3 Développer des sites et des pages ______________________________________________________________ 16
3.1Présentation de la structure du site et de la navigation 16
3.1.1 Structure du site 16
3.1.2 Navigation 17
3.2Présentation des pages et des maquettes 17
3.3Afficher les pages 18
3.3.2 Passer d'une page à une autre 18
3.4Ajouter, supprimer et réorganiser les pages 19
3.4.2 Réorganiser les pages 22
3.4.3 Affecter une maquette particulière 22
3.4.4 Affecter plusieurs maquettes 22
3.5Ajouter des barres de navigation 23
3.5.1 Types de navigation 24
3.5.2 Créer des barres de navigation 24
3.5.3 Personnaliser des barres de navigation 25
3.5.4 Utiliser des styles de barre de navigation 26
3.5.5 Inclure/exlure des pages dans la navigation 27
3.5.6 Utiliser des séparateurs de pages dans des menus déroulants 27
3.5.7 Utiliser des barres de navigation dynamiques 27
3.5.8 Tester vos barres de navigation 27
3.6Utiliser les outils de mise en page 28
3.6.2 Création de repères de règles 28
3.6.3 Règles 29
3.6.4 Des règles comme outil de mesure 29
3.6.5 Utiliser la grille de points 30
3.7Définir les propriétés du site 30
3.7.2 Définir la taille et l'alignement de la page 31
3.8Définir les propriétés de la page 32
3.9Utiliser le Gestionnaire de site 33
ii
Table des matières
3.10 Contrôle d'accès 34
3.10.1 Configurer votre objet intelligent Liste d'utilisateurs 35
3.10.2 Ajouter des utilisateurs (manuellement ou par inscription) 36
3.10.3 Activer le contrôle d'accès 37
3.10.4 Ajouter un champ d'identification 38
3.10.5 Contrôle de l'utilisateur avancé 38
3.10.6 Contrôle d'accès pour les forums, les blogs et le SGC 39
3.11 Optimisation pour les moteurs de recherche 39
3.11.1 Utiliser les méta-balises de descripteurs des moteurs de recherche 40
3.11.2 Exclure des pages de l'indexation (méta-balises "robots") 40
3.11.3 Exclure des pages de l'indexation (fichier "robots") 41
3.11.4 Inclure les pages dans l'indexation 41
3.12 Effectuer une recherche sur des sites Web 42
3.13 Utiliser la Galerie 43
3.14 Ajouter une carte Google 44
3.14.2 Utiliser des cartes Google avancées 45
3.15 Ajouter une publicité 46
4 Utiliser du texte ______________________________________________________________________________ 48
4.1Importer du texte à partir d'un fichier 48
4.2Utiliser les zones de texte 49
4.2.1 Qu'est-ce qu'une zone de texte ? 49
4.2.2 HTML et zones créatives 49
4.2.3 Création de zones de texte 50
4.2.4 Placer du texte dans une zone de texte 51
4.2.5 Configuration et mise en forme des zones créatives 51
4.2.6 Gestion des dépassements du texte (zones HTML) 52
4.3Utiliser le texte artistique 52
4.4Aligner du texte sur tracé 54
4.5Éditer le texte sur la page 55
4.5.1 Sélectionner et saisir du texte 55
4.5.2 Copier, coller et déplacer un texte 57
4.5.3 Définir des retraits de paragraphe 57
4.5.4 Utiliser du texte Unicode 57
4.6Utiliser la fonction Rechercher et remplacer 58
5 Mettre en forme des caractères et des paragraphes _______________________________________________ 59
5.1Définir les propriétés du texte 59
5.2Utiliser les polices 59
5.3Utiliser les styles de texte 60
5.3.1 Styles de paragraphe et styles de caractère 60
5.3.2 Utiliser des styles nommés 60
5.4Créer une liste à puces ou numérotée 61
6 Utiliser des tableaux __________________________________________________________________________ 63
6.1Créer des tableaux de texte 63
6.1.1 Tableaux HTML et tableaux créatifs 63
6.2Insérer un calendrier 64
6.2.2 Ajouter des vacances 65
6.2.3 Ajouter des événements personnels 66
7 Editer les objets de la page ____________________________________________________________________ 67
7.1Sélectionner un objet 67
7.2Sélectionner plusieurs objets 67
7.3Copier, coller et dupliquer des objets 68
7.3.2 Dupliquer des objets 69
7.3.3 Reproduire la mise en forme d'un objet 69
7.4Déplacer des objets 70
7.5Redimensionner des objets 70
7.6Faire pivoter un objet 71
7.7Recadrer et combiner des objets 72
iii
WebPlus X4 Manuel d’utilisation
7.7.2 Recadrer une forme d'après le contour d'une autre forme 73
7.7.3 Combiner des lignes et des formes 73
7.8Joindre les contours d'objets 74
7.9Verrouiller la taille ou l’emplacement d’un objet 74
7.10 Mettre à jour et enregistrer les paramètres par défaut 75
8 Organiser des objets _________________________________________________________________________ 77
8.1Agencer les objets 77
8.2Aligner et répartir des objets 77
8.3Magnétisme 78
8.3.2 Magnétisme à l'aide des guides dynamiques 78
8.4Associer un objet au texte 78
8.5Créer des groupes 80
9 Lignes, contours, formes et effets ______________________________________________________________ 81
9.1Tracer et modifier des lignes 81
9.1.1 Tracer des lignes 81
9.1.2 Éditer des lignes 82
9.2Définir les propriétés du contour 82
9.3Tracer et modifier des formes 83
9.3.1 Formes pleines 84
9.3.2 Formes fermées 84
9.4Appliquer des effets de filtre 2D 85
9.4.2 Créer des réflexions 86
9.4.3 Créer des contours 86
9.4.4 Erreur ! Signet non défini.Utiliser l'outil Ombre 87
9.5Appliquer des effets de filtre 3D 87
9.6Ajouter une troisième dimension (3D instantanée) 88
9.7Ajouter des bordures 89
9.8Utiliser les styles d'objets 90
9.8.2 Enregistrer des styles d'objet 91
10 Images, animation et multimédia _______________________________________________________________ 92
10.1 Ajouter des cadres d'image 92
10.2 Importer des images 93
10.2.2 Remplacer des images 94
10.2.3 Ajuster les images recadrées 94
10.2.4 Intégrer ou associer 95
10.3 Utiliser la Barre des médias 95
10.3.2 Ajouter des photos à la page 97
10.4 Définir les options d'exportation des images 97
10.4.2 Définir des options d'exportation, un titre et un texte de remplacement pour chacune des
images 98
10.5 Importer des images TWAIN 99
10.6 Appliquer des filtres PhotoLab 99
10.6.2 Appliquer un filtre 100
10.6.3 Retoucher 101
10.6.4 Masquage sélectif 101
10.6.5 Enregistrer des favoris 102
10.6.6 Quitter PhotoLab 102
10.7 Utiliser le Studio de découpe d'images 102
10.7.2 Choisir un format de rendu 103
10.7.3 Sélectionner les zones à conserver ou supprimer 104
10.8 Ajouter des animations 105
10.8.1 Textes défilants 105
10.8.2 Fichiers Flash 105
10.9 Ajouter du son et de la vidéo 106
10.9.1 Son 106
10.9.2 Vidéo 106
11 Couleur, remplissages et transparence _________________________________________________________ 109
iv
Table des matières
11.1 Appliquer des couleurs unies 109
11.2 Utiliser des combinaisons de couleurs 110
11.2.1 Comment fonctionnent les combinaisons de couleurs ? 111
11.2.2 Couleurs supplémentaires 111
11.2.3 Appliquer des couleurs de combinaisons à des objets 112
11.2.4 Modifier les combinaisons de couleurs 112
11.3 Utiliser les remplissages en dégradé et bitmap 113
11.3.1 Appliquer un remplissage dégradé ou bitmap 113
11.4 Définir la transparence 113
11.4.1 Appliquer de la transparence 114
11.4.2 Définir la transparence par défaut 115
12 Ajouter des liens hypertextes et de l'interactivité _________________________________________________ 116
12.1 Ajouter des liens hypertextes et des ancres 116
12.1.2 Insérer une ancre 117
12.2 Ajouter des zones dynamiques à la page 118
12.2.2 Modifier des zones dynamiques 119
12.3 Ajouter des images survolées 119
12.4 Options des images survolées 119
12.4.2 Créer des variantes des images sources 120
12.5 Ajouter des images survolées (popups) 120
13 Ajouter du contenu dynamique ________________________________________________________________ 123
13.1 Créer des pages HTML 123
13.2 Joindre un code HTML 124
13.2.1 Ajouter du code HTML 124
13.2.2 Ajout de code JavaScript 125
13.2.3 Utilisation d'identifiants 127
13.2.4 Marqueurs 128
13.3 Ajouter des formulaires 128
13.3.1 Structure des formulaires 128
13.3.2 Créer des formulaires 129
13.3.3 Éléments de formulaire 130
13.3.4 Modifier les éléments de formulaire 132
13.3.5 Transmission de formulaires 132
13.4 Flux RSS et podcasts 134
13.4.1 Créer des flux RSS ou des podcasts 134
13.4.2 Soumission de podcasts 136
13.4.3 Abonnement 136
13.4.4 Inclure des flux tiers 137
13.5 E-commerce 138
13.5.1 Qu'est-ce que l'E-Commerce 138
13.5.2 Insérer un objet E-Commerce (PayPal) 139
13.6 Objets intelligents 141
13.6.1 Les objets intelligents 141
14 Imprimer, prévisualiser et publier sur le Web ____________________________________________________ 147
14.1 Afficher un aperçu de votre site Web 147
14.2 Publier le site sur le Web 148
14.2.2 Gérer les informations du compte FTP 150
14.2.3 Opération automatique 150
14.2.4 Résolution des problèmes 151
14.2.5 Consulter votre site en ligne 151
14.2.6 Publication rapide 151
14.2.7 Créer des fichiers PDF 152
v
1 Introduction
1.1 Bienvenue
Bienvenue dans WebPlus X4, la solution la plus simple pour présenter votre entreprise, votre association ou votre
famille sur le Web !
Pour vous faciliter la vie, WebPlus est fourni avec une impressionnante sélection de modèlesnavigation, de galeries créatives et de styles. Ainsi, une publication de qualité professionnelle est possible
pour les utilisateurs expérimentés comme pour les débutants ! Vous pourrez également réutiliser un contenu textuel
existant en important des documents provenant d'un traitement de texte.
Pour tirer le meilleur parti des images de votre site, vous pouvez utiliser le Studio de découpe d'images
découper les images, et PhotoLab
pouvez pas les rater !
WebPlus X4 ne se contente pas de vous offrir une publication Web "statique", toute sa puissance n’est réellement
visible que lorsque vous ajoutez et gérez du contenu dynamique, tel que des blogs
de gestion de contenu (SGC), des compteurs, etc. Vous pouvez même faire appel aux outils Ecommerce pour accéder à la fonction de panier d'achat.
Une fois satisfait de votre site WebPlus, chargez-le simplement sur votre espace Web Serif (ou chez un FAI
équivalent) pour le partager avec vos collègues, vos clients, vos amis ou votre famille.
Pour un résumé plus détaillé des fonctions de WebPlus , reportez-vous à la rubrique Caractéristiques principales.
pour un réglage performant des images et des combinaisons d'effets. Vous ne
, des forums, des Systèmes
, de barres de
pour
1.1.1 Mise à niveau ?
Si vous avez effectué une mise à niveau à partir d'une version antérieure du produit, cette nouvelle édition de
WebPlus inclut une multitude de nouvelles fonctionnalités
le pion à ses concurrents, pour un prix inférieur ! Nous espérons que vous apprécierez cette amélioration des
performances.
intéressantes grâce auxquelles WebPlus dame
1.1.2 Enregistrement
N'oubliez pas d'enregistrer votre copie du logiciel à l'aide de l'Assistant d'enregis trement, dans le menu
Aide. Vous serez ainsi informé des nouveaux développements et des mises à jour à venir.
1.2 Caractéristiques principales
Avant de prendre en main WebPlus, nous vous recommandons de vous familiariser avec les principales
caractéristiques et fonctionnalités de WebPlus.
1.2.1 Mise en page
•Modèles de conception multipage
Concevez des sites Web "sur-mesure" et en un clin d'œil d'après un modèle et un thème défini. Choisissez un
modèle de présentation parmi les nombreuses catégories.
•Outils professionnels de mise en page
Des règles
permettent de positionner les objets avec précision. Grâce au magnétisme, collez un objet à un guide ou une
grille. Utilisez les guides magnétiques
objets collés par magnétisme à vos repères. Déplacez le guide et les objets suivront !
•Contrôle des pages
Ajoutez
l'onglet pour réorganiser la sélection. Affectez des maquettes
gagner du temps et garantir une meilleure homogénéité dans la conception.
1.2.2 Informations essentielles pour la conception d'un site Web
•Structurez votre site en toute simplicité
L'onglet hiérarchique Site vous offre un aperçu global de la mise en page de votre site.
déplaçables, des repères et une grille de points servent d'aides à la mise en page et vous
, une méthode commode pour déplacer simultanément tous les
et supprimez des pages en quelques clics sous l'onglet Site. Glissez-déposez des pages sous
à plusieurs pages d'un site simultanément pour
6
•Barres de navigation
Faites votre choix parmi le vaste éventail de barres de navigation, avec divers styles et modèles au choix.
Introduction
•Outil Champ de recherche
Effectuez des recherches sur le texte de la totalité du site Web à l'aide du puissant outil Champ de recherche.
•Optimisation pour les moteurs de recherche
Contrôlez la manière dont les moteurs de recherche indexent votre site Web. Il est possible d'inclure ou
d'exclure des pages de l'indexation en utilisant un fichier de moteur de recherche sitemap ou des fichiers robot.
Protégez vos données personnelles tout en offrant aux visiteurs potentiels de votre site des informations
précises dans les résultats de recherche.
•Objets intelligents
Les ressources Web Serif, le service d'hébergement d'objets intelligents, propose une série de
fonctionnalités de site interactif :
• Forum
• Liste d'utilisateurs
• Statistiques Collecte et présente les statistiques des pages Web relatives aux visites sur le site, aux
• Messages
• Blogs
Encourage les discussions animées basées sur un flux dans une fenêtre grand format. Vous
pouvez créer plusieurs forums et les gérer indépendamment (en modérant les discussions et en
définissant les autorisations d'accès).
d'utilisateurs réunis par "zone" (par exemple : Personnel). Les internautes peuvent s'inscrire à l'a ide
d'un identifiant (avec activation facultative par courrier électronique).
informations sur le navigateur, les référents et les termes de recherche.
réunion de l'association.
Ajoutez des profils personnels, des signets et utilisez des rétroliens pour le référencement
croisé inter-blog. Modifiez l'apparence du blog en utilisant différents styles visuels prédéfinis (ou utilisez
votre propre style !) Utilisez des groupes d'éditeurs pour la publication d'articles multi-auteurs.
Pour des messages simples annonçant les mises à jour du site ou les prochaines dates de
Permet de contrôler l'accès à une page ou au site en gérant de groupes
•Cadres flottants actifs
Les liens hypertextes peuvent ouvrir une page dans un cadre de document sur une autre page. Définissez une
URL absolue pour une navigation plus précise entre les cadres.
•Outils de gestion de site
Gérez toutes les propriétés des pages et des maquettes
les liens hypertextes et les ancres depuis le Gestionnaire de site
peuvent être gérées individuellement, par sélection ou globalement. Le Vérificateur de site analyse la navigation
sur le site, la mise en forme du texte les problèmes rencontrés par les formulaires ou l'e-commerce et tente d'y
remédier automatiquement.
, les ressources, les polices, le texte,
de WebPlus. Les pages Web
1.2.3 Images
•Importer des images
Importez des formats de fichier standard, notamment tous les plus récents formats RAW pour appareils photo
numériques et fichiers Photoshop. Importez plusieurs images et collez-les une par une.
•Des photos plus accessibles grâce à la Barre des médias
Finie l'importation répétitive des photos ! Toutes vos photos sont à portée de clic dans la nouvelle Barre des médias. Il suffit de faire glisser-déplacer les photos depuis la Barre des médias sur les photos à remplacer.
Recherchez des photos en utilisant les métadonnées. Contrôlez les dimensions et l'alignement des photos dans
leur cadre.
•Des galeries photos
Étonnez vos amis, votre famille et vos collègues par des galeries photos basées Flash
permettent de parcourir les photos sous forme de miniatures, des miniatures avec effet de survol, des planches
ou des piles de photos. Utilisez la fonction de lecture automatique pour la lecture en boucle des diaporamas.
•Réglag es d'images
Appliquez des réglages (luminosité, contraste, yeux rouges, etc.) ou sélectionnez Éditer dans PhotoPlus
pour accéder au produit de retouche d'image de Serif, unanimement salué (s'il est installé).
en ligne extraordinaires !
. Divers styles de galerie
•Un format métafichier polyvalent
Importez
format Windows Metafile (WMF). Grâce à de meilleures définitions de ligne, de remplissage et de texte, ces
fichiers sont parfaits pour le partage d'images entre les différentes applications Serif.
et exportez des métafichiers Serif (.SMF), un format d'image propriétaire avec des améliorations du
7
WebPlus X4 Manuel d’utilisation
•Image survolée (Popup)
Créez votre propre galerie photos — affichez une version agrandie d'une photo en cas de survol de sa miniature
par la souris.
1.2.4 Média
•Vidéos YouTube®
Choisissez vos vidéos YouTube préférées et insérez-les dans votre page Web.
•Podcasts
Créez vos propres flux podcast et diffusez régulièrement vos propres épisodes audio et vidéo. Les visiteurs
Web peuvent s'abonner en utilisant tous les navigateurs Web connus et via Google Reader®, My Yahoo!® et
Apple iTunes®.
1.2.5 Images
•Outils de dessin
Dessinez d'intéressantes images vectorielles à l'aide des outils Crayon, Stylo et Ligne droite
fins de ligne telles que des têtes de flèche, des losanges ou des stylos plumes. Par ailleurs, la gamme de
Formes pleines
objets, tandis que les options Convertir en courbes et Recadrer, ainsi que le tracé de courbes, offrent
une totale flexibilité vous permettant de créer toutes les formes possibles et imaginables ! Les enveloppes de maillage ajoutent une perspective, une inclinaison ou un bombement à tout objet.
•Styles prêts à l'utilisation
Sous l'onglet Styles, sélectionnez divers effets de filtre, des lumières, des ombres, des textures et des
matériaux. Personnalisez les styles prédéfinis ou créez-en.
•Transparence
Ajoutez une transparence à vos arrière-plans, zones de texte, tableaux, formes et textes pour obtenir un résultat
professionnel. Comme avec les remplissages de couleur, vous pouvez appliquer des transparences unies,
dégradées et bitmap, et même créer des transparences bitmap à partir de votre collection d'images.
•Combinaisons de couleurs intelligentes
Choisissez en un clic parmi une douzaine de combinaisons de couleurs installées pour modifier l'apparence
générale de votre site.
•Nouveaux effets de filtre 2D/3D
Ajoutez des reflets
tracez un trait
Contour qui applique un remplissage dégradé depuis le contour intérieur jusqu'au contour extérieur). Les
effets 3D
surfaces réfléchissantes et non réfléchissantes et divers éclairages colorés. Tous les effets de filtre peuvent être
appliqués en mode d'aperçu ou à l'objet sur la page. Utilisez le nouvel outil Ombre
la page.
sont renforcés par des imitations de verre réalistes, comme le contrôle de la transparence de
entièrement personnalisables vous permet de créer rapidement des contours pour vos
sur un objet. C'est idéal pour les titres des pages Web et les photos ! Floutez un objet ou
de couleur unie ou dégradée sur les contours d'un objet (trait ayant un nouveau remplissage
pour contrôler l'ombre sur
, et ajoutez des
•3D Instantanée
Transformez des objets 3D in situ grâce aux fonctions d'édition 3D d'une barre d'outils contextuelle. Appliquez
des effets de lumière multicolores fantastiques (avec contrôle directionnel) avec des profils de biseau et
de tour pour créer des contours personnalisés uniques. L'accélération matérielle du rendu améliore
considérablement les performances de retraçage (fonctionnalité dépendante de votre matériel).
avec transformations à l'écran
1.2.6 Texte
•Texte artistique et zone de texte
WebPlus gère le texte de la même manière qu'un outil de traitement de texte. Le texte artistique
pour rendre votre site Web encore plus original. Il s'adapte particulièrement bien aux titres et à l'ajout à un tracé.
Les cadres de texte HTML
automatiquement remplies avec du texte grâce à l'option Création automatique ou par un ajustement
manuel du texte. Toutes les fonctionnalités d'édition sont compatibles avec les meilleurs traitements de texte.
•Zones de texte
Composez des articles dans des zones de texte HTML ou créatives, puis positionnez-les ou adaptez la zone
à vos besoins ; les zones de texte créatives reliées contiennent le même article et peuvent être
automatiquement remplies grâce à l'option Création automatique ou par un ajustement manuel du texte.
Le contour englobant et détouré implique un meilleur contrôle sur le déplacement du texte ainsi que sur son
apparence. Importez, collez, exportez du texte au format Unicode. Utilisez une langue étrangère ou des
polices et des caractères spéciaux. Les tracés de texte
8
assurent la compatibilité HTML, tandis que les zones de texte créatives peuvent être
peuvent également être ajusté intelligemment.
peut être utilisé
•Polices
Remplacez les polices manquantes à l'ouverture de projets tiers. Vérifiez les polices de caractères
actuellement installées sous l'onglet Polices, y compris les polices récemment appliquées au texte, vos polices
favorites et les polices optimisées pour le Web. Déplacez le curseur sur une des polices répertoriées pour en
afficher un aperçu de la police in situ sur le texte sélectionné — et il suffit ensuite de cliquer pour lui
appliquer la police si cela vous plait ! Substituez facilement toutes les occurrences d'une polices courante par
une autre police en moins de temps qu'il n'en faut pour le dire !
Introduction
•Tableaux
Choisissez parmi une gamme de formats prédéfinis ou concevez votre propre tableau. Utilisez la pratique barre
d'outils contextuelle pour trier des données, mettre en forme des cellules et choisir parmi une large gamme de
fonctions de tableurs (utiliser des références de cellules absolues). Pour améliorer leurs fonctionnalités, les
calendriers sont basés sur des tableaux et prennent en charge la mise à jour de l'année, les événements en
ligne et les jours fériés !
•Rechercher et remplacer
Recherchez des mots et des phrases dans le texte d'un articles, mais également des attributs de texte, des
polices particulières, des couleurs, des caractères spéciaux (Unicode), des expressions régulières, ou des mots
à des positions spécifiques dans des phrases.
•Base de données
Il peut s'agir d'une base de données Serif (.SDB), Microsoft Access (.MDB), dBASE, de données de serveur
ODBC ou d'autres formats de bases de données connus, ainsi que des fichiers Microsoft Excel, HTML et de
texte délimité. Etablissez des listes, des listes de diffusion, des catalogues. En bref, toutes les informations
contenues dans des bases de données peuvent être publiées sur le Web. Placez du texte ou des photos dans
des zones récurrentes, des formulaires d'e-commerce récurrents Acheter maintenant ou Ajouter
au panier, ou encore des fragments de code HTML. Créez votre propre base de données de
photos (avec des champs EXIF) en prévision d'une fusion.
et calendriers
1.2.7 Publication Web
•Aperçu de votre travail
Testez votre nouvelle page Web ou votre site entier dans divers navigateurs Web installés.
•Publier votre site
Publiez dans un dossier local ou chargez directement votre site par FTP via votre FAI ; chargez
progressivement toutes les pages nouvelles ou modifiées.
1.3 Nouvelles fonctions
•De toutes nouvelles barres de navigation
Utilisez les barres de navigation en Flash ou JavaScript pour naviguer sur votre site. Flexibles et
personnalisables, elles vous proposent divers modèles de styles — appliquez des styles globalement pour
conférer une homogénéité à vos barres de navigation. Vous pouvez aussi inclure un forum
articles de SGC
contrôle toutes les barres de navigation. Ajoutez des séparateurs
•Réservation de ressources
Utilisez la réservation de ressources basée sur le calendrier pour gérer vous-mêmes des réservations
(hébergement, salles de conférence et de réunion, courts de squash, etc.) par heure ou par jour, et
périodiquement. Définissez en toute simplicité les tarifs.
•Gérer le contenu Web à distance
Le nouveau Système de gestion de contenu (SGC) permet aux fournisseurs de contenu d'ajouter et de
mettre à jour un contenu Web depuis n'importe quel lieu, sans WebPlus et sans devoir republier le site.
dans les sous-menus dynamiques des barres de navigation. Le Gestionnaire de navigation
entre les éléments des sous-menus.
1.3.1 Plus puissant
•Grâce à Google Maps, les clients ne se pe rdent plus !
Intégrez une carte Google directement dans votre page Web "Coordonnées". Ajoutez des marqueurs pour
indiquer des emplacements tels qu'un bureau, un dépôt, un lieu d'intérêt, ou un événement. Le mode Avancé
offre un API JavaScript pour un nombre illimité de marqueurs et un étiquetage HTML des marqueurs.
•Suivi de l'utilisati on du site
Inscrivez-vous à Google Analytics pour obtenir un suivi et une surveillance complète des données relatives
aux visiteurs de votre site Web. Analysez à tout moment les données en ligne, grâce à des graphes et des
cartes faciles à interpréter.
, un blog et des
•Gagnez de l'argent pour votre site grâce à Google AdSense
Ajoutez un espace publicitaire
Google à votre site Web... et Google vous paiera, 24/7!
9
WebPlus X4 Manuel d’utilisation
1.3.2Plus de créativité
•Mise en page thématique
Sélectionnez un thème tel qu'Arctique ou Naturel pour votre site ! Chaque thème propose un choix de types
de pages classiques — À propos, Galerie, Produits, Contact, etc. Sélectionnez plusieurs mises en page
pour vos nouvelles pages, puis remplacez simplement les images fictives par vos images personnelles.
•Gestionnaire de combinaisons
Composez vos propres combinaisons de couleurs en utilisant des étendues de couleurs basées sur la
théorie de couleur acceptée (Monochrome, Complémentaire, Triadique, etc.). Sélectionnez une
couleur de départ et effectuez un choix parmi les couleurs recommandées et associées — sélectionnez les
couleurs une à une ou attribuez automatiquement les couleurs de la nouvelle combinaison.
•Bordures à partir de photos
De toute nouvelles bordures prêtes à l'emploi peuvent être appliquées autour des zones de texte, des tableaux
ou des images. Créez et enregistrez des bordures personnalisées à partir de vos compositions sur ordinateurs
ou de cadres d'image numérisés ! Les mêmes bordures sont déjà appliquées aux cadres d'image
Galerie.
•Joindre les contours d'objets
Combinez des Formes pleines, des formes dessinées et du texte artistique pour créer des objets à contour plus
complexes, que vous pouvez éditer ultérieurement. Utilisez Ajouter, Soustraire, Intersection et
Exclure pour produire des divers résultats intéressants.
•Créer des formats automatiques de tableaux et de calendriers
Personnalisez une large sélection de formats automatiques attrayants pour vos modèles de tableaux
personnalisés. À partir d'un environnement de création de tableau simple d'utilisation, modifiez la disposition
des cellules d'un tableau et les styles de cellules des en-têtes, des lignes ou des pieds de page. Une fois
les modifications effectuées, enregistrez les formats automatiques pour une utilisation ultérieure.
•Utilisez plusieurs maquettes
Pour une conception de page plus variée, appliquez plusieurs maquettes à une page Web spécifique.
!
1.3.3 Simplicité d'emploi
• Barre de Création rapide
Prise en main rapide de WebPlus — déplacement de pages, barres de navigation, zones de texte, images,
contenu Flash, galeries photos, ou objets intelligents directement sur la page pour un résultat rapide sans
connaissance préalable de l'interface utilisateur.
de l'onglet
•Prise en main de WebPlus
Grâce à la nouvelle Zone d'apprentissage de l'Assistant de démarrage
Des didacticiels (sous forme de fichiers PDF et de vidéos) sont publiés avec diverses ressources et informations
sur le produit.
•Publication rapide
Chargez et affichez rapidement un aperçu de la page affichée, ce qui est particulièrement utile pour contrôler en
ligne les pages individuelles lorsque vous créez votre site Web.
•Accès utilisateur
Nouveau et plus intuitif, l'accès utilisateur offre désormais un système de sécurité par CAPTCHA lors de
l'enregistrement de l'utilisateur. Les mots de passe peuvent être créés ou reproduits manuellement. À
l'inscription, les internautes peuvent être redirigés vers une page Web publiée spécifique. L'inscription des
utilisateurs peut être activée ou désactivée globalement.
•Alignement de la passe
Pour un positionnement précis, alignez une forme ou la passe d'un texte créatif avec l'intérieur, l'extérieur, ou
le centre de son tracé.
•Guides dynamiques
Alignez et redimensionnez les objets à l'aide du magnétisme des guides dynamiques, sans faire appel
à des règles ou à des transformations d'objet précises.
, tirez le meilleur parti de WebPlus.
1.3.4 Images
•Des galeries photos renversantes
Sélectionnez l'un des trois types de galeries photos — optimisés avec SlideShowPro™ (Flash), Flash, et
JavaScript. Tirez profit de la prise en charge des légendes (à l'aide de données EXIF), et créez et gérez des
albums.
10
•PhotoLab pour des filtres de réglage et d'effets non destructeurs
Le puissant studio PhotoLab contient une impressionnante sélection de réglages éditables, d'effets créatifs et
artistiques (crayon, aquarelle, huile, etc). Utilisez les outils intégrés Redresser, Recadrer, Yeux rouges et
Réparation des tons directs pour effectuer une retouche rapide. Appliquez des filtres aux zones
sélectionnées dans votre photo, grâce à un masquage à l'aide du pinceau. Enregistrez des
combinaisons de réglages/d'effets comme favoris, pour une utilisation ultérieure.
Introduction
•Des découpes d'images simples et rapides
Le Studio de découpe d'images
WebPlus. Utilisez les pinceaux pour supprimer les arrière-plans uniformes (ciel, murs, etc.) ou conserver les
sujets qui vous intéressent (personnes, objets, etc.).
•Nouveaux formats d'importation
Importez au format Photo HD Microsoft ou au format de métafichiers propriétaire Serif (.smf). Grâce à de
meilleures définitions de ligne, de remplissage et de texte (par rapport au format Windows Metafile), ces fichiers
sont parfaits pour le partage d'images entre les différentes applications Serif.
vous permet de découper facilement vos images, directement dans
et d'exportation d'images
1.3.5 Texte
•Importer des documents texte Wo rd 2007 et Open Office
Ajoutez sans difficultés le contenu d'un traitement de texte à une zone de texte. Pour une importation,
l'application ne doit pas nécessairement être installée localement. Utilisez divers convertisseurs pour optimiser
l'importation de texte.
•Styles de texte
Affichez la mise en forme actuelle
Supprimez
•Associez et positionnez
Contrôlez la position des formes et des images dans vos zones de texte HTML ou créatives (ou par rapport
aux titres du texte artistique).
•
et mise en forme
— les styles de paragraphe et de caractère, ainsi que la mise en forme locale.
plusieurs styles simultanément.
des formes et des images à du texte
1.4 Nous contacter
Micro Application
20 /22 rue des petits hôtels
75010 Paris France
• Pour consulter le site Web de Micro Application, cliquez sur www.microapp.com
• Pour enregistrer ce produit, cliquez sur www.microapp.com/support/e-carte.cfm?ref_produit=2605
• Pour accéder aux informations sur le produit, cliquez sur
• Pour accéder au support technique, cliquez sur www.microapp.com/fiche_technique.cfm?ref_produit=2605
• Pour poser une question au support technique, envoyez un message à l'adresse sav@microapp.com
11
2 Démarrage
2.1 Assistant de démarrage
Une fois WebPlus installé, vous pouvez le lancer. L'installation ajoute un élément Serif WebPlus X4 dans le sousmenu (Tous les) Programmes du menu Démarrer de Windows.
• Utilisez le bouton Démarrer de Windows pour dérouler le menu, puis cliquez sur Tous les programmes,
enfin sélectionnez WebPlus.
L'Assistant de démarrage vous offre plusieurs possibilités :
Les options se passent d'explications : un site peut être créé de toutes pièces ou à partir de modèles de conception
fournis. Les sites existants peuvent être ouverts ou les pages Web qui n'ont pas été créées dans WebPlus peuvent
être importées sur votre site à partir d'un fichier ou d'une URL.
• Créer un site
• Utiliser un modèle
• Ouvrir un site
• Importer un site
• Zone d'apprentissage, pour accéder aux vidéos, aux didacticiels, aux informations techniques, etc.
Le menu déroulant Espace de travail vous permet de sélectionner l'aspect de votre espace de travail
(notamment la position et la taille des onglets du Studio, afficher/masquer l'onglet Position).
L'Assistant de démarrage s'affiche par défaut lorsque vous lancez WebPlus. Vous pouvez le désactiver (ou le
réactiver) en cochant ou en désactivant la case Ne plus afficher cet assistant sur l'écran de l'Assistant de
démarrage lui-même ou par l'option Utiliser l'assistant de démarrage dans l'onglet Général de la boîte de
dialogue Outils/Options. (utilisez l'option de menu Options/Général).
, pour créer votre site.
, pour créer immédiatement un site à partir d'un modèle préétabli.
, pour ouvrir un site WebPlus enregistré préalablement.
, pour utiliser un site existant comme base de votre nouveau site.
Lorsque vous sélectionnez différents profils dans le menu, votre espace de travail affiche
successivement les dispositions d'onglets correspondantes.
2.2 Créer un site à partir d'un modèle
WebPlus vous propose une gamme complète de modèles de mise en page classés par catégories permettant
d'accélérer le processus de création de toutes sortes de sites Web. Les catégories de modèles vont des modèles
Professionnels et E-Commerce à d'autres plus ludiques (Personnels, Divertissement et Loisirs).
Chaque modèle propose :
•un modèle complémentaire : un modèle professionnel à fort impact.
12
Démarrage
•Combinaisons: choisissez une combinaison de couleurs pour définir une apparence particulière (par
exemple, Atlantis).
•Pages : choisissez toutes les pages du modèle ou quelques-unes seulement (par exemple, Accueil, Produits,
À propos de nous, etc.) comme base de votre nouveau site.
Deux types de modèles existent : les mises en page thématiques, dans lesquels vous choisissez vos images
personnelles, ou les modèles prédéfinis, déjà dotés d'images.
Mises en page thématiques
Elles proposent une sélection de thèmes (p.
ex., Arctique) sur laquelle votre site se base ;
des images fictives remplacent les images
réelles. Ajoutez simplement vos images
personnelles aux images fictives, éditez le
texte, puis publiez.
Modèles prédéfinis
Classés par catégories, ces modèles
contiennent des images libres de droits que
vous pouvez adopter pour créer rapidement
votre site Web. Il ne vous reste qu'à
personnaliser le texte de l'image fictive, puis
publier.
Vous pouvez accéder à encore plus de modèles si vous avez acheté le CD de
ressources de WebPlus X4.
2.2.1.1 Pour créer un site à partir d'un modèle :
1. Lancez WebPlus ou exécutez la commande Fichier/Assistant de démarrage pour afficher
l'Assistant de démarrage.
2. Cliquez sur Utiliser un modèle.
3. Dans la boîte de dialogue, sélectionnez un thème ou un modèle depuis le volet principal.
Les modèles sont réunis par catégories de sujet ; utilisez la barre de défilement ou développez une
catégorie pour accéder à d'autres options (cliquez sur le bouton en regard du nom de la catégorie). Le
volet de droite affiche alors les miniatures des pages disponibles pour ce modèle.
13
WebPlus X4 Manuel d’utilisation
4. Dans le volet de droite, choisissez les pages
que vous voulez intégrer à votre site Web.
Cochez ou décochez chaque page à
sélectionner, ou cliquez sur Sélectionner
tout pour sélectionner toutes les pages (ou
Aucun pour annuler la sélection).
5. Sélectionnez une combinaison de couleurs dans la liste en haut de la boîte de dialogue (les trois
premières combinaisons sont conçues spécifiquement pour la mise en page thématique). Les miniatures des
pages sont mises à jour pour refléter la nouvelle apparence des pages. Pour un examen plus en détail, utilisez
les boutons Zoom avant/Zoom arrière ou les glissières de zoom au bas de la boîte de dialogue.
6. Cliquez sur Ouvrir.
La première page (la page d'accueil) du site apparaît, avec l'onglet Site du Studio affiché à droite et présentant les
diverses pages qui constituent le site avec son arborescence Structure du site.
Comme chaque modèle est basé sur une combinaison de couleurs, vous pouvez à
tout moment remplacer la combinaison et l'apparence du site par une autre
combinaison.
2.3 Créer un site de toutes pièces
Bien que les modèles de mise en page facilitent vos choix de conception, vous pouvez tout aussi facilement créer un
site à partir de zéro.
2.3.1.1 Pour créer un site à l'aide de l'Assistant de démarrage :
•Démarrez WebPlus et sélectionnez Créer un site.
Le nouveau site apparaît dans une page vierge utilisant les propriétés de page
Si vous cliquez sur Annuler (ou si vous appuyez sur Échap) dans
l'Assistant de démarrage, vous obtiendrez le même résultat.
2.3.1.2 Pour créer un site au cours d’une session WebPlus :
par défaut.
•Exécutez la commande Fichier/Nouveau.
Pour faciliter la création d'un site, WebPlus propose la Barre de création rapide. L'onglet correspondant
propose des objets et des fonctions courantes que vous pouvez appliquer à votre page Web par glisser-déposer.
Ainsi, vous n'êtes pas obligé de maîtriser immédiatement la gamme complète de barres d'outils de WebPlus.
2.4 Ouvrir un site existant
Vous pouvez ouvrir un site WebPlus existant à partir de l'Assistant de démarrage, de la barre d'outils Standard ou
du menu Fichier. Il est aussi possible d'importer des pages Web
de démarrage. (Voir l'Aide en ligne pour plus d'informations.)
14
depuis des sites Web HTML existant via l'Assistant
Démarrage
2.4.1.1 Pour ouvrir un site WebPlus existant à l’aide de l’Assistant Démarrage :
1. Sélectionnez l'option Ouvrir un site. Dans le volet Documents de la boîte de dialogue Ouvrir un
site, vous verrez soit la structure du dossier contenant vos sites web (onglet Dossiers), soit une liste des
dernièrs sites web utilisés (onglet Historique). Selon la vue en cours, des miniatures d'aperçu ou les détails
du site peuvent apparaître dans le volet adjacent.
2. Cliquez sur un nom de fichier ou un échantillon, puis sur Ouvrir. Le site s'ouvre à la première page
(Démarrage).
2.4.1.2 Pour ouvrir un site WebPlus existant (lorsque WebPlus est ouvert) :
1. Cliquez sur le bouton Ouvrir dans la barre d'outils standard.
2. Dans la boîte de dialogue Ouvrir, sélectionnez le répertoire et le nom du fichier, puis cliquez sur le bouton
Ouvrir.
2.4.1.3 Pour restaurer la version précédemment enregistrée d'un site ouvert :
• Exécutez la commande Fichier/Version précédente.
2.4.2 Remplacement des polices
WebPlus prend en charge le remplacement automatique de la police à l'ouverture du site WebPlus si le site contient
des polices qui ne sont pas installéees sur l'ordinateur. La boîte de dialogue qui apparaît permet aussi de remplacer
manuellement une police manquante, si nécessaire. Consultez l'aide en ligne pour plus d'informations.
2.5 Travailler sur plusieurs sites
Si vous ouvrez plusieurs sites Web simultanément, vous pouvez facilement passer de l'une à l'autre par différentes
méthodes.
Cliquez sur l'onglet Fenêtre en haut de
l'espace de travail pour le rendre actif (p.
ex., Design657.wpp).
Vous pouvez aussi sélectionner le nom d'un
site ouvert dans le menu Fenêtre. Le nom
des sites Web non enregistrés est suivi d'un
astérisque ; le site actif est précédé d'une
coche. Dans l'exemple ci-contre, le site
Design657.wpp est actif et non enregistré.
2.6 Enregistrer votre site Web
2.6.1.1 Pour enregistrer votre travail :
• Cliquez sur le bouton Enregistrer dans la barre d'outils standard.
• Pour l'enregistrer sous un autre nom, exécutez la commande Fichier/Enregistrer sous.
Le nom d'un site non enregistré est suivi d'un astérisque dans son onglet ou dans
le menu de Fenêtre.
15
3 Développer des sites et des pages
3.1 Présentation de la structure du site et de la navigation
Contrairement à une publication imprimée, un site Web ne repose pas sur une succession linéaire de pages. Lorsque
vous concevez un site, il est plus logique de le penser en termes d'espace, avec une structure telle que celle d'un
musée que des personnes visiteraient. En règle générale, vous pouvez supposer que les visiteurs y entreront par la
porte principale (la page d'accueil), mais la suite de la visite dépendra des liens que vous aurez prévus. Les
passerelles de navigation sont comparables aux couloirs reliant les pièces du musée. C'est à vous, en tant
qu'architecte, de prévoir une disposition intelligente des pages et des liens pour que les visiteurs s'y retrouvent
facilement, sans se perdre.
Dans WebPlus, vous pouvez utiliser l'arborescence Structure du site pour représenter visuellement la
structure de votre site, puis ajouter des barres de navigation
vous avez définie.
3.1.1 Structure du site
Contrairement au musée de notre analogie, la structure d'un site Web n'a aucun rapport avec son organisation
physique ou avec l'endroit où les pages sont conservées. Il s'agit plutôt de l'organisation logique du contenu du site
de manière à y simplifier la navigation. L'un des principes d'organisation les plus efficaces, défendu par WebPlus, est
une structure en arbre inversé qui commence par la page d'accueil à partir desquelles les ramifications se
développent vers d'autres pages. Du point de vue du visiteur qui parcourt votre site, cette disposition présente le
contenu d'une manière hiérarchique familière, structurée en sections et en niveaux.
, qui s'adaptent de façon dynamique à la structure que
• Une section est une catégorie de contenu, telle que Actualités, Produits, Contact ou Liens. Les diverses
sections principales sont généralement répertoriées sur la page d'accueil du site, dans une barre de navigation.
Dans l'idéal, chaque page du site appartient à une section particulière et, à moins qu'il n'y ait qu'une seule page
dans une section donnée, la section a sa propre page principale qui sert généralement de menu pour les pages
subsidiaires.
• Le niveau est le nombre d'étapes (de liens) séparant une page donnée de la page d'accueil. La page d'accueil
réside toujours au niveau 1, normalement avec les pages de menus des sections principales. Cela permet aux
barres de navigation de fonctionner facilement et automatiquement. Les pages situées un niveau "en dessous"
des pages de menus des sections se trouvent au niveau 2 etc.
Dans WebPlus, l'arborescence Structure du site (dans l'onglet Site)
apporte une aide visuelle permettant d'organiser le contenu du site en
sections et en niveaux, c'est-à-dire en une hiérarchie de pages parents
reliées à des pages enfants. Voici un exemple de structure pouvant
apparaître dans l'arborescence Structure du site de WebPlus :
L'utilisation de l'arborescence facilite la visualisation des relations entre
les pages et l'organisation du site d'une manière adaptée au contenu
que vous avez à offrir. Évidemment, un site Web est véritablement un
réseau de pages liées les unes aux autres et l'arborescence ne vous
empêche pas de prévoir des liens entre deux pages. Mais elle
matérialise la représentation des passerelles principales (vers le haut,
vers le bas et sur les côtés) à l'intérieur du site. L'organisation logique
par sections et par niveaux simplifie la navigation à l'intérieur du site.
Avec WebPlus, vous pouvez facilement créer des barres de navigation qui reflètent la structure du site et qui guident les visiteurs
le long de ces artères principales.
16
Développer des sites et des pages
3.1.2Navigation
Dans WebPlus, la navigation entre vos pages Web est facilitée par des barres de navigation, programmées pour
comprendre la structure de votre site, de manière à faciliter la conception d'un site dont la navigation est simple. Il
suffit de sélectionner une barre d'outils Objets Web et WebPlus fait le reste !
Voici, par exemple, une barre de navigation que nous avons choisie pour le site représenté dans l'arborescence cidessus. Les boutons constituent des liens vers la page d'accueil et les pages de menus de sections (toutes au
niveau 1) et à des menus déroulants qui pointent vers des pages enfants (niveau 2 en l'occurrence).
Pour plus d'informations, reportez-vous à Ajouter des barres de navigation
.
3.2 Présentation des pages et des maquettes
La page est l'unité de base de la conception Web. WebPlus permet de structurer le contenu de votre site en
organisant les pages dans une arborescence, qui aidera les internautes à naviguer sur votre site. Du point de vue de
la conception, chaque page WebPlus comporte une page au premier plan et une maquette à l'arrière-plan.
Les maquettes font partie de la structure de votre site WebPlus et constituent un moyen flexible de stocker des
éléments d'arrière-plan que vous souhaitez faire apparaître sur plusieurs pages : par exemple, un logo, un arrièreplan, une bordure, ou une barre de navigation. Le point essentiel est qu'une maquette particulière est généralement
partagée par plusieurs pages, comme illustré ci-dessous. En plaçant un élément de la conception sur une maquette
et en affectant plusieurs pages à cette maquette, vous vous assurez que toutes les pages incorporent cet élément.
Bien sûr, chaque page individuelle peut comporter ses propres éléments.
17
WebPlus X4 Manuel d’utilisation
L'onglet Site du Studio comporte une section supérieure Maquettes avec une icône pour chaque maquette et une
section Structure du site indiquant quelle maquette est utilisée par chacune des pages Web :
3.3 Afficher les pages
L’espace de travail d’une publication de Web Studio consiste en une page et en une zone de travail.
La page est l'endroit où vous placez le texte, les images et autres éléments que vous souhaitez faire apparaître sur
votre page web finale. La table de montage est l'endroit où vous placez généralement les éléments à positionner
sur la page. Lorsque vous publiez le site à partir du site WebPlus, tout ce qui se trouve sur la page apparaît, et tout
ce qui se trouve entièrement sur la table de montage n'apparaît pas. La table de montage, qui est partagée par
toutes les pages et maquettes, est utile pour copier ou déplacer des objets d'une page à une autre.
3.3.1.1 Pour déplacer ou copier un objet entre des pages via la table de montage :
1. Faites glisser l'objet de la page source sur la table de montage. Si vous souhaitez le copier, maintenez la
touche Ctrl enfoncée.
2. Affichez la page cible (voir Passer d’une page à une autre
ci-dessous).
3. Faites glisser (en maintenant la touche Ctrl enfoncée si vous souhaitez copier) l'objet de la table de
montage à la page de destination.
WebPlus vous permet de visualiser facilement votre travail et propose diverses options d'affichage allant de
l'affichage d'une page entière à un zoom avant sur une petite zone. Ainsi, vous pouvez utiliser les barres de défilement situées en bas à droite de la fenêtre principale pour déplacer la page et la table de montage par
rapport à la fenêtre principale. L'affichage se recentre automatiquement à mesure que vous faites glisser les objets
vers le côté de l'écran.
La barre d'outils Affichage située en haut de l'écran propose l'outil Déplacer, qui offre une autre
manière de se déplacer dans la zone de travail. Vous pouvez également procéder à un zoom avant ou arrière avec
les boutons correspondants afin de pouvoir contrôler et/ou modifier la page à divers niveaux de détails.
3.3.2 Passer d'une page à une autre
WebPlus offre diverses façons d'atteindre rapidement la partie du site sur laquelle vous travaillez actuellement.
L'onglet Site du Studio constitue un centre de contrôle proposant à la fois l'arborescence de la Structure du site
qui reflète la hiérarchie des pages du site (voir Présentation de la structure du site et de la navigation
icônes des maquettes du site.
Différence entre sélection et affichage d'une page :un simple clic sur une entrée de
page/maquette sélectionne simplement la page. Pour vraiment afficher la page/maquette associée, il est
nécessaire de double-cliquer sur une entrée.
Une entrée orange (avec le nom de la page en gras) correspond à une
page sélectionnée.
) ainsi que les
18
L'icône de l'oeil désigne la page actuellement affichée et que vous pouvez
modifier dans l'espace de travail. Cet exemple montre que la page est
affichée et sélectionnée. Une autre maquette est utilisée (B au lieu de A).
Une icône de maquette en surbrillance dans la fenêtre supérieure sous
l'onglet Site désigne une maquette sélectionnée.
Une icône d’œil dans l’icône de la maquette désigne la page actuellement
affichée. Cette illustration présente une maquette affichée (mais pas
sélectionnée).
Développer des sites et des pages
3.3.2.1 Pour afficher une page/maquette spécifique :
Plusieurs méthodes permettent d'afficher une page :
•Dans la barre d'état, utilisez les boutons pour la navigation parmi les pages.
OU
Cliquez sur l'entrée de la page ou maquette dans la liste Identificateur de pages.
• Sous l'onglet Site du Studio, double-cliquez sur l'entrée de la page ou maquette à afficher. A l'intérieur de
l'onglet, la fenêtre Structure du site comporte une arborescence des pages du site, alors que la fenêtre
Maquettes n'affiche les maquettes que sous forme de miniatures. Vous devrez peut-être cliquer sur le bouton
Maquettes pour afficher la fenêtre Maquettes.
•Cliquez sur le bouton Structure du site de la barre d'état ou dans la fenêtre Page de l'onglet Site.
Sélectionnez l'entrée de la page dans l'arborescence de la boîte de dialogue (double-cliquez si nécessaire sur
les entrées de l'arborescence pour les développer). Cliquez ensuite sur le bouton Aperçu de la page.
Pour les maquettes :
• Dans l'onglet Site du Studio, cliquez sur le bouton Maquettes> pour afficher la fenêtre Maquettes. Une ou
plusieurs icônes de maquettes s'affichent.
•Double-cliquez sur l'icône de la maquette que vous voulez afficher.
3.3.2.2 Pour passer de la page à la maquette :
• Cliquez sur le bouton Page/Maquette de la barre d'état.
3.3.2.3 Raccourci d'affichage de la page d'accueil du site :
• Cliquez sur le bouton Page d'accueil dans la barre d'état.
3.4 Ajouter, supprimer et réorganiser les pages
L'onglet Site du Studio permet d'ajouter ou de supprimer
rapidement des pages standard ou HTML à un niveau
quelconque de la structure de votre site et d'y réorganiser les
pages par glisser-déplacer selon vos besoins, ajouter de
nouvelles maquettes, réaffecter des maquettes à des pages
et ajouter des liens externes.
19
WebPlus X4 Manuel d’utilisation
La fenêtre Maquettes de l'onglet Site permet d'accéder aux maquettes et la fenêtre Page (arborescence Structure du
site centrale) permet d'accéder aux pages. Des pages (vides ou ayant de contenu) peuvent aussi être ajoutées
depuis des modèles
multipages.
3.4.1.1 Pour ajouter une nouvelle page vide :
1. Cliquez sur la flèche bas du bouton Ajouter, situé juste au-dessus de la fenêtre Pages de
l'onglet Site. Dans le menu déroulant, choisissez Nouvelle page.
2. Dans la boîte de dialogue Propriétés de la nouvelle page, spécifiez les options de la nouvelle page sous
l'onglet Apparence (voir Définir les propriétés de la page
dans cette boîte de dialogue :
•Dupliquer les éléments de conception dessin d'une page Web existante. Cochez Copier les objets de
la page et sélectionnez la page dans la liste activée.
•Spécifier la position de la nouvelle page dans la structure du site. Dans la section Emplacement, insérez la
page Avant, Après, ou comme page enfant de la page nommée.
3. Cliquez sur OK.
) ainsi que des options disponibles uniquement
Une nouvelle page apparaît à l'emplacement indiqué dans la structure du site. La page utilise les propriétés du site
pour ses dimensions. Vous pouvez toujours déplacer la page à un autre emplacement ou niveau ou activer une autre
maquette (voir Réorganiser les pages
Tandis que l'ajout de pages standard vous permet de commencer à concevoir une page de toutes pièces, vous
pouvez vous simplifier la tâche en adoptant des pages prêtes à l'emploi à partir des modèles WebPlus fournis. Pour
conserver la présentation d'origine de la page, toute maquette associée à la page ajoutée peut éventuellement être
"importée" avec la page.
ou Associer des maquettes).
3.4.1.2 Pour ajouter une nouvelle page à partir d'un modèle :
1. Dans la section Pages (structure du site) de l'onglet Site du Studio, sélectionnez la page à la suite de
laquelle vous voulez ajouter une nouvelle page.
2. Cliquez sur la flèche vers le bas du bouton Ajouter, immédiatement au-dessus de la fenêtre
Pages. Dans le menu déroulant, choisissez Nouvelle page de modèle.
3. Dans la boîte de dialogue Ajouter une nouvelle page depuis un modèle, sélectionnez un
modèle dans le volet de gauche et cochez la page à ajouter (cochez d'autres pages à ajouter, si
nécessaire).
4. WebPlus vous permet de vérifier si une maquette associée est copiée avec la page. Choisissez l'une des
commandes proposées dans le menu déroulant situé en haut et à gauche :
• Copier la maquette. Pour toujours copier la maquette dans votre site.
• Comparer et copier la maquette. Vérifie si la maquette existe déjà dans votre site, puis la copie si
elle n'y figure pas.
•Aucune maquette. La maquette n'est jamais copiée dans votre site.
5. Cliquez sur le bouton Ouvrir. Les pages sont ajoutées à l'onglet Site.
20
Développer des sites et des pages
Au lieu de pages Web vides ou de modèles, des pages HTML peuvent être ajoutées à la Structure du site sous
l'onglet Site. Ces pages peuvent être incluses dans la navigation de la même manière que les pages ordinaires.
3.4.1.3 Pour ajouter une page HTML :
1. Dans la section Pages (structure du site) de l'onglet Site du Studio, sélectionnez la page à la suite de
laquelle vous voulez ajouter une nouvelle page.
2. Cliquez sur la flèche vers le bas du bouton Ajouter, immédiatement au-dessus de la fenêtre
Pages. Dans le menu déroulant, choisissez Nouvelle page HTML
Une nouvelle page HTML est ajoutée à l'onglet Site. Voir Créer des pages HTML
Vous pouvez aussi ajouter un lien externe à votre structure de site. Il s'agit généralement d'une page ou d'une
ressource n'appartenant pas à votre site, mais que vous souhaitez inclure dans sa structure de navigation. Le lien
externe apparaît dans l'arborescence de la Structure du site et dans les barres de navigation et vous pouvez donc le
manipuler comme si c'était une page de votre site.
pour plus d'informations.
3.4.1.4 Pour ajouter un lien externe :
1. Dans la section Pages (structure du site) de l'onglet Site du Studio, sélectionnez la page à la suite de
laquelle vous voulez ajouter une nouvelle page.
2. Cliquez sur la flèche vers le bas du bouton Ajouter, immédiatement au-dessus de la fenêtre
Pages. Dans le menu déroulant, choisissez Nouveau lien externe.
3. Dans la boîte de dialogue, saisissez le Nom du menu pour identifier le lien externe dans l'arborescence
de la Structure du site (l'équivalent du nom de la page).
4. Cliquez pour sélectionner le type de destination du lien et saisissez la cible du lien externe (voir
Sélectionner la cible d'un lien hypertexte
l'option Inclure à la navigation cochée si le lien doit apparaître dans la navigation du site.
• Cochez Avant et/ou Après pour appliquer des lignes horizontales au-dessus/en dessous de la page en
tant qu'élément de sous-menu dans les barres de navigation.
• Ajoutez une Description pour ajouter du texte relatif à la page sur l'élément de sous-menu de la barre.
5. Cliquez sur OK.
) et la fenêtre où vous souhaitez que la cible apparaisse. Laissez
3.4.1.5 Pour ajouter une nouvelle maquette :
1. Sous l’onglet Site du Studio, vérifiez que le bouton Maquettes> est activé pour développer la fenêtre
Maquettes.
2. Cliquez sur le bouton Ajouter au-dessus de la fenêtre Maquettes.
Une nouvelle page de maquette figure dans la fenêtre Maquettes sous l'onglet Site.
Pour distinguer facilement les différentes maquettes, vous pouvez leur attribuer des noms distincts. Les maquettes
adopteront des identifiants comme suffixes, p. ex. A, B, C, etc. Vous pouvez ainsi consulter l'affectation des
maquettes dans la structure de votre site.
3.4.1.6 Pour nommer une maquette :
1. Faites un clic droit sur la miniature d'une maquette et cliquez sur Propriétés....
2. Modifiez le Nom de la page.
3.4.1.7 Pour reproduire une page :
• Sous l'onglet Site du Studio, cliquez avec le bouton droit de la souris sur une page sélectionnée et choisissez
Copier la page. Une copie est insérée au-dessous de la page sélectionnée.
3.4.1.8 Pour supprimer une page ou une maquette :
1. Sous l'onglet Site du Studio, sélectionnez la page (ou la maquette) à supprimer en cliquant sur son entrée.
21
WebPlus X4 Manuel d’utilisation
2. Cliquez sur le bouton Supprimer situé au-dessus de la fenêtre appropriée.
Lorsque vous supprimez une page, vous avez la possibilité de supprimer tout
lien hypertexte présent sur votre site et pointant sur celle-ci ou de rediriger ces
liens vers une autre page de votre choix (les liens hypertextes vers des ancres sur
la page supprimée peuvent éventuellement être supprimé).
3.4.2 Réorganiser les pages
L'arborescence de la Structure du site permet d'ajouter et de supprimer des pages, mais aussi de les réorganiser. A
l'aide de la structure parent/enfant, la réorganisation des pages est une procédure intuitive pouvant être réalisée par
glisser-déplacer ou en cliquant sur des boutons. Vous pouvez déplacer une page de la manière suivante :
•Vers un autre emplacement dans la succession de page (vers le haut ou vers le bas) au même niveau de la
structure
• Vers un niveau (parent) supérieur
• Vers un niveau (enfant) inférieur
3.4.2.1 Pour déplacer une page :
1. Affichez l'onglet Site du Studio.
2. Cliquez pour sélectionner la page dans la structure du site.
3. (Par glisser-déplacer) Faites glisser l'entrée de la page vers le haut ou vers le bas dans l'arborescence.
L'apparence du pointeur signale la nouvelle position par rapport à la page sur laquelle il pointe :
déplace la page au-dessous et au même niveau que la page cible sélectionnée.
fait de la page un enfant de la page située sous la page cible sélectionnée.
3.4.3 Affecter une maquette particulière
Si vous avez défini plusieurs maquettes pour votre site, vous pouvez utiliser plusieurs méthodes pour réassocier une
maquette particulière à différentes pages, une par une. Vous pouvez également paramétrer une page pour
qu'aucune maquette ne lui soit affectée, si vous importez une page HTML dont vous ne souhaitez afficher que les
propres éléments de mise en page sans lui en ajouter d'autres à partir d'une maquette. (Voir Présentation des pages
et des maquettes.)
3.4.3.1 Pour affecter une maquette à une page :
• Dans l'onglet Site du Studio, cliquez sur la miniature de la maquette (dans la section Maquettes) et faites-la
glisser sur l'entrée de la page (dans la section Structure du site de l'onglet).
3.4.4 Affecter plusieurs maquettes
Pour les pages de conception plus variée, vous pouvez affecter plusieurs maquettes à chaque page Web à l'aide de
l'onglet Maquettes. Par exemple, si deux conceptions se situent sur deux maquettes distinctes ("Maquette A" et
"Maquette B"), à l'aide de l'onglet Maquettes, vous pouvez placer la "Maquette B" (contenant le texte IPSUM) devant
la page sélectionnée, la maquette A étant utilisée comme arrière-plan de la page.
22
Développer des sites et des pages
Vous devrez créer plusieurs maquettes avant d'utiliser l'onglet Maquettes.
3.4.4.1 Pour affecter plusieurs maquettes à une page Web :
1. Sous l'onglet Site, sélectionnez la page à laquelle vous souhaitez affecter plusieurs maquettes.
2. Cliquez sur le bouton Ajouter sous l'onglet Maquettes.
3. Dans le menu déroulant de la boîte de dialogue, choisissez une maquette déjà créée puis et cliquez sur
OK. La maquette supplémentaire est ajoutée à l'onglet (ci-dessous) et la page Web utilisera les éléments
de la maquette nouvellement affectée.
La structure du site de l'onglet Site affiche une page Web accompagnée d'un signe "+" si plusieurs maquettes sont
affectées (au lieu de A, B, C, etc.).
L'onglet Maquettes vous permet de contrôler l'ordre d'affichage du contenu de la page et de
la maquette. À l'image des calques dans un programme de dessin, les objets de l'entrée
située au premier plan peuvent s'afficher devant les objets des maquettes "inférieures".
Vous pouvez également réorganiser les maquettes entre elles. Les nouvelles maquettes
sont ajoutées en bas de la pile et apparaîtront donc derrière tout autre contenu.
Dans l'exemple ci-contre, la Maquette B est positionnée au-dessus de tout autre contenu.
3.4.4.2 Pour réorganiser le contenu de la page et les maquettes :
•Sélectionnez l'entrée sous l'onglet et cliquez sur le bouton Haut ou Bas.
Pour masquer temporairement une maquette, décochez son entrée sous l'onglet.
3.4.4.3 Pour supprimer l'affectation d'une maquette :
• Sélectionnez l'entrée sous l'onglet et cliquez sur le bouton Supprimer.
3.5 Ajouter des barres de navigation
Dans WebPlus, des barres de navigatio n sont programmées pour comprendre la structure de votre site, de
manière à faciliter la conception d'un site dont la navigation est simple.
Les barres de navigation facilitent le mouvement entre les différentes sections et niveaux
dans les barres de navigation ci-dessous, les boutons incluent des liens vers la page d'accueil et vers différentes
pages des sections principales, tandis que les menus contextuels offrent des liens vers les pages enfants (Article 1 et
Article 2) de chaque section.
d'un site. Par exemple,
23
WebPlus X4 Manuel d’utilisation
1
2 3
Vous pouvez aisément insérer des barres de navigation à n'importe quel niveau de votre site, puis reconfigurer ceuxci afin de les relier à une section spécifique du site, modifier la présentation d'une barre de navigation et exclure
certaines pages spécifiques de la navigation, selon vos besoins.
3.5.1 Types de navigation
WebPlus propose divers types de barres de navigation en fonction du niveau de fonctionnalité et de design
recherché pour votre barre de navigation. Les barres de navigation utilisent différentes technologies, en particulier
JavaScript ou Flash.
Types de barres
Pour :
de navigation
Basique (JavaScript) Barres de navigation 1 à base de texte, sans arrière-plan.2
Créateur (JavaScript) Barres de navigation
Divers (JavaScript)
Zone de liste, plan de site vertical, barres de navigation pliables ou en accordéon (image
à base de texte, avec bouton et barre en arrière-plan.
coulissante).
Basique (Flash) Barres de navigation Flash avec survols animés, popups et palettes.
Créateur (Flash)
1
Se présentent sous la forme de texte HTML pris en compte lors des recherches.
2
Barres de navigation horizontales et verticales disponibles.
3
Lecteur Flash requis. Vous trouverez un lecteur Flash dans votre dossier d'installation WebPlus.
Barres de navigation Flash avec effets graphiques professionnels (survols, popups,
palettes et pages roulées.
2 3
3.5.2Créer des barres de navigation
Les barres de navigation peuvent être ajoutées sur n'importe quelle page, mais on choisit généralement la maquette
pour éviter d'avoir à coller le même élément sur plusieurs pages. La barre de navigation se comporte, sur une
maquette, comme si elle était présente sur chaque page, sachant que ses boutons et menus sont définis par rapport
à la position de chaque page dans la structure globale du site.
Lorsque vous ajoutez une barre de navigation, vous pouvez définir un type, des options et un style. Après l'ajout, la
barre peut être modifiée à tout moment. Vous pouvez créer des barres supplémentaires à partir de toute barre de
navigation présente dans votre site.
3.5.2.1 Pour ajouter une barre de navigation :
1. Sélectionnez la page (ou la maquette).
2. Cliquez sur Insérer une barre de navigation dans la barre d'outils Objets Web.
3. Sous l'onglet Type de la boîte de dialogue, une galerie de barres de navigation par défaut apparaît. Pour
un type de navigation différent, effectuez une sélection dans le menu déroulant Type situé dans la partie
supérieure droite.
La galerie de barres de navigation vous permet de sélectionner une barre de navigation de ce type, par
exemple.
4. Sous l'onglet Type de navigation, indiquez si vous souhaitez directement baser votre barre de
navigation sur la Structure du site
options de la barre de navigation (cochez Personnaliser ; reportez-vous à Personnaliser des barres de
navigation).
Pour la première méthode :
•Sélectionnez les boutons à inclure dans la barre de navigation : Niveau racine, Niveau parent,
Même niveau, Niveau enfant, Accueil, Précédent et suivant, Précédent, Suivant, Haut,
Fil d'Ariane, Ancres, Retour ou Personnaliser.
(cochez Basé sur la structure du site) ou persionnaliser les
24
Développer des sites et des pages
•En fonction des éléments sélectionnés, vous pouvez décidez d'inclure la page enfant, les ancres, la
page d'accueil, la page parent, et/ou de masquer la page courante.
• Cochez Ne pas utiliser le nom des pages pour personnaliser le nom des boutons. Dans le cas
contraire, les boutons porteront des noms fonctionnels tels que "Précédent" ou "Accueil".
• Définissez l'option Fenêtre ou cadre cible pour indiquer à quel emplacement la nouvelle page doit
s'ouvrir. Sélectionnez Même fenêtre (option la plus utilisée), Nouvelle fenêtre (utile dans le cas
d'un renvoi vers une page externe au site), Haut de la fenêtre courante, Fenêtre parente,
Fenêtre nommée et Cadre du document.
5. (Facultatif ; pour les barres de navigation JavaScript uniquement) Sous l'onglet Options, vous pouvez
paramètrer le fonctionnement de la barre de navigation. Vous pouvez notamment modifier les options
d'alignement et de positionnement des popups et des menus.
6. (Facultatif) Sous l'onglet Style, vous pouvez sélectionner des propriétés différentes pour les objets et le texte
des menus et sous-menus.
7. Cliquez sur OK. Le barre de navigation s'affiche sur votre page.
Lorsque vous incluez des ancres dans les barres de navigation, vous pouvez parcourir
différentes sections dans des pages longues ou des zones dupliquées comme options de
menu.
Vous pouvez à tout moment modifier la barre de navigation, pour régler le type de navigation, ses options ou son
style.
3.5.2.2 Pour modifier une barre de navigation :
1. Double-cliquez sur la barre de navigation ou cliquez dessus avec le bouton droit de la souris, puis
choisissez Modifier la barre de navigation...
2. Modifiez les paramètres proposés sous les onglets Type de navigation et Style.
Vous pouvez modifier la barre de navigation sélectionnée, mais pas son type (p.
ex., remplacer une barre de navigation JavaScript basique par une barre Flash).
Dans WebPlus, vous pouvez baser une nouvelle barre de navigation sur une barre présente sur votre site, au lieu
d'en utiliser une depuis la galerie Barre de navigation. Ainsi, vous n'êtes pas obligé de personnaliser une barre de
navigation de la galerie.
3.5.2.3 Pour créer une barre de navigation à partir d'une barre de navigation
existante :
1. Sous l'onglet Type de la boîte de dialogue, cochez Copier la barre de navigation existante. La
galerie est actualisée et affiche les barres de navigation utilisées sur votre site.
2. Cliquez sur Sélectionnez en regard de la barre de navigation choisie, puis modifiez le type ou le style de
navigation, comme décrit dans la rubrique Pour ajouter une barre de navigation
3. Cliquez sur OK.
.
3.5.3 Personnaliser des barres de navigation
Par défaut, les éléments des barres de navigation se basent sur la structure de votre site. Si vous souhaitez
réorganiser l'ordre ou la hiérarchie des éléments de votre barre de navigation de sorte qu'ils soient différents de la
Structure du site, WebPlus permet de personnaliser toutes les barres de navigation en créant une arborescence personnalisée — vous pouvez également ajouter, supprimer ou modifier des éléments donnant accès à toute une
gamme de destinations de liens (voir Ajouter des liens hypertextes et des ancres
Structure du site figurant sous l'onglet Site.
) exactement comme dans la
Si vous utilisez une arborescence personnalisée, la barre de navigation ne se
mettra plus à jour automatiquement lorsque de nouvelles pages seront ajoutées au
site. Si vous souhaitez une mise à jour de la barre de navigation, vous devez baser
votre barre sur la structure du site.
3.5.3.1 Pour personnaliser une barre de navigation sélectionnée :
1. Double-cliquez sur la barre de navigation.
25
WebPlus X4 Manuel d’utilisation
2. Sous l'onglet Type de navigation, cochez l'option Personnaliser et vérifiez que l'option Nouvelle
arborescence est cochée.
3. (Facultatif) Attribuez un nom à l'arborescence dans le champ prévu à cet effet.
4. Réagencez les éléments de la barre de navigation par glisser-déplacer (ou utilisez les boutons Vers le
haut, Vers le bas, Page enfant ou Page parente).
5. Cliquez sur le bouton Ajouter un lien pour ajouter un nouveau lien en bas de la liste de la barre de
navigation. Une destination de lien, un cadre ou une fenêtre cible et un titre sont attribués au nouvel
élément dans la boîte de dialogue qui s'affiche. Cliquez sur OK.
(Facultatif) Cliquez sur Rétablir pour rétablir la structure initiale de l'arborescence. Options d'exportation... vous permet de contrôler l'emplacement et le nom du fichier JavaScript utilisé pour
afficher votre arborescence personnalisée.
6. Cliquez une nouvelle fois sur OK. La barre de navigation utilise désormais l'arborescence personnalisée
pour afficher les options de menu.
L'arborescence personnalisée que vous enregistrez se voit attribuer un nom (p. ex., arboperso-1) et est
automatiquement stockée sur votre site.
Si vous prévoyez de créer d'autres barres de navigation pour votre site, vous pouvez réutiliser la même
arborescence personnalisée en la sélectionnant dans la boîte de dialogue. Les barres existantes peuvent aussi être
remplacées pour utiliser la nouvelle arborescence lors de la modification.
Vous pouvez aussi cliquer sur le bouton Copier... pour copier l'arborescence utilisée dans une barre de navigation
présente sur votre site. L'arborescence active sera ainsi remplacée.
3.5.4 Utiliser des styles de barre de navigation
Lorsque vous créez ou modifier une barre de navigation, vous pouvez conserver son type de navigation et sa
structure, tout en personnalisant son aspect. Le style modifié peut être écrasé ou copié sous forme de nouveau style.
Si vous utilisez plusieurs barres et styles de navigation, faites appel au Gestionnaire de navigation
styles des barres.
3.5.4.1 Pour modifier un style de barre de navigation :
1. Sous l'onglet Style, les palettes et menus déroulants vous permettent de créer un style unique. Vous
pouvez définir les couleurs d'objet, les propriétés de police des menus et sous-menus, les marges,
l'espacement, et les options d'échelle des boutons.
2. (Facultatif) Définissez un nom de style différent. Les noms se basent sur le nom d'origine de la barre de
navigation.
3. Cliquez sur OK. Si vous n'avez pas renommé le style, le style d'origine est écrasé. Si vous avez renommé
le style, un nouveau style est créé.
Cochez Copier le style pour créer un style identique.
OU
1. Effectuez un clic droit sur la barre de navigation de la page, puis choisissez Modifier un style...
2. Dans la boîte de dialogue, modifiez les paramètres de style explicites.
3. (Facultatif) Définissez un nom de style différent.
pour échanger les
4. Cliquez OK.
Si vous êtes satisfait du style de la barre de navigation que vous avez créée ou qui résulte de la modification d'une
barre de navigation existante, vous pouvez la réutiliser ultérieurement. Le style créé peut être appliqué à diverses
barres de navigation via le Gestionnaire de navigation
26
.
Développer des sites et des pages
3.5.5Inclure/exlure des pages dans la navigation
Par défaut, toutes les pages de l'arborescence sont incluses dans la navigation. Autrement dit, elles peuvent
être reliées par des barres de navigation. Vous pouvez cependant exclure certaines pages (sauf la Page d'accueil)
de façon à ce qu'elles ne soient pas prises en compte par les barres de navigation. Par exemple, imaginons que
votre site comporte une section de références ou d'archives que vous ne souhaitez pas rendre accessibles aux
visiteurs. Si vous excluez de la navigation la page parent de cette section, elle sera inaccessible par la barre de
navigation. Remarque : l'exclusion de cette page du système de navigation ne supprimera pas la page du site. La
page apparaîtra toujours dans la structure du site et vous pourrez toujours y insérer des liens hypertextes
Simplement, elle n'apparaîtra pas dans une barre de navigation.
.
3.5.5.1 Pour exclure une page de la navigation :
• Dans l'onglet Site du Studio, cliquez avec le bouton droit de la souris sur la page dans l'arborescence Structure
du site et sélectionnez Propriétés de la page. Sous l'arborescence, désactivez Inclure à la navigation.
•Les pages incluses affichent, dans leur entrée de page, le signe dans la structure du site de l'onglet Site. Les
pages exclues n'affichent pas ce symbole et apparaissent en grisé.
3.5.6 Utiliser des séparateurs de pages dans des menus déroulants
Dans le sous-menu, vous pouvez régler les propriétés de toute page, tout lien externe ou toute ancre incluse dans la
navigation (et présente dans un sous-menu) afin de contrôler les séparateurs et le texte explicatif de la page.
• Cochez Avant et/ou Après pour appliquer des lignes horizontales au-dessus/en dessous de la page en tant
qu'élément de sous-menu dans les barres de navigation.
• Ajoutez une Description pour ajouter du texte relatif à la page sous l'élément de sous-menu de la barre.
3.5.7 Utiliser des barres de navigation dynamiques
Jusqu'à présent, nous sommes partis du principe que les barres de navigation sont basées sur la structure de votre
site et affichent des pages statiques comme éléments de menu. Toutefois, pour des barres de navigation plus
dynamiques, vous pouvez compléter les sous-menus de votre barre de navigation avec un forum en évolution
constant, un SGC, et des titres d'articles de blog ; cliquez simplement sur un titre pour afficher l'article correspondant.
Supposons que vous utilisez un lien externe
lien externe est inclus dans la navigation.
pour vous connecter à votre forum, votre SGC et votre blog, et que le
3.5.7.1 Pour créer une barre de navigation dynamique :
• Effectuez un clic droit sur le lien externe de l'onglet Site, puis cliquez sur Propriétés du lien externe....
• Dans la boîte de dialogue Lien externe, modifiez le menu déroulant de la section Information sur l'objet
intelligent pour ajouter des éléments de flux (c'est-à-dire des titres d'articles publiés) comme enfants du sousmenu de la barre.
Chaque titre d'article est cliquable et ouvre l'article associé dans une fenêtre, généralement séparée.
3.5.8 Tester vos barres de navigation
Le Gestionnaire de navigation donne un aperçu de toutes les barres de navigation utilisées sur votre site
depuis le Gestionnaire de site
structure du site et de la navigation.)
. (Pour une présentation basique des barres de navigation, voir Présentation de la
27
WebPlus X4 Manuel d’utilisation
3.5.8.1 Pour afficher le Gestionnaire de
navigation :
• Cliquez sur Gestionnaire de site dans la barre
contextuelle (ou la barre d'état située en bas de l'espace de
travail), puis sélectionnez l'option de menu Navigation.
OU
Sélectionnez Gestionnaire de site/Gestionnaire de navigation... dans le menu Outils.
Le Gestionnaire de site s'ouvre par défaut avec le
Gestionnaire de navigation.
3.6 Utiliser les outils de mise en page
Les guides de mise en page sont des repères visuels qui vous aident à positionner vos différents éléments, soit
"à l'oeil" soit en activant le magnétisme. Lorsque le magnétisme
redimensionnez s'alignent sur les guides de mises en page et les règles visibles les plus proches. WebPlus comporte
divers outils de mise en page pour vous aider : marges de la page, repères des lignes et colonnes et repères des
règles.
•Les paramètres des marges de la page sont essentiels à votre mise en page et doivent généralement être
définis dès le début lorsque vous créez un site. Au départ, il est conseillé de définir des marges étroites. Les
marges de la page sont indiquées sous la forme de quatre traits bleus en haut, en bas, à gauche et à droite de
la page, délimitant les réglages des marges. Si vous le souhaitez, vous pouvez définir des marges
correspondant aux paramètres de l'imprimante installée.
est activé, les objets que vous créez, déplacez ou
• Les repères des lignes et des colonnes sont des aides sous-jacentes qui permettent de séparer la page
en rangées ou en colonnes représentées par des repères à tirets bleus.
• Les repères des règl es sont les lignes rouges "collantes" librement positionnables qui sont très utiles pour
aligner verticalement ou horizontalement des objets.
3.6.1.1 Pour définir des guides de mise en page :
• Cliquez sur Guides de mise en page dans la barre d'outils contextuelle par défaut.
L'onglet Marges vous permet de définir les guides pour les marges, les lignes et les colonnes de la page. Vous
pouvez définir les marges de gauche, de droite, du haut et du bas séparément. La boîte de dialogue vous propose
également l'option Marges équilibrées, permettant de faire correspondre les marges de droite à celles de
gauche et celles du haut à celles du bas.
La rubrique Repères des lignes et colonnes permet de définir des guides pour les rangées et les colonnes
avec un blanc (écart) intermédiaire. Si vous souhaitez obtenir des lignes et des colonnes de largeur inégale, placezles tout d'abord à intervalles réguliers puis, dans un second temps, faites-les glisser sur les guides pour les
repositionner comme vous le souhaitez.
L'onglet Guides vous permet d'ajuster l'emplacement des repères des règles en précisant un positionnement absolu
des pixels (les guides peuvent aussi être déplacés sur la page à partir des règles de WebPlus ; voir Créer des
repères de règles.
3.6.1.2 Pour afficher ou masquer les guides de mise en page :
•Dans le menu Affichage, activez ou désactivez l'option Repères.
Ce réglage affecte également tous les guides de règles placés sur la page.
3.6.2 Création de repères de règles
WebPlus vous permet de définir des repères de règle s horizontaux et verticaux : il s'agit de lignes non
imprimables que vous pouvez utiliser pour aligner les manchettes, les images et d'autres éléments de mise en page.
Les repères sont magnétisés par défaut de sorte que les objets qui les touchent peuvent être déplacés sur la page
avec leur repère de règle — une manière pratique de déplacer en groupe et simultanément des objets
précédemment alignés.
28
Développer des sites et des pages
•Pour créer un repère de règle, cliquez sur une règle, maintenez le bouton de la souris enfoncé et faites glisser le
curseur sur la page. Une ligne rouge symbolisant le repère de règle apparaît parallèle à la règle (faites glisser le
pointeur en maintenant la touche Alt enfoncée pour créer le repère à un angle de 90 degrés par rapport à la
règle).
• Pour déplacer un repère, faites-le simplement glisser à l'aide de la souris.
• Pour supprimer un repère, glissez-déplacez-le n'importe où en dehors de la zone de la page.
• Pour démagnétiser un objet sélectionné, cliquez sur l'un des deux petits repères triangulaires rouges affichés au
point où l'objet est fixé au repère. Vous observez un curseur de lien () lorsque vous survolez le repère de
guide magnétique avec la souris.
•Pour activer et désactiver les guides magnétiques, cochez/désélectionnez Guides magnétiques dans le
menu Outils/Options/Mise en page/Mise en page. Les objets déjà "magnétisés" le restent après la
désactivation des guides magnétiques. Vous devez les "décoller" manuellement.
3.6.3 Règles
Les règles de WebPlus rappellent le té du metteur-en-page et ont de multiples fonctions :
• Elles servent d'outil de mesure ;
• Elles permettent de créer des repères pour l'alignement et le magnétisme ;
• définir et afficher les retraits de paragraphes
La taille de l'intervalle réel des marques de la règle dépend du pourcentage de zoom actif. Dans un affichage en
zoom arrière, de 50 % par exemple, la distance entre les marques de la règle est moins importante qu'avec un
pourcentage de zoom de 150 %. Dans le cas où vous souhaiteriez exercer un contrôle plus important et des
incréments de magnétisme plus faibles, cliquez sur un bouton zoom pour agrandir la page.
.
3.6.3.1 Ajuster les règles
Par défaut, la règle horizontale s'étend en haut de la fenêtre de WebPlus et la règle verticale à gauche. Par défaut,
l'intersection des règles se trouve dans le coin supérieur gauche de la table de montage. L'origine par défaut
(0 sur chacune des règles) se situe dans le coin supérieur gauche de la page. Mais il est possible de définir un autre
emplacement.
3.6.3.2 Pour définir un nouveau point zéro :
•Faites glisser le marqueur de tabulation sur l’intersection des règles vers le nouveau point zéro sur la page ou la
zone de travail (ne faites glisser que sur le marqueur triangulaire !)
3.6.3.3 Pour déplacer les règles :
•Maintenez la touche Maj enfoncée, cliquez et faites glisser la flèche sur l'intersection des règles. Les règles
horizontale et verticale se détachent et peuvent être déplacées sur la page. Le point zéro n'est pas modifié.
•Double-cliquez sur l'intersection des règles pour faire passer les règles et leur origine vers le coin supérieur
gauche de la page ou sur un objet préalablement sélectionné. C'est pratique pour mesurer les objets sur la
page.
3.6.3.4 Pour rétablir la position de la règle et le point zéro d'origine :
• Double-cliquez sur le repère de tabulation à l'intersection des règles.
3.6.3.5 Pour verrouiller les règles et éviter qu'elles ne soient déplacées :
•Exécutez la commande Outil s/Options/Mise en page, sélectionnez l'onglet Règles, puis cochez
Verrouiller les règles.
3.6.4 Des règles comme outil de mesure
La fonction la plus évidente des règles est celle d'un outil de mesure. Tandis que vous déplacez le pointeur, de
petites lignes le long de chaque règle affichent les positions horizontale et verticale actuelles du curseur. Lorsque
vous cliquez pour sélectionner un objet, les zones bleues de la règle indiquent les coins gauche, droit, supérieur et
inférieur de l'objet. Chaque zone comporte un point zéro correspondant au coin supérieur gauche de l'objet de telle
sorte que vous pouvez connaître les dimensions de l'objet en un simple coup d'œil.
29
WebPlus X4 Manuel d’utilisation
3.6.5Utiliser la grille de points
La grille de points est une matrice de points ou de lignes basée sur les unités de la règle
couvrant les zones de la page et de la zone de travail. Comme les guides de règle, la grille
de points est pratique pour l'alignement et le magnétisme.
3.6.5.1 Pour activer/désactiver la grille de points :
•Activez (ou désactivez) le bouton Grille de points dans le menu Affichage.
Vous pouvez définir l'espacement, le style et la couleur du quadrillage dans la boîte de dialogue Options.
3.7 Définir les propriétés du site
Les propriétés du site permettent de définir des réglages qui s'appliqueront à la totalité du site. Les paramètres par
défaut de la page, les contrôles HTML, l'optimisation des moteurs de recherche, l'auteur/copyright et les informations
statistiques sur l'utilisation du Web peuvent être définis depuis les onglets des Propriétés du site. De manière
générale, choisissez les paramètres du site au moment de la préparation du site. Une fois définis, les paramètres
n'ont généralement pas besoin d'être modifiés (même si vous pouvez le faire à tout moment).
Certaines propriétés du site, telles que les paramètres de la page et d'optimisation pour les moteurs de recherche
s'appliquent aussi aux pages (via les Propriétés de la page
propriétés "globales" du site, respectivement et d'appliquer des paramètres "locaux" à des pages particulières.
3.7.1.1 Pour afficher ou modifier les paramètres du site :
• Sélectionnez Propriétés du site dans le menu Fichier. Une boîte de dialogue du même nom s'affiche.
La boîte de dialogue est divisée en onglets représentant chacun un aspect des propriétés du site.
Onglet Propriété
Options (défaut)
Alignement de la page par défaut
WebPlus vous permet de définir une largeur et une hauteur par défaut pour les pages Web.
Taille de la page par défaut
Les réglages de largeur et de hauteur par défaut déterminent les dimensions des nouvelles
pages Web standard ou des maquettes.
). Cela permet de remplacer ou de compléter les
30
Favoris
Définit un fichier d'icône (une image) qui s'affichera lorsqu'un visiteur inclura votre site Web
dans ses signets.
Extension de fichier par défaut
L'extension par défaut des pages publiées est .HTML. Certains serveurs web requièrent une
extension différente.
Avertir en cas de majuscules dans les noms de fichiers
Lors de la création de pages, l'utilisateur est averti si des caractères en majuscules sont
utilisés dans le nom de fichier de la page.
Loading...
+ 122 hidden pages
You need points to download manuals.
1 point = 1 manual.
You can buy points or you can get point for every manual you upload.