- Ordinateurs et électronique
- Logiciel
- Logiciel de publication assistée par ordinateur
- Adobe
- GoLive 6.0
- Manuel du propriétaire
▼
Scroll to page 2
of
693
Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Comment utiliser l'aide Page précédente 1 Comment utiliser l'aide A propos de l'aide en ligne Adobe Systems, Inc. fournit une documentation complète dans l'aide Adobe au format PDF. Cette aide contient des informations sur tous les outils, les commandes et les caractéristiques de l'application à la fois pour Windows et Mac OS. Le format PDF permet de naviguer facilement dans l'aide en ligne et peut être utilisé par des lecteurs d'écran tiers compatibles avec Windows. L'aide peut également être imprimée pour être utilisée comme référence. Navigation parmi les rubriques d'aide L'aide s'ouvre dans une fenêtre Acrobat avec le volet Signets activé. Si le volet Signets n'est pas à l'écran, sélectionnez Fenêtre > Afficher les signets. Vous pouvez également naviguer dans l'aide en utilisant la barre de navigation, l'index ou la commande Rechercher dans le document. La barre de navigation se trouve au sommet de chaque page. Cliquez sur Comment utiliser l'aide pour revenir à cette introduction. Cliquez sur Sommaire ou Index pour y accéder. Cliquez sur les flèches Page suivante ou Page précédente pour faire défiler les pages de manière séquentielle. Cliquez sur Page précédente pour revenir à la dernière page affichée. Vous pouvez également utiliser les flèches de navigation dans la barre d'outils Acrobat. Utilisation des signets, du sommaire, de l'index et de la commande Rechercher Le sommaire de l'aide s'affiche sous forme de signets dans le volet du même nom. Pour afficher les sous-rubriques, cliquez sur le signe plus en regard du signet. Chaque signet est un lien hypertexte permettant d'accéder à une section d'aide associée. Pour cela, cliquez sur le signet. La rubrique s'affiche dans le volet de droite et le signet apparaît alors en surbrillance. Vous pouvez activer ou désactiver la surbrillance à l'aide de l'option Mettre en surbrillance le signet actuel à partir du menu du volet des signets. Pour trouver une rubrique à l'aide du sommaire : 1 Cliquez sur Sommaire dans la barre de navigation au sommet ou au bas d'une page quelconque. 2 Cliquez sur une rubrique de la page Sommaire pour en afficher la première page. 3 Dans le volet Signets, développez la rubrique pour afficher les sous-rubriques. Comment utiliser l'aide | Sommaire | Index Page précédente 1 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Comment utiliser l'aide Page précédente 2 Pour trouver une rubrique à l'aide de l'index : 1 Cliquez sur Index dans la barre de navigation au sommet ou au bas d'une page quelconque. 2 Cliquez sur la lettre appropriée au sommet de la page. Vous pouvez également développer le signet Index, puis cliquer sur une lettre dans le volet Signets. 3 Localisez votre entrée, puis cliquez sur le lien du numéro de page pour afficher les informations. 4 Pour afficher plusieurs entrées, cliquez sur Page précédente pour revenir au même endroit dans l'index. Pour trouver une rubrique à l'aide de la commande Rechercher : 1 Sélectionnez Edition > Rechercher. 2 Entrez un mot ou une phrase dans la zone de saisie, puis cliquez sur OK. Acrobat recherche alors dans le document actif en commençant par la page à l'écran et met en surbrillance la première occurrence du mot ou de la phrase recherchée. 3 Pour poursuivre la recherche, sélectionnez Edition > Poursuivre la recherche. Impression des pages d'aide L'affichage de l'aide à l'écran a été optimisé ; vous pouvez néanmoins imprimer les pages sélectionnées ou l'ensemble du fichier. Pour imprimer, sélectionnez Fichier > Imprimer ou cliquez sur l'icône d'imprimante dans la barre d'outils Acrobat. Comment utiliser l'aide | Sommaire | Index Page précédente 2 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Sommaire Page précédente 3 Sommaire Introduction 4 Présentation d’Adobe GoLive 9 Introduction à la construction de sites dans GoLive 14 Définition du projet de site et de l’espace de travail 31 Fonctions de mise en page 70 Formatage du texte 103 Utilisation de feuilles de style en cascade 134 Utilisation de tableaux 157 Ajout d’images et de fichiers multimédias 178 Création de formulaires 238 Utilisation d’actions 250 Gestion et affichage de sites Web 289 Utilisation des éléments de construction de site 337 Transfert de fichiers et publication de sites Web 357 Conception de sites collaboratifs 379 Création de diagrammes de conception 406 Utilisation du code source 429 Edition de séquences QuickTime 469 Création de sites Web sans fil 522 Utilisation de contenu dynamique 544 Utilisation de la base de données Web 625 Raccourcis clavier Macintosh 642 Raccourcis clavier Windows 648 Notices juridiques 653 Comment utiliser l'aide | Sommaire | Index Page précédente 3 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Introduction Page précédente 4 Introduction Bienvenue Bienvenue à Adobe® GoLive® 6.0, la solution complète de conception, gestion et développement de sites Web. Que vous soyez un utilisateur débutant ou expérimenté, Adobe GoLive vous fournit les outils nécessaires à l’obtention de résultats de qualité professionnelle. Adobe GoLive fait partie d’un environnement de travail offrant une grande compatibilité avec d’autres applications d’Adobe, parmi lesquelles Adobe Photoshop ®, Adobe Illustrator®, Adobe InDesign®, Adobe LiveMotion™, Adobe After Effects®, et Adobe Premiere®. Enregistrement Pour Adobe, il ne fait aucun doute que votre productivité sera significativement accrue par ce logiciel. Veuillez donc enregistrer votre copie de l’application afin qu’Adobe puisse continuer à vous fournir des logiciels de qualité, un support technique et des informations sur les nouvelles fonctions de GoLive. Lorsque vous démarrez l’application pour la première fois, vous êtes invité à procéder à un enregistrement en ligne. Vous pouvez aussi choisir d’envoyer le formulaire directement ou de faxer une copie imprimée. Enfin, vous pouvez enregistrer votre copie de l’application en remplissant et en renvoyant la carte d’enregistrement de garantie jointe au logiciel. Installation d’Adobe GoLive Remarquez que vous ne pouvez pas exécuter le programme Adobe GoLive à partir du CD-Rom. Vous devez l’installer sur votre disque dur. Suivez les instructions d’installation qui vous sont données à l’écran. Pour plus de détails, consultez le fichier Comment_installer contenu dans le CD-Rom. Mise en route Adobe met à votre disposition une multitude d’options pour vous apprendre à utiliser GoLive, y compris des guides imprimés, une aide en ligne, des conseils et des info-bulles. La fonction Adobe Online offre un accès direct à des ressources Web régulièrement actualisées afin de faciliter l’apprentissage de GoLive, qu’il s’agisse de conseils, de didacticiels ou d’informations d’assistance technique. La rapidité de votre progression dépend de l’expérience acquise avec les précédentes versions de GoLive. Comment utiliser l'aide | Sommaire | Index Page précédente 4 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Introduction Page précédente 5 Si vous êtes un utilisateur débutant de GoLive : • Consultez la section « Présentation d’Adobe GoLive », page 9 pour bénéficier d’une introduction au logiciel. • Lisez la section « Introduction à la construction de sites dans GoLive », page 14 pour vous familiariser avec les principales fonctionnalités de développement de site offertes par GoLive. • Utilisez la palette Conseils de GoLive pour obtenir de brèves descriptions des icônes de GoLive et visualiser les rubriques connexes dans l’aide en ligne. • Utilisez les info-bulles de GoLive pour apprendre à identifier les outils, les boutons et les options des palettes au cours de votre travail. Voir « Utilisation des info-bulles », page 6. • Rendez-vous sur le site Web Adobe.com et faites des exercices pratiques grâce aux didacticiels de GoLive. Voir « Utilisation des ressources Web », page 6. Si vous êtes un utilisateur averti de Golive : • Consultez la section « Présentation d’Adobe GoLive », page 9 pour bénéficier d’une introduction au logiciel. • Rendez-vous sur le site Web Adobe.com et faites des exercices pratiques grâce aux didacticiels de GoLive. Voir « Utilisation des ressources Web », page 6. Si vous faites partie d’un groupe de travail de développement Web : • Lisez le Guide de l’utilisateur d’Adobe Web Workgroup Server imprimé pour plus de détails sur la configuration et l’utilisation d’un site GoLive accessible à l’ensemble d’un groupe. Utilisation de la documentation imprimée Outre le présent guide de l’utilisateur, quatre documents imprimés accompagnent Adobe GoLive 6.0. Vous trouverez également des documents au format PDF sur le CD-Rom de GoLive. Vous pourrez les visualiser à l’aide du logiciel Adobe Acrobat ® Reader™, disponible sur le même CD-Rom. Les documents imprimés figurant ci-dessous sont fournis avec Adobe GoLive 6.0. Guide de l’utilisateur d’Adobe GoLive Contient des informations sur la création et la conception de votre site Web, l’ajout de contenu dynamique à votre site, ainsi que le développement et l’intégration de contenu multimédia élaboré dans vos pages Web. Guide de l’utilisateur d’Adobe Web Workgroup Server Contient des informations sur l’utilisation d’un fichier projet de site de groupe de travail et l’administration d’Adobe Web Workgroup Server. Guide d’édition pour les appareils sans fil d’Adobe GoLive Contient des informations sur la création de sites destinés à des appareils portables sans fil. Carte de référence d’Adobe GoLive Fournit une liste des raccourcis clavier de GoLive. Les raccourcis sont également disponibles dans l’aide en ligne. Comment utiliser l'aide | Sommaire | Index Page précédente 5 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Introduction Page précédente 6 Utilisation de l’aide en ligne La documentation complète d’Adobe GoLive est également disponible dans un système d’aide au format HTML. L’aide en ligne de GoLive reprend toutes les informations du Guide de l'utilisateur d'Adobe GoLive 6.0, auxquelles il faut ajouter les raccourcis clavier, des illustrations en couleurs et une description plus détaillée de certaines procédures. (Une version de l’aide destinée à l’impression est disponible au format PDF sur le CD-Rom d’Adobe GoLive.) L’aide en ligne propose trois méthodes d’accès à l’information. Les panneaux Sommaire et Index vous donnent accès à des informations générales, tandis que le panneau Rechercher permet d’effectuer une recherche de mots ou d’expressions spécifiques. Pour un affichage correct des rubriques de l’aide en ligne, utilisez Netscape Communicator 4.0 (ou version ultérieure) ou Microsoft ® Internet Explorer 4.0 (ou version ultérieure). N’oubliez pas non plus d’activer JavaScript. Pour ouvrir l’aide en ligne : Choisissez ? > Aide de GoLive ou appuyez sur la touche F1 (Windows). Utilisation des conseils GoLive comporte une palette Conseils qui fournit de brèves descriptions des icônes figurant dans les barres d’outils, la fenêtre du document et la palette Objets. Cette palette inclut également des liens renvoyant à des sections importantes de l’aide en ligne. Pour utiliser des conseils : 1 Choisissez Fenêtre > Conseils pour afficher la palette Conseils. 2 Déplacez et maintenez le curseur de la souris sur une icône de la palette Objets, la barre d’outils ou la fenêtre du document. Le contenu de la palette Conseils change rapidement pour faire place à une brève description de l’icône. 3 Cliquez sur l’un des liens de la rubrique connexe dans la palette Conseils pour ouvrir l’aide en ligne et afficher les informations correspondant à la fonctionnalité. Utilisation des info-bulles Les info-bulles vous permettent d’afficher le nom des outils ou des boutons et commandes dans les palettes. Pour identifier un outil ou une commande : Placez le pointeur sur un outil ou une commande et marquez une pause. Une info-bulle apparaît, indiquant le nom et le raccourci clavier (le cas échéant) de l’élément. Remarque : Les info-bulles ne sont pas disponibles dans la plupart des boîtes de dialogue. Utilisation des ressources Web Si vous disposez d'une connexion Internet, vous pouvez utiliser la fonction Adobe Online pour accéder à des ressources d’apprentissage supplémentaires de GoLive situées sur le site Web Adobe.com. Sélectionnez Products sur la page d'accueil Adobe.com. Choisissez ensuite GoLive, puis Training & Events. Comment utiliser l'aide | Sommaire | Index Page précédente 6 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Introduction Page précédente 7 Ces ressources sont régulièrement mises à jour et comprennent les rubriques suivantes : Tutorials and Techniques (Didacticiels et techniques) Fournissent des indications détaillées concernant l’utilisation des fonctionnalités de Golive ou une aide à l’exécution de techniques avancées. Ces didacticiels peuvent vous aider à aller bien au-delà des informations de référence contenues dans le guide de l’utilisateur et vous montrer comment vous servir de GoLive avec d’autres applications. How Tos and Backgrounders (Instructions et informations de référence) Donnent accès à des procédures d’exécution des tâches dans GoLive et à des informations de référence détaillées sur une grande variété de rubriques. Vous y trouverez notamment une aide très complète qui couvre non seulement les processus courants mais aussi les tâches les plus complexes faisant appel à plusieurs applications pour la préparation de créations graphiques destinées au Web. Dépannage Fournit des solutions aux éventuels problèmes rencontrés lors de l’utilisation de GoLive. Il est recommandé de consulter les informations sur le dépannage disponibles via Adobe Online et le site Web d’Adobe avant de contacter le service clientèle. Pour accéder à la page d’accueil d’Adobe correspondant à votre pays : 1 Ouvrez la page d’accueil d’Adobe, à l’adresse URL www.adobe.com. 2 Dans le menu Adobe Worldwide, sélectionnez le pays de votre choix. La page d’accueil d’Adobe est personnalisée pour 20 régions géographiques différentes. Utilisation d’Adobe Online Adobe Online donne accès aux didacticiels, astuces et autres informations disponibles sur le Web, relatives à GoLive et à d’autres produits Adobe. Avec Adobe Online, vous pouvez également télécharger et visualiser la version actuelle du document Top Issues (Problèmes fréquents) de GoLive contenant les solutions les plus récentes aux problèmes techniques de GoLive. Adobe Online contient également des signets qui vous renvoient rapidement à des sites d’intérêt relatifs à Adobe et à GoLive. Pour utiliser Adobe Online : Dans GoLive, choisissez ? > Adobe Online ou cliquez sur l’icône correspondante la barre d’outils. dans Remarque : Vous devez impérativement disposer d’une connexion Internet pour accéder à Adobe Online. Adobe Online lancera votre navigateur en fonction de votre configuration Internet par défaut. Pour vous assurer que vous utilisez bien la version mise à jour d’Adobe Online : Définissez les préférences de votre système de manière à activer les options de mise à jour automatique. Vous pouvez également définir les préférences d’Adobe Online en choisissant l’option de configuration d’Adobe Online dans le menu Edition. Comment utiliser l'aide | Sommaire | Index Page précédente 7 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Introduction Page précédente 8 Accès à Adobe Online par le biais du menu d’aide Le menu d’aide (?) comporte des options qui permettent de visualiser et de télécharger des informations depuis le site Web d’Adobe. Pour télécharger les informations et les mises à jour de produits depuis le site Web d’Adobe : Choisissez Aide >Mises jour ou Aide > Liens Adobe. Autres ressources d’apprentissage D’autres ressources d’apprentissage sont également à votre disposition, même si elles ne sont pas comprises dans votre application. Service de presse d'Adobe Propose un fonds de manuels d’apprentissage approfondi, relatifs aux logiciels Adobe de création d'images et de publication, notamment la collection très reconnue Classroom in a Book, mise au point par les experts d'Adobe. Pour savoir comment vous procurer la liste des titres disponibles auprès du service de presse d'Adobe, consultez le site Web d’Adobe à l’adresse www.adobe.com ou contactez votre libraire. Programme de certification d’Adobe Permet aux utilisateurs, instructeurs et centres de formation d’améliorer et de promouvoir leurs compétences sur les produits Adobe en obtenant, par exemple, le titre d'Adobe Certified Experts ou d’Adobe Authorized Learning Providers. Vous pouvez obtenir une certification quelque soit votre situation géographique dans le monde. Pour plus de détails sur les programmes de certification, rendez-vous sur le site dédié au partenariat avec Adobe à l’adresse http://partners.adobe.com. Support technique L’enregistrement de votre produit vous donne droit à un support technique. Les conditions peuvent varier en fonction du pays de résidence. Pour plus de détails, reportez-vous à la carte de support technique fournie avec la documentation de GoLive. Support technique pour Adobe Online Adobe Online donne accès à la base de connaissances de GoLive, dans laquelle vous trouverez des réponses à vos questions techniques. Autres ressources de support technique Adobe Systems offre un support technique automatisé disponible sous diverses formes : • Consultez les fichiers Readme et Readme First! installés avec le programme pour obtenir les informations postérieures à la publication du présent manuel. • Consultez les informations très complètes concernant le support technique sur le site Web d’Adobe (www.adobe.com). Pour accéder au site Web d’Adobe à partir de GoLive, choisissez ? > Support. Comment utiliser l'aide | Sommaire | Index Page précédente 8 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Présentation d’Adobe GoLive Page précédente 9 Présentation d’Adobe GoLive Conception et développement de sites Web professionnels Les professionnels de l'Internet peuvent à présent développer, organiser et gérer rapidement du contenu dynamique destiné au Web et aux appareils sans fil et ce, quelque soit leur emplacement. Adobe GoLive 6.0 unifie l’organisation des informations, la création de contenu dynamique, la gestion de site et de fichiers pour vous permettre de produire rentablement à grande échelle du contenu multimédia d’une richesse incomparable. Développement de diagrammes d'organisation des informations GoLive vous permet de concevoir votre site et de développer un diagramme organisationnel que vous pouvez communiquer pour recueillir des commentaires et obtenir des approbations. Diagrammes d’informations de site Les outils de diagramme vous permettent de déterminer la structure de votre site et d’afficher les relations et les liens entre les pages. Diagrammes d'approbation Une fois le diagramme développé, vous pouvez le publier comme un fichier PDF ou au format SVG. Si vous distribuez votre diagramme au format PDF, vos relecteurs pourront utiliser Acrobat pour insérer directement des annotations et des commentaires dans votre fichier et vous renvoyer ce dernier approuvé. Vues de site et pages dynamiques Une fois votre site schématiquement présenté, vous pouvez générer rapidement une vue de site (à l’aide de la fonction Table des matières) et transformer le diagramme en pages dynamiques pour votre site. Conception et création visuelles de pages Web Les outils de conception visuelle de pages de GoLive vous permettent de créer facilement des pages Web, sans utiliser de code. En outre, GoLive comprend des outils d’édition de code vous permettant simultanément et visuellement de travailler dans la vue Mise en page et le code source. Grille de mise en page pour les conceptions basées sur des tableaux Il n'est désormais plus nécessaire de manipuler des tableaux HTML pour effectuer des mises en pages. Pour développer une page, il suffit simplement de glisser et déplacer des zones de texte, des images et d’autres objets vers la grille de mise en page. Cette grille constitue un tableau HTML formaté pour vous par GoLive. Lorsque vous souhaitez extraire directement le tableau, vous pouvez convertir la grille de mise en page en un tableau et vice-versa. (Voir « Utilisation de la grille de mise en page », page 74.) Mises en page de boîtes flottantes GoLive simplifie les calques HTML et les éléments DIV à l’aide de boîtes flottantes. Vous pouvez utiliser ces dernières pour mettre en page l’ensemble ou une partie spécifique d’une page Web ou encore pour afficher et masquer des images et du texte sur une page. (Voir « Mise en page à l’aide de boîtes flottantes », page 81.) Comment utiliser l'aide | Sommaire | Index Page précédente 9 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Présentation d’Adobe GoLive Page précédente 10 Mises en page d’images Photoshop tranchées De nombreux concepteurs de sites Web utilisent Adobe Photoshop pour développer des idées et effectuer des mises en page de conceptions. Ces conceptions étaient jusque là manuellement converties par le concepteur ou un développeur Web. Aujourd’hui, ces derniers peuvent trancher une page dans Photoshop et l’importer directement dans GoLive. Grâce aux objets dynamiques, le lien entre l’image et Photoshop est conservé dans GoLive et chaque image tranchée peut être séparément optimisée pour des téléchargements d’images performants. (Voir « Utilisation d’une image tranchée Photoshop », page 189.) Création de feuilles de style Les feuilles de style en cascade assurent la cohérence du texte de votre page et vous permettent d’en contrôler entièrement le formatage et la présentation. Dans GoLive, vous pouvez créer facilement des feuilles de style, sans avoir à modifier directement leur code. (Voir « A propos des feuilles de style en cascade », page 134.) Modèles de page et composants réutilisables Utilisez des modèles, des gabarits, des composants et des objets de bibliothèque pour une cohérence maximale et gagner du temps au niveau du développement. Lorsque vous utilisez les modèles de page et les composants de GoLive, il est possible de mettre automatiquement à jour les pages qui y sont liées. (Voir « A propos des éléments de construction de site », page 337.) Conception de formulaires Créez visuellement des formulaires pour la collecte de données utilisateur et le commerce électronique en faisant glisser et en déposant des éléments de formulaire sur une page. (Voir « Création de formulaires », page 238.) Modification du code source Ecrivez et modifiez le code source dans l’éditeur de code source de GoLive. Lorsque vous souhaitez visualiser simultanément votre mise en page et une partie du code, divisez la fenêtre du document en deux panneaux afin de travailler parallèlement dans l’éditeur de mise en page et l’éditeur de code source. Pour ajouter rapidement un élément ou un attribut spécifique à la page sans ouvrir l’éditeur de code source, utilisez Visual Tag Editor. Ce dernier vous offre un choix de balises et d’attributs organisés dans une liste. (Voir « Utilisation du code source », page 429.) Intégration d'outils de conception normalisés dans votre flux de production Travaillez directement vos images, graphiques et animations dans les applications qui vous sont déjà familières et importez les ensuite dans GoLive. Les éléments de construction graphiques et multimédias développés dans Adobe Photoshop, Adobe Illustrator et Adobe LiveMotion conservent leurs liens avec l’application d’origine. Objets dynamiques Placez directement des fichiers source non optimisés sur vos pages, et convertissez les ensuite en graphiques compatibles Web. Lorsque vous redimensionnez ou effectuez d’autres modifications sur le graphique de votre page, GoLive utilise le fichier source d’origine pour générer une nouvelle version formatée pour le Web. (Voir « Ajout d’images à une page Web à l’aide d’objets dynamiques », page 182.) Images Web optimisées La boîte de dialogue Enregistrer pour le Web affiche des aperçus juxtaposés de vos images vous permettant de comparer différentes options de compression et de sélectionner des paramètres qui maximisent la qualité de l’image et limitent la taille des fichiers. (Voir « Optimisation d’images pour le Web », page 197.) Comment utiliser l'aide | Sommaire | Index Page précédente 10 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Présentation d’Adobe GoLive Page précédente 11 Boutons animés dynamiques et simples Développez des boutons animés qui conservent des liens avec les images source et détectent automatiquement les images affichées lorsque vous les survolez avec le pointeur de la souris ou que vous cliquez dessus. Effectuez des modifications dans une image source, comme par exemple sur un URL dans un lien de navigation : GoLive met automatiquement à jour l’image du bouton animé. Exportez le code JavaScript du bouton animé vers un fichier bibliothèque distinct, que vous pouvez stocker dans la mémoire cache du navigateur. (Voir « Création de boutons animés », page 212.) Variations sur une image L’utilisation de variables dans des fichiers Photoshop, Adobe Illustrator SVG et Adobe LiveMotion vous permet de créer plusieurs versions d’une même image à partir d’un seul fichier source. Vous pouvez, par exemple, modifier le contenu d’un texte dans un fichier Photoshop ou encore la visibilité et le style d’un objet dans un fichier LiveMotion. (Voir « Création de plusieurs versions d’une image à l’aide des variables », page 218.) Texte converti en image dotée d’un style Si vous utilisez Adobe LiveMotion pour développer des graphiques et des animations Web, vous pouvez créer des styles destinés au texte d’en-tête, puis convertir automatiquement le texte de vos pages GoLive en images utilisant ce style. (Voir « Conversion du texte en image sur une page Web », page 221.) Gestion d’un site et de ses éléments de construction GoLive 6.0 améliore la productivité de votre équipe en rationalisant votre flux de production et en vous permettant de gérer plus efficacement vos éléments de construction. Gestion de fichiers de site Restez organisé et évitez les erreurs de site grâce au fichier projet de site de GoLive. Gestion d’éléments de construction de projet La fenêtre du site de GoLive répertorie et organise l'ensemble de vos éléments de construction de site : pages, graphiques, fichiers multimédias, objets de bibliothèque, modèles, diagrammes de conception, et ainsi de suite. GoLive propose différentes de vues de votre site, de type répertoire ou graphique pour afficher l’arborescence et les liens entre les fichiers. (Voir « Utilisation de la fenêtre du site », page 15.) Maintenance des liens Lorsque vous ajoutez, déplacez et modifiez des noms de fichiers dans la fenêtre du site, GoLive conserve et met à jour les liens entre les pages et les fichiers source. (Voir « Utilisation de la fenêtre de site », page 290.) Travail collaboratif avec Adobe Web Workgroup Server Si vous travaillez au sein d’une équipe de développement Web, vous avez la possibilité de stocker et de gérer votre dossier projet de site sur un serveur, accessible à tous les membres du groupe. Fourni avec Adobe GoLive 6.0, le serveur Adobe Web Workgroup Server permet à l’administrateur du site de contrôler l’accès et les autorisations d’accès aux éléments de construction du site. Comment utiliser l'aide | Sommaire | Index Page précédente 11 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Présentation d’Adobe GoLive Page précédente 12 Extraction et archivage des fichiers Partagez des pages Web et des éléments de construction de site sans craindre d’écraser le travail d’un collègue. Lorsqu’un fichier est extrait, aucun autre utilisateur ne peut y apporter de modification. Lorsque vous archivez le fichier, vous avez la possibilité d’enregistrer des commentaires sur vos modifications avec le fichier. (Voir « Développement d’un site collaboratif », page 388.) Eléments de construction de site partagés Outre les pages Web, votre équipe peut accéder à toutes les fonctionnalités d’un fichier projet de site, comme des images, des feuilles de style, des couleurs de site, des modèles, des composants et des diagrammes de conception. (Voir « Utilisation des éléments de construction de site », page 337.) Gestion du processus de révision Lorsque vous archivez un fichier, le serveur conserve les versions antérieures du fichier en cas de restauration nécessaire d’une version précédente. Vous pouvez aussi comparer facilement plusieurs versions du même fichier. (Voir « Utilisation de l’historique des révisions », page 396.) Liens automatiquement résolus Archivez de nouveau les fichiers et soyez certain que toutes les modifications aux pages liées apportées par vous ou un collègue seront automatiquement mises à jour par le serveur. (Voir « Archivage de fichiers et de dossiers », page 390.) Personnalisation de votre environnement de travail Créez votre propre interface utilisateur de GoLive en agençant à votre gré les outils, les palettes et les commandes de menu et en enregistrant les configurations. Espaces de travail personnalisés Définissez différents affichages des palettes de GoLive que vous souhaitez maintenir actifs pour des tâches spécifiques et enregistrez chacun d’eux comme un espace de travail personnalisé que vous pouvez choisir dans le menu Fenêtre. (Voir « Enregistrement d’un espace de travail personnalisé », page 36.) Kit SDK (Software Developer’s Kit) Personnalisez et élargissez les fonctionnalités de GoLive grâce à la création de scripts. (Pour plus d’informations, consultez la documentation du kit SDK de GoLive.) Richesse et personnalisation du contenu Produisez du contenu multimédia élaboré et personnalisé, destiné au Web et à des appareils sans fil. Création de contenu personnalisé et de sites de commerce électronique Les sites Web dynamiques offrent aux internautes une expérience interactive où les informations sont générées, regroupées, stockées et traitées de manière dynamique. Prise en charge native des langages de script courants Le module Dynamic Content d’Adobe GoLive prend en charge les technologies de script serveur ASP (Active Server Pages), JSP (JavaServer Pages), et PHP (PHP : Hypertext Preprocessor). (Voir « Exécution de scripts serveur », page 549.) Pages Web générées de manière dynamique Liez facilement du contenu Web à une base de données ou un serveur d’imagerie pour générer des données comme des tailles ou des prix d’images. (Voir « Développement et déploiement de sites Web dynamiques », page 552.) Comment utiliser l'aide | Sommaire | Index Page précédente 12 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Présentation d’Adobe GoLive Page précédente 13 Fournisseurs de solutions de commerce électronique intégrés Adobe Systems Incorporated s’est associé aux principaux fournisseurs de solutions de commerce électronique afin de faciliter la création de sites de commerce électronique personnalisés et entièrement fonctionnels. Création de pages Web destinées à des appareils sans fil L’environnement de création sans fil vous permet de bénéficier de fonctionnalités de GoLive uniques, telles que la gestion performante de liens et de site, les diagrammes d'organisation d’informations, les modèles et les gabarits ou encore les objets dynamiques et l'optimisation d’images. CHTML Créez visuellement des pages dans CHTML, le langage de balisage utilisé pour le service de téléphonie sans fil i-mode, très répandu au Japon et dans d’autres pays. L’utilisation de la fonction d’aperçu du micro navigateur et d’Access Compact Viewer pour GoLive (Windows uniquement) assurera un affichage impeccable de vos pages sur un grand nombre de téléphones. (Voir « Création d’un site CHTML », page 523.) WML Grâce au principe de création par glisser-déposer, vous pouvez développer des sites conformes aux spécifications WAP 1.0 et afficher ensuite un aperçu de vos pages sur l’émulateur de téléphone de Nokia (Windows uniquement). (Voir « Création d’un site Web WML », page 530.) XHTML-Basic Nouvelle norme des appareils sans fil conforme à la spécification WAP 2.0. GoLive propose une vue Mise en Page de micro navigateur lorsque vous créez des pages en langage XHTML-Basic et un émulateur de téléphone de Nokia (Windows uniquement) pour afficher un aperçu de vos pages. (Voir « Création de pages XHTML-Basic », page 541.) Vérification du code Economisez du temps grâce aux nouvelles fonctionnalités puissantes de détection d’erreurs vous permettant de vérifier la conformité du code avec les dernières normes W3C. Vérificateur de syntaxe GoLive inclut un vérificateur de syntaxe robuste et compatible DTD. (Voir « Vérification de la syntaxe », page 440.) Sites conformes à l’article 508 Vérifiez que votre site soit accessible aux personnes handicapées. Le vérificateur d’accessibilité vous permet de créer des rapports personnalisés. (Voir « Génération de rapports sur les sites », page 331.) Comment utiliser l'aide | Sommaire | Index Page précédente 13 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 14 Introduction à la construction de sites dans GoLive Préparation du terrain Pour bénéficier au maximum des outils GoLive de création et de gestion de site, commencez par créer un site à l’aide de ce programme. GoLive vous permet de définir l’ensemble de vos pages, de vos fichiers multimédias et de vos ressources dans une structure logique et de créer un document spécial pour leur utilisation. Ce document est le fichier projet de votre site ; il s’ouvre dans la fenêtre du site et affiche une réplique exacte de la structure des dossiers et fichiers de votre Bureau. C’est à partir de cette fenêtre que vous pouvez construire et restructurer votre site, lier différentes pages et images, stocker les éléments de construction réutilisables (tels que les modèles de page) et effectuer les transferts et les synchronisations des fichiers du site avec votre serveur. Utilisation d’Adobe Web Workgroup Server Vous avez la possibilité de travailler sur votre site en collaboration avec votre équipe de développement Web. GoLive facilite la configuration d’un serveur et d’un fichier projet de site collaboratif. L’ensemble de votre équipe de développement Web peut accéder à votre site et aux fichiers correspondants. A l’aide de la fenêtre du site, vos collègues peuvent extraire des fichiers sur lesquels ils veulent travailler, évitant ainsi la modification de ces fichiers par d’autres personnes, puis les archiver à nouveau après leur utilisation. GoLive vérifie et met automatiquement à jour toutes les références de lien qui ont été modifiées dans le site. Le serveur Adobe Web Workgroup Server vous permet de développer et de gérer vos sites de façon centralisée ; à chaque fois qu’un fichier de site est modifié par vous ou par un autre membre de votre équipe, Web Workgroup Server enregistre une version distincte du fichier. Vous pouvez comparer le code source des différentes versions du fichier et spécifier une de ces versions pour le fichier actif. Vous n’avez pas besoin de travailler au sein d’une équipe de développement Web pour pouvoir profiter des fonctions de contrôle de version. En effet, même en tant qu’utilisateur unique et seul créateur du site Web, vous pouvez configurer un serveur de groupe de travail. (Voir « Conception de sites collaboratifs », page 379.) Création du fichier projet de site Pour créer un site, choisissez Fichier > Nouveau site. L’assistant de création de site de GoLive vous guide tout au long du processus de création d’un site sur votre ordinateur local ou sur un serveur de groupe de travail distant. Vous pouvez créer un site vierge et laisser GoLive générer la page d’accueil à votre place (généralement intitulée index.html) ou créer un site basé sur des fichiers existants (importés depuis un autre emplacement ou créés dans une application tierce). Vous avez également la possibilité de baser votre nouveau site sur un modèle de site GoLive. (Voir « Création d’un site », page 38.) Comment utiliser l'aide | Sommaire | Index Page précédente 14 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 15 Lorsque vous créez un site, GoLive génère sur votre bureau le fichier projet de ce site et trois dossiers : un dossier de site destiné à stocker les pages Web et les fichiers multimédias (également appelé dossier racine du site), un dossier de données doté de sousdossiers pour stocker toutes les conceptions de sites et tous les éléments de construction réutilisables, et un dossier de configuration destiné à stocker toute sorte d’informations transférables sur la configuration de votre site dans GoLive. Utilisation de la fenêtre du site Il est recommandé de toujours utiliser la fenêtre de site lorsque vous travaillez sur votre site, que ce soit pour mettre en page une page unique dotée de texte et d’images, pour créer la structure de toutes les pages du site ou pour télécharger le site vers le Web. Les puissants outils de création et de gestion de site de GoLive reposent sur cette fenêtre de site. Elle constitue la zone de travail, le gestionnaire et les ressources de votre projet de site. Vous pouvez ouvrir vos pages, organiser vos fichiers et créer des liens dans la fenêtre de site. Cette fenêtre est composée de plusieurs panneaux, mais celui dans lequel vous travaillez la plupart du temps est le panneau Fichiers. Les fichiers et dossiers affichés dans ce panneau correspondent aux fichiers et dossiers contenus dans le dossier racine du site stocké sur votre disque dur. Lorsque vous déplacez ou renommez un fichier, ajoutez une page ou créez un nouveau dossier dans le panneau Fichiers, GoLive implémente automatiquement la modification dans le dossier racine du site et met à jour les références de lien du site. (Voir « Utilisation des fichiers et des dossiers », page 294.) Le fichier projet du site est affiché dans la fenêtre du site. La plupart des autres panneaux de la fenêtre de site répertorient les éléments de construction réutilisables contenus dans votre site, tels que les URL externes utilisés en tant que liens dans vos pages, les couleurs dotées de noms pour faciliter leur identification et les jeux de polices appliqués au texte et aux feuilles de style en cascade. Le panneau Bibliothèque permet de stocker des objets utilisés dans plusieurs pages ou des extraits de code source. Vous pouvez échanger ces éléments de construction de site avec des membres de votre équipe étant donné qu’ils sont stockés dans le site (et non dans l’application). Comment utiliser l'aide | Sommaire | Index Page précédente 15 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 16 Vous pouvez afficher des panneaux supplémentaires en cliquant sur la double flèche située dans le coin inférieur droit de la fenêtre du site. Parmi ces panneaux figurent le panneau Erreurs permettant de vérifier les erreurs du site, ainsi que les panneaux FTP et WebDAV permettant de travailler sur un site publié. Dans le panneau Divers, vous trouverez des dossiers dans lesquels sont stockés des fichiers ressource spéciaux vous permettant de gagner du temps lors de la création de pages Web et d’assurer une cohérence entre les différentes pages. Tous les fichiers affichés dans le panneau Divers (y compris ceux du dossier Corbeille du site) peuvent être réutilisés dans votre site. (Voir « Utilisation des éléments de construction de site », page 337.) Tous les panneaux de la fenêtre du site reflètent les fichiers et dossiers effectivement stockés sur votre disque dur. Ajout de pages et de fichiers multimédias Utilisez la fenêtre de site pour ajouter des pages, des images et d’autres fichiers multimédias à votre site, soit en faisant glisser les fichiers voulus (dossiers compris) vers le panneau Fichiers ou en les y important, soit en créant de nouvelles pages. Lorsque vous faites glisser ou importez des fichiers image et HTML dans la fenêtre du site depuis d’autres emplacements de votre disque dur, GoLive crée une copie de ces fichiers pour le site et laisse les originaux à leur emplace-ment d'origine. Lorsque vous ajoutez une nouvelle page à votre site en choisissant Site > Créer > Page, GoLive répertorie automatiquement cette dernière dans la liste du panneau Fichiers et place le fichier dans le dossier du site. Vous pouvez ouvrir la page dans la fenêtre du document en cliquant deux fois dessus dans le panneau Fichiers. (Voir « Ajout de fichiers à un site », page 42.) Comment utiliser l'aide | Sommaire | Index Page précédente 16 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 17 Conception de l’arborescence et des liens de page du site GoLive comprend des outils d’organisation d’informations permettant de créer des diagrammes de travail ou des organigrammes de la structure du site. Grâce aux petites icônes graphiques et aux autres outils visuels, vous pouvez mettre en page des niveaux de section et des pages du site et définir leur relation avec les autres fichiers de la structure. A partir de ces diagrammes, vous pouvez générer des documents à partager avec des tiers pour vérification. Ensuite, lorsque vous êtes satisfait du résultat, vous pouvez enregistrer ces diagrammes en tant que fichiers à insérer dans votre site. (Voir « Création de diagrammes de conception », page 406.) Conception de pages Web Vous pouvez créer des pages Web sans avoir à écrire de code source. En effet, GoLive met à votre disposition des outils facilitant la mise en page de texte, d’images et d’autres objets, l’application d’attributs structurels, graphiques ou interactifs au contenu et la création de liens renvoyant à d’autres pages ou URL. Utilisation des outils de conception de page L'interaction des outils de conception de page de GoLive vous permet de gagner du temps lors de la mise en page du contenu de pages Web. Supposons que vous faites glisser un objet de la palette Objets vers le corps de votre page Web ; si cet objet appartient à la section d’en-tête du document (tel que l’élément Mots-clés), GoLive le place immédiatement dans la section d’en-tête de la fenêtre du document. Fenêtre de document Les pages Web s’affichent par défaut dans le panneau Mise en page de la fenêtre du document. Ce panneau permet de mettre en page le contenu de votre page Web. La partie supérieure de la fenêtre du document comprend d’autres panneaux, parmi lesquels l’éditeur de code source et l’éditeur de structure permettant de manipuler le code source d'une page, l’éditeur de cadres permettant de mettre en page un jeu de cadres et le panneau d’aperçu permettant de visualiser un aperçu de la page. Comment utiliser l'aide | Sommaire | Index Page précédente 17 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 18 Lorsque vous travaillez dans le panneau Mise en page, vous pouvez ouvrir des fenêtres afin de modifier des feuilles de style, des scripts JavaScript, du contenu dynamique de base de données et des montages de boîtes flottantes en cliquant sur les boutons situés dans le coin supérieur droit de la fenêtre du document. A G B H C D E F I Cliquez sur un onglet pour afficher un éditeur ou un aperçu différent. A. Affiche ou masque le panneau d’en-tête B. Ouvre l’éditeur JavaScript C. Ouvre l’éditeur de montage DHTML D. Ouvre l’éditeur de source de contenu E. Ouvre l’éditeur de feuilles de style CSS F. Affiche le menu de la fenêtre du document G. Affiche ou masque le panneau de code source H. Affiche l’arborescence des balises I. Définit la taille de la fenêtre du document. GoLive prend en charge les formats HTML et XHTML courants. A l’aide du menu situé dans le coin supérieur droit de la fenêtre du document, vous pouvez choisir une déclaration de type de document, telle que HTML 4.01 strict ou cHTML (imode), pour l’affichage des pages sur des appareils sans fil. (Voir « Ajout ou modification d’une déclaration doctype », page 46.) La barre d’arborescence des balises située dans la partie inférieure de la fenêtre du document vous permet de choisir des éléments spécifiques du code source associés à du texte ou des objets que vous avez sélectionnés dans votre mise en page. Vous pouvez diviser la fenêtre du document en panneaux supplémentaires pour afficher la section d’en-tête de votre page dans le haut de la fenêtre ou le code source de la page dans le bas de la fenêtre. Le panneau de code source constitue un autre affichage de l’éditeur de code source. (Voir « Modification du code HTML dans l’éditeur de code source », page 429.) Comment utiliser l'aide | Sommaire | Index Page précédente 18 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 19 Palette Objets La palette Objets évite l’encodage manuel des documents HTML. Elle contient des éléments HTML et du code source prédéfini que vous pouvez insérer dans votre page en cliquant deux fois sur les icônes d’objets de la palette ou en les faisant glisser. Certains objets, comme par exemple l’icône Image, sont des balises d’emplacement que vous pouvez utiliser pour créer des liens pointant vers les fichiers source des ressources. D’autres objets correspondent à des références de site pour des couleurs, des jeux de polices, etc., stockés avec un site ou des pages génériques insérées dans un site. Le glissement d’un objet vers une page entraîne l’insertion immédiate d’un élément HTML. Les objets sont organisés par catégories dans la palette Objets, en fonction de la tâche générale à réaliser. Par exemple, le panneau Standard contient des objets permettant de mettre en page le corps d’une page et le panneau En-tête, des objets permettant d’ajouter des informations méta à la section d’en-tête de la page. D’autres jeux comprennent les objets permettant d’ajouter à la page des formulaires, du contenu dyna-mique de base de données et des cadres, ainsi que des objets dynamiques pour établir des liens entre les images de la page et les applications ayant servi à les créer. Vous pouvez également utiliser la palette Objets pour insérer des composants dans une page, des objets de diagramme dans un diagramme de conception, et des extraits de code source ou des objets personnalisés dans le code source ou la mise en page. Vous pouvez configurer les jeux d’icônes de sorte qu’ils correspondent à un type de document restreint, supprimant ainsi toutes les icônes non prises en charge de chaque jeu et permettant d’éviter tout ajout d’objets erronés à votre page. (Voir « Configuration de la palette Objets pour un type de document », page 440.) Comment utiliser l'aide | Sommaire | Index Page précédente 19 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 20 Inspecteur L’inspecteur est une palette contextuelle contenant des options. Cette palette change dynamiquement en fonction de l’élément sur lequel vous travaillez. Par exemple, lorsque vous sélectionnez un tableau ou une boîte flottante dans une page, l’inspecteur se transforme en inspecteur de tableau ou de boîte flottante et contient des options de définition des attributs du tableau ou de la boîte flottante. L'inspecteur propose des options non seulement pour les éléments de page, mais également pour les fichiers ou éléments de construction de site de la fenêtre de site, les styles des feuilles de style en cascade, les cadres des jeux de cadres, etc. Le nom de l’inspecteur s’affiche dans la partie inférieure de la palette. Veillez à toujours afficher l’inspecteur lorsque vous créez votre site Web. C’est en effet à cet endroit que vous apportez toutes vos modifications, quelles qu’elles soient, aux éléments ou objets. Pour afficher l’inspecteur, choisissez Fenêtre > Inspecteur. Le nom de l’inspecteur varie en fonction de l’élément de page ou de fenêtre sélectionné. Outils de prévisualisation Vous pouvez cliquer sur le panneau Aperçu de la fenêtre du document pour prévisualiser instantanément le contenu de votre travail de mise en page tel qu’il serait affiché dans un navigateur. Certains objets, tels que les liens pointant vers des URL externes, fonctionnent uniquement s’ils sont prévisualisés dans un navigateur. Le bouton Afficher dans le navigateur de la barre d’outils permet d’ouvrir automatiquement la page dans le navigateur Web de votre choix. (Voir « Prévisualisation des fichiers », page 63.) Vous pouvez également modifier l’affichage de votre mise en page dans le panneau Mise en page afin de simuler divers profils de navigateurs sur différentes plates-formes, tels que l’émulateur de téléphone XHTML de Nokia. Cliquez sur la page avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS), et choisissez Afficher > Profil du navigateur dans le menu contextuel. (Voir « Définition des options d’affichage de mise en page », page 48.) Comment utiliser l'aide | Sommaire | Index Page précédente 20 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 21 Barre d’outils La barre d’outils est utilisée pour travailler sur une page dans l’éditeur de mise en page ou sur des fichiers et des éléments de construction de site dans la fenêtre du site. Les options disponibles dans la barre d’outils varient en fonction de l’élément sélectionné dans la fenêtre. Par exemple, lorsque vous sélectionnez du texte dans votre mise en page, les boutons et les menus contextuels de formatage de texte deviennent disponibles dans la barre d’outils. Lorsque vous sélectionnez la page dans la fenêtre du site, d’autres options deviennent disponibles, comme par exemple l’option de transfert du fichier vers le serveur Web. A B Les options de la barre d’outils varient en fonction de la sélection active. A. Options de l’éditeur de mise en page B. Options de la barre d’outils du panneau Fichiers de la fenêtre de site GoLive propose des barres d’outils supplémentaires destinées à la manipulation de sites collaboratifs (voir « Utilisation de la barre d’outils Groupe de travail », page 382), de code source (voir « Modification du code HTML dans l’éditeur de code source », page 429), et de contenu dynamique (voir « Utilisation de contenu dynamique », page 544). Définition des titres et des mises en page Toutes les nouvelles pages créées dans GoLive sont dotées par défaut du titre « Bienvenue dans Adobe GoLive 6 ». Ce titre, que vous pouvez modifier, s’affiche dans la barre de titre de la fenêtre du navigateur Web. L’éditeur de mise en page, la palette Objets et l’inspecteur vous permettent de définir rapidement des titres et des marges de page, ainsi que des paramètres relatifs aux navigateurs Web et aux moteurs de recherche. Les titres des pages et les mots-clés insérés dans la section d’en-tête de chaque page jouent un rôle primordial dans les résultats obtenus par les moteurs de recherche au niveau de la recherche des pages de votre site. Les titres de page sont également utilisés par les navigateurs Web pour désigner des signets ou des URL de Favoris. (Voir « Configuration des pages », page 45.) Pour ouvrir l’inspecteur de la page, Choisissez Spécial > Propriétés de la page. Dans l’inspecteur, vous avez la possibilité de modifier le titre de la page, les marges, la couleur de fond et d’autres propriétés de la page. Comment utiliser l'aide | Sommaire | Index Page précédente 21 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 22 Par défaut, les marges de gauche et supérieures des nouvelles pages ne s’alignent pas sur les bords de la fenêtre du navigateur, de sorte que le contenu de la page ne soit pas affiché trop près des commandes du navigateur Web, ce qui risquerait d’entraver sa lecture. Pour supprimer les décalages des marges et afficher la page dans la partie supérieure gauche de la fenêtre du navigateur, cliquez avec le bouton droit de la souris (Windows) ou maintenez la touche Control enfoncée (Mac OS) sur la page, puis, dans le menu contextuel, choisissez Document > Affecter aux marges la valeur zéro. (Voir « Utilisation des menus contextuels », page 34.) Mise en page de contenu Vous pouvez créer différents types de mises en page à l’aide des grilles de mise en page, des tableaux, des boîtes flottantes, des jeux de cadres et des objets dynamiques Photoshop. A l’exception des jeux de cadres, la mise en page du contenu de vos pages s’effectue dans l’éditeur de mise en page. Pour mettre en page des cadres et ajouter des pages de contenu dans un document doté d’un jeu de cadres, utilisez l’éditeur de cadres. (Voir « Utilisation de cadres », page 92.) Introduction à la grille de mise en page Les grilles de mise en page de GoLive vous permettent de créer des conceptions de page basées sur des tableaux, sans avoir à considérer la taille des cellules du tableau ni la fusion des lignes et des colonnes. Lorsque vous faites glisser du texte, des images et d’autres objets vers la grille de mise en page et que vous tentez de les positionner, GoLive crée automatiquement les cellules de tableau nécessaires en ajustant les cellules vides autour du contenu. Pour ajouter une grille de mise en page, faites-la glisser du panneau Standard de la palette Objets vers la page. (Voir « Utilisation de la grille de mise en page », page 74.) Le moyen le plus rapide et le plus efficace de mettre en page des images et d’autres fichiers multimédias sur votre page Web consiste à les faire glisser de la fenêtre du site vers la grille de mise en page. GoLive crée automatiquement des liens de ressource entre les fichiers source et les images ou les médias incorporés dans la page. Vous pouvez utiliser des zones de texte pour agencer des blocs de texte sur la grille et y placer des images lorsque vous souhaitez les habiller de texte. Comment utiliser l'aide | Sommaire | Index Page précédente 22 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 23 Utilisation de tableaux HTML standard Même si vous utilisez des grilles de mise en page, il est possible que vous souhaitiez ajouter un tableau HTML standard à une page, pour afficher, par exemple, les bords des lignes et des colonnes dans un diagramme d’informations. Il est extrêmement facile d’ajouter un tableau ou de convertir une grille de mise en page en un tableau standard et d’utiliser ensuite l’inspecteur du tableau pour définir ses attributs. (Voir « Utilisation de tableaux », page 157.) A B Les bords des tableaux peuvent séparer visuellement les informations. A. Grille de mise en page (aucun bord de cellule) B. Tableau HTML standard encadré Conception de pages à l’aide d’images Photoshop tranchées Un autre moyen de créer une mise en page de site Web consiste à effectuer la conception dans Photoshop et à trancher l’image en plusieurs sections. Lorsque vous faites glisser l’image Photoshop tranchée de la fenêtre du site vers la fenêtre du document, GoLive crée automatiquement une relation d’objet dynamique entre Photoshop et la page. Il configure ensuite un dossier et crée un tableau destiné à contenir de nouvelles images formatées pour le Web pour chaque tranche, puis affiche la boîte de dialogue Enregistrer pour le Web pour optimiser chacune d’elle. (Voir « Ajout d’images Photoshop », page 188.) Masquage et affichage d’images dans les boîtes flottantes Vous pouvez créer des mises en page à l’aide des boîtes flottantes de GoLive, afin que celles-ci reçoivent le contenu de la page, ou encore les combiner à d’autres objets sur une grille de mise en page pour créer des effets en couche. Les boîtes flottantes sont basées sur l’élément DIV. Ainsi, vous pouvez les superposer, les positionner librement à n’importe quel endroit de la page et y associer des actions JavaScript. Vous pouvez, par exemple, utiliser des boîtes flottantes et les actions prédéfinies afficher/masquer pour afficher ou masquer des images dans le navigateur Web en fonction d’événements de souris (tel qu’un clic). (Voir « Mise en page à l’aide de boîtes flottantes », page 81 et « Masquage et affichage des boîtes flottantes », page 88). Comment utiliser l'aide | Sommaire | Index Page précédente 23 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 24 Formatage de texte Pour ajouter du texte à votre mise en page, vous pouvez le saisir directement sur une page ou dans des zones de texte, des cellules de tableau et des boîtes flottantes, ou encore coller ou faire glisser un texte copié dans les éléments conteneurs. Vous pouvez ensuite formater le texte avec des attributs, tels que de la couleur, des polices, des corps de police et un alignement. Vous pouvez créer des listes numérotées ou à puces, appliquer des retraits à des blocs de texte pour des citations et formater des mots sélectionnés avec des attributs de texte en ligne, tels que des caractères en italique ou en gras. Vous avez également la possibilité de vérifier l’orthographe, de rechercher et de remplacer des éléments de texte. La palette Styles HTML permet de configurer en un clin d’oeil des groupes d’attributs HTML fréquemment utilisés, tels que des en-têtes HTML de base. (Voir « Enregistrement de styles HTML », page 117.) A B C Texte formaté à l’aide d’éléments HTML A. En-tête 1 B. Option Distinction pour du texte en ligne C. Liste numérotée Le meilleur moyen d’ajouter des attributs de formatage à votre texte en limitant le code source et le temps de téléchargement de vos pages Web consiste à stocker les informations de formatage du texte dans une feuille de style en cascade appliquée au texte de toutes les pages. Les feuilles de style en cascade vous permettent de contrôler plus amplement l’affichage du texte dans les navigateurs Web (comme l’établissement d’un corps de police cohérente sur les plate-formes Mac OS et Windows). GoLive n’est pas seulement un éditeur HTML. C’est aussi un programme de création de feuilles de style en cascade (CSS). Dans GoLive, vous pouvez créer des feuilles de style en cascade internes ou externes en sélectionnant des options au lieu de saisir du code source. En structurant d’abord le texte à l’aide d’éléments HTML, vous pouvez être sûr que la présentation de votre page sera toujours impeccable, même dans des versions de navigateur plus anciennes ne prenant pas en charge les CSS. Utilisez le menu contextuel Format du paragraphe de la barre d’outils pour ajouter une structure à un texte en appliquant des en-têtes HTML et d’autres éléments structurels. (Voir « Formatage des paragraphes », page 106.) Créez ensuite une feuille de style et utilisez l’inspecteur de sélecteur CSS pour configurer des styles dotés de sélecteurs de balises conçus à partir des éléments de structure, en ajoutant à chaque style de la couleur, des polices, etc. (Voir « Création de styles d’élément HTML », page 139.) Comment utiliser l'aide | Sommaire | Index Page précédente 24 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 25 Liaison de pages Lorsque vous élaborez la structure de votre site Web, vous avez la possibilité de créer différents types de liens sur une page afin de relier cette dernière à d’autres pages ou à des fichiers source. Les liens de ressource sont utilisés pour lier des images ou des médias incorporés dans la page à leurs fichiers source. Les liens de navigation sont utilisés pour passer d’images ou d’un texte contenu dans une page à d’autres pages ou URL lorsque vous cliquez sur les liens figurant dans le navigateur. GoLive vérifie continuellement l’intégrité des liens, en vous signalant des problèmes éventuels et en veillant à ce que tous les liens et toutes les références soient mis à jour dans le site. B A GoLive met à jour les liens chaque fois qu’un fichier de destination change A. Lien de ressource entre une image et un fichier source B. Lien de navigation entre un texte et une page Quelques étapes seulement sont nécessaires à la création de liens de ressource et de navigation. En faisant glisser, par exemple, un fichier image de la fenêtre du site vers la page, vous créez automatiquement un lien de ressource entre l’image figurant sur la page et le fichier source. En sélectionnant le texte d’une page et en le faisant glisser du bouton d’affectation de l’inspecteur de texte vers un fichier HTML de la fenêtre du site, vous créez automatiquement un lien de navigation entre le texte et le fichier HTML. Utilisez l’inspecteur afin de créer des liens, configurer des références vides pour créer ultérieurement des liens et spécifier les fichiers de destination et les cadres cibles. Le menu de la palette Inspecteur inclut également une liste des URL que vous avez déjà utilisé en tant que destinations de liens, afin de pouvoir les réutiliser ultérieurement, si nécessaire. (Voir « Liaison des fichiers », page 55.) Vous pouvez enregistrer des URL dans le panneau Externe de la fenêtre du site afin de pouvoir les réutiliser sans avoir à spécifier chaque fois le chemin d’accès. (Voir « Utilisation d’URL et d’adresses électroniques dans un site », page 352.) Comment utiliser l'aide | Sommaire | Index Page précédente 25 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 26 Utilisation de graphiques et de médias Les images, le son, les séquences et les animations permettent de faciliter la lecture des informations sur vos pages Web et d’en rendre la lecture plus attrayante. Vous pouvez ajouter à votre page des images compressées et formatées pour le Web (telles que des images GIF, JPEG ou PNG) et utiliser l’inspecteur de l’image pour définir du texte et des liens d’image alternatifs ainsi que d’autres attributs d’image. Vous pouvez utiliser des images comme boutons de navigation ou boutons animés contenant des liens renvoyant à d’autres pages ou URL, et créer des mappages d’images en divisant une image en sections interactives ou « zones sensibles. » (Voir « Création de boutons animés », page 212 et « Création de mappages d’images », page 217.) GoLive inclut également un éditeur de séquences QuickTime destiné à faciliter l’ajout de fichiers séquence à votre page. (Voir « Edition de séquences QuickTime », page 469.) Mieux encore, vous pouvez utiliser des objets dynamiques pour ajouter des images et des animations à votre page et laisser GoLive les optimiser pour le Web tout en conservant un lien aux fichiers source dans leur format d’origine. Utilisation d’objets dynamiques pour optimiser des images destinées au Web GoLive est compatible avec d’autres programmes d’Adobe. Ainsi, lorsque vous faites glisser un fichier Photoshop, Illustrator, ou LiveMotion de la fenêtre du site vers votre mise en page, GoLive établit automatiquement un lien d’objet dynamique avec le fichier source, vous permettant ainsi d’éditer le fichier en question dans l’application d’origine. Désormais, il n’est plus nécessaire de préparer ces images avant de les importer dans GoLive. Le programme affiche la boîte de dialogue Enregistrer pour le Web pour vous permettre d’optimiser l’image dans un format Web, puis réoptimise automatiquement celle-ci chaque fois que vous modifiez l’image source d’origine. Les images tranchées sont automatiquement placées dans un tableau. Chaque tranche optimisée pour le Web, ainsi que les fichiers et le tableau HTML pour les images Web, sont ajoutés à votre site. (Voir « Utilisation d’une image tranchée Photoshop », page 189 et « Utilisation d’une image tranchée Illustrator SVG », page 192.) Lorsque vous utilisez des objets dynamiques sur vos pages, le redimensionnement d’une image Web n’affecte pas la taille ou la résolution du fichier image source, ceci afin de permettre à votre page de contenir plusieurs images de tailles diverses, toutes se référant à la même image source. Vous pouvez également utiliser des variables de l’image source de manière à pouvoir modifier un seul aspect (tel que la couleur des polices) de chaque image Web de la page, sans avoir à changer l’image source. Si vous souhaitez modifier une image source, cliquez deux fois sur l’objet dynamique. GoLive affiche ensuite l’image dans l’application dans laquelle elle a été créée. (Voir « Ajout d’images à une page Web à l’aide d’objets dynamiques », page 182.) Création de boutons animés « dynamiques » Dans GoLive, vous pouvez créer des boutons animés à partir de deux ou trois images, en fonction d’événements de souris et de scripts JavaScript prédéfinis. Les boutons animés sont des images qui changent d’apparence lorsque vous les survolez avec le pointeur de la souris ou que vous maintenez le bouton de la souris appuyé dessus. Vous pouvez associer des liens de navigation aux boutons animés : ainsi, lorsque vous cliquez dessus, vous êtes renvoyé vers une nouvelle destination. Comment utiliser l'aide | Sommaire | Index Page précédente 26 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 27 Lorsque vous utilisez des noms spéciaux de boutons animés pour chaque fichier image et que vous spécifiez la première image dans l’inspecteur de l'image, GoLive lie automatiquement l’ensemble des fichiers image aux événements de souris correspondants. Pour créer des boutons animés, vous pouvez appliquer l’objet Bouton animé ou l’objet Image à vos images. GoLive conserve automatiquement les liens de navigation associés aux boutons animés. Vous pouvez exporter le code JavaScript utilisé pour les boutons animés vers un fichier bibliothèque distinct pouvant être stocké dans la mémoire cache du navigateur. Lorsque vous utilisez l’objet Image au lieu de l’objet Bouton animé pour créer un bouton animé, vous obtenez un bouton animé simplifié contenant moins de code source. Ceci est particulièrement utile lorsque vous souhaitez créer de simples boutons animés en y associant un nombre limité d’actions, voire aucune action. (Voir « Création de boutons animés », page 212.) Réutilisation d’éléments de construction de site pour une cohérence et une performance maximales Les modèles et les composants de page réutilisables de GoLive vous permettent de gagner un temps précieux au niveau de la production et de créer des pages Web homogènes et cohérentes dans l’ensemble de votre site. Pour stocker et réutiliser des éléments de construction de site de GoLive, utilisez la fenêtre du site et la palette Objets. Création de pages basées sur des modèles Vous pouvez créer des modèles de page à l’aide de mises en page pré-conçues et les utiliser pour la création de nouvelles pages dans le site. Vous pouvez marquer certaines zones des modèles comme modifiables, tout en maintenant le reste verrouillé, de manière à pouvoir contrôler la manière dont le contenu est ajouté à chaque nouvelle page. Les modèles de page demeurent liés aux pages. Ainsi, lorsque vous les modifiez, GoLive met automatiquement à jour les pages qui y sont associées (sans affecter le nouveau contenu ajouté aux zones modifiables). (Voir « Utilisation de modèles de page », page 338.) Le gabarit est un autre type de modèle que vous pouvez utiliser pour créer de nouvelles pages. Contrairement aux modèles de page, les gabarits n’affectent les nouvelles pages que lors de leur création et ne demeurent pas liés aux pages une fois leur création terminée, de sorte que leur mise en page ne soit pas automatiquement mise à jour. (Voir « Utilisation de gabarits », page 346.) Si vous publiez plusieurs sites Web et que vous souhaitez contrôler l’ensemble de la structure, du format et des mises en page de chaque site, vous avez la possibilité de configurer tous vos modèles de page et d’autres éléments de construction de page dans un site vierge et d’enregistrer ce dernier comme un modèle de site. (Voir « Utilisation de modèles de site », page 355.) Comment utiliser l'aide | Sommaire | Index Page précédente 27 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 28 Réutilisation de texte, d’images ou d’attributs de page Si vous souhaitez qu’un texte et des images s’affichent plusieurs fois sur toutes les pages de votre site (comme une barre de navigation comportant de nombreux boutons image et des liens de page), vous pouvez les enregistrer comme un fichier source unique appelé un composant. En faisant glisser l’icône du composant de la palette Objets, vous pouvez réutiliser ce composant sur n’importe quelle page. (Il n’existe aucune limite au nombre de composants pouvant être ajoutés à une page.) Les composants d’une page demeurent liés à leurs fichiers source. Ainsi, ils sont automatiquement mis à jour lorsque vous modifiez la source. (Voir « Utilisation de composants », page 345.) Les URL externes, les adresses électroniques, les signets de navigateur, les couleurs dotées de noms, les jeux de polices, ainsi que les extraits de code source peuvent être enregistrés dans la fenêtre du site. Pour réutiliser l’un de ces éléments de construction de site, vous pouvez le faire glisser de la fenêtre du site vers un élément de page ou le choisir dans un menu ou une palette. (Voir « Utilisation des éléments de construction de site », page 337.) Gestion et publication de votre site Que vous ajoutiez de nouveaux éléments à votre site ou que vous mettiez à jour son ancien contenu, GoLive propose des solutions de gestion de site très conviviales. Chaque fois que vous utilisez la fenêtre du site pour déplacer une page vers un nouveau dossier, renommer une page, ajouter une nouvelle page au site ou modifier un fichier image auquel se réfèrent de nombreuses pages, GoLive met automatiquement à jour les chemins d’accès entre chaque fichier, URL ou objet associé contenu dans une page. GoLive vérifie l’intégrité des liens dans les pages HTML, les fichiers PDF, les séquences QuickTime, les fichiers SWF et le code source JavaScript incorporé dans votre site. GoLive vous signale également si des pages contiennent des liens de référence vides ou incorrects en affichant une icône d’insecte en regard de la page affichée dans la fenêtre du site. Visualisation de l’arborescence et des liens Lorsque la fenêtre du site est active, vous avez également la possibilité de visualiser des représentations graphiques de la structure globale de la page et des relations entre les liens de votre site. Les pages, les fichiers image et autres objets (tels que des adresses électroniques) sont alors symbolisés par de petites vignettes et des options d’affichage vous permettent d’agrandir ou de réduire différents niveaux dans l’arborescence du site. Pour ouvrir la vue de navigation ou la vue des liens, utilisez le menu de la fenêtre du site ou choisissez-la dans le menu Site > Affichage. (Voir « A propos des vues graphiques du site », page 305.) Vous pouvez utiliser la palette des liens entrants et sortants pour modifier la destination des liens dans une page en sélectionnant la page dans la fenêtre du site, la vue de navigation ou la vue des liens et en la faisant glisser des boutons d’affectation de la palette vers la nouvelle destination. Vous pouvez également utiliser la palette des liens entrants et sortants afin de spécifier des destinations pour les liens de référence vides (balises d’emplacement de la page auxquelles aucun lien n’est encore associé). Lorsque vous modifiez la destination d’un lien, GoLive met automatiquement le site à jour. (Voir « Utilisation de la palette Liens entrants et sortants », page 320.) Vous pouvez également visualiser des rapports détaillés de votre site à l’aide de l’outil de recherche Rapports sur le site. (Voir « Génération de rapports sur les sites », page 331.) Comment utiliser l'aide | Sommaire | Index Page précédente 28 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 29 Préparation à la publication Lorsque vous créez votre site, GoLive vérifie et met continuellement à jour toutes les références de liens. La préparation finale de votre site n’exige donc pratiquement aucun effort avant sa publication sur le Web. Les erreurs contenues dans votre site sont généralement causées par le déplacement, la suppression ou la modification des noms de fichiers sur le bureau (dans le Finder de Mac OS ou Windows Explorer) au lieu de recourir à la fenêtre du site. (Chaque fois que vous modifiez un fichier sur le disque dur plutôt que dans la fenêtre du site, assurez-vous d’ouvrir la fenêtre du site et de cliquer sur le bouton Rafraîchir la vue de la barre d’outils pour mettre votre site à jour.) Pour identifier des liens rompus, utilisez les panneaux Externe et Erreurs de la fenêtre du site et pour les rétablir, la palette des liens entrants et sortants. (Voir « Correction des erreurs de site », page 328.) En sélectionnant le panneau Externe et en choisissant Site > Vérifier les liens externes, vous pouvez utiliser GoLive pour vous connecter à Internet et vérifier les liens de navigation qui font référence à des URL de pages et des médias externes afin de vous assurer que les sites n’ont pas été déplacés ou qu’ils ne deviennent obsolètes. Configuration de l’accès au serveur FTP Vous pouvez enregistrer vos préférences réseau et votre configuration de site pour les serveurs FTP et WebDav de manière à ne configurer qu’une seule fois l’accès au serveur FTP. Lorsque vous configurez l’accès au serveur FTP, vous créez une liste des serveurs disponibles qui contient les noms des serveurs (tels que ftp.company.com), les noms des répertoires qui recevront vos sites, ainsi que votre nom d’utilisateur et mot de passe FTP. Si vous configurez l’accès pour plusieurs serveurs ou répertoires, utilisez alors des surnoms afin d’identifier les paramètres du serveur pour chacun d’eux. (Voir « Configuration de l’accès Internet », page 358.) Connexion au serveur Web FTP Le moyen le plus simple et le plus rapide de transférer vos fichiers de site sur le serveur FTP consiste à sélectionner le panneau FTP dans la fenêtre du site et à cliquer sur le bouton Connecter/Déconnecter le serveur FTP de la barre d’outils. Si vous n’avez pas encore saisi les para-mètres d’accès au serveur, GoLive vous invite à le faire ici. Si vous ne le faites pas, GoLive affichera le contenu du répertoire spécifié dans le panneau FTP de la fenêtre du site. Pour télécharger la première fois votre site vers le serveur FTP, cliquez sur le bouton Téléchargement de la barre d’outils. GoLive télécharge automatiquement chaque fichier et dossier contenu dans le panneau Fichiers et les synchronise avec tous les fichiers et dossiers correspondants situés sur le serveur. Les fois suivantes, cliquez sur le bouton Téléchargement incrémentiel vers le serveur pour ne télécharger que les fichiers qui ont été modifiés. GoLive synchronise également les fichiers lorsque vous les téléchargez depuis le serveur vers la fenêtre de site. Comment utiliser l'aide | Sommaire | Index Page précédente 29 Aide d'Adobe GoLive Introduction à la construction de sites dans GoLive Comment utiliser l'aide | Sommaire | Index Page précédente 30 Vous pouvez également télécharger un fichier vers ou depuis un serveur en faisant glisser simplement le fichier du panneau Fichiers vers le panneau FTP ou vice-versa dans la fenêtre du site. (Voir « Connexion à un serveur FTP », page 359 et « Téléchargement de fichiers vers et depuis un serveur à l’aide de FTP », page 362) Pour télécharger un fichier vers le serveur, faites-le glisser du panneau Fichiers vers le panneau FTP. Comment utiliser l'aide | Sommaire | Index Page précédente 30 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 31 Définition du projet de site et de l’espace de travail Présentation de GoLive L’espace de travail de GoLive est composé de la fenêtre de site (une par projet de site), d’une fenêtre de document pour chaque page Web ouverte et de différents éditeurs et palettes permettant de manipuler tous les éléments du site. Les fenêtres peuvent être disposées en cascade ou en mosaïque sur votre écran. Les palettes, quant à elles, peuvent être groupées, dissociées de leur groupe, réorganisées sur votre écran et enregistrées en tant qu’espaces de travail personnalisés. GoLive favorise les opérations de glissement Vous pouvez faire glisser des fichiers au sein de la fenêtre de site de la même manière que sur votre Bureau, à la différence près que lorsque vous faites glisser des fichiers dans la fenêtre de site, GoLive réalise un suivi de ces fichiers et met à jour les références à ces fichiers dans le site. Vous pouvez faire glisser des fichiers de la fenêtre de site vers une page Web ouverte afin d’y ajouter des images, des objets dynamiques, des éléments de construction de site ou des liens hypertexte. Vous avez également la possibilité de faire glisser du texte et des objets d’une page vers une autre, voire même d’un site vers un autre. La palette Objets permet de faire glisser des objets représentant des éléments HTML vers une page ouverte ou vers le panneau Bibliothèque de la fenêtre de site afin de les stocker avec le site. Vous pouvez également faire glisser du texte et des objets de la page vers la palette Objets (dans le panneau Bibliothèque) afin de les stocker avec l’application. Grâce à la fonction d’affectation, il est possible de créer des liens de ressource (entre des balises d’emplacement d’objets sur la page et leur fichier source) ou des liens de navigation (entre la page et d’autres pages ou URL) par simple glissement entre la page ou l’inspecteur et la cible dans la fenêtre de site ou toute autre page ouverte. Si une fenêtre est masquée par d’autres fenêtres, vous pouvez, au cours du glissement, arrêter le pointeur de votre souris au-dessus du bouton Sélectionner une fenêtre de la barre d’outil afin d’afficher cette fenêtre au premier plan. Lorsque vous faites glisser un fichier ou un objet vers un onglet dans une fenêtre, GoLive affiche le panneau correspondant au premier plan de la fenêtre. Lancement de l’application Lorsque l’application GoLive est lancée, une boîte de dialogue, ou écran de présentation, s’affiche par défaut et propose des options de création d’une nouvelle page ou d’un nouveau site, d’ouverture d’un fichier ou de fermeture de la boîte de dialogue. Vous pouvez désactiver l’option d’affichage de cet écran au lancement du programme, puis l’activer à nouveau dans la boîte de dialogue des préférences. (Voir « Définition des préférences d’ouverture des pages », page 66.) Comment utiliser l'aide | Sommaire | Index Page précédente 31 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 32 Utilisation des fenêtres, des palettes et des menus Au premier lancement de GoLive, plusieurs palettes s’affichent par défaut dans des groupes. Afin de profiter au maximum de votre espace de travail, vous avez la possibilité de déplacer ces palettes d’un groupe à un autre ou vers des fenêtres individuelles, de les réduire et de les redimensionner. L’affichage des palettes ainsi obtenu peut ensuite être enregistrée en tant qu’espace de travail personnalisé. Les panneaux de la fenêtre de site et les vues structurelles du site ont le même comportement que les palettes, c’est-à-dire que vous pouvez les déplacer et réorganiser leur groupement. Il est recommandé de toujours afficher la fenêtre de site (en activant les deux panneaux), la palette Objets, la barre d’outils et l’inspecteur pendant la construction, la modification et le téléchargement d’un site. Affichage des fenêtres de site et de documents Il est possible d’afficher plusieurs fenêtres de sites et de documents simultanément. GoLive réalise un suivi des pages et des sites correspondants, de façon que vous puissiez facilement copier des éléments d’une page à une autre et d’un site Web à un autre. La fenêtre de document s’affiche à l’ouverture de fichiers HTML ou à la création de nouvelles pages dans GoLive. Pour plus de détails sur la création de nouvelles pages, voir « Ajout de fichiers à un site », page 42. La fenêtre de site s’affiche à l’ouverture dans GoLive du fichier projet de site (doté de l’extension de fichier .site). Pour plus de détails sur la création d’un fichier projet de site, voir « Création d’un site », page 38. Pour développer la fenêtre de site et afficher ses deux panneaux : Cliquez sur le bouton à double flèche situé dans le bas de la fenêtre. (Pour réduire l’affichage de la fenêtre de site au panneau gauche, cliquez à nouveau sur ce bouton.) Pour afficher la section d’en-tête dans la fenêtre du document : Activez le panneau Mise en page, puis cliquez sur le triangle situé dans le coin supérieur gauche de la fenêtre de document (à côté du titre de la page). Pour plus de détails sur l’utilisation de la section d’en-tête, voir « Ajout d’éléments ou de scripts dans la section d’en-tête », page 51. Pour afficher le panneau Code source de l’éditeur de mise en page : Activez le panneau Mise en page dans la fenêtre de document, puis cliquez sur le bouton à double flèche situé dans le coin inférieur gauche de la fenêtre. La fenêtre de document est divisée en deux panneaux. Le panneau Code source de cette fenêtre affiche une autre vue de l’éditeur de code source. Il est également possible d’afficher ce panneau dans les éditeurs de cadres et de structure, et dans le panneau Aperçu sous Mac OS. Pour afficher le panneau Code source sur les côtés, en haut ou en bas de la fenêtre, cliquez sur le bouton à double flèche en maintenant la touche Alt (Windows) ou Option (Mac OS) enfoncée ; à chaque clic, le panneau est placé dans une nouvelle position verticale ou horizontale dans la fenêtre. Pour plus de détails sur l’utilisation du panneau Code source, voir « Utilisation des éditeurs de code source GoLive », page 429. Comment utiliser l'aide | Sommaire | Index Page précédente 32 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 33 Pour afficher un éditeur ou un aperçu : Cliquez sur un onglet dans la partie supérieure de la fenêtre de document. (Par exemple, cliquez sur l’onglet Source pour afficher l’éditeur de code source.) Affichage des barres d’outils et des règles Les barres d’outils s’affichent dans le haut de votre écran, en dessous des menus de commande. Les boutons et menus contextuels qui les composent varient en fonction des éléments préalablement sélectionnés dans la zone de travail. Outre la barre d’outils principale, d’autres barres d’outils sont disponibles lorsque vous ouvrez une session sur un site collaboratif, que vous travaillez avec un contenu dynamique ou que vous manipulez du code source dans la fenêtre de document. Vous avez la possibilité d’afficher des règles horizontale et verticale dans l’éditeur de mise en page afin de faciliter le positionnement et le redimensionnement précis des objets sur une page. Lorsque vous placez un objet, sa position et sa taille sont indiquées dans les zones blanches des règles. Si vous déplacez le pointeur dans la fenêtre du document, les lignes des règles se déplacent en même temps pour indiquer la position actuelle du pointeur. Pour afficher ou masquer les règles de mise en page : Choisissez Affichage > Afficher les règles. (Une marque est affichée en regard de cette commande de menu lorsqu’elle est activée.) Pour afficher ou masquer la barre d’outils : Choisissez Fenêtre > Barre d’outils. (Une marque est affichée en regard de cette commande de menu lorsqu’elle est activée.) Pour déplacer la barre d’outils : Cliquez deux fois sur l’extrémité gauche de la barre d’outils et faites glisser sa barre de titre (Windows) ou son coin inférieur gauche (Mac OS). Pour replacer la barre d’outils dans sa position par défaut, cliquez deux fois sur sa barre de titre (Windows). Pour afficher ou masquer la barre d’outils Groupe de travail : Ouvrez une session sur Adobe Web Workgroup Server, puis choisissez Fenêtre > Barre d’outils Groupe de travail. (Voir « Utilisation de la barre d’outils Groupe de travail », page 382.) Pour afficher ou masquer la barre d’outils Contenu dynamique : Choisissez Fenêtre > Barre d’outils Contenu dynamique. (Voir « Présentation de l’interface de contenu dynamique », page 551.) Pour afficher ou masquer la barre d’outils Code source : Dans la fenêtre de document, cliquez sur le code source avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS), puis choisissez Affichage > Barre d’outils dans le menu contextuel. (Pour plus de détails sur l’utilisation de la barre d’outils Code source, voir « Affichage des éléments de syntaxe en couleur », page 431.) Comment utiliser l'aide | Sommaire | Index Page précédente 33 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 34 Utilisation des menus contextuels GoLive propose un certain nombre de menus contextuels affichant des commandes relatives à la fenêtre ou à la sélection actives. Ces menus contextuels constituent un moyen rapide pour activer les commandes les plus courantes. Pour utiliser un menu contextuel : 1 Placez le pointeur de la souris sur la fenêtre ou sur la sélection active. 2 Effectuez l’une des opérations suivantes : • Sous Windows, cliquez avec le bouton droit de la souris. • Sous Mac OS, cliquez en maintenant la touche Control enfoncée. Menu contextuel du fichier sélectionné Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS) pour afficher un menu contextuel. Affichage des palettes Les palettes GoLive sont répertoriées dans le menu Fenêtre. Une coche en regard du nom de la palette indique que ladite palette est affichée au premier plan de son groupe. La plupart des palettes sont dotées d’un menu dans lequel vous pouvez choisir des options. Le cas échéant, le menu est situé dans le coin supérieur droit de la palette. Par exemple, le menu de la palette de couleurs propose des options correspondant aux boutons de définition des couleurs situés dans le haut de la palette. (Voir « Utilisation de la palette de couleurs », page 60.) L’organisation des palettes sur votre écran peut ensuite être enregistrée en tant qu’espace de travail personnalisé. (Voir « Enregistrement d’un espace de travail personnalisé », page 36.) Vous pouvez également réduire une palette à la taille d’un onglet situé sur le côté de votre écran. (Voir « Réduction des palettes en onglets latéraux », page 36.) Pour afficher une ou plusieurs palettes dans un groupe : Choisissez le nom de la palette dans le menu Fenêtre. (Pour masquer la palette et le groupe auquel elle appartient, choisissez à nouveau son nom dans le menu Fenêtre.) Pour afficher une palette au premier plan de son groupe : Effectuez l’une des opérations suivantes : • Cliquez sur le nom de la palette dans le groupe. • Choisissez le nom de la palette dans le menu Fenêtre. Comment utiliser l'aide | Sommaire | Index Page précédente 34 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 35 Pour masquer toutes les palettes : Choisissez Fenêtre > Espace de travail > Masquer les palettes. Pour rétablir les positions et les tailles par défaut des palettes : Choisissez Fenêtre > Espace de travail > Espace de travail par défaut. Pour utiliser un menu de palette : Cliquez sur le triangle situé dans le coin supérieur droit de la palette, puis sur une option dans le menu afin de l’activer ou de la désactiver. Pour afficher le menu de la palette lorsque celle-ci est réduite à la taille d’un onglet latéral, cliquez sur cet onglet avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS). (Voir « Réduction des palettes en onglets latéraux », page 36.) Organisation des palettes ou onglets Toutes les palettes peuvent être déplacées d’un groupe à un autre ou affichées en tant que fenêtres distinctes. Vous avez également la possibilité de déplacer et de séparer les panneaux de la fenêtre de site, de la vue de navigation et de la vue des liens. Pour déplacer une palette ou un onglet d’un groupe à un autre : Effectuez l’une des opérations suivantes : • Faites glisser le nom de la palette d’un groupe vers un autre. • Faites glisser un onglet d’un panneau à l’autre dans la fenêtre de site ou de la fenêtre de site vers une fenêtre de vue structurelle de site (vue de navigation ou des liens). • Faites glisser l’onglet Navigation ou Liens vers un des panneaux latéraux de la fenêtre de site. Pour déplacer une palette ou un panneau de façon à l’afficher dans une fenêtre distincte : Faites glisser le nom de la palette ou du panneau hors de la fenêtre de site ou du groupe. Pour déplacer un groupe de palettes ou de panneaux : Cliquez sur la barre de titre de la fenêtre du groupe. Pour afficher un panneau au premier plan de son groupe dans la fenêtre de site : Effectuez l’une des opérations suivantes : • Cliquez sur l’onglet associé au panneau. • Choisissez le panneau dans le menu contextuel de la fenêtre de site. • Choisissez le panneau dans le menu Site > Affichage. Comment utiliser l'aide | Sommaire | Index Page précédente 35 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index • Page précédente 36 Faites glisser un élément approprié vers l’onglet associé au panneau, marquez une pause le temps que le panneau s’affiche au premier plan, puis continuez à faire glisser l’élément vers l’intérieur de ce panneau. Faites glisser, par exemple, une couleur vers l’onglet Couleurs, marquez une pause, puis continuez à la faire glisser vers le panneau Couleurs. Lorsque vous marquez une pause avec le pointeur sur l’onglet Couleurs, le panneau s’affiche au premier plan. Réduction des palettes en onglets latéraux Il est possible de réduire des palettes en onglets. Ces onglets, placés sur un des côtés de l’écran (Mac OS) ou de la fenêtre de l’application (Windows) peuvent être rapidement ouverts par un simple clic. Pour réduire une palette en onglet latéral : Sélectionnez le nom de la palette, puis faites-le glisser vers le haut, le bas ou vers les côtés gauche ou droit de votre écran. (Sous Windows, agrandissez au maximum la fenêtre de l’application.) Lorsque vous relâchez le bouton de votre souris, GoLive convertit la palette en onglet latéral. Pour ouvrir ou fermer la palette, cliquez sur cet onglet. Pour rétablir l’affichage normal de la palette, faites glisser l’onglet vers le centre de votre écran ou vers un groupe de palettes. Pour afficher le menu de la palette lorsqu’elle est réduite à la taille d’un onglet latéral, cliquez sur cet onglet avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS). (Voir « Utilisation des menus contextuels », page 34.) Enregistrement d’un espace de travail personnalisé La taille et le positionnement des palettes sur votre écran peuvent être enregistrés en tant qu’espaces de travail personnalisés. Les espaces de travail personnalisés s’avèrent utiles lors d’un travail sur différents types de pages, telles que des pages Web normales et des pages dotées de contenu dynamique, nécessitant l’affichage de différentes palettes. Les noms des espaces de travail sont répertoriés dans le menu Fenêtre > Espace de travail. Vous pouvez modifier cette liste en ajoutant, en renommant ou en supprimant des espaces de travail. Comment utiliser l'aide | Sommaire | Index Page précédente 36 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 37 Pour enregistrer un espace de travail personnalisé : 1 Ouvrez, fermez, redimensionnez et organisez les palettes sur votre écran, selon le besoin. 2 Choisissez Fenêtre > Espace de travail > Enregistrer l’espace de travail. 3 Effectuez l’une des opérations suivantes : • Nommez le nouvel espace de travail en saisissant un nom dans la zone de texte. • Dans le menu contextuel, choisissez le nom d’un espace de travail à remplacer. 4 Cliquez sur OK. Pour utiliser votre espace de travail personnalisé : Choisissez l’espace de travail dans le menu Fenêtre > Espace de travail. Pour modifier la liste des espaces de travail personnalisés : 1 Choisissez Fenêtre > Espace de travail > Gérer les espaces de travail. 2 Sélectionnez un nom dans la liste des espaces de travail et effectuez une des opérations suivantes : • Cliquez sur le bouton Nouvel espace de travail travail. pour ajouter un nouvel espace de • Saisissez un nouveau nom dans la zone de texte, puis appuyez sur Entrée (Windows) ou Retour (Mac OS). • Cliquez sur le bouton Supprimer les espaces de travail sélectionnés l’espace de travail sélectionné. pour supprimer 3 Cliquez sur OK. Organisation des fenêtres Vous pouvez organiser les fenêtres de documents, de sites et de vues structurelles de sites de différentes façons : horizontalement, verticalement ou en cascade. GoLive place les fenêtres côte à côte (en commençant de nouvelles rangées ou colonnes selon le besoin) ou les « empile » en n’affichant que leurs bords. Pour afficher les fenêtres en cascade ou en mosaïque : Choisissez Cascade, Mosaïque horizontale ou Mosaïque verticale dans le menu Fenêtre > Cascade et mosaïque. Basculement entre différentes fenêtres GoLive propose plusieurs méthodes pour basculer entre différentes fenêtres de sites, de documents et de concep-tion de sites ouvertes sur votre Bureau. Pour basculer vers une fenêtre de document, de site ou de conception de site ouverte : Effectuez l’une des opérations suivantes : • Cliquez sur la fenêtre de votre choix pour la sélectionner. • Choisissez la fenêtre qui vous intéresse dans le bas du menu Fenêtre. • Cliquez sur le bouton Sélectionner une fenêtre de la barre d’outils afin de basculer entre la fenêtre de document affichée au premier plan et la fenêtre de site. Comment utiliser l'aide | Sommaire | Index Page précédente 37 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index • Page précédente 38 Choisissez la fenêtre voulue dans le menu contextuel du bouton Sélectionner une fenêtre de la barre d’outils. A B C Différents états du bouton Sélectionner une fenêtre A. Cliquez pour revenir à la fenêtre du document. B. Cliquez pour revenir à la fenêtre de site. C. Cliquez et maintenez le bouton de la souris enfoncé pour afficher une liste des fenêtres ouvertes. • Lorsque vous créez un lien de référence, faites glisser le pointeur du bouton d’affectation vers le bouton Sélectionner une fenêtre de la barre d’outils afin de faire apparaître le menu contextuel et de choisir une fenêtre à afficher au premier plan, sur laquelle vous faites ensuite glisser votre pointeur. (Voir « Spécification de l’URL cible d’un lien », page 57.) Création d’un site L’assistant de création de site de GoLive permet de créer des sites Web sur votre ordinateur local (sites pour utilisateurs uniques) ou sur un serveur collaboratif distant (sites collaboratifs). Vous pouvez créer des sites vierges et des sites basés sur des modèles ou des fichiers importés depuis d’autres dossiers ou sites Web. Pour travailler sur des sites créés à l’aide de versions anciennes de GoLive GoLive (4.0 ou antérieures) ou d’autres applications de création de pages Web, importez-les dans un nouveau site GoLive 6.0. Vous pouvez créer des sites collaboratifs si vous travaillez sur un projet de site au sein d’une équipe, mais également si vous êtes un utilisateur unique souhaitant bénéficier des avantages offerts par les fonctions du serveur Adobe Web Workgroup Server. Pour pouvoir créer un site collaboratif, vous devez d’abord ouvrir une session sur le serveur Adobe Web Workgroup Server. (Voir « Création d’un site collaboratif », page 383.) A propos des sites GoLive Lorsque vous créez un site Web à l’aide de l’Assistant de création de site, GoLive crée un fichier projet (doté de l’extension .site) pour gérer et contrôler le contenu de ce site. GoLive génère également trois dossiers destinés au stockage des pages Web, des fichiers multimédia et des autres fichiers ressource nécessaires à la création et à la gestion du site. GoLive génère une page index.html vierge lors de la création d’un site vierge. Si vous le souhaitez, vous pouvez regrouper tous les éléments relatifs au site, y compris les trois dossier et le fichier de projet du site, dans un dossier projet. Comment utiliser l'aide | Sommaire | Index Page précédente 38 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 39 Si votre nouveau site s’appelle Monsite, le fichier projet de ce site est nommé Monsite.site. Le dossier racine du site s’appelle Monsite et permet de stocker les pages Web, les fichiers image, les feuilles de style CSS externes et les autres fichiers source sur le serveur. Le dossier de données s’appelle Monsite.data et permet de stocker les éléments de construction de site GoLive pouvant être réutilisés, tels que les composants et les modèles de page. Un troisième dossier, appelé Monsite.settings, permet de stocker les paramètres définis dans la fenêtre de site et dans la boîte de dialogue de configuration du site. (Voir « Définition des préférences et paramètres de site Web », page 289.) Le fichier projet de site et le contenu des dossiers de données et de configuration ne sont pas téléchargés lors du téléchargement du site sur le serveur Web. A B C D E Site GoLive intitulé Monsite A. Dossier projet B. Dossier racine C. Dossier de données D. Dossier de configuration E. Fichier projet de site. Le site créé peut être ouvert et utilisé indifféremment sous Windows ou sous Mac OS, quelle que soit la plate-forme utilisée pour sa création. Si le site a été créé à l’aide d’Adobe GoLive 5.0, il n’est pas nécessaire de le recréer dans Adobe GoLive 6.0. En effet, l’ouverture du fichier projet de site entraîne automatiquement sa mise à jour pour la version 6.0, c’est-à-dire la création d’un document de site 6.0. (Une copie de sauvegarde de l’ancienne version du fichier de site est alors générée. Si vous souhaitez archiver entièrement ce site, et pas seulement le fichier projet de site associé, copiez-le, sauvegardez la copie, puis ouvrez le fichier projet de site d’origine.) Pour ouvrir des sites créés dans Adobe GoLive 4.0 (ou version antérieure), utilisez l’option Importer d’un dossier de l’assistant de création de site afin d’importer le site dans un nouveau site GoLive 6.0. Création d’un site pour utilisateur unique Pour créer un site sur votre ordinateur local à l’aide de l’assistant de création de site, créez un site pour utilisateur unique. En fonction du nom spécifié pour le nouveau site, GoLive crée le fichier projet de site et les dossiers racine, de données et de configuration du site, ainsi qu’un dossier projet de site (facultatif ). Vous pouvez créer des sites collaboratifs basés sur vos sites pour utilisateur unique et bénéficier des avantages offerts par le serveur Adobe Web Workgroup Server, tels que la création de plusieurs versions de fichier, la comparaison des différentes versions afin de détecter les différences et le rétablissement de versions antérieures de fichiers, et ce, que vous travailliez au sein d’une équipe ou seul. (Voir « Conception de sites collaboratifs », page 379.) Comment utiliser l'aide | Sommaire | Index Page précédente 39 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 40 Pour créer un site pour utilisateur unique : 1 Choisissez Fichier > Nouveau site pour ouvrir l’Assistant de création de site de GoLive. 2 Sélectionnez Utilisateur unique, puis cliquez sur Suivant. 3 Effectuez l’une des opérations suivantes : • Sélectionnez Site Vierge pour créer un fichier de projet de site, un dossier racine contenant la page d’accueil vierge nommée index.html, un dossier de données contenant des sous-dossiers vides destinés à contenir les fichiers ressource, ainsi qu’un dossier de configuration. • Sélectionnez Importer d’un dossier pour créer un nouveau site basé sur des fichiers stockés dans un dossier sur votre ordinateur. Ce dossier et les fichiers qu’il contient servent de base au dossier racine du nouveau site. De nouveaux dossiers contenant les données et les paramètres du site sont également ajoutés. Vous avez la possibilité de spécifier l’emplacement du fichier projet de site, de le nommer (en veillant à toujours garder l’extension de fichier .site) et de créer un dossier pour stocker ce fichier. Remarque : Etant donné que GoLive utilise le dossier contenant les fichiers existants comme base pour le nouveau site, il est conseillé de réaliser une copie pour l’importation plutôt que d’utiliser le dossier original et son contenu. • Sélectionnez Importer d’un serveur pour créer un nouveau site basé sur la copie d’un site téléchargé depuis un serveur FTP ou HTTP. (Voir « Importation des sites stockés sur des serveurs distants », page 40.) • Sélectionnez Copier d’un modèle pour créer un nouveau site basé sur un modèle de site créé par vous ou fourni avec GoLive. (Voir « Utilisation de modèles de site », page 355.) 4 Cliquez sur Suivant, puis suivez les instructions de l’assistant. Importation des sites stockés sur des serveurs distants L’assistant de création de site permet de créer des sites GoLive basés sur d’autres sites importés de serveurs FTP ou HTTP. Pour pouvoir importer des sites stockés sur un serveur distant, créez un site pour utilisateur unique plutôt qu’un site collaboratif, puis téléchargez les fichiers sur votre disque dur local. Sélectionnez ensuite l’option Importer d’un site GoLive de l’assistant de création de site ou choisissez Site > Espace de travail > Convertir en site collaboratif afin d’importer le site dans un nouveau site collaboratif. (Voir « Création d’un site collaboratif », page 383.) Informations d’ouverture de session Pour pouvoir créer des sites basés sur des fichiers importés depuis un serveur FTP, vous avez besoin d’informations de compte correctes afin d’ouvrir une session sur le serveur. Ces informations comprennent notamment le nom du serveur et vos nom d’utilisateur et mot de passe. L’assistant de création de site propose les options de modification du numéro de port et d’utilisation du mode passif dans le cas où le site est protégé par un pare-feu. Pour pouvoir créer des sites basés sur des fichiers importés depuis un serveur HTTP, vous avez uniquement besoin d’un accès à la configuration Internet et d’un URL de page d’accueil correct. Contactez votre fournisseur de services Internet ou votre administrateur système pour obtenir les informations d’ouverture de session. Comment utiliser l'aide | Sommaire | Index Page précédente 40 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 41 Gestion avancée des URL Si vous connaissez le type d’encodage des caractères utilisé par un site pour l’encodage de ses URL, vous pouvez le spécifier dans l’assistant de création de site avant l’importation du site. L’encodage Unicode UTF 8 est adapté aux plates-formes informatiques et aux langues les plus courantes. La fonction Echappement % utilise les notations d’encodage hexadécimales pour l’échappement des caractères dans les URL (par exemple, %20 est utilisé pour l’échappement des caractères, ce qui n’est pas autorisé dans les URL). Vous pouvez également activer l’option de vérification des URL sensibles à la casse. Ces options de gestion avancée des URL restent effectives pour le nouveau site. Une fois le site créé, vous pouvez modifier l’encodage des caractères dans les URL du nouveau site à l’aide de la boîte de dialogue de configuration du site. Il est cependant impossible de modifier la vérification des URL sensibles à la casse. Pour assurer la conformité aux normes W3C, sélectionnez les deux options d’encodage des URL. (Voir « Définition des préférences et paramètres de site Web », page 289.) Importation d’un site depuis un serveur HTTP L’assistant de création de site permet d’importer dans GoLive un site Web entier, y compris les pages liées pointant vers des serveurs HTTP multiples et les fichiers source (fichiers image, par exemple) référencés dans les pages. Le téléchargement de sites volumineux pouvant prendre beaucoup de temps, il est possible de restreindre le nombre de niveaux de pages dans l’arborescence des liens de page pour l’importation. Outre la possibilité de définir le nombre de niveaux de pages, vous pouvez sélectionner l’option Télécharger uniquement les pages incluses dans le chemin afin de télécharger seulement les pages stockées dans le dossier (ou sous-dossier) contenant l’URL de la page d’accueil, ou l’option Utiliser un seul serveur afin de télécharger seulement les pages stockées sur le même serveur que l’URL de la page d’accueil. Cependant, que vous sélectionniez ou non l’option Utiliser un seul serveur, GoLive télécharge tous les fichiers source référencés par les pages téléchargées, quels que soient les serveurs sur lesquels ils se trouvent. GoLive importe uniquement des pages des niveaux spécifiés et les fichiers source des images et autres objets situés sur ces pages. GoLive convertit tous les liens restants pointant vers d’autres niveaux en URL externes et les répertorie dans le panneau Externe de la fenêtre de site. Une fois le site créé, vous pouvez télécharger les pages individuellement depuis ces URL externes en choisissant Télécharger dans le menu contextuel d’un URL. Téléchargement de pages vers lesquelles pointent des liens externes Pour télécharger une page et ses fichiers source depuis un lien externe, cliquez sur le lien externe dans le panneau Externe de la fenêtre de site avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS), ou dans la palette Liens entrants et sortants, puis choisissez Télécharger dans le menu contextuel. GoLive télécharge la page et les fichiers source référencés (tels que des images) vers le panneau Fichiers de la fenêtre de site. Pour plus de détails sur les autres méthodes de téléchargement de fichiers depuis un serveur, voir « Téléchargement de fichiers vers et depuis un serveur à l’aide de FTP », page 362. Comment utiliser l'aide | Sommaire | Index Page précédente 41 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 42 Ajout de fichiers à un site Vous avez la possibilité d’ajouter à votre site des pages Web, des fichiers image et d’autres fichiers multimédia ou ressource. Le cas échéant, GoLive réalise un suivi de ces pages dans la fenêtre de site. Vous pouvez ajouter des copies de fichiers existants à votre site sans déplacer les fichiers originaux. Pour ce faire, faites glisser les fichiers voulus du Bureau (tel que l’Explorateur Windows ou le Finder sous Mac OS) vers la fenêtre de site. Il est recommandé d’utiliser la fenêtre de site pour ajouter des fichiers à votre site. En effet, GoLive peut ainsi conserver tous les liens pointant vers des pages, des fichiers ressource et des éléments de construction de site. Création d’une nouvelle page Choisissez Fichier > Nouvelle page pour créer une nouvelle page Web non associée au site avant son enregistrement. Lorsque la fenêtre de site est ouverte, différentes méthodes s’offrent à vous pour créer une nouvelle page automatiquement associée au site. Après avoir créé une nouvelle page, GoLive génère un fichier sans_titre.html et l’affiche par défaut dans l’éditeur de mise en page de la fenêtre de document. Lorsque vous créez une nouvelle page Web, il est important d’en modifier le titre, car celui-ci apparaît dans la barre de titre du navigateur Web qui la visualise et est utilisé pour indexer la page dans les moteurs de recherche Internet. (Voir « Modification du titre de la page », page 45.) Vous pouvez définir une préférence GoLive de façon qu’une nouvelle page soit automatiquement créée au lancement de l’application et affichée dans l’éditeur ou dans le mode d’aperçu de votre choix. (Voir « Définition des préférences d’ouverture des pages », page 66.) Pour créer une nouvelle page dans un site : Effectuez l’une des opérations suivantes : • Activez le panneau Fichiers ou Divers dans la fenêtre de site et, si vous le souhaitez, sélectionnez un dossier répertorié dans le panneau activé. Choisissez ensuite Site > Créer > Page. La nouvelle page est ajoutée au bas de la liste dans le panneau ou dans le dossier sélectionné. Vous pouvez également sélectionner une page dans le panneau Fichiers de la fenêtre de site, puis choisir Edition > Dupliquer afin de créer une copie de la page existante. • Ouvrez la fenêtre de site, choisissez Fichier > Nouvelle page, puis Fichier > Enregistrer sous. Dans la boîte de dialogue Enregistrer sous, saisissez un nom, choisissez Racine dans le menu Dossier de site, puis cliquez sur OK. La nouvelle page est ajoutée au contenu du dossier racine du site affiché dans le panneau Fichiers de la fenêtre de site. Remarque : La fenêtre de site doit être ouverte, mais pas nécessairement sélectionnée, pour que le menu Dossier de site apparaisse dans la boîte de dialogue Enregistrer sous. • Faites glisser une icône de page générique du panneau Site de la palette Objets vers le panneau Fichiers ou Divers de la fenêtre de site ou à côté d’une autre page dans la vue de navigation. Comment utiliser l'aide | Sommaire | Index Page précédente 42 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 43 Création de documents spéciaux GoLive permet de créer des documents dans différents formats, y compris les formats XHTML, SMIL et RealPix. Vous pouvez baser la création d’un nouveau document HTML sur un modèle ou un gabarit de page défini pour le site. Vous pouvez également créer des fichiers texte, CSS ou JavaScript, voire même des fichiers séquence QuickTime. Remarque : Lorsque vous créez un document spécial (HTML, XHTML, WML ou SMIL), GoLive ajoute automatiquement une déclaration doctype au code source avec une référence au fichier DTD (Document Type Definition) correct. (Voir « Définition du type de document », page 437.) Pour créer un document spécial : Choisissez un format dans le menu Fichier > Nouveau document spécial. Une boîte de dialogue ou une fenêtre de document spécial s’ouvre, en fonction du format sélectionné. Ajout de fichiers existants Deux méthodes s’offrent à vous pour ajouter à votre site des fichiers stockés à des emplacements différents. La première consiste à déplacer manuellement les fichiers vers le dossier du site sur le Bureau et à mettre à jour la fenêtre de site, tandis que la seconde consiste à importer ou à faire glisser les fichiers dans le panneau Fichiers de la fenêtre de site pour que GoLive en fasse une copie dans le dossier de site et laisse les originaux intacts. Remarque : Lorsque vous créez une nouvelle page, GoLive ajoute automatiquement dans la section d’en-tête de cette page un élément méta pour définir l’encodage des caractères du texte. Si une page ne contient pas cet élément méta, GoLive affiche une boîte de dialogue à son ouverture de façon que vous puissiez utiliser temporairement l’encodage par défaut. Pour définir l’encodage des caractères pour une page, utilisez l’icône Encoder du panneau En-tête de la palette Objets. (Voir « Ajout d’éléments ou de scripts dans la section d’en-tête », page 51.) Pour ajouter un fichier existant à un site : Effectuez l’une des opérations suivantes : • Faites glisser le fichier de votre Bureau vers le panneau Fichiers de la fenêtre de site. • Déplacez le fichier vers le dossier racine du site situé sur votre Bureau. Sélectionnez ensuite la fenêtre de site, puis cliquez sur le bouton Rafraîchir la vue de la barre d’outils. • Activez le panneau Fichiers dans la fenêtre de site. Choisissez ensuite Fichier > Importer > Fichiers. Dans la boîte de dialogue Ajout de fichiers au site, localisez et sélectionnez le fichier voulu, cliquez sur Ajouter un dossier, puis sur Terminer. Si le programme vous y invite, cliquez sur OK afin de copier le fichier et mettre le site à jour. Pour plus de détails sur la création d’un site GoLive par importation de fichiers, voir « Création d’un site », page 38. Comment utiliser l'aide | Sommaire | Index Page précédente 43 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 44 Ouverture de pages de site dans une vue spécifique Plusieurs méthodes s’offrent à vous pour ouvrir des pages de votre site et spécifier si ces pages doivent s’afficher dans l’éditeur de mise en page ou dans un autre panneau de la fenêtre de document. Il est possible de définir une préférence afin que toutes les pages soient automatiquement affichées dans un panneau différent. (Voir « Définition des préférences d’ouverture des pages », page 66.) Pour ouvrir une page du site dans l’éditeur de mise en page : Effectuez l’une des opérations suivantes : • Cliquez deux fois sur la page dans la fenêtre de site, dans la vue de navigation ou dans la vue des liens. • Sélectionnez la page voulue dans la fenêtre de site, puis cliquez sur le bouton Ouvrir de la barre d’outils. • Sélectionnez la page dans la fenêtre de site, puis choisissez Site > Explorateur > Ouvrir le fichier (Windows) ou Site > Finder > Ouvrir le fichier (Mac OS). Pour ouvrir une page dans la fenêtre de document en affichant un panneau spécifique : 1 Cliquez sur le fichier dans la fenêtre de site, dans la vue de navigation ou dans la vue des liens. 2 Cliquez sur le fichier avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS) pour afficher son menu contextuel. 3 Effectuez une sélection dans le menu Ouvrir > Ouvrir en mode, qui répertorie tous les panneaux disponibles dans la fenêtre de document. Déverrouillage de fichiers verrouillés localement GoLive peut déverrouiller des fichiers verrouillés dans le Finder sous Mac OS ou définis en lecture seule dans la boîte de dialogue des propriétés sous Windows. Cette opération est nécessaire si vous voulez modifier des fichiers verrouillés localement dans un site importé. Si les fichiers sont masqués dans l’Explorateur Windows, vous devez les afficher pour pouvoir les modifier. Le verrouillage local de fichier s’applique uniquement à la plate-forme sur laquelle il a été défini. Par exemple, si vous créez un site sous Mac OS en verrouillant ses fichiers HTML, ces fichiers ne sont pas verrouillés lorsque le site est téléchargé sur un serveur UNIX ou Windows. Le verrouillage local de fichier ne s’applique pas aux fichiers stockés sur un serveur WebDAV ou sur le serveur Adobe Web Workgroup Server. Pour déverrouiller un fichier verrouillé ou en lecture seule : 1 Sélectionnez le fichier en question dans la fenêtre de site. Remarque : Cette méthode permet de déverrouiller un fichier uniquement si une icône de cadenas est affichée en regard de celui-ci dans la colonne de verrouillage du panneau Fichiers. Cette icône indique que le fichier correspondant a été verrouillé sous Mac OS ou défini en lecture seule sous Windows. Comment utiliser l'aide | Sommaire | Index Page précédente 44 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 45 2 Cliquez sur le bouton Afficher les informations dans l’Explorateur (Windows) ou Afficher les informations dans le Finder (Mac OS) de la barre d’outils. Vous pouvez également choisir Afficher les propriétés dans le menu contextuel. 3 Effectuez l’une des opérations suivantes : • Sous Windows, désactivez l’attribut Lecture seule, puis cliquez sur OK. • Sous Mac OS, déverrouillez le fichier, puis refermez la fenêtre Lire les informations. 4 Cliquez sur le bouton Rafraîchir la vue de la barre d’outils. Configuration des pages Vous avez la possibilité de définir les titres, les marges et l’arrière-plan des pages, les couleurs du texte et des liens et une taille de fenêtre, ce avant ou après avoir mis en page texte et objets sur vos pages Web. Vous pouvez également ajouter des instructions cachées relatives à chaque document et destinées aux navigateurs Web. Il suffit de faire glisser des éléments et des scripts dans les sections d’en-tête (par exemple, des mots-clés permettant aux moteurs de recherche de répertorier votre page dans leurs résultats de recherche). Pendant votre travail dans la fenêtre de document, vous pouvez définir des options dans la palette Affichage afin d’afficher ou de masquer certains éléments masqués dans les pages visualisées dans un navigateur, tels que les symboles de saut de ligne et les commentaires. La palette Affichage permet également de définir un profil pour la prévisualisation d’un aperçu de la page sur une plate-forme différente. (Voir « Définition des options d’affichage de mise en page », page 48.) Une fois votre page configurée, elle peut être utilisée comme point de départ pour d’autres nouvelles pages. Il suffit pour cela de l’enregistrer en tant que gabarit ou modèle de page. (Voir « A propos des éléments de construction de site », page 337.) Modification du titre de la page Lorsque vous créez une nouvelle page vierge (un nouveau document HTML), cette page est automatiquement intitulée Bienvenue dans GoLive 6. Les titres des pages, tout comme les mots-clés, sont utilisés par les navigateurs Web et les moteurs de recherche Internet pour l’identification du contenu des pages. (Pour plus de détails sur l’ajout de mots-clés à une page, voir « Ajout d’éléments ou de scripts dans la section d’en-tête », page 51.) Il est possible de définir une préférence afin d’afficher un rappel relatif à la modification du titre de la page lorsque vous enregistrez une page. Lorsque vous visualisez vos pages dans la vue de navigation ou dans la vue des liens, vous pouvez sélectionner une option du panneau Affichage de la palette Affichage afin que la visualisation soit réalisée par titre de page ou par nom de fichier. (Voir « A propos des vues graphiques du site », page 305.) Pour modifier le titre d’une page : Effectuez l’une des opérations suivantes : • Sélectionnez le titre de page par défaut, Bienvenue dans Adobe GoLive 6, situé à côté de l’icône de page , dans le coin supérieur gauche de la fenêtre de document, puis saisissez le nouveau titre. Comment utiliser l'aide | Sommaire | Index Page précédente 45 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 46 • Cliquez sur l’icône de page dans le coin supérieur gauche de la fenêtre de document, puis entrez le nouveau titre dans le panneau page de l’inspecteur de la page. (Vous pouvez également ouvrir l’inspecteur de la page en choisissant Spécial > Propriétés de la page.) • Sélectionnez la page dans le panneau Fichiers de la fenêtre de site, de la vue de navigation ou de la vue des liens, puis entrez le nouveau titre dans le panneau Page de l’inspecteur de fichier. Vous pouvez créer un titre de page personnalisé pour une page vierge et définir une préférence afin d’utiliser cette page pour la création des nouvelles pages. (Voir « Définition des préférences d’ouverture des pages », page 66.) Pour définir un rappel de modification de titre pour les nouvelles pages : Choisissez Edition > Préférences, sélectionnez Modules dans le panneau gauche de la boîte de dialogue des préférences. Naviguez jusqu’au dossier Extend Scripts situé dans le bas du panneau droit, activez SetTitle, puis cliquez OK. Relancez ensuite l’application GoLive. Lorsque vous enregistrez une page, GoLive affiche automatiquement la boîte de dialogue Définir un titre si aucun titre n’a été défini pour la page ou s’il contient les mots Bienvenue dans Adobe GoLive, Bienvenue dans GoLive CyberStudio ou sans_titre. Ajout ou modification d’une déclaration doctype Le menu de la fenêtre de document permet d’ajouter ou de modifier une déclaration doctype dans votre page Web référençant un DTD W3C pour un type spécifique de document HTML ou XHTML, tel que le cHTML (i-mode) destiné à un affichage sur des appareils sans fil. (Si vous avez créé une page HTML à l’aide du menu Fichier > Nouveau document spécial, GoLive ajoute automatiquement la déclaration doctype pour les DTD de documents HTML 4.01 de transition.) Vous pouvez également configurer les jeux d’icônes dans la palette Objets de façon qu’elles correspondent au doctype. (Voir « Définition du type de document », page 437.) Enregistrement des pages Vous pouvez enregistrer des pages Web directement dans le dossier racine du site dans lequel sont stockés les pages et les médias de votre site Web. Vous pouvez également enregistrer vos pages en tant que composants, gabarits ou modèles de page pour votre site. Il est possible de définir une préférence de façon à afficher ou masquer la boîte de dialogue Définir un titre, dans laquelle vous pouvez modifier les titres des pages lors de l’enregistrement de ces pages. (Voir « Modification du titre de la page », page 45.) Pour enregistrer une nouvelle page dans un site : 1 Ouvrez le fichier projet du site. 2 Effectuez l’une des opérations suivantes : • Sélectionnez la fenêtre de document, choisissez Fichier > Enregistrer ou Fichier > Enregistrer sous. • Choisissez Enregistrer sous dans le menu de la fenêtre de document, puis Gabarit, Composants ou Modèle(s) dans le menu Dossier de site. Comment utiliser l'aide | Sommaire | Index Page précédente 46 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index • Page précédente 47 Cliquez dans la fenêtre de document avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS), puis choisissez Document > Enregistrer sous dans le menu contextuel. 3 Dans la boîte de dialogue Enregistrer sous, nommez le fichier en respectant les conventions appropriées pour l’attribution des noms de fichiers. (Il est, par exemple, conseillé d’utiliser exclusivement des minuscules et de ne pas insérer d’espace.) Assurez-vous que ce nom de fichier comprend l’extension correcte (.htm ou .html), permettant ainsi la reconnaissance du format du fichier par GoLive et les navigateurs Web. (Voir « Attribution de noms et de chemins à des fichiers », page 301.) 4 Choisissez un dossier de site (racine, gabarit, composant ou modèle) dans le menu Dossier de site de la boîte de dialogue Enregistrer sous. (Cette étape n’est pas nécessaire si vous choisissez une option dans le sous-menu Enregistrer sous du menu de la fenêtre de document.) Pour plus de détails sur les gabarits, les composants et les modèles, voir « Utilisation des éléments de construction de site », page 337. 5 Cliquez sur Enregistrer. 6 En cas d’affichage de la boîte de dialogue Définir un titre, saisissez un nom pour le titre de la page dans la zone de texte ou sélectionnez Définir le nom du document comme titre pour valider automatiquement le nom du fichier en tant que titre. Pour éviter que la boîte de dialogue Définir un titre ne s’affiche à nouveau, activez l’option Ne plus afficher ce message. Cliquez ensuite sur Définir. Sélection d’une taille de fenêtre de document Vous pouvez choisir une taille pour la fenêtre de document. La taille spécifiée est alors utilisée comme guide pendant la conception de votre mise en page. Par exemple, bien que de nombreux moniteurs proposent une zone d’affichage visible supérieure à 640 pixels, vous pouvez réduire la taille de la mise en page à 580 pixels ou moins afin de prendre en compte les internautes disposant de moniteurs 14 pouces ou ceux préférant éviter que le navigateur ne remplisse l’écran. La taille de la fenêtre de document est uniquement un outil de référence pour la conception de la mise en page. En effet, la taille choisie n’a aucune incidence sur la taille de la fenêtre du navigateur affichant la page. Pour choisir la taille des fenêtres de document : Effectuez l’une des opérations suivantes : • Choisissez une taille pour la fenêtre d’ouverture du document dans le menu contextuel situé dans le coin inférieur droit de la fenêtre du document. • Si vous voulez définir une taille par défaut pour toutes les fenêtres de document, choisissez Configuration dans le menu contextuel situé dans la partie droite de la barre d’état, en bas de la fenêtre de document. Activez ensuite l’option Fenêtres de documents balisés, puis cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 47 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 48 Définition des options d’affichage de mise en page La palette Affichage permet de définir des options relatives à l’affichage d’images de faible résolution ou de fond, de polices Web standard et de certains éléments contenus dans votre page (tels que les lignes des grilles de mise en page, les bords des tableaux, les marqueurs de boîtes flottantes et les symboles de saut de ligne). Vous pouvez également définir un profil pour un navigateur Web spécifique (tel que l’i-mode pour l’affichage des pages sur des appareils sans fil). Des modifications sont alors réalisées au niveau de la mise en page afin de refléter l’affichage qui serait obtenu dans un tel navigateur (par exemple, dans une fenêtre très petite pour les navigateurs i-mode). Les options sélectionnées sont uniquement appliquées à la page ouverte. Pour définir des options d’affichage pour la page dans la palette Affichage : 1 Sélectionnez le panneau Mise en page dans la fenêtre du document. 2 Dans la palette Affichage, effectuez l’une des opérations suivantes : • Choisissez une option dans le menu contextuel Profil afin de prévisualiser l’aspect qu’aura la page dans un navigateur Web, sous Windows comme sous Mac OS. • Sélectionnez l’option Superposer les paragraphes afin de prévisualiser le chevauchement entre les éléments dotés de valeurs de marges négatives et les éléments adjacents. Cette option n’a d’incidence que sur les éléments de la page formatés à l’aide d’une feuille de style CSS et confère à GoLive une précision accrue dans la génération des aperçus des styles CSS. • Choisissez Afficher tous les éléments, Jeu par défaut ou, le cas échéant, un jeu personnalisé afin d’afficher soit tous les éléments, soit certains éléments n’apparaissant pas dans la fenêtre du navigateur. L’option ou le jeu choisis déterminent l’affichage ou le masquage des éléments dans GoLive lorsque la commande Affichage > Masquer les éléments invisibles ou Affichage > Afficher les éléments invisibles est utilisée. (Voir « Création de jeux personnalisés d’éléments masqués », page 48.) • Désactivez l’option Images afin de masquer les images (tout en affichant les limites, les icônes de balises d’emplacement ou le texte de remplacement de ces images) dans l’éditeur de mise en page. Activez les options Faible résolution et Fond afin d’afficher respectivement les images de faible résolution et les images de fond. (Voir « Création d’images source de faible résolution », page 227 et « Application d’images ou d’une couleur de fond à une page », page 49.) • Choisissez Toutes, Ignorer les polices Web ou Times uniquement dans le menu Polices. L’option des polices Web est utile, car elle attire votre attention sur tout texte formaté à l’aide de polices Web non standard ou sur toute police dont l’internaute est susceptible de ne pas disposer. Si vous le souhaitez, vous pouvez alors reformater le texte en utilisant les polices Web standard. • Choisissez Liens normaux, Liens actifs ou Liens visités dans le menu Liens afin de prévisualiser les couleurs choisies pour chaque état de lien. (Voir « Définition de la couleur par défaut d’un texte ou des liens d’une page », page 50.) Création de jeux personnalisés d’éléments masqués Le menu Visibilité de la palette Affichage contient un jeu par défaut d’éléments normalement masqués sur votre écran, tels que les symboles de saut de ligne. Vous pouvez modifier ce jeu afin d’afficher certains éléments et d’en masquer d’autres. Vous pouvez également créer des jeux supplémentaires basés sur le jeu par défaut. Comment utiliser l'aide | Sommaire | Index Page précédente 48 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 49 Pour ajouter au menu Visibilité des jeux personnalisés d’éléments masqués : 1 Effectuez l’une des opérations suivantes : • Choisissez Modifier le jeu dans le menu Visibilité de la palette Affichage. • Choisissez Edition > Préférences, développez la liste des préférences générales dans le panneau gauche, puis sélectionnez Eléments invisibles dans cette liste. 2 Sélectionnez un jeu dans le panneau central, puis activez les éléments à masquer dans ce jeu dans le panneau droit. Le jeu par défaut peut être modifié, mais pas supprimé ou renommé. 3 Pour ajouter un jeu à la liste, cliquez sur le bouton Nouveau jeu panneau central. situé dans le bas du 4 Pour renommer un jeu, sélectionnez-le, puis saisissez un nouveau nom dans la zone de texte. 5 Pour supprimer un jeu, sélectionnez-le, puis cliquez sur le bouton Supprimer les jeux sélectionnés . 6 Cliquez sur OK. Application d’images ou d’une couleur de fond à une page Vous pouvez appliquer une image ou une couleur de fond à une page afin de l’améliorer visuellement. Vous pouvez également appliquer des images ou une couleur de fond à d’autres éléments, y compris les grilles de mise en page (voir « Ajout de couleurs ou de fonds aux éléments de page », page 80.) Lorsque vous choisissez une image de fond, gardez à l’esprit que celle-ci sera répétée plusieurs fois dans Adobe GoLive et dans les navigateurs Web afin de remplir la page, à la façon d’une mosaïque. Bien que les couleurs choisies comme couleurs de fond remplacent les couleurs par défaut utilisées par la plupart des navigateurs Web, d’autres couleurs définies dans les préférences des navigateurs peuvent remplacer les couleurs de fond de vos pages. Pour appliquer une image ou une couleur de fond à une page 1 Cliquez sur l’icône de page document. située dans le coin supérieur gauche de la fenêtre de 2 Dans l’inspecteur de la page, activez le panneau Page. 3 Dans la zone Fond, effectuez une des opérations suivantes : • Activez l’option Image, puis spécifiez le fichier image voulu à l’aide du bouton d’affectation ou Parcourir. (Voir « Spécification de l’URL cible d’un lien », page 57.) • Activez l’option Couleur, puis cliquez sur la case échantillon. (La palette de couleurs s’affiche alors.) Sélectionnez ensuite une couleur compatible avec le Web dans la palette de couleurs. (Voir « Utilisation de la palette de couleurs », page 60.) La couleur sélectionnée est automatiquement appliquée à la page et à la case échantillon de l’inspecteur de page. Comment utiliser l'aide | Sommaire | Index Page précédente 49 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index • Page précédente 50 Faites glisser une couleur du panneau d’aperçu de la palette de couleurs vers l’icône de page située dans la fenêtre de document. A B C Un clic sur une case échantillon entraîne l’ouverture automatique de la palette de couleur. A. Case échantillon B. Panneau d’aperçu C. Couleur sélectionnée dans la liste des couleurs nommées Définition de la couleur par défaut d’un texte ou des liens d’une page L’inspecteur de la page permet de définir des couleurs par défaut pour un texte saisi dans une page et pour les trois états de liens suivants : les liens normaux (aspect normal d’un lien dans un navigateur Web), les liens actifs (lorsque le bouton de la souris est enfoncé alors que le pointeur est positionné sur un lien dans le navigateur) et les liens visités (après un clic sur le lien dans un navigateur). Pour définir les couleurs par défaut du texte ou des liens d’une page : 1 Choisissez Spécial > Propriétés de la page afin d’ouvrir l’inspecteur de la page. Alternativement, vous pouvez cliquez sur l’icône de page située dans le coin supérieur gauche de l’éditeur de mise en page, puis choisir Fenêtre > Inspecteur. 2 Dans l’inspecteur de la page, activez le panneau Page, puis effectuez l’une des opérations suivantes : • Pour mettre en couleur tout le texte contenu dans une page, activez l’option Texte, puis cliquez sur la case échantillon et sélectionnez une couleur dans la palette de couleurs. • Pour mettre en couleur les différents états des liens hypertexte d’une page, activez Liens, Liens actifs et/ou Liens visités. Cliquez ensuite sur la case échantillon correspondant aux états de liens sélectionnés, puis sélectionnez une couleur dans la palette de couleurs. Comment utiliser l'aide | Sommaire | Index Page précédente 50 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 51 Définition des marges d’une page Vous pouvez contrôler le décalage du contenu d’une page Web dans les fenêtres des navigateurs en spécifiant des marges de pages. L’inspecteur de page permet de spécifier la largeur des marges (espace séparant le contenu de la page et le bord gauche de la fenêtre du navigateur Web), ainsi que leur hauteur (espace séparant le contenu de la page et le bord supérieur de la fenêtre du navigateur). GoLive ajoute au code source de la page les attributs requis pour l’application des marges spécifiées dans Netscape Navigator et dans Microsoft Internet Explorer. Vous pouvez également supprimer le décalage de marges automatique dont sont dotées les pages dans les fenêtres des navigateurs. Il suffit pour ce faire de spécifier la valeur 0 pour les marges. Pour définir les marges d’une page : 1 Choisissez Spécial > Propriétés de la page afin d’ouvrir l’inspecteur de page. Alternativement, vous pouvez cliquez sur l’icône de page située dans le coin supérieur gauche de l’éditeur de mise en page, puis choisir Fenêtre > Inspecteur. 2 Dans l’inspecteur de la page, activez le panneau Page, puis saisissez des valeurs (en pixels) dans les zones de texte de largeur et de hauteur de marges. Pour définir un décalage de marge nul : Cliquez dans la fenêtre de document avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS), puis choisissez Document > Affecter aux marges la valeur zéro dans le menu contextuel. (Voir « Utilisation des menus contextuels », page 34.) Ajout d’éléments ou de scripts dans la section d’en-tête Une page HTML est composée de deux sections principales : l’en-tête et le corps. L’éditeur de mise en page de GoLive reflète cette structure en proposant une section d’en-tête au sein de la fenêtre de document. Vous pouvez utiliser cette section pour stocker des informations relatives à votre page. Ces informations, telles que le titre de la page et les motsclés associés, sont utilisées par les navigateurs Web. La section d’en-tête de chaque page contient déjà un élément Titre pour le titre de la page affiché dans le coin supérieur gauche de la fenêtre de document. Le panneau En-tête de la palette Objets permet d’insérer des balises vides dans la section d’en-tête de votre page Web. Il suffit ensuite de spécifier les attributs de l’élément ou du script dans l’inspecteur. Comment utiliser l'aide | Sommaire | Index Page précédente 51 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 52 Pour ajouter un élément dans la section d’en-tête d’une page : 1 Faites glisser l’icône voulue du panneau En-tête de la palette Objets vers le corps de la page. GoLive déplace automatiquement cet élément vers la section d’en-tête et ouvre ce panneau. (Vous pouvez également ouvrir la section d’en-tête en cliquant sur le triangle situé à côté de l’icône de page , dans le coin supérieur gauche de la fenêtre du document.) A B Il est possible de repositionner les éléments d’en-tête par glissement. A. Section d’en-tête non affichée B. Section d’en-tête ouverte La palette Objets n’est pas la seule méthode disponible pour ajouter des éléments dans la section d’en-tête. Il est également possible de cliquer dans la section d’en-tête avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS) et de choisir l’objet voulu dans le menu contextuel Insérer un objet > En-tête. 2 Dans l’inspecteur, choisissez différentes options et spécifiez les attributs de l’élément ou du script sélectionné. Les options et attributs disponibles dans l’inspecteur varient en fonction du type d’élément ou de script sélectionné dans la section d’en-tête. Elément Mots-clés L’élément méta Mots-clés permet de spécifier des mots-clés pour votre page Web. Les moteurs de recherche Internet utilisent les informations contenues dans cet élément afin de constituer leurs index. L’inspecteur de mots-clés permet d’ajouter, de mettre à jour, de supprimer et de réorganiser des mots-clés sélectionnés dans une liste. Vous pouvez également ajouter un mot-clé au premier élément Mots-clés de la section d’en-tête en sélectionnant du texte dans la page, puis en choisissant Spécial > Ajouter des mots-clés. Si aucun élément Mots-clés n’existe dans la section d’entête, GoLive en ajoute alors un automatiquement. Le nouveau mot-clé est affiché dans la liste de l’inspecteur de mots-clés. Les moteurs de recherche Internet utilisent à la fois les mots-clés et les titres des pages pour trouver vos pages. (Voir « Modification du titre de la page », page 45.) Elément Commentaire (section d’en-tête) L’icône Commentaire insère une balise permettant d’ajouter à vos pages Web des commentaires cachés, tels que des informations de publication pour référence ultérieure. Ces commentaires ne peuvent être visualisés qu’à partir de GoLive ou d’un autre programme de visualisation de code source. Remarque : Vous avez également la possibilité d’ajouter des commentaires dans le corps de la page et d’y effectuer des références pendant la construction de la page dans l’éditeur de mise en page. (Voir « Ajout de commentaires », page 99.) Comment utiliser l'aide | Sommaire | Index Page précédente 52 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 53 Elément Méta L’élément Méta permet d’insérer des informations sur la page Web, telles que la description du contenu de la page. GoLive insère automatiquement et pour chaque nouvelle page les informations méta suivantes : le format de fichier (texte/HTML, par exemple), le jeu de caractères utilisé (ISO-8859-1, par exemple) et le programme de création du fichier (Adobe GoLive, par exemple). Dans l’inspecteur de la balise méta, vous pouvez choisir l’option Equivalent HTTP afin de simuler les informations d’en-tête accompagnant la page lorsqu’elle est envoyée vers un navigateur par un serveur HTTP ou l’option Nom pour définir un élément méta autre que HTTP. Remarque : Pour modifier l’application ayant servi à créer le fichier, choisir Edition > Préférences, sélectionnez Source dans le panneau gauche, modifiez le code source comme vous le souhaitez, puis cliquez sur OK. Pour spécifier un jeu de caractères différent pour une nouvelle page, sélectionnez la balise Encoder dans la section d’en-tête de la page, activez le jeu de caractères voulu dans l’inspecteur d’encodage. Vous pouvez également choisir le jeu de caractères dans le menu Fichier > Encodage du document. Pour modifier le jeu de caractères pour toutes les pages, choisissez Edition > Préférences. Sélectionnez Encodages dans le panneau gauche, puis choisissez un nouveau jeu du panneau droit. Cliquez ensuite sur OK. Elément Script L’élément Script permet d’insérer un script JavaScript dans la section d’en-tête de votre page Web. Les scripts des sections d’en-tête sont exécutés pendant le chargement de la section de corps visible de la page. L’inspecteur de script d’en-tête permet de définir un nom pour le script, de choisir le langage JavaScript pour un navigateur spécifié, de spécifier le fichier script et d’ouvrir l’éditeur JavaScript pour y modifier ce fichier script. (Voir « Utilisation de scripts JavaScript », page 460.) Elément Rafraîchir L’élément méta Rafraîchir permet d’indiquer aux navigateurs Web qu’ils doivent mettre à jour le contenu de votre page Web ou la remplacer par une autre page après un délai défini. Vous pouvez utiliser cet élément si votre page comporte des objets interactifs ou si elle fait partie d’une série de pages présentées aux internautes. L’inspecteur de rafraîchissement permet de saisir une valeur (en secondes) afin de spécifier l’intervalle précédant le rafraîchissement de la page ou son remplacement par une autre page. Vous pouvez choisir l’option Cibler ce document afin de rafraîchir la page active ou l’option Cibler l’URL afin de remplacer la page par une autre page. Vous pouvez facilement créer un diaporama en ajoutant un élément de rafraîchissement à chaque page à inclure. Vous pouvez, par exemple, insérer sur la première page de la présentation un élément de rafraîchissement renvoyant à la seconde page, etc. Elément <no edit> L’icône Elément permet d’insérer des éléments <no edit> dans la section d’en-tête de votre page Web. Ces éléments permettent d’ajouter du code contenant une syntaxe inhabituelle or que GoLive ne peut pas lire, et d’assurer la compatibilité avec les versions futures du langage HTML et des navigateurs Web prenant en charge ces versions. Dans l’inspecteur de balise, vous pouvez modifier les balises ouvrantes et fermantes, ajouter les noms et les valeurs des nouveaux attributs et supprimer des attributs de la liste. Comment utiliser l'aide | Sommaire | Index Page précédente 53 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 54 Encodage du texte L’icône Encoder permet d’ajouter à une page un élément méta définissant l’encodage du texte qui s’y trouve. Par défaut, toutes les nouvelles pages créées dans GoLive utilisent l’élément d’encodage méta de la section d’en-tête avec l’attribut de jeu de caractères ISO-8859-1. Vous pouvez modifier l’encodage des caractères en sélectionnant l’objet <ENC> dans la section d’en-tête et en choisissant une option d’encodage dans l’inspecteur d’encodage. Vous pouvez également modifier le jeu de caractères d’un document en choisissant un jeu différent dans le menu Fichier > Encodage du document. (Voir « Utilisation des jeux de caractères non romains », page 131.) Elément Liens L’élément Liens est utilisé pour définir la relation entre la page Web active et les autres pages de votre site Web ou pages Internet. (Si vous gérez les pages du site à l’aide de la fenêtre de site GoLive, l’utilisation de cet élément n’est pas nécessaire.) Les informations de l’élément Liens permettent la réalisation d’un suivi des liens entre différentes pages dans un site volumineux. Dans l’inspecteur des liens, vous pouvez spécifier le titre, le nom du lien et le nom de l’ancre de la page référencée, les relations, inversées ou non, entre la page active et l’URL source ou cible, une liste des méthodes HTTP prises en charge par la page référencée et un URN pour la page. Remarque : Les attributs URN ou Méthodes sont rarement utilisés ou pris en charge par les navigateurs Web. Elément Index L’élément Index permet d’informer les navigateurs Web que votre page Web prend en charge la recherche par mot-clé et de leur indiquer qu’une zone de texte de recherche doit être affichée avec la page. Dans la zone de texte Chaîne de l’inspecteur d’index, saisissez la chaîne devant être affichée par le navigateur Web avec la zone de recherche de texte. Remarque : L’élément Index est obsolète. Elément URL de base L’élément URL de base spécifie l’emplacement d’origine de votre page Web. L’URL de base est utilisé par les navigateurs Web pour localiser les liens relatifs situés sur une page. Ainsi, si la page est retirée de son emplacement d’origine, les navigateurs sont en mesure de localiser les liens relatifs qu’elle contient à l’aide de l’URL de base. L’option Toujours utiliser des URL absolus garantit que toutes les références renvoient à la racine du site. Ajout de scripts de routage de navigateurs Vous pouvez insérer dans la section d’en-tête de votre page Web un script de routage de navigateur afin de détecter le type du navigateur Web chargeant votre page et de rediriger automatiquement l’internaute vers une page de remplacement prédéfinie. Par exemple, cette fonction vous permet de rediriger les navigateurs de versions 3.0 vers une autre page lorsque la page actuelle comporte des fonctions (des actions, animations et feuilles de style en cascade, par exemple) reconnues uniquement par les versions 4.0 et ultérieures des navigateurs. Remarque : Les scripts de routage ne sont pas reconnus par les versions 2.0 des navigateurs et par Microsoft Internet Explorer 3.0 pour Mac OS. Les versions anciennes des navigateurs ne pouvant pas lire le script de routage, assurezvous que la page associée à ce script est prise en charge par les navigateurs les plus anciens et que, le cas échéant, aucun routage n’est déclenché. Vous pouvez également utiliser le script de routage pour établir une distinction entre les navigateurs Netscape et Internet Explorer en fonction de la prise en charge de balisage spécifique aux navigateurs. Comment utiliser l'aide | Sommaire | Index Page précédente 54 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 55 Pour ajouter un script de routage de navigateur : 1 Faites glisser l’icône Routeur du navigateur du panneau SmartObjects de la palette Objets vers le corps de la page. GoLive déplace automatiquement cet élément vers la section d’en-tête et ouvre ce panneau. 2 Dans l’inspecteur de routeur du navigateur, sélectionnez les navigateurs prenant en charge les fonctions de votre page : • Sélectionnez Automatique pour laisser à GoLive le soin de déterminer la compatibilité des navigateurs. Par exemple, si votre page comporte des fonctions reconnues uniquement par les versions 4.0 et ultérieures des navigateurs, GoLive configure le script de sorte que toute requête issue d’une version 3.0 de navigateur soit redirigée. • Si les mêmes navigateurs sont pris en charge sous Windows et sous Mac OS, désactivez l’option Automatique, choisissez Toutes dans le menu Plates-formes gérées, puis sélectionnez les navigateurs pris en charge. • Si des navigateurs différents sont pris en charge sous Windows et sous Mac OS, choisissez Windows dans le menu Plates-formes gérées, puis sélectionnez les navigateurs spécifiques à Windows. Choisissez ensuite Mac OS dans le menu Plates-formes gérées et sélectionnez les navigateurs spécifiques à Mac OS. Remarque : Dans l’inspecteur de routeur du navigateur, vous pouvez associer le symbole de l’infini à Netscape et/ou Explorer afin d’indiquer que seules les versions supérieures à 5.0 sont prises en charge. 3 Spécifiez l’URL d’une page de remplacement dans la zone de texte Lien alternatif. (Voir « Spécification de l’URL cible d’un lien », page 57.) 4 Lorsque vous avez terminé, visualisez votre page à l’aide d’un navigateur incompatible pour vous assurer que la requête est correctement redirigée. Liaison des fichiers Une fois votre site créé et toutes les ressources ajoutées à la fenêtre de site, vous pouvez lier des images ou des objets s’y trouvant aux fichiers source, créer un système de navigation entre les différentes pages de ce site et ajouter des liens pointant vers d’autres sites ou vers des URL externes. GoLive met automatiquement à jour le site avec chaque nouveau lien créé et contrôle de façon continue l’intégrité des liens à mesure de la construction du site. Si vous déplacez ou renommez un fichier dans la fenêtre de site, GoLive met à jour les liens pointant vers les nouveaux chemins d’accès. Vous pouvez afficher une représentation graphique de tous les liens de votre site et de l’arborescence de navigation entre les différentes pages. (Voir « A propos des vues graphiques du site », page 305.) En cas de rupture d’un lien causée par le déplacement ou la modification du nom du fichier cible hors de la fenêtre de site, GoLive affiche le fichier orphelin ou manquant dans le panneau Erreurs de la fenêtre de site. (Voir « Correction des erreurs de site », page 328.) Comment utiliser l'aide | Sommaire | Index Page précédente 55 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 56 Création de liens de ressource et de navigation Lorsque vous ajoutez à une page des images et d’autres types de médias, vous créez des liens de ressource entre les balises d’emplacement contenues dans la page et les fichiers source. Vous pouvez également créer des liens de navigation à partir des images ou du texte d’une page utilisés par les internautes pour passer à d’autres pages du site, à d’autres emplacements de la page active ou pour accéder à des adresses e-mail ou à des URL externes. Vous pouvez définir du texte ou des images en tant que liens de référence vides et spécifier ultérieurement des fichiers cible pour ces liens ou leur associer des actions. Lorsque vous associez une action à un lien de référence vide, veillez à bien saisir le symbole # dans la zone de texte d’URL afin d’éviter les problèmes de navigateur. (Voir « Spécification de l’URL cible d’un lien », page 57 et « Configuration d’actions », page 250.) Pour créer un lien de référence vide : Effectuez l’une des opérations suivantes : • Faites glisser le fichier source (une image GIF, un fichier PSD Photoshop ou un fichier SWF LiveMotion, par exemple) du panneau Fichiers de la fenêtre de site vers la page. GoLive crée automatiquement un lien de ressource entre l’image de la page et le fichier source. • Sélectionnez la balise d’emplacement de l’objet (une image ou un objet dynamique, par exemple), puis spécifiez le fichier source dans la zone de texte d’URL de l’inspecteur. (Voir « Spécification de l’URL cible d’un lien », page 57.) Pour créer un lien de navigation : 1 Sélectionnez un texte, une image ou un objet sur la page. 2 Dans l’inspecteur, effectuez l’une des opérations suivantes : • Pour le texte sélectionné, spécifiez le fichier cible du lien de navigation dans la zone de texte d’URL. (Voir « Spécification de l’URL cible d’un lien », page 57.) • Pour les images ou objets sélectionnés, cliquez sur le panneau Liens (le cas échéant), puis sur le bouton Nouveau lien . Spécifiez ensuite le fichier cible du lien dans la zone de texte d’URL. (Voir « Spécification de l’URL cible d’un lien », page 57.) Vous pouvez également faire glisser le fichier cible d’un lien de navigation du panneau Fichiers de la fenêtre de site vers la sélection de la page. Si vous faites glisser le fichier vers une page dont aucun élément n’a été sélectionné, GoLive crée un lien hypertexte et utilise le nom du fichier en tant que libellé de texte.) (Voir « Création de liens hypertexte », page 121.) Pour créer un lien de référence vide : Sélectionnez un texte ou un objet de votre page, puis cliquez sur le bouton Nouveau lien de la barre d’outils. GoLive affiche une icône d’insecte dans la fenêtre de site, à côté des pages contenant des liens de référence vides. Vous pouvez spécifier simultanément le fichier cible de plusieurs liens à l’aide de la palette Liens entrants et sortants. (Voir « Modification de liens et d’URL dans l’intégralité du site », page 321.) Comment utiliser l'aide | Sommaire | Index Page précédente 56 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 57 Pour supprimer un lien : Sélectionnez un texte ou un objet de votre page, puis cliquez sur le bouton Supprimer le lien de la barre d’outils. Spécification de l’URL cible d’un lien L’inspecteur permet de spécifier les fichiers ou les URL cibles des liens de navigation et de ressource. Vous pouvez saisir le chemin d’accès au fichier cible du lien directement dans la zone de texte d’URL de l’inspecteur ou le spécifier en choisissant une des différentes méthodes disponibles, notamment le glissement de fichiers, l’utilisation du bouton d’affectation, la navigation et la réutilisation de fichiers récemment liés. Quelle que soit la méthode utilisée, le chemin d’accès au fichier cible est affiché dans l’inspecteur. Remarque : Vous trouverez également le bouton d’affectation dans d’autres fenêtres et palettes (telle que la palette Liens entrants et sortants), permettant ainsi la création facile de liens entre des objets et des fichiers du site. (Voir « Utilisation de la palette Liens entrants et sortants », page 320.) Le menu de la palette Inspecteur et les menus contextuels des textes et objets sélectionnés contiennent des listes de fichiers récemment liés pouvant être utilisés pour spécifier la cible d’un lien. Ces listes sont organisées par catégories, dont les catégories Fichiers HTML, Images, URL divers et Ancres. Les cinq derniers fichiers utilisés en tant que cibles pour des liens sont également répertoriés. La catégorie URL divers comprend des liens pointant vers des fichiers PDF, les URL préférés et/ou des adresses e-mail en provenance du panneau Externe de la fenêtre de site. Pour spécifier l’URL d’un lien par glissement du fichier cible : Effectuez l’une des opérations suivantes : • Pour les liens de ressource, faites glisser un fichier image ou tout autre fichier multimédia du panneau Fichiers de la fenêtre de site vers la page. L’URL pointant vers le fichier source est affiché dans l’inspecteur. • Pour les liens de navigation, faites glisser un fichier HTML du panneau Fichiers de la fenêtre de site vers un lien ou un texte sélectionnés dans une page. L’URL cible de la page est affiché dans l’inspecteur. (Si vous faites glisser le fichier HTML vers une page dont aucun élément n’a été sélectionné, GoLive crée un lien hypertexte et utilise le nom du fichier en tant que libellé de texte.) Vous pouvez également faire glisser les URL externes, les adresses e-mail et les objets de bibliothèque de la fenêtre de site vers la page. (Voir « A propos des éléments de construction de site », page 337.) Pour spécifier la cible du lien à l’aide du bouton d’affectation : 1 Sélectionnez dans la page le texte, l’objet, l’icône de balise d’emplacement ou le lien existant. 2 Spécifiez le fichier cible en utilisant l’une des méthodes suivantes : • Faites glisser une ligne du bouton d’affectation jusqu’à la cible dans la fenêtre de site. Cette cible peut correspondre à un fichier ou à une ancre répertoriés dans le panneau Fichiers, ou encore à un URL ou à une adresse e-mail figurant dans le panneau Externe. Vous pouvez également effectuer un glissement vers une icône de page ou vers une ancre se trouvant sur une page ouverte. (Voir « Utilisation d’ancres en tant Comment utiliser l'aide | Sommaire | Index Page précédente 57 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 58 que liens », page 60 et « Utilisation d’URL et d’adresses électroniques dans un site », page 352.) • Faites glisser une ligne, en maintenant le bouton Alt (Windows) ou Commande (Mac OS) enfoncé, depuis une sélection de la page vers le fichier cible dans la fenêtre de site ou vers un point cible de la page ou d’une autre page ouverte (créant ainsi une ancre). Si la ligne disparaît en zigzaguant, cela indique que vous avez relâché le bouton de la souris trop tôt ou qu’il est impossible de créer le lien. Pendant l’opération de glissement, il est possible d’arrêter le pointeur pendant quelques instants au-dessus du bouton Sélectionner une fenêtre de la barre d’outils afin d’afficher une fenêtre au premier plan, ou au dessus d’une page dans le panneau Fichiers de la fenêtre de documents afin d’afficher une liste des ancres sous la page. Faites glisser le pointeur de la souris du bouton d’affectation de l’inspecteur vers un fichier de la fenêtre de site. Pour spécifier la cible de lien à l’aide du bouton Parcourir : 1 Sélectionnez dans la page le texte, l’objet, l’icône de balise d’emplacement ou le lien existant. 2 Dans l’inspecteur, cliquez sur le bouton Parcourir . 3 Dans la boîte de dialogue Ouvrir, sélectionnez le fichier cible, puis cliquez sur Ouvrir. Si le fichier cible ne se trouve pas dans la fenêtre de site, le bouton Parcourir permet de le localiser, puis de le lier au texte ou à l’objet sélectionnés. Vous pouvez ensuite faire glisser le fichier orphelin du panneau Erreurs de la fenêtre de site vers le panneau Fichiers, puis cliquer sur OK pour copier le fichier et mettre le site à jour. Une alternative consiste à placer une copie du fichier dans le site à l’aide de la commande de nettoyage. (Voir « Nettoyage d’un site », page 300.) Pour spécifier le lien cible à l’aide d’un fichier récemment lié, d’une adresse e-mail ou d’un URL : 1 Sélectionnez dans la page le texte, l’objet, l’icône de balise d’emplacement ou le lien existant. 2 Effectuez l’une des opérations suivantes : • Dans le menu contextuel d’URL de l’inspecteur, choisissez un fichier récemment lié, une ancre sur une page, un URL ou une adresse e-mail. Comment utiliser l'aide | Sommaire | Index Page précédente 58 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index • Page précédente 59 Dans le menu contextuel, choisissez Appliquer un lien ou Hyperlien, puis choisissez un fichier récemment lié, une ancre de page, un URL ou une adresse e-mail. (Voir « Utilisation des menus contextuels », page 34.) Modification d’URL dans des liens La boîte de dialogue Modifier l’URL permet de modifier le chemin d’accès à une cible de lien, de rendre le chemin relatif ou absolu et d’ajouter des paramètres de requête à l’URL pour les requêtes CGI et autres requêtes de serveur. Les paramètres de requête sont utilisés par les serveurs de requête, pour des informations telles que des données de bases de données (voir « Utilisation de contenu dynamique », page 544) ou pour le chargement de scripts serveurs, tels que les scripts Perl, destinés au traitement de formulaires (voir « Création de formulaires », page 238). Lorsque vous ajoutez des paramètres de requête à l’URL, GoLive insère un point d’interrogation (?) pour la requête, des signes d’égalité entre chaque valeur et nom de paramètre et des esperluettes (&) entre chaque paramètre. GoLive affiche l’URL complet, incluant la requête CGI ou toute autre requête de serveur au bas de la boîte de dialogue Modifier l’URL. Par défaut, GoLive utilise des URL relatifs en tant que cibles de liens. Vous pouvez transformer un URL individuel en chemin absolu dans la boîte de dialogue Modifier l’URL. Vous pouvez également transformer un URL en chemin absolu pour un site spécifique ou définir une préférence pour transformer tous les URL en chemins absolus pour tous les sites. (Voir « Configuration de chemins de liens absolus », page 304.) Pour modifier un URL : 1 Dans le menu de la palette Inspecteur, choisissez Modifier. La boîte de dialogue Modifier l’URL peut également être ouverte en choisissant Hyperlien > Modifier le lien dans le menu contextuel d’un lien. (Voir « Utilisation des menus contextuels », page 34.) 2 Dans cette boîte de dialogue, effectuez l’une des opérations suivantes : • Modifiez l’URL ou saisissez-en un nouveau dans la zone de texte Chemin. • Cliquez sur Parcourir pour localiser et sélectionner une nouvelle page cible. • Cliquez sur Chemin absolu ou sur Chemin relatif afin d’utiliser un chemin absolu ou un chemin relatif dans l’URL. (Voir « A propos des chemins de liens absolus », page 304.) • Saisissez les noms et les valeurs des paramètres dans les zones de texte, puis cliquez sur Ajouter un paramètre afin de les ajouter à la liste Paramètres de la requête. • Pour supprimer un paramètre de la liste, sélectionnez-le, puis cliquez sur Supprimer le paramètre. • Pour modifier le nom ou la valeur d’un paramètre, sélectionnez ce paramètre dans la liste, effectuez les modifications voulues dans les zones de texte situées sous la liste, puis cliquez sur Mettre à jour. L’URL complet et les paramètres sont affichés dans la zone des résultats située au bas de la boîte de dialogue Modifier l’URL. 3 Cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 59 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 60 Utilisation d’ancres en tant que liens Une ancre correspond à un emplacement spécifique d’une page Web utilisé comme cible de lien. Vous trouverez ci-dessous quelques conseils relatifs à la création d’ancres : • Ne créez pas les ancres directement sur la grille de mise en page. Placez-les plutôt dans le flux de texte HTML, dans une zone de texte ou dans une cellule de tableau. Dans le cas d’une zone de texte ou d’une cellule de tableau, assurez-vous que cette zone ou cette cellule ne sont pas vides. En effet, le cas échéant, l’ancre n’est pas reconnue par Netscape Navigator. Pour contourner ce problème, vous pouvez ajouter un espace insécable dans la zone ou cellule vide. Pour ce faire, cliquez à l’intérieur de celle-ci et appuyez sur Maj + barre d’espacement (Windows) ou sur Option + barre d’espacement (Mac OS). • Il est recommandé de placer les ancres près de la marge de gauche de la page, de sorte qu’elles se comportent de façon plus cohérente dans les différents navigateurs. • Vous ne pouvez pas prévisualiser certaines combinaisons de liens et d’ancres dans les aperçus. • Testez tous les liens pointant vers les ancres dans des navigateurs avant de publier votre site Web. Les ancres ne fonctionnent pas toujours de manière identique dans Netscape Navigator et dans Microsoft Internet Explorer. Pour créer une ancre : Effectuez l’une des opérations suivantes : • Faites glisser l’icône Ancre du panneau Standard de la palette Objets vers le point de la page où vous souhaitez situer l’ancre. • Sélectionnez un lien dans la page, effectuez un glissement entre le bouton d’affectation de l’inspecteur et un point de la page ou d’une autre page ouverte, correspondant à l’emplacement voulu pour l’ancre, puis relâchez le bouton de la souris. Remarque : Vous devez enregistrer la page cible avant de pouvoir créer une ancre à l’aide du bouton d’affectation. Pour attribuer un nom unique à une ancre : Sélectionnez le marqueur d’ancre l’inspecteur d’ancre. sur la page, puis saisissez un nouveau nom dans Pour afficher une liste de toutes les ancres placées sur une page, cliquez sur le triangle afférent à la page dans le panneau Fichiers de la fenêtre de site. Utilisation de la palette de couleurs La palette de couleurs permet de mettre en couleur dans GoLive le fond, le texte et les objets d’une page, ainsi que les éléments d’écran. Vous pouvez effectuer une sélection parmi 216 couleurs compatibles avec le Web à l’aide des échantillons ou des noms de couleurs, ou en spécifiant une valeur hexadécimale. La palette de couleurs contient également des jeux de couleurs basés sur les palettes CMJN (Cyan, Magenta, Jaune, Noir), RVB (Rouge, Vert, Bleu), TSV (Teinte, Saturation, Valeur), TSL (pour le matériel vidéo), de niveaux de gris et 256 couleurs. Comment utiliser l'aide | Sommaire | Index Page précédente 60 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 61 Le panneau Liste des couleurs du site de la palette de couleurs affiche les couleurs utilisées dans votre site. (Voir « Utilisation de couleurs dans un site », page 350.) Remarque : Lorsque vous mettez des objets ou du texte figurant sur une page directement en couleur à l’aide de la palette de couleurs, GoLive insère l’attribut de couleur dans l’élément de police. L’utilisation de l’élément de police est déconseillée et il est même prévu de le supprimer de la prochaine norme HTML. En effet, l’élément de police est à l’origine de problèmes avec les navigateurs Web interprétant les feuilles de style en cascade. Il est donc recommandé de mettre les textes et objets en couleur via les styles, plutôt qu’à l’aide de la palette de couleurs. Pour sélectionner une couleur compatible avec le Web : 1 Choisissez Fenêtre > Couleur pour afficher la palette de couleurs. (La palette de couleurs s’affiche également lorsque vous cliquez sur une case échantillon dans l’inspecteur, la palette Mise en évidence ou la barre d’outils.) 2 Dans le menu de la palette de couleurs, choisissez Liste des couleurs ou cliquez sur le bouton correspondant dans le haut de la palette. La couleur sélectionnée est affichée dans le panneau d’aperçu vertical situé sur la gauche de la palette et sa valeur hexadécimale est indiquée dans la zone de texte Valeur. La liste déroulante affiche les couleurs compatibles avec le Web correspondant aux couleurs les plus proches de la couleur sélectionnée. Remarque : Contrairement à la liste des couleurs Web, La liste des couleurs Web nommées ne correspond pas exclusivement à un jeu de couleurs compatibles avec le Web. Une couleur compatible avec le Web peut être identifiée grâce aux paires correspondantes figurant dans sa valeur, telle que #6600FF. 3 Sélectionnez une couleur compatible avec le Web dans la liste déroulante d’échantillons, de noms ou de valeurs hexadécimales de couleurs. La couleur sélectionnée s’affiche dans le panneau d’aperçu. 4 Pour appliquer une couleur, faites-la glisser du panneau d’aperçu vers la case échantillon de la barre d’outils, de l’inspecteur ou de la palette Mise en évidence. Vous pouvez également faire glisser la couleur vers le panneau Couleur de la fenêtre de site, puis la nommer dans l’inspecteur de couleur. (Voir « Utilisation de couleurs dans un site », page 350.) Pour afficher ou masquer les boutons de la palette de couleurs : Choisissez Afficher les boutons dans le menu de la palette. Pour afficher les valeurs des couleurs sous forme de pourcentages plutôt qu’à l’aide de l’échelle numérique à 256 couleurs : Choisissez Valeurs en pourcentage dans le menu de la palette de couleurs. Une coche s’affiche en regard de l’option dans le menu. Choisissez à nouveau Valeurs de pourcentage dans le menu de la palette pour désélectionner l’option. Comment utiliser l'aide | Sommaire | Index Page précédente 61 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 62 Annulation et restauration de modifications Lors de la conception de votre page Web, vous pouvez revenir à un état précédent de la page ou du site à l’aide de la palette Historique ou des commandes de menu. La palette Historique réalise un suivi des modifications apportées à une page dans l’éditeur de mise en page ou de code source, et de celles apportées aux fichiers dans la fenêtre de site. A chaque modification, le nouvel état de la page ou du site est ajouté à la palette Historique. Vous pouvez ainsi restaurer un état antérieur du document en le sélectionnant dans cette palette. Ensuite, rien ne vous empêche de restaurer les modifications effectuées en choisissant un état plus récent dans la palette Historique. Adobe Web Workgroup Server peut être utilisé pour enregistrer plusieurs versions des pages, pour comparer différentes versions et pour restaurer une version antérieure d’une page. (Voir « A propos des sites collaboratifs GoLive », page 379.) Utilisation de la palette Historique Vous pouvez définir le nombre maximum d’états affiché dans la palette Historique pour une page ou un site (20 états par défaut). Lorsque vous basculez entres différentes fenêtres de site ou de document ouvertes, l’affichage de la palette Historique est réactualisé en conséquence. Cependant, le contenu est effacé et les informations sont perdues lorsque vous cliquez sur un panneau différent dans la fenêtre de document. Pour utiliser la palette Historique : 1 Choisissez Fenêtre > Historique. La palette Historique affiche la liste des états précédents du document, du plus ancien au plus récent. 2 Dans la palette Historique, cliquez sur l’état du document que vous souhaitez restaurer. 3 Pour restaurer les modifications effectuées dans cet état du document, choisissez un état plus récent dans la palette Historique (les états les plus récents du document sont affichés en grisé). Sous Mac OS, appuyez sur Majuscule + Commande + Z pour restaurer successivement les modifications apportées à un document. Pour supprimer toutes les modifications du document affichées dans la palette Historique, appuyez sur Option + Commande + Z, puis cliquez sur Ignorer. Pour définir un nombre maximum d’états répertoriés dans la palette Historique : Dans le menu de la palette Historique, choisissez Configurer l’historique, saisissez une valeur numérique comprise entre 1 et 1600 dans la zone de texte Nombre maximum d’entrées, puis cliquez sur OK. Pour effacer toutes les entrées de la palette Historique : Dans le menu de la palette Historique, choisissez Effacer l’historique. Comment utiliser l'aide | Sommaire | Index Page précédente 62 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 63 Utilisation des commandes Annuler, Rétablir et Restaurer la version enregistrée Vous pouvez également annuler ou restaurer une modification apportée à votre page sans utiliser la palette Historique. Il suffit pour cela d’utiliser les commandes Annuler et Rétablir. Ces commandes figurent dans certains menus de palettes, tel que le menu de la palette des styles HTML. Vous pouvez également annuler toutes les modifications réalisées en rétablissant l’état qu’avait la page lors de son dernier enregistrement. Pour utiliser les commandes Annuler, Rétablir et Restaurer la version enregistrée : 1 Pour annuler une action, effectuez l’une des opérations suivantes : • Choisissez Edition > Annuler. La commande de menu indique la dernière action réalisée. A chaque annulation d’action à l’aide de la commande de menu, le nom de cette commande est modifié de façon à refléter la dernière action réalisée. Lorsqu’il ne reste aucune action à annuler, la commande de menu est affichée en grisé. • Choisissez Annuler dans le menu de la palette. 2 Pour rétablir une action précédemment annulée, effectuez l’une des opérations suivantes : • Choisissez Edition > Rétablir. La commande de menu indique la dernière action qu’il est possible de rétablir. A chaque rétablissement d’action à l’aide de la commande de menu, le nom de cette commande est modifié de façon à refléter l’action la plus récente qu’il est possible de rétablir. Lorsque toutes les rétablissements d’action possibles ont été réalisés, la commande de menu est affichée en grisé. • Choisissez Rétablir dans le menu de la palette. 3 Pour rétablir l’état qu’avait la page lors de son dernier enregistrement, choisissez Fichier > Restaurer la version enregistrée. Prévisualisation des fichiers Vous pouvez afficher un aperçu de vos pages Web et tester les liens directement dans GoLive. Vous avez également la possibilité de prévisualiser les séquences QuickTime, les animations GIF, ainsi que tout autre composant multimédia des modules externes pris en charge par GoLive. L’aperçu affiché correspond approximativement à l’aspect qu’aura votre page lors de sa publication sur le Web. Après avoir affiché un aperçu de votre page dans GoLive, prévisualisez-la systématiquement en utilisant une variété de navigateurs, de versions et de plates-formes. Ces navigateurs vous permettront de déterminer les différences éventuelles entre chacun d’eux et d’afficher un aperçu des animations JavaScript, DHTML et Macromedia Shockwave ou d’autres éléments non pris en charge par GoLive en mode natif. Vous avez la possibilité de lancer les différents navigateurs à partir de GoLive pour autant que vous les ayez ajoutés au préalable dans le menu Afficher dans le navigateur de la barre d’outils. Il est également possible d’afficher dans l’éditeur de mise en page un aperçu de la page telle qu’elle apparaîtrait dans un navigateur Web. Il suffit pour ce faire de choisir le profil d’un navigateur Web spécifique dans la palette Affichage. (Voir « Définition des options d’affichage de mise en page », page 48.) Comment utiliser l'aide | Sommaire | Index Page précédente 63 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 64 Pour afficher un aperçu de votre page dans GoLive : 1 Assurez-vous que le mode d’aperçu est activé dans les préférences des modules. (Choisissez Edition > Préférences, sélectionnez Modules dans le panneau gauche, puis Preview Mode dans le panneau droit. Cliquez ensuite sur OK.) 2 Cliquez sur le panneau Aperçu dans la fenêtre de document. 3 Pour vérifier votre mise en page, faites défiler le contenu de la fenêtre du document. Pour tester les liens, cliquez sur toutes les zones sensibles de la page. GoLive ouvre chaque page référencée dans une fenêtre spécifique. Remarque : Pour pouvoir utiliser la fonction d’aperçu dans Adobe GoLive pour Windows, vous devez installer Microsoft Internet Explorer sur votre ordinateur. Pour définir les préférences pour la prévisualisation dans les navigateurs : 1 Assurez-vous que chaque navigateur est installé sur votre disque dur et que tous les modules externes nécessaires à la prévisualisation se trouvent dans le dossier des modules externes du navigateur (ou dans tout autre dossier utilisé par le navigateur pour les extensions multimédias). 2 Choisissez Edition > Préférences, puis cliquez sur Navigateurs dans le panneau gauche de la boîte de dialogue Préférences. 3 Effectuez l’une des opérations suivantes : • Pour ajouter à la liste tous les navigateurs installés sur votre disque dur, cliquez sur Tout rechercher. • Pour ajouter un seul navigateur à la liste, cliquez sur Ajouter. Sélectionnez le navigateur voulu, puis cliquez sur Ouvrir (Windows) ou sur Ajouter puis sur Terminer (Mac OS). 4 Sélectionnez dans la zone de liste le ou les navigateurs que vous souhaitez lancer lorsque vous cliquez sur le bouton Afficher dans le navigateur de la barre d’outils ou que vous choisissez Fichier > Aperçu dans > Navigateur par défaut. Remarque : La plupart des navigateurs autorisent l’ouverture d’une seule version du programme à la fois. Par exemple, vous pouvez exécuter simultanément Netscape Navigator et Microsoft Internet Explorer, mais pas les versions 3.0 et 4.0 de Netscape Navigator. Lorsque plusieurs types de navigateurs sont sélectionnés dans les préférences des navigateurs, par exemple Navigator et Internet Explorer, une icône de navigateur générique s’affiche sur la barre d’outils. En revanche, si un seul type de navigateur est sélectionné (par exemple, Navigator 3.0 et 4.0), la barre d’outils affiche l’icône de ce programme. 5 Pour supprimer un navigateur de la zone de liste, sélectionnez-le et cliquez sur Supprimer. 6 Cliquez sur OK. Pour afficher un aperçu de votre page dans un navigateur : Effectuez l’une des opérations suivantes : • Pour afficher un aperçu de la page dans le ou les navigateurs sélectionnés dans les préférences des navigateurs, cliquez sur le bouton Afficher dans le navigateur de la barre d’outils ou choisissez Fichier > Aperçu dans > Navigateur par défaut. Comment utiliser l'aide | Sommaire | Index Page précédente 64 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index • Page précédente 65 Pour afficher un aperçu de la page dans un seul navigateur défini dans les préférences des navigateurs, choisissez le navigateur dans le menu Afficher dans le navigateur de la barre d’outils. Vous pouvez également le choisir dans le menu Fichier > Aperçu dans. Bouton et menu contextuel Afficher dans le navigateur Remarque : Pour prévisualiser le contenu dynamique d’une page, la page en question doit se trouver sur le serveur Web de façon qu’il puisse traiter le code source. (Voir « Développement et déploiement de sites Web dynamiques », page 552.) Affichage d’informations sur les documents La boîte de dialogue Statistiques du document de GoLive permet de visualiser des informations générales sur votre page Web, notamment sa taille en octets, le nombre de mots et de caractères qu’elle contient et la durée approximative de son téléchargement. Notez que la taille en octets ne tient pas compte des composants son ou média (tels que QuickTime) car ceux-ci peuvent être configurés pour s’exécuter avant leur téléchargement complet. De plus, les temps de téléchargement indiqués ne constituent que des estimations fondées sur des circonstances bien définies. Certaines conditions externes, telles qu’une fréquentation importante du réseau et une surcharge du serveur Web, peuvent modifier sensiblement la durée réelle du téléchargement de la page. Vous pouvez créer un rapport de site pour ajouter des informations supplémentaires, telles que la durée de téléchargement de tous les éléments de la page (images, séquences QuickTime, etc.). (Voir « Génération de rapports sur les sites », page 331.) Pour afficher des informations sur la page active : Choisissez Spécial > Statistiques du document. Une fois que vous avez consulté les informations, cliquez sur OK. Configuration des préférences De nombreux paramètres sont stockés dans le fichier des préférences de GoLive , situé dans le dossier Adobe GoLive > Données de l’application > Adobe (Windows) et dans le dossier Préférences du Dossier Système (Mac OS). Vous pouvez modifier la plupart des paramètres à l’aide de la boîte de dialogue des préférences, ce qui vous permet de contrôler l’aspect et le comportement de GoLive. Par exemple, définissez les options d’affichage, d’importation des images, d’activation des modules, de sélection des navigateurs Web par défaut lancés depuis GoLive et de correcteur d’orthographe. Certaines préférences définies dans la boîte de dialogue des préférences sont également affichées dans la boîte de dialogue de configuration du site (telles que les options de gestion des URL) et peuvent être remplacées par des paramètres définis pour des sites spécifiques. (Voir « Définition des préférences et paramètres de site Web », page 289.) Comment utiliser l'aide | Sommaire | Index Page précédente 65 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 66 Si vous travaillez sur un serveur collaboratif, les paramètres définis dans la boîte de dialogue des préférences sont ignorés pour les sites collaboratifs. (Voir « Configuration d’un site collaboratif », page 403.) Pour définir les options dans la boîte de dialogue des préférences : 1 Choisissez Edition > Préférences. 2 Sélectionnez une icône ou un nom dans le panneau gauche de la boîte de dialogue des préférences. Le cas échéant, cliquez sur le triangle ou sur le symbole + situé en regard de l’icône afin d’afficher la liste des noms. 3 Sélectionnez les options dans le panneau droit de la boîte de dialogue des préférences. Pour plus de détails sur des options spécifiques aux préférences, voir l’index. 4 Cliquez sur OK. Il est nécessaire de relancer GoLive pour que les nouveaux paramètres définis prennent effet. Définition des préférences d’ouverture des pages Vous pouvez définir les préférences générales de façon qu’une nouvelle page soit automatiquement ouverte au lancement de GoLive. Vous pouvez également spécifier le panneau sélectionné (le panneau Source, par exemple) dans la fenêtre de document à l’ouverture de la page. Vous avez également la possibilité de définir une préférence pour que la création des nouvelles pages soient basée sur une page ou un modèle existants, ce qui peut s’avérer utile lorsque vous définissez les pages de votre site. Par exemple, vous définissez une page avec un titre, des marges et un fond, et voulez que toutes les pages soient dotées de ces mêmes attributs. Il suffit donc pour ce faire de définir une préférence pour que cette page soit utilisée lors de toute création de nouvelle page. (Voir « Configuration des pages », page 45.) Pour stocker cette page avec votre site, enregistrez-la en tant que gabarit. (Voir « Utilisation de gabarits », page 346.) Pour définir les préférences générales relatives à l’ouverture des pages au lancement de GoLive ou à la création d’une nouvelle page : 1 Choisissez Edition > Préférences. 2 Choisissez Général dans le panneau gauche de la boîte de dialogue des préférences. 3 Dans le panneau droit de la boîte de dialogue des préférences, choisissez une des options suivantes dans le menu A l’ouverture afin de personnaliser le comportement de GoLive à son lancement : • L’option Créer une nouvelle page permet de créer et d’ouvrir un nouveau document sans titre. • L’option Afficher l’écran de présentation permet de créer une nouvelle page ou un nouveau site, ou d’ouvrir un fichier existant. • L’option Ne rien faire pour lancer GoLive sans créer de nouveau document ou afficher l’écran de présentation. 4 Pour définir le panneau de la fenêtre de document dans lequel la page doit s’ouvrir, choisissez-le dans le menu Mode par défaut. Si vous voulez que toutes les nouvelles pages soient ouvertes dans le panneau spécifié, sélectionnez Nouveau document. Comment utiliser l'aide | Sommaire | Index Page précédente 66 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 67 5 Pour baser la création des nouvelles pages dans GoLive sur un fichier existant, sélectionnez Nouveau document, cliquez sur le bouton Sélectionner, puis sélectionnez le fichier voulu. Si vous choisissez également l’option Créer une nouvelle page dans le menu A l’ouverture, GoLive, à son lancement, crée une nouvelle page en utilisant le fichier sélectionné comme modèle. 6 Pour ajouter les informations méta « <meta name="generator" content="GoLive 6"> » à chaque fichier créé ou enregistré, sélectionnez Ecrire « Générer par Adobe GoLive . » 7 Cliquez sur OK. Définition des préférences relatives à l’interface utilisateur Vous pouvez définir des préférences afin de personnaliser la couleur des éléments mis en évidence, tels qu’un texte formaté avec un style CSS, ainsi que la taille et l’épaisseur des poignées et des bords de sélection. Vous pouvez également autoriser GoLive à lancer d’autres applications pour modifier les fichiers source des médias incorporés dans une page. Les préférences générales relatives à l’interface utilisateur sont appliquées à toutes les pages ouvertes, jusqu’à leur modification. Pour définir les préférences générales relatives à l’interface utilisateur de GoLive : 1 Choisissez Edition > Préférences. 2 Développez l’arborescence de la liste Général en cliquant sur le symbole situé en regard de son nom, puis sélectionnez Interface utilisateur. 3 Sélectionnez l’option Exécuter d’autres programmes pour modifier les fichiers multimédias afin d’autoriser GoLive à lancer une application d’édition spécifique lorsque vous cliquez deux fois sur une image ou sur des objets de votre page liés à un fichier source image ou multimédia, ou lorsque vous ouvrez un fichier source dans le panneau Fichiers de la fenêtre de site. Par exemple, GoLive mappe, ou associe, l’extension de fichier .psd à l’application Photoshop et lance cette application lorsque vous cliquez deux fois sur un fichier image doté de cette extension. Les mappages entre fichiers et applications d’édition sont répertoriés dans la boîte de dialogue Configuration de la base de données Web. (Voir « Utilisation du panneau Association de fichiers », page 640) 4 Pour modifier l’aspect des poignées de redimensionnement situées sur les lignes de sélection, effectuez l’une des opérations suivantes : • Sélectionnez 3D ou 2D pour ajouter respectivement un bord en biseau ou un bord plat aux poignées de sélection. • Pour modifier la couleur des poignées, cliquez sur la case échantillon. Dans la boîte de dialogue Couleurs, choisissez une couleur et cliquez sur OK. • Pour modifier la taille des poignées, choisissez Important, Moyen ou Réduit dans le menu. 5 Cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 67 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 68 Définition des préférences relatives aux modules Dans la boîte de dialogue des préférences des modules, vous pouvez activer ou désactiver des modules et des scripts selon votre besoin, en vue de raccourcir le temps de lancement de GoLive, d’améliorer sa rapidité de réaction et de réduire la quantité de mémoire globale nécessaire. En désactivant les modules non utilisés, vous pouvez réduire la quantité de mémoire nécessaire du programme jusqu’au minimum recommandé de 24 Mo. Pour activer ou désactiver les modules du programme : 1 Choisissez Edition > Préférences. 2 Cliquez sur Modules dans le panneau gauche de la boîte de dialogue des préférences. 3 Pour afficher une description sur un module, sélectionnez le module voulu dans le panneau droit, puis cliquez sur le triangle afférent à l’option Afficher les informations. 4 Sélectionnez ou désélectionnez les cases à cocher afférentes aux modules pour activer ou désactiver les modules correspondants. Les modules du programme actuellement installés sont cochés par défaut. 5 Cliquez sur OK. 6 Relancez GoLive. Personnalisation des raccourcis clavier Vous pouvez personnaliser le jeu de raccourcis clavier GoLive ou un jeu intitulé GoLive 5, basé sur le jeu GoLive. Vous pouvez également créer des jeux de raccourcis clavier supplémentaires en copiant un jeu existant et en modifiant le nouveau jeu. Vous pouvez, par exemple, modifier un jeu de façon à inclure un raccourci pour la commande de menu Fenêtre > Espace de travail > Espace de travail par défaut, ainsi que pour vos espaces de travail personnalisés, ce qui vous permet par la suite de basculer entre les différents espaces de travail à l’aide des raccourcis clavier. (Voir « Enregistrement d’un espace de travail personnalisé », page 36.) Remarque : Le jeu GoLive 5 est une version modifiable et supprimable du jeu GoLive. Le jeu GoLive par contre ne peut pas être supprimé. Pour personnaliser un jeu de raccourcis clavier : 1 Choisissez Edition > Raccourcis clavier. 2 Effectuez l’une des opérations suivantes : • Pour modifier un jeu de raccourcis clavier existant, choisissez ce jeu dans le menu contextuel Jeu sélectionné. • Pour créer un nouveau jeu de raccourcis clavier, cliquez sur Nouveau jeu. Dans la boîte de dialogue Nouveau jeu, saisissez le nom du nouveau jeu, choisissez le jeu existant à prendre comme base pour le nouveau jeu et cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 68 Aide d'Adobe GoLive Définition du projet de site et de l’espace de travail Comment utiliser l'aide | Sommaire | Index Page précédente 69 3 Pour modifier un raccourci clavier dans un jeu modifiable, sélectionnez le nom d’une commande de menu et saisissez un nouveau raccourci clavier dans la zone de texte Appuyez sur les touches. (Si le raccourci clavier saisi est déjà assigné à une autre commande, le nom de celle-ci s’affiche dans la zone de texte Déjà affecté à.) Cliquez ensuite sur Affecter afin d’associer le raccourci clavier à la commande sélectionnée. 4 Cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 69 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 70 Fonctions de mise en page Présentation des fonctions de mise en page La vue Mise en page de la fenêtre du document fournit une zone de travail sur laquelle vous pouvez faire glisser les fichiers ou les objets (généralement à partir de la fenêtre du site) que vous souhaitez insérer à vos pages. Les tableaux, les boîtes flottantes, les grilles de mise en page et zones de texte spéciales de GoLive constituent des éléments conteneurs qui permettent de recevoir et de positionner du texte, des images, des animations et des séquences. Conceptions basées sur des tableaux La plupart des navigateurs Web étant en mesure d’afficher des tableaux HTML, l’utilisation de tableaux dans la conception de mise en page est fréquente. GoLive propose deux méthodes de conception de mise en page à partir de tableaux : à l’aide de tableaux HTML standard ou de la grille de mise en page. La grille de mise en page de GoLive constitue un type de tableau HTML spécial permettant de placer librement des objets sur la page. (Pour plus de détails, voir « Utilisation de la grille de mise en page », page 74.) GoLive met à votre disposition des outils de conception de tableaux HTML standard. Pour positionner des objets tels que des images ou du texte, il vous suffit de les insérer à l’intérieur des cellules d’un tableau, de laisser les cellules environnantes vides et de masquer les bords du tableau. (Pour plus de détails, voir « Utilisation de tableaux », page 157.) Comment utiliser l'aide | Sommaire | Index Page précédente 70 Aide d'Adobe GoLive Fonctions de mise en page Comment utiliser l'aide | Sommaire | Index Page précédente 71 Mise en page de boîtes flottantes A l’instar de la grille de mise en page, les boîtes flottantes permettent de positionner librement les objets sur la page. L’avantage des boîtes flottantes réside dans la possibilité de les faire se chevaucher pour créer des effets de superposition. Leur utilisation combinée avec la grille de mise en page permet de concevoir des comportements dynamiques ou interactifs à partir d’un tableau. Par exemple, vous pouvez choisir de faire disparaître, puis réapparaître du texte chaque fois qu’il est survolé par le pointeur de la souris. (Pour plus de détails, voir « Mise en page à l’aide de boîtes flottantes », page 81.) A B Les liens associés aux images utilisent des actions Afficher/Masquer afin de superposer les boîtes flottantes. A. Lorsque le pointeur est maintenu au-dessus de l’image... B. ...le texte apparaît dans la boîte flottante Conceptions basées sur Photoshop La plupart des sociétés et professionnels de la conception de sites Web créent dans Adobe Photoshop les éléments de mise en page Web, tels que des boutons animés et des animations GIF, puis importent leurs conceptions dans les pages Web. Lorsque vous concevez une mise en page dans Photoshop, vous pouvez la trancher en une série d’images individuelles que GoLive insérera automatiquement à l’intérieur d’un tableau HTML personnalisé sur votre page. Lorsque vous enregistrez l’image Photoshop pour le Web, vous avez la possibilité d’en reformater le code HTML et JavaScript pour permettre à GoLive de modifier les boutons animés. Utilisez l’une des trois méthodes suivantes pour insérer dans vos pages Web vos conceptions Photoshop : • Faites glisser un fichier image Photoshop depuis la fenêtre du site vers la page, une liaison d’objet dynamique sera créée automatiquement entre Photoshop et GoLive. Si l’image est tranchée, GoLive insère les tranches d’image à l’intérieur d’un nouveau tableau et enregistre chaque tranche comme une image Web distincte. Lorsque vous mettez à jour votre conception dans Photoshop, GoLive optimise automatiquement les images tranchées pour le Web. (Pour plus de détails, voir « Utilisation d’une image tranchée Photoshop », page 189.) • Si vous souhaitez préserver les différents calques d’une conception Photoshop, importez dans des boîtes flottantes les calques de l’image comme des images Web individuelles (calques DHTML). Les images Web étant affichées à l’intérieur de boîtes flottantes, vous pouvez les déplacer, les superposer et leur appliquer d’autres actions Comment utiliser l'aide | Sommaire | Index Page précédente 71 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 72 telles que l’action Afficher/Masquer. (Voir « Masquage et affichage des boîtes flottantes », page 88 et « Utilisation de fichiers de calques Photoshop », page 226.) • Vous avez la possibilité d’utiliser vos conceptions Photoshop comme images de référence et d’enregistrer chaque tranche d’image comme une image Web à l’intérieur d’une boîte flottante. Vous pouvez ensuite, si vous le souhaitez, convertir les boîtes flottantes en grilles de mise en page afin de créer une copie de la page sur laquelle sont indiquées les références à l’intérieur d’un tableau de conception. (Voir « Conversion de boîtes flottantes en grilles de mise en page », page 87 et « Création d’une page Web à l’aide d’images de référence », page 223.) Jeux de cadres Il est également possible de baser des conceptions de mise en page sur des jeux de cadres. Utilisez pour ce faire le panneau Cadres qui vous permet de créer un jeu de cadres et de définir la mise en page des cadres destinés à afficher des pages Web individuelles. (Pour plus de détails, voir « Utilisation de cadres », page 92.) Eléments de construction de site permettant d’accélérer la conception des pages Les éléments de construction de site, tels que des composants et modèles de pages, permettent de mettre à jour les sites et de partager les conceptions avec d’autres utilisateurs, tout en limitant leur accès à des zones spécifiques de la mise en page. Les gabarits peuvent s’avérer utiles pour poser les bases de nouvelles pages et les enregistrer avec le site. (Pour plus de détails, voir « A propos des éléments de construction de site », page 337.) Flux de production de la mise en page Avant de vous lancer dans la mise en page du contenu de vos pages, il est conseillé de définir la configuration de votre site. En effet, si vos fichiers ressource et multimédias sont déjà organisés au sein de votre site, il sera plus aisé de les référencer sur la page. Par ailleurs, les outils de gestion de site de GoLive garantiront la mise à jour automatique de vos liens de référence et actions JavaScript au fur et à mesure que vous travaillez. Pour que GoLive soit en mesure de gérer et de générer vos liens lorsque cela s’avère nécessaire, il est indispensable qu’une fenêtre de site soit active pendant que vous travaillez. (Pour plus de détails, voir « Création d’un site », page 38.) Vous pouvez également insérer des éléments standard à vos pages (tels qu’un titre, des marges, et un fond) avant d’entreprendre la mise en page de leur contenu. (Pour plus de détails, voir « Configuration des pages », page 45.) Utilisez la palette Objets pour insérer des objets à vos pages, tels qu’une grille de mise en page, des zones de textes, et des objets dynamiques renvoyant à des fichiers image et à leurs applications d’origine. L’inspecteur de la grille de mise en page vous permet d’ajouter une couleur ou une image de fond à la grille, de modifier son espacement entre les lignes ainsi que l’alignement des objets qu’elle contient. Comment utiliser l'aide | Sommaire | Index Page précédente 72 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 73 La fenêtre de site vous permet de faire glisser images, fichiers HTML et éléments de construction de site personnalisés dans des conceptions de mise en page. Son utilisation constitue un gain de temps, les liens entre les objets et leurs fichiers source étant définis automatiquement. A B C D E Faites glisser vos fichiers image ou autres, ou vos éléments de construction de site pour les insérer à votre mise en page. A. Composant situé à l’intérieur d’une zone de texte B. Grille de mise en page C. Texte situé à l’intérieur d’une zone de texte D. Image liée à son fichier source E. Texte situé à l’intérieur d’une boîte flottante Pour ajouter un contenu à vos pages Web : 1 Choisissez le type de conteneur voulu, tel qu’une grille de mise en page, une boîte flottante ou un tableau, et faites glisser son icône de la palette Objets vers le panneau Mise en page. Pour simplifier la mise en page, recouvrez la totalité de votre page d’une grille de mise en page. 2 Ajoutez un contenu de l’une des manières suivantes : • Faites glisser des icônes de balises d’emplacement (d’image ou d’objet dynamique, par exemple) de la palette Objets vers le conteneur choisi, puis liez-les aux fichiers de référence correspondants (un fichier image, par exemple) dans la fenêtre de site. • Faites glisser des fichiers directement de la fenêtre de site vers l’élément conteneur. S’il s’agit de fichiers image, il n’est pas nécessaire de lier la balise d’emplacement au fichier de référence. Dans le cas de fichiers Photoshop, Illustrator ou LiveMotion, il suffit en effet de faire glisser le fichier pour insérer une image, sans lier au préalable de balise d’emplacement d’objet dynamique. (Voir « Ajout d’images compatibles avec le Web Comment utiliser l'aide | Sommaire | Index Page précédente 73 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 74 sans utiliser les objets dynamiques », page 211 et « Ajout d’images à une page Web à l’aide d’objets dynamiques », page 182.) • Faites glisser des fichiers HTML, URL ou des adresses électroniques depuis la fenêtre du site pour créer des liens hypertexte portant le nom du fichier utilisé comme libellé. Si vous sélectionnez du texte à l’intérieur du conteneur avant de faire glisser le fichier de la fenêtre du site, un lien sera créé sans que le libellé du texte ne change. (Pour plus de détails, voir « Liaison des fichiers », page 55.) • Faites glisser des éléments de construction de site, tels que des composants intégrant une barre de navigation, de la palette Objets vers l’élément conteneur. (Pour plus de détails, voir « Utilisation des éléments de construction de site », page 337.) Utilisation de la grille de mise en page La grille de mise en page de GoLive simplifie la création des conceptions basées sur des tableaux pour vos pages Web. Plutôt que de vous lancer dans la configuration de cellules de tableaux ou la manipulation du code source pour positionner du texte et des objets sur la page, insérez simplement sur votre page une grille de mise en page. Il vous suffira ensuite de faire glisser des zones de texte et autres objets sur cette grille pour les placer sur la page. A mesure que vous ajoutez du contenu et le repositionnez, GoLive ajuste les propriétés de la grille de mise en page. Les grilles de mise en page vous permettent de placer plusieurs objets sur votre page avec une précision de 1 pixel. Vous pouvez insérer des tableaux dans la grille de mise en page si vous souhaitez, par exemple, ajouter un diagramme composé de plusieurs lignes et colonnes à votre mise en page. Pour plus de détails sur la création de tableaux, voir « Création de tableaux », page 157. La position de la grille de mise en page et des objets qu’elle contient est fixe ; elle n’est pas modifiée lorsque la fenêtre du navigateur est redimensionnée. Si vous souhaitez que votre page ou des objets soient redimensionnés automatiquement avec la fenêtre du navigateur, placez tous les objets voulus sur votre page et convertissez la grille de mise en page en tableau HTML standard lorsque la page est prête pour la publication. (Pour plus de détails, voir « Conversion d’une grille de mise en page en tableau », page 79.) Ensuite, configurez, à partir de l’inspecteur du tableau, les cellules du tableau de sorte qu’elles puissent être redimensionnées dans la fenêtre du navigateur. (Pour plus de détails, voir « Redimensionnement des colonnes, lignes et tableaux », page 162.) Lorsque vous procédez à la conversion d’une grille de mise en page en tableau, GoLive élimine tout code source personnalisé et ne préserve que le format de tableau HTML standard. Vous pouvez également éliminer le code source personnalisé en exportant ou en téléchargeant une page Web vers le serveur. (Pour plus de détails, voir « Exportation d’un site », page 368.) Comment utiliser l'aide | Sommaire | Index Page précédente 74 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 75 Ajout d’une grille de mise en page Pour simplifier la mise en page, le groupement et l’alignement de plusieurs objets sur votre page, ajoutez une grille de mise en page de la taille de la fenêtre. Ainsi, lorsque vous aurez ajouté les objets voulus à votre grille, vous pourrez définir la taille de cette dernière de manière optimale autour des objets à l’aide de l’inspecteur de la grille de mise en page. Vous pouvez utiliser plusieurs grilles de mise en page pour des configurations plus avancées, telles que la mise en page d’objets dans les zones d’en-tête et de pied de page. Cela dit, il est déconseillé de superposer les grilles de mise en page. Une fois votre mise en page terminée, vous pouvez convertir la grille en tableau HTML standard si vous le souhaitez. (Pour plus de détails, voir « Conversion d’une grille de mise en page en tableau », page 79.) Si vous souhaitez que votre grille de mise en page couvre la totalité de la page, sans toutefois définir de marge dans la fenêtre du navigateur, spécifiez dans l’inspecteur de la page des hauteur et largeur de marges nulles. La grille de mise en page se positionne alors dans le coin supérieur gauche de la fenêtre. (Pour plus de détails, voir « Définition des marges d’une page », page 51.) Si vous envisagez de toujours configurer des pages exemptes de marges, vous pouvez créer une telle page, puis indiquer à GoLive, via les préférences, d’utiliser cette page comme modèle pour la création de nouvelles pages. (Pour plus de détails, voir « Définition des préférences d’ouverture des pages », page 66.) Tous les objets placés sur la grille de mise en page sont considérés comme des éléments de la grille. Ceci s’avère particulièrement pratique si vous créez une conception de mise en page que vous souhaitez réutiliser. Vous avez la possibilité d’enregistrer la conception sous la forme d’un composant, d’un modèle de page, d’un gabarit ou d’un objet de bibliothèque afin de la stocker pour une utilisation ultérieure. (Pour plus de détails, voir « Utilisation des éléments de construction de site », page 337.) Pour ajouter une grille de mise en page : Faites glisser l’icône Grille de mise en page du panneau Standard de la palette Objets vers la page ou cliquez deux fois sur l’icône pour l’ajouter au point d’insertion. A B Icônes d’objets du panneau Standard de la palette Objets A. Grille de mise en page B. Zone de texte (utilisée pour ajouter du texte à la grille) Pour redimensionner la grille de mise en page : Effectuez l’une des opérations suivantes : • Sélectionnez la grille et faites glisser l’une des trois poignées de redimensionnement situées à droite, en bas et dans le coin inférieur droit de la grille. Les nouvelles largeur et hauteur ainsi définies apparaissent dans l’inspecteur de la grille de mise en page. • Dans l’inspecteur de la grille de mise en page, indiquez la largeur et la hauteur de votre choix. Comment utiliser l'aide | Sommaire | Index Page précédente 75 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 76 • Si la grille de mise en page est dotée d’une image de fond, sélectionnez l’option Utiliser la taille de l’image dans l’inspecteur de la grille de mise en page pour ajuster la taille de la grille à celle de l’image. (Pour plus de détails, voir « Ajout de couleurs ou de fonds aux éléments de page », page 80.) • Si vous avez fini de placer des objets sur la grille, cliquez sur Optimiser dans l’inspecteur de la grille de mise en page pour la réduire automatiquement à sa taille minimale, c’està-dire pour encadrer précisément les objets qu’elle contient sur leurs bords extérieurs. Lorsque vous cliquez sur le bouton Optimiser, vous pouvez maintenir la touche Maj enfoncée pour réduire la largeur uniquement et la touche Alt (Windows) ou Option (Mac OS) pour réduire la hauteur uniquement. Pour minimiser le défilement horizontal de la page dans le navigateur Web, assurezvous que la largeur définitive de la grille de mise en page n’excède pas 580 pixels, c’est-à-dire la largeur d’un moniteur standard de 14 pouces. Pour personnaliser le comportement de la grille de mise en page : Effectuez l’une des opérations suivantes dans l’inspecteur de la grille de mise en page : • Pour placer les objets librement sur la grille avec une précision de 1 pixel, désactivez les cases Coller situées en regard des zones Verticale et Horizontale et utilisez les touches fléchées pour déplacer les objets par incréments de 1 pixel. Si vous préférez ne pas passer par l’inspecteur de la grille de mise en page, utilisez le raccourci suivant : maintenez la touche Alt (Windows) ou Option (Mac OS) enfoncée, puis appuyez sur les touches fléchées afin de déplacer les objets. • Pour déplacer les objets par incréments équivalant à l’espacement entre les lignes de la grille, cochez les cases Coller situées en regard des zones Horizontale et Verticale, puis utilisez les touches fléchées. • Pour modifier l’espacement entre les lignes de la grille, indiquez les valeurs de votre choix (en pixels) dans les zones de texte Horizontale ou Verticale. • Pour masquer les lignes de la grille, désactivez les cases Visible situées en regard des zones Horizontale et Verticale. • Pour définir la position de la grille par rapport à la fenêtre du document, choisissez une option dans le menu contextuel Alignement de l’inspecteur de la grille de mise en page. L’option Par défaut permet d’aligner la grille sur le coin supérieur gauche de la page. L’option Gauche ou Droite permet d’habiller la grille de texte et d’objets. Ajout de contenu à la grille de mise en page Grâce à la grille de mise en page, vous pouvez insérer texte, images et autres objets à l’intérieur de vos pages. Vous insérez du texte à la grille de mise en page en utilisant des zones de texte. Les zones de texte peuvent également recevoir des images et autres objets que vous souhaitez aligner sur le texte ou habiller de texte. (Pour plus de détails, voir « Alignement d’images ou d’objets sur le texte », page 108.) Vous avez la possibilité de stocker, dans la palette Objets ou dans la fenêtre d’un site spécifique, le texte et les objets que vous utilisez souvent. (Pour plus de détails, voir « Utilisation des objets de bibliothèque », page 347.) Comment utiliser l'aide | Sommaire | Index Page précédente 76 Aide d'Adobe GoLive Fonctions de mise en page Comment utiliser l'aide | Sommaire | Index Page précédente 77 Pour ajouter du texte à une grille de mise en page : Faites glisser l’icône Zone de texte du panneau Standard de la palette Objets vers la grille de mise en page et saisissez ou collez le texte dans cette zone. (Pour plus de détails, voir « Ajout de texte à des pages Web », page 104.) Pour ajouter des images ou autres objets à la grille de mise en page : Effectuez l’une des opérations suivantes : • Faites glisser les fichiers image ou autres fichiers multimédias depuis la fenêtre du site vers la grille de mise en page ou vers une zone de texte placée sur la grille. Lorsque vous faites glisser le fichier vers la fenêtre de site, un lien est créé automatiquement entre la page et l’image ou le fichier multimédia. (Pour plus de détails, voir « Ajout d’images à une page Web à l’aide d’objets dynamiques », page 182 ou « Ajout de fichiers multimédias à une page Web », page 229.) • Faites glisser des icônes de balises d’emplacement (d’objet dynamique ou de composant, par exemple) de la palette Objets vers la grille, puis liez-les aux fichiers source correspondants dans l’inspecteur. (Pour plus de détails, voir « Liaison des fichiers », page 55.) Vous pouvez également coller des copies de zones de texte, d’images et d’autres objets dans la grille de mise en page. Pour ce faire, placez le point d’insertion clignotant en cliquant dans une zone vierge de la grille et choisissez Edition > Coller. Pour éviter le redimensionnement automatique des zones de texte dans GoLive : Dans l’inspecteur de la zone de texte, cochez la case Autoriser le débordement du contenu. Lorsque cette option est sélectionnée, la zone de texte n’est pas redimensionnée dans votre mise en page lors de l’ajout ou le formatage du texte. Ceci n’a aucune incidence sur l’aspect de la zone de texte dans le navigateur Web. Remarque : Le navigateur Web ajuste automatiquement la taille d’une zone de texte en fonction de son contenu, lequel est redimensionné en fonction de la plate-forme utilisée (pour afficher les corps de polices différents sous Mac OS et sous Windows, par exemple). Vous pouvez attribuer une définition du corps en pixels à l’ensemble du texte en utilisant une feuille de style en cascade. (Voir « A propos de l’interface de feuille de style en cascade », page 135) Association et dissociation d’objets Seuls les objets qui sont placés sur une grille de mise en page peuvent être groupés. L’association d’objets vous permet de gagner un temps considérable lorsque vous devez déplacer plusieurs objets à la fois et souhaitez conserver leurs positions relatives les uns par rapport aux autres. (Cette possibilité constitue l’un des atouts majeurs de la grille de mise en page par rapport à l’utilisation d’un tableau HTML standard.) Pour associer ou dissocier des objets : 1 Sélectionnez les objets que vous souhaitez associer ou dissocier sur la grille de mise en page. Pour ce faire, cliquez sur le premier objet à associer, puis sur les suivants en appuyant simultanément sur la touche Maj. (Il n’est pas possible d’associer les boîtes flottantes.) 2 Cliquez sur le bouton Associer Transformation. ou Dissocier Comment utiliser l'aide | Sommaire | Index dans la barre d’outils ou la palette Page précédente 77 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 78 Déplacement, alignement et répartition des objets Vous pouvez changer la position des objets sur une page en les faisant glisser. Si les boîtes flottantes ou les objets sont placés sur une grille de mise en page, vous pouvez également définir précisément leur position à partir de la barre d’outils, de la palette Transformation ou de la palette Alignement. Si les objets se trouvent à l’intérieur d’un texte ou d’une zone de texte, utilisez l’inspecteur pour définir leur alignement par rapport au texte. Pour plus de détails sur l’alignement des objets à l’intérieur d’une ligne de texte, voir « Alignement d’images ou d’objets sur le texte », page 108. Pour déplacer un objet ou un groupe d’objets : Sélectionnez les objets voulus et faites-les glisser sur la grille de mise en page ou précisez leur position horizontale et verticale en pixels à partir de la barre d’outils ou de la palette Transformation. Pour aligner des objets par rapport à leur conteneur : 1 Sélectionnez la boîte flottante, l’objet ou le groupe d’objets que vous souhaitez aligner. 2 Effectuez l’une des opérations suivantes : • Sur la barre d’outils, cliquez sur un bouton d’alignement horizontal ou vertical. • Dans la palette Alignement, sous Alignement sur le parent, cliquez sur un bouton d’alignement horizontal ou vertical. (Les boutons proposés dans cette palette sont identiques à ceux de la barre d’outils.) Remarque : Etant donné que vous ne pouvez déplacer un objet sélectionné lorsqu’un autre lui fait obstacle, certains boutons d’alignement peuvent être affichés en grisé pour signaler qu’ils sont indisponibles. Pour aligner des objets les uns par rapport aux autres : Sélectionnez les boîtes flottantes ou les objets sur la grille de mise en page et cliquez sur l’un des boutons d’alignement dans la palette Alignement. Vous pouvez aligner les objets le long de l’axe vertical droit, gauche ou central, ou le long de l’axe horizontal inférieur, supérieur ou central. Alignement des objets sur leur axe central horizontal Pour répartir des objets les uns par rapport aux autres : 1 Sélectionnez au moins trois boîtes flottantes ou objets sur la grille de mise en page. Comment utiliser l'aide | Sommaire | Index Page précédente 78 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 79 2 Dans la palette Alignement, effectuez l’une des opérations suivantes : • Sous Répartition des objets, cliquez sur l’un des boutons pour répartir les objets par rapport à leurs axes verticaux (gauche, central ou droit) ou horizontaux (supérieur, central ou inférieur). • Sous Répartition de l’espacement, cliquez sur l’un des boutons pour répartir l’espacement (et non les objets) de sorte que les axes verticaux et horizontaux des objets présentent le même espacement. • Avant de cliquer sur l’un des boutons de répartition, sélectionnez Utiliser l’espacement et saisissez dans la zone de texte une valeur en pixels à utiliser pour la répartition des objets ou de l’espacement. Définition d’un même espacement entre les objets Conversion d’une grille de mise en page en tableau Vous pouvez convertir des grilles de mise en page en tableaux HTML standard dotés de cellules de dimensions fixes, puis convertir (à partir de l’inspecteur du tableau) ces cellules de sorte qu’elles puissent être redimension-nées dans la fenêtre du navigateur. (Pour plus de détails, voir « Redimensionnement des colonnes, lignes et tableaux », page 162.) Lorsque vous convertissez une grille de mise en page en tableau, GoLive élimine tous les codes spéciaux (tels que cool gridx, gridy et ctrlrow), mais conserve des éléments de contrôle (une ligne de cellules vides d’une hauteur de un pixel au bas tableau et une colonne de cellules vides d’une largeur de un pixel située à l’extrémité droite de chaque ligne du tableau) ainsi que des éléments d’espa-cement de Netscape (situés à l’intérieur des cellules vides). Vous pouvez supprimer ces lignes et colonnes de contrôle du tableau résultant de la conversion ou remplacer les éléments d’espacement à l’intérieur des cellules vides par des images transparentes spacer.gif incluses avec le programme. (Les éléments d’espacement et les images GIF transparentes sont utilisés pour résoudre un problème d’affichage des cellules de tableaux vides dans les navigateurs Netscape. Ces éléments ne sont pas pris en compte par les navigateurs Internet Explorer.) En supprimant le code de GoLive, vous perdrez la possibilité de déplacer les objets librement autour de la page, à moins que vous ne reconvertissiez le tableau en grille de mise en page. Comment utiliser l'aide | Sommaire | Index Page précédente 79 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 80 Pour convertir une grille de mise en page en tableau HTML standard : 1 Sélectionnez la grille de mise en page et choisissez Spécial > Convertir la grille en tableau. Remarque : Si l’option de conversion de la grille en tableau ne figure pas dans le menu Spécial, vous devez activer le module correspondant. Choisissez Edition > Préférences > Modules, sélectionnez LayoutGrid dans le dossier Extend Scripts, puis cliquez sur OK. 2 Dans la boîte de dialogue Convertir, effectuez l’une des opérations suivantes : • Cochez la case Eliminer les ligne et colonne de contrôle pour supprimer la ligne et la colonne de un pixel situées au bas et à droite de la grille. (Cette option est sélectionnée par défaut.) • Désactivez l’option Eliminer les ligne et colonne de contrôle et activez Remplacer les espacements par une image pour remplacer tous les éléments d’espacement de Netscape par une image transparente d’une hauteur de un pixel : spacer.gif. Vous pouvez également spécifier le nom d’une autre image si vous le souhaitez, à condition que cette dernière soit située dans le dossier de l’application GoLive 6. • Désactivez les deux options si vous préférez conserver les ligne et colonne de contrôle, et autoriser les éléments d’espacement. 3 Cliquez sur OK. Pour reconvertir un tableau en grille de mise en page : Sélectionnez le tableau voulu et choisissez Spécial > Tableau > Convertir en grille de mise en page ou cliquez sur le bouton Convertir de l’inspecteur du tableau. Ajout de couleurs ou de fonds aux éléments de page Il est possible de définir des couleurs de fond pour les objets tels que des cellules de tableaux, des zones de texte, des grilles de mise en page ou des boîtes flottantes. Si vous préférez, vous pouvez également choisir d’insérer une image en mosaïque plutôt qu’une couleur, comme vous le feriez pour le fond d’une page. Si vous souhaitez extraire la couleur de fond d’une image ou de tout autre élément affiché à l’écran, utilisez pour ce faire la pipette de la palette et consultez la liste des couleurs Web pour identifier la couleur compatible avec le Web la plus proche. Appliquez ensuite la couleur de fond correspondante. Pour plus de détails sur la définition de la couleur du texte, voir « Définition de la police, du corps de police et de la couleur du texte », page 113. Pour définir la couleur d’un objet : 1 Sélectionnez un objet (tel qu’une grille de mise en page) sur la page. 2 Cliquez sur une case échantillon dans l’inspecteur. La palette de couleurs s’ouvre automatiquement. 3 Dans la palette de couleurs, sélectionnez une couleur parmi les jeux de couleurs proposés. (Le jeu Liste des couleurs Web est le plus approprié et le plus fréquemment utilisé pour afficher des couleurs sur le Web. Voir « Utilisation de la palette de couleurs », page 60.) Comment utiliser l'aide | Sommaire | Index Page précédente 80 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 81 GoLive insère automatiquement la couleur dans la case échantillon de l’inspecteur, active l’option correspondante pour cette case (si nécessaire) et associe cette couleur à la sélection active sur la page. Pour appliquer une teinte au texte sélectionné ou à un objet, vous pouvez également la faire glisser du panneau Couleurs de la fenêtre du site ou du panneau de prévisualisation de la palette de couleurs vers l’élément sélectionné sur la page, vers la case échantillon Couleur du texte de la barre d’outils ou vers une case échantillon dans l’inspecteur. Le panneau Couleurs de la fenêtre du site vous permet de nommer individuellement les couleurs de vos projets de sites Web. (Pour plus de détails, voir « Utilisation de couleurs dans un site », page 350.) Pour extraire une couleur à l’aide de la pipette : 1 Dans la palette de couleurs, cliquez sur le bouton Liste des couleurs Web . 2 Placez le pointeur sur une nuance de la palette de couleurs. Il alors prend la forme d’une pipette . Ensuite, appuyez sur le bouton de la souris et faites glisser la pipette sur l’image ou la partie de l’écran contenant la couleur qui vous intéresse. Vous remarquerez que les couleurs affichées dans le panneau de prévisualisation de la palette de couleurs changent à mesure que vous faites glisser la pipette, et que leurs correspondances Web sont indiquées dans la partie droite de la palette. Lorsque vous relâchez le bouton de la souris, la couleur extraite est sélectionnée dans le panneau de prévisualisation. 3 Sélectionnez dans la liste des couleurs compatibles avec le Web la couleur correspondant à la couleur extraite, puis appliquez-la au texte ou aux objets sélectionnés. Vous pouvez enregistrer la couleur extraite afin de l’utiliser sur d’autres pages de votre site. Pour ce faire, faites-la glisser vers le panneau Couleurs de la fenêtre du site. (Pour plus de détails, voir « Utilisation de couleurs dans un site », page 350.) Pour définir une image de fond en mosaïque pour un objet : 1 Sélectionnez un objet, tel qu’un tableau, une boîte flottante ou une grille de mise en page. 2 Dans l’inspecteur, sélectionnez l’option Image de fond et spécifiez le fichier image dans la zone de texte de référence à l’URL. (Pour plus de détails, voir « Liaison des fichiers », page 55.) Remarque : Evitez d’insérer uniquement une image de fond dans une boîte flottante. Dans les navigateurs Netscape, il se peut que les images ou les couleurs de fond ne soient pas affichées correctement, à moins que la zone ne contienne également des objets ou du texte. Pour contourner ce problème, vous pouvez ajouter une image GIF transparente dans la zone vide. (Pour plus de détails, voir « Ajout d’éléments spéciaux à une page », page 98.) Mise en page à l’aide de boîtes flottantes Les boîtes flottantes vous offrent la possibilité de diviser votre page en rectangles qui peuvent être formatés et positionnés séparément. Elles peuvent contenir les mêmes éléments HTML qu’une page, tels qu’une image ou un simple texte HTML formaté. Comment utiliser l'aide | Sommaire | Index Page précédente 81 Aide d'Adobe GoLive Fonctions de mise en page Comment utiliser l'aide | Sommaire | Index Page précédente 82 Les boîtes flottantes sont des calques DHTML qu’il est possible de superposer, de masquer, d’afficher, voire d’animer sur vos pages. Par exemple, l’utilisation combinée des boîtes flottantes et de l’action Afficher/Masquer est fréquente et permet de faire apparaître et disparaître des boîtes flottantes par un simple mouvement de la souris. Les boîtes flottantes peuvent comporter des images ou des couleurs de fond, et hériter d’attributs de feuilles de style CSS définis pour la page (voir « Utilisation de feuilles de style en cascade », page 134). Leur position étant mise en oeuvre à l’aide de l’élément DIV, elle peut être définie de manière précise. En effet, l’élément DIV, formaté à l’aide du style ID d’une feuille de style CSS, définit la largeur, la visibilité et la position absolue de la boîte flottante, et indique au navigateur de créer dans la page une sous-division indépendante d’HTML. Remarque : Les boîtes flottantes sont compatibles avec les navigateurs Web, version 4.0 ou ultérieure. Pour visualiser l’aspect d’une boîte flottante dans un navigateur Web qui ne prend pas en charge les feuilles de style en cascade, désactivez la prise en charge CSS dans les préférences de votre navigateur. Si votre conception est basée sur un tableau, vous pouvez convertir les boîtes flottantes non chevauchantes et leur contenu en une nouvelle page affichant le contenu à l’intérieur d’une grille de mise en page. (Pour plus de détails, voir « Conversion de boîtes flottantes en grilles de mise en page », page 87.) A B C Les boîtes flottantes permettent de masquer, puis de faire réapparaître du texte et des objets A. Marqueurs définissant 3 boîtes flottantes B. Le lien associé à l’image utilise une action Afficher/ Masquer déclenchée par un événement Souris entrée. C. Lorsque le pointeur survole l’image, la boîte flottante apparaît, affichant un texte. Insertion de boîtes flottantes dans la page Vous pouvez insérer une boîte flottante dans la page en utilisant la palette Objets ou un menu contextuel. Lorsque vous ajoutez une boîte flottante, GoLive insère un petit marqueur jaune intitulé SB. Lorsque vous déplacez la boîte, ce marqueur demeure au point d’insertion initial. Comment utiliser l'aide | Sommaire | Index Page précédente 82 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 83 N’oubliez pas de définir un nom pour vos boîtes flottantes. En effet, GoLive répertorie les boîtes flottantes par leurs noms dans la palette Boîtes flottantes ainsi que dans les listes utilisées pour leur associer des actions et pour les animer. Ces noms sont également utilisés dans les références aux boîtes flottantes dans JavaScript. Veillez à saisir des noms évocateurs afin de les distinguer facilement de ceux utilisés par défaut : layer1, layer2, layer3, etc. La palette Boîtes flottantes vous permet d’ajouter et de gérer plusieurs boîtes flottantes sur la page. Pour l’affi-cher, choisissez Fenêtre > Boîtes flottantes. Pour insérer une boîte flottante dans la page : Effectuez l’une des opérations suivantes : • Faites glisser l’icône Boîte flottante du panneau Standard de la palette Objets vers la page ou cliquez deux fois sur l’icône pour l’ajouter au point d’insertion sur la page. Si celui-ci se trouve à l’intérieur d’un bloc de texte, GoLive insère un nouveau paragraphe pour séparer le texte et place un élément DIV au milieu. • Cliquez à l’intérieur de la page pour placer le point d’insertion, puis sur le bouton Nouvelle boîte flottante de la palette Boîtes flottantes. • Cliquez à l’intérieur de la page et choisissez Insérer un objet > Standard > Boîte flottante dans le menu contextuel. Pour nommer une boîte flottante : 1 Sélectionnez une boîte flottante sur la page ou dans la palette Boîtes flottantes. 2 Saisissez un nouveau nom dans la palette Boîtes flottantes ou dans la zone de texte Nom de l’inspecteur de la boîte flottante. (Les noms ne doivent pas commencer par un chiffre.) Ajout de contenu à une boîte flottante Les boîtes flottantes peuvent contenir tout élément HTML reconnu, y compris du texte et des images. Cela dit, certains navigateurs Web risquent de rencontrer des problèmes lors de l’affichage de boîtes flottantes contenant des tableaux ou des grilles de mise en page. Si vous incorporez une boîte flottante à l’intérieur d’une seconde boîte flottante, la première héritera de toutes les informations CSS de la boîte flottante parent. Pour ajouter du contenu à une boîte flottante : Cliquez à l’intérieur de la boîte flottante et saisissez du texte ou faites glisser une image ou tout autre élément de construction de site de la fenêtre du site ou de la palette Objets vers la boîte flottante. Ajoutez au besoin une image ou une couleur de fond à la boîte flottante à l’aide de l’inspecteur de la boîte flottante. (Pour plus de détails, voir « Ajout de couleurs ou de fonds aux éléments de page », page 80.) Vous avez la possibilité de définir le contenu d’une boîte flottante de telle sorte qu’il ne soit pas affiché lorsque la page est chargée pour la première fois dans le navigateur. (Pour plus de détails, voir « Masquage et affichage des boîtes flottantes », page 88.) Comment utiliser l'aide | Sommaire | Index Page précédente 83 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 84 Redimensionnement et positionnement de boîtes flottantes Vous pouvez placer les boîtes flottantes avec précision à l’aide de l’inspecteur de la boîte flottante et d’une grille de mise en page définie dans la boîte de dialogue Configuration de la grille de la boîte flottante. Vous avez également la possibilité de déterminer l’ordre d’empilement des boîtes flottantes. Il vous suffit pour ce faire d’associer à chaque boîte flottante une valeur d’index Z définissant la position de la boîte dans la pile. Ainsi, une boîte flottante dotée d’une valeur d’index Z de 2 est affichée au-dessus d’une boîte dont l’index Z est de 1, et ainsi de suite. Vous pouvez également utiliser les palettes Transformation et Alignement pour positionner, redimensionner et aligner plusieurs boîtes flottantes, comme vous le feriez pour d’autres objets. (Pour plus de détails, voir « Déplacement, alignement et répartition des objets », page 78.) Pour sélectionner une boîte flottante : Effectuez l’une des opérations suivantes : • Cliquez sur le marqueur de la boîte flottante (petite icône jaune intitulée « SB »). • Placez le pointeur sur le bord supérieur de la boîte flottante et cliquez lorsqu’il prend la forme d’une main. • Cliquez sur le nom de la boîte flottante dans la palette Boîtes flottantes. Pour déplacer ou redimensionner une boîte flottante en la faisant glisser : Effectuez l’une des opérations suivantes : • Pour déplacer librement la boîte flottante sur la page, placez le pointeur sur le bord supérieur de la boîte flottante et faites-le glisser lorsqu’il prend la forme d’une main. • Pour redimensionner une boîte flottante, sélectionnez-la et faites glisser l’une de ses poignées. Vous pouvez également utiliser les touches fléchées pour déplacer ou redimensionner les boîtes flottantes : Appuyez sur une touche fléchée pour déplacer la boîte par incréments de 1 pixel et maintenez la touche Maj enfoncée lorsque vous appuyez pour redimensionner la boîte flottante par incréments de 1 pixel. Maintenez la touche Alt (Windows) ou Option (Mac OS) enfoncée lorsque vous appuyez sur une touche fléchée pour basculer entre des incréments exprimés en pixels ou dépendants de la grille. Pour définir des dimensions et positions exactes ou relatives d’une boîte flottante : 1 Sélectionnez une boîte flottante. 2 Effectuez l’une des opérations suivantes dans l’inspecteur de la boîte flottante : • Saisissez les coordonnées exactes (calculées en pixels à partir du coin supérieur gauche de la fenêtre du document) dans les zones de texte Gauche et Haut. • Saisissez les dimensions exactes dans les zones de texte Largeur et Hauteur. • Choisissez « automatique » dans les menus Largeur et Hauteur pour définir automatiquement les dimensions de la boîte flottante en fonction de son contenu. Comment utiliser l'aide | Sommaire | Index Page précédente 84 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Fonctions de mise en page Page précédente 85 Choisissez « pour cent » dans les menus Largeur et Hauteur pour définir automatiquement les dimensions de la boîte flottante selon un pourcentage spécifique des largeur et hauteur de la fenêtre. Remarque : Un bogue inhérent à Netscape entraîne le redimensionnement automatique de la largeur de la boîte en fonction de son contenu et ce, même lorsque l’option « pour cent » a été sélectionnée. Pour positionner une boîte flottante à l’aide des lignes de la grille : 1 Sélectionnez une boîte flottante. 2 Choisissez Configurer la grille de la boîte flottante dans le menu de la palette Boîtes flottantes. 3 Configurez la grille et son comportement : • Saisissez des valeurs dans les zones Espacement horizontal et Espacement vertical pour définir l’espacement entre les lignes de la grille. • Cochez la case Coller si vous souhaitez aligner la boîte flottante sur les lignes de la grille lorsque vous la déplacez. Vous pouvez utiliser les touches fléchées pour déplacer la boîte flottante par incréments d’une ligne de la grille à l’autre. • Cochez la case Visible pour afficher la grille lorsque vous faites glisser une boîte flottante. Pour modifier l’ordre d’empilement de plusieurs boîtes : Sélectionnez une boîte flottante et spécifiez une valeur d’index Z dans l’inspecteur de la boîte flottante. Définissez un index Z de 1 pour la boîte flottante située sous la pile, 2 pour la suivante, et ainsi de suite. (Vous pouvez modifier une valeur d’index Z en la sélectionnant dans la palette Boîtes flottantes et en spécifiant une nouvelle valeur.) A B C D E Symboles de boîte flottante et définition de l’ordre d’empilement A. Icône d’objet Boîte flottante B. Marqueur de boîte flottante C. La première boîte a une valeur d’index-Z de 1 D. La boîte située au milieu a une valeur d’index-Z de 2 E. La boîte flottante située sur la pile a un index-Z de 3 Comment utiliser l'aide | Sommaire | Index Page précédente 85 Aide d'Adobe GoLive Fonctions de mise en page Comment utiliser l'aide | Sommaire | Index Page précédente 86 Gestion des boîtes flottantes La palette Boîtes flottantes permet de verrouiller, de masquer ou d’afficher temporairement les boîtes flottantes à mesure que vous travaillez. Les paramètres définis dans cette palette n’ont aucune influence sur la manière dont la boîte flottante est affichée dans le navigateur. La palette Boîtes flottantes vous permet également de sélectionner rapidement plusieurs boîtes flottantes afin de les aligner ou de les associer. (Voir « Déplacement, alignement et répartition des objets », page 78.) Remarque : Certains paramètres de la palette Boîtes flottantes sont temporaires et sont annulés lorsque vous basculez entre les vues du document ou cliquez sur le bouton de lecture de l’éditeur de montage DHTML pour lire une boîte flottante animée. A B C D E F Ce type de paramètres temporaires permettent de manipuler plusieurs boîtes flottantes à la fois sans tenir compte de leur état dans l’inspecteur de la boîte flottante. A. Etat d’affichage/de masquage temporaire B. Etat de verrouillage/déverrouillage temporaire C. Nom de la boîte flottante D. Ordre d’empilement défini par les valeurs d’index Z E. Bouton de création d’une nouvelle boîte flottante F. Bouton de suppression de la boîte flottante sélectionnée Pour verrouiller, masquer ou afficher temporairement une boîte flottante : Dans la palette Boîtes flottantes, sélectionnez une boîte flottante et effectuez l’une des opérations suivantes : • Cliquez dans la colonne affichant une icône d’oeil pour masquer ou afficher temporairement le contenu d’une boîte flottante. Vous pouvez également maintenir la touche Ctrl (Windows) ou Commande (Mac OS) enfoncée lorsque vous cliquez dans la colonne pour masquer ou afficher simultanément le contenu de toutes les boîtes flottantes. • Cliquez dans la colonne affichant une icône de cadenas pour verrouiller ou déverrouiller temporairement la boîte flottante associée, ou maintenez la touche Ctrl (Windows) ou Commande (Mac OS) enfoncée lorsque vous cliquez pour verrouiller ou déverrouiller simultanément toutes les boîtes flottantes. Lorsqu’une boîte flottante est verrouillée, vous ne pouvez ni la sélectionner, ni la faire glisser, ni modifier son contenu dans la fenêtre du document. • Choisissez Verrouiller la visibilité dans le menu de la palette Boîtes flottantes si vous souhaitez conserver tous les paramètres de masquage/d’affichage et de verrouillage/ déverrouillage temporaires lorsque vous cliquez sur le bouton de lecture de l’éditeur de montage DHTML ou que vous basculez entre plusieurs vues, par exemple, entre les vues Mise en page et Aperçu. • Cliquez sur le nom d’une boîte flottante pour l’afficher au premier plan et la rendre temporairement visible et modifiable, sans tenir compte de ses paramètres de masquage/d’affichage et de verrouillage/déverrouillage. Comment utiliser l'aide | Sommaire | Index Page précédente 86 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 87 Pour modifier le nom ou l’ordre d’empilement d’une boîte flottante : Dans la palette Boîtes flottantes, sélectionnez la boîte voulue, cliquez de nouveau pour sélectionner le nom ou la valeur de l’index Z, puis saisissez un nouveau nom ou une nouvelle valeur. Les modifications apportées sont mises à jour automatiquement dans l’inspecteur de la boîte flottante. Pour visualiser l’arborescence des boîtes flottantes imbriquées les unes dans les autres : Choisissez Afficher l’arborescence dans le menu de la palette Boîtes flottantes. La sélection de cette option vous permet de modifier l’ordre d’imbrication des boîtes flottantes à partir de la palette en les faisant glisser. (Pour afficher toutes les boîtes flottantes de même niveau dans la liste, choisissez Masquer l’arborescence dans le menu de la palette.) Conversion de boîtes flottantes en grilles de mise en page Vous avez la possibilité de convertir les boîtes flottantes non chevauchantes et leur contenu en objets sur la grille de mise en page d’une nouvelle page sans titre. Ceci s’avère particulièrement pratique si vous souhaitez combiner des conceptions basées sur des tableaux et des calques DHTML pour votre page. Par exemple, si une boîte flottante contient du texte, celui-ci sera intégré dans la grille sous la forme d’une zone de texte. Les attributs relatifs à la position, à la taille et à la couleur de fond sont conservés. GoLive crée une nouvelle page intégrant les objets convertis ; la page d’origine avec les boîtes flottantes reste inchangée. Pour convertir une boîte flottante en grille de mise en page : Choisissez Convertir en grille de mise en page dans le menu de la palette Boîtes flottantes. (Cette option est grisée si les boîtes flottantes se chevauchent.) Les positions du texte et de l’image sont identiques dans le nouveau document. Vous pouvez afficher ou masquer les lignes horizontales et verticales de la grille de mise en page en activant ou désactivant les options Visible dans l’inspecteur de grille de mise en page. Comment utiliser l'aide | Sommaire | Index Page précédente 87 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 88 Masquage et affichage des boîtes flottantes Les boîtes flottantes permettent de masquer ou d’afficher des images ou du texte lorsqu’un internaute clique sur des liens dans une page ou les survole avec le pointeur de sa souris. Lorsque vous définissez des actions de masquage/d’affichage pour plusieurs boîtes flottantes, veillez à bien commencer par nommer ces boîtes flottantes dans l’inspecteur de boîte flottante afin de pouvoir les identifier facilement. Vous pouvez également afficher et masquer des boîtes flottantes selon un laps de temps spécifique. (Voir « Application d’actions déclenchées par le montage à des boîtes flottantes », page 92.) Pour masquer une boîte flottante pendant le chargement d’une page : Sélectionnez la boîte flottante, puis désactivez l’option Visible dans l’inspecteur de boîte flottante. (La palette Boîtes flottantes permet d’afficher temporairement la boîte flottante dans GoLive à mesure que vous travaillez. Voir « Gestion des boîtes flottantes », page 86.) Pour déclencher l’affichage ou le masquage d’une boîte flottante avec un événement de souris : 1 Sélectionnez le texte, l’objet ou l’image devant servir de déclencheur d’événement de souris, puis cliquez sur le bouton Nouveau lien de la barre d’outils. 2 Dans la zone de texte d’URL de l’inspecteur de lien, saisissez le symbole numérique #. Si la sélection doit également jouer le rôle de lien de navigation, vous pouvez saisir l’URL cible du lien dans la zone de texte au lieu du symbole numérique. (Voir « Spécification de l’URL cible d’un lien », page 57.) 3 Dans la palette Actions, sélectionnez un événement de souris (Souris entrée, par exemple) dans la liste Evénements, puis cliquez sur le bouton Nouvelle action . Choisissez ensuite Action > Multimédia > Afficher/Masquer, votre boîte flottante dans le menu Boîte flottante, puis Afficher, Masquer ou Afficher/Masquer dans le menu Mode. (L’option Afficher/Masquer permet d’afficher ou de masquer la boîte flottante selon l’état de visibilité actif défini dans l’inspecteur de boîte flottante.) 4 Enregistrez la page et prévisualisez l’action dans un navigateur Web. Remarque : Les actions doivent être prévisualisées dans un navigateur. (Voir « Prévisualisation des fichiers », page 63.) Pour en savoir plus sur l’association d’autres actions de scripts à vos boîtes flottantes, voir « Utilisation d’actions », page 250. Utilisation de l’éditeur de montage DHTML L’éditeur de montage DHTML permet d’insérer des actions pour boîtes flottantes dans un éditeur de montage ou d’animer une boîte flottante. Animation de boîtes flottantes Pour animer une boîte flottante, il suffit d’insérer des images-clés dans sa piste temporelle et de repositionner la boîte flottante sur la page pour chacune de ces images-clés. Vous pouvez également définir l’état de visibilité ou l’ordre d’empilement d’une boîte flottante par rapport à une image-clé sélectionnée dans la piste temporelle. Vous pouvez recourir aux scènes pour insérer plusieurs animations dans une même page Web. Comment utiliser l'aide | Sommaire | Index Page précédente 88 Aide d'Adobe GoLive Fonctions de mise en page Comment utiliser l'aide | Sommaire | Index Page précédente 89 Remarque :Un bogue intermittent inhérent à Netscape 4.0. peut entraîner la disparition momentanée d’une boîte flottante animée, notamment elle contient un bouton image. Pour remédier à ce problème, insérez un espace insécable ou une image GIF transparente d’un pixel en regard du bouton image. (Voir « Ajout d’espacements ou d’images GIF transparentes », page 101) A B C D E F G H I J K Editeur de montage DHTML contenant les pistes temporelles de deux boîtes flottantes A.Début de la lecture B. Fin de la lecture C. Bouton de lecture automatique D. Menu d’options de scènes E. Piste d’action F. Pistes temporelles G. Commandes Boucle et Palindrome H. Boutons de lecture I. Compteur de position d’image-clé en secondes et en images J. Images par seconde K. Image-clé Pour insérer une image-clé dans la piste temporelle : 1 Ouvrez l’éditeur de montage DHTML en cliquant sur le bouton Editeur de montage DHTML , situé dans le coin supérieur droit de la fenêtre de document. Une piste temporelle est affichée dans l’éditeur de montage DHTML pour chaque boîte flottante de la page. A l’origine, chaque piste temporelle est dotée d’une seule image-clé. 2 Cliquez sur une image-clé afin de sélectionner la piste temporelle d’une boîte flottante. Le nom de la boîte flottante s’affiche dans l’inspecteur de boîte flottante. 3 Cliquez en maintenant la touche Ctrl (Windows) ou Commande (Mac OS) enfoncée sur un point de la piste temporelle de l’éditeur de montage afin d’y insérer une nouvelle image-clé. Vous pouvez également créer une nouvelle image-clé en cliquant sur la copie d’une image-clé existante tout en maintenant la touche Alt (Windows) ou Option (Mac OS) enfoncée et en faisant glisser cette image-clé jusqu’au point voulu dans la piste temporelle. La nouvelle image-clé spécifie la fin de la lecture, indiquée par le marqueur droit qui suit le déplacement de l’image-clé. Si vous insérez des images-clés supplémentaires, celle se trouvant le plus à droite détermine la fin de la lecture. L’espacement entre les imagesclés détermine la vitesse de lecture ; plus la distance est réduite, plus la lecture de l’animation est rapide. Pour spécifier la position de la boîte flottante d’une image-clé : 1 Dans l’éditeur de montage DHTML, sélectionnez l’image-clé de la boîte flottante. dans la piste temporelle 2 Dans la fenêtre du document, faites glisser la boîte flottante vers l’emplacement où l’image-clé sélectionnée doit apparaître. Vous pouvez également entrer la position voulue dans les zones de texte Gauche et Haut de l’inspecteur de la boîte flottante. 3 Cliquez sur la première image-clé dans l’éditeur de montage DHTML afin de replacer la boîte flottante à sa position initiale. Comment utiliser l'aide | Sommaire | Index Page précédente 89 Aide d'Adobe GoLive Fonctions de mise en page Comment utiliser l'aide | Sommaire | Index 4 Cliquez sur le bouton de lecture l’animation. Page précédente 90 au bas de la fenêtre afin de prévisualiser La boîte flottante se déplace dans la fenêtre du document et s’arrête à l’endroit où se trouve la dernière image-clé. Le curseur temporel de l’éditeur de montage DHTML s’arrête lorsqu’il atteint le marqueur de fin de lecture (marqueur droit) . Vous pouvez cliquer deux fois sur le bouton Arrêter pour arrêter la lecture et replacer le curseur temporel au début de la lecture. Utilisez le bouton Arrière afin de replacer le curseur temporel par incréments au début du montage. Pour gérer la lecture : 1 Utilisez les boutons Boucle et Palindrome, situés dans le coin inférieur gauche de la fenêtre de l’éditeur de montage DHTML afin de définir la lecture en boucle de l’animation : • Le bouton Boucle lit l’animation en boucle infinie. Lorsque la fin du chemin de l’animation est atteinte, la boîte flottante revient à sa position initiale et se déplace à nouveau sur la page. Ce cycle est répété indéfiniment. • Le bouton Palindrome se déplace dans un sens, puis dans le sens inverse du début à la fin de la lecture, et inversement. (Le bouton Boucle doit être sélectionné pour que le bouton Palindrome puisse être activé.) 2 Pour modifier la vitesse de lecture, sélectionnez une autre option d’images par seconde dans le menu correspondant situé au bas de l’éditeur de montage DHTML. La plupart des navigateurs prennent en charge la valeur par défaut 15 i/s, même s’ils sont exécutés sur un système dont l’équipement vidéo est de qualité moyenne. Si vous souhaitez définir des vitesses supérieures, testez l’animation en fonction de différentes configurations système pour vous assurer que la lecture s’effectue sans difficulté. Pour définir la visibilité de la boîte flottante d’une image-clé : 1 Sélectionnez, dans la piste temporelle, l’image-clé dont la boîte flottante doit disparaître ou réapparaître. 2 Dans l’inspecteur de la boîte flottante, activez ou désactivez l’option Visible. 3 Cliquez sur le bouton de lecture afin de prévisualiser l’animation. La boîte flottante apparaît ou disparaît jusqu’au moment où le curseur temporel atteint une autre image-clé doté dont la visibilité est définie différemment. Pour enregistrer un chemin d’animation : 1 Ouvrez l’éditeur de montage DHTML, puis sélectionnez l’image-clé de départ. 2 Cliquez sur le bouton Enregistrer dans l’inspecteur de la boîte flottante. 3 Dans la fenêtre de document, faites glisser la boîte flottante le long du chemin voulu. Une image-clé apparaît à chaque courbe principale du chemin. 4 Cliquez sur chaque image-clé et corrigez sa position si nécessaire. Pour spécifier la forme d’un chemin d’animation : 1 Sélectionnez une ou plusieurs images-clés dans la piste temporelle. 2 Choisissez une option dans le menu contextuel Animation de l’inspecteur de boîte flottante : • L’option Aucune fait rebondir la boîte flottante. Comment utiliser l'aide | Sommaire | Index Page précédente 90 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 91 • L’option par défaut est Linéaire, qui déplace la boîte flottante selon une ligne droite. • L’option Courbe crée un chemin courbe. • L’option Aléatoire crée un chemin aléatoire en zigzag. Pour créer plusieurs scènes dans une animation : 1 Créez une animation. GoLive attribue à la première animation créée le nom par défaut suivant : Scène 1. 2 Dans le menu contextuel situé dans le coin supérieur gauche de l’éditeur de montage DHTML, choisissez Renommer la scène. 3 Saisissez le nom de la scène, puis cliquez sur OK. 4 Choisissez Créer une scène dans le menu contextuel. 5 Ajoutez des images-clés et animez les boîtes flottantes de la nouvelle scène, puis prévisualisez l’animation de la nouvelle scène en cliquant sur le bouton de lecture de l’éditeur de montage DHTML. Pour gérer la lecture des scènes : 1 Passez à la deuxième scène, puis cliquez sur le bouton Lecture automatique de le désélectionner et de désactiver ainsi la lecture automatique. afin 2 Revenez à la première scène et cliquez en maintenant la touche Ctrl (Windows) ou Commande (Mac OS) enfoncée sur la piste d’action, à un emplacement quelconque avant la dernière image-clé, afin d’insérer un marqueur d’action, représenté par une icône de point d’interrogation . (La piste d’action correspond à la barre grise horizontale située entre la piste de montage et la piste temporelle.) 3 Dans l’inspecteur d’action, choisissez Action > Multimédia > Lire une scène, puis choisissez le nom de la deuxième scène dans le menu contextuel. L’action Lire une scène indique au navigateur qu’il doit passer à une scène spécifique après avoir terminé la lecture de la scène active. Dans la piste d’action, l’icône d’action Lire une scène remplace le marqueur. 4 Si la première scène est une animation en boucle ou en palindrome, il est nécessaire d’insérer une action Arrêter une scène. Pour ce faire, maintenez la touche Ctrl (Windows) ou Commande (Mac OS) enfoncée et cliquez au niveau de la dernière image-clé sur la piste d’action afin d’insérer un marqueur d’action. Dans l’inspecteur d’action, choisissez ensuite Action > Multimédia > Arrêter une scène, puis choisissez la première scène dans le menu contextuel. L’icône de l’action Arrêter une scène s’affiche dans la piste d’action. L’action Arrêter une scène arrête la lecture de la scène, même s’il s’agit d’une animation en boucle. Insérez cette action dans la piste d’action, après l’action Lire une scène. Dans le cas contraire, l’animation s’arrête avant que le navigateur ne passe à la scène suivante. 5 Positionnez le curseur temporel au début de la première scène et prévisualisez l’animation dans le navigateur. Remarque : Pour octroyer aux internautes un certain contrôle sur l’animation, vous pouvez affecter une action Lire une scène à un bouton animé ou à un lien hypertexte de la page. Pour plus de détails sur l’utilisation des actions avec des boutons animés et du texte, voir« Utilisation d’actions », page 250 Comment utiliser l'aide | Sommaire | Index Page précédente 91 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 92 Application d’actions déclenchées par le montage à des boîtes flottantes Les actions correspondent à des scripts prêts à l’emploi que vous pouvez utiliser dans l’éditeur de montage DHTML avec des boutons animés, des liens et des formulaires. Vous pouvez ajouter des actions à l’éditeur de montage d’une boîte flottante en insérant des marqueurs dans la piste d’action de l’éditeur de montage, puis en définissant les actions dans l’inspecteur d’action. Les actions permettent d’ajouter du son, de déclencher la lecture des scènes d’une animation, de modifier de manière dynamique le contenu d’images et de gérer d’autres procédures dans la fenêtre du navigateur. Pour plus de détails sur les actions pouvant être utilisées avec les boîtes flottantes, voir « Utilisation d’actions GoLive », page 254 Utilisation de cadres Les cadres divisent la fenêtre d’un navigateur Web en sections qui affichent chacune des pages différentes. Ils vous permettent d’agrémenter la présentation de votre mise en page et de faciliter la navigation des internautes sur votre site Web. Comme le contenu de chaque cadre est constitué d’une page distincte (et d’un fichier distinct) possédant son propre URL, il peut être modifié et parcouru indépendamment des pages des autres cadres. Vous pouvez, par exemple, utiliser des cadres pour créer une aide à la navigation ou une table des matières affichée en permanence dans un cadre pendant que l’internaute parcourt une page de contenu dans un autre cadre. Remarque : Les cadres ne fonctionnent pas correctement avec les moteurs de recherche Web car ils n’ont aucun contenu. C’est pourquoi il est recommandé d’éviter d’utiliser un jeu de cadres pour votre page index. Vous ne pouvez pas non plus définir de signets de navigateur pour les pages Web contenant des cadres, car les URL réalisent des mappages aux jeux de cadres plutôt qu’aux pages souhaitées. Comment utiliser l'aide | Sommaire | Index Page précédente 92 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 93 Création d’une mise en page dotée de cadres Un minimum de trois documents HTML est nécessaire pour créer une mise en page à deux cadres : un document pour le jeu de cadres contenant la structure des cadres, et deux documents pour les pages de contenu visibles. Le jeu de cadres correspond au document principal qui définit la taille et l’emplacement des cadres, et contient les liens de référence pointant vers les pages de contenu. Vous avez la possibilité de créer des pages pouvant être contenues ou parcourues dans des cadres spécifiques du jeu de cadres. Document doté de deux cadres A. Le cadre gauche comporte une page de navigation B. Le cadre droit une page liée depuis la page de navigation. Lorsque vous utilisez des cadres, tenez compte des restrictions suivantes inhérentes à certains navigateurs : • Les pages à cadre unique ne s’affichent pas dans les navigateurs Netscape antérieurs à la version 6. • Les navigateurs ont tendance à décaler de quelques pixels le contenu d’une page par rapport au bord de leur zone d’affichage principale et aux bords intérieurs des cadres. Ce comportement peut entraîner des problèmes de dimensionnement. Pour remédier à ce problème, vous pouvez définir les marges du document à cadres sur zéro. (Voir « Définition des marges d’une page », page 51.) • Des documents contenant des jeux de cadres peuvent être imbriqués dans d’autres jeux de cadres, mais cette intégration risque de provoquer de graves problèmes de navigation. Comment utiliser l'aide | Sommaire | Index Page précédente 93 Aide d'Adobe GoLive Fonctions de mise en page Comment utiliser l'aide | Sommaire | Index Page précédente 94 Pour créer une mise en page dotée de cadres : • Créez les pages de contenu à afficher dans les cadres, puis une page vierge qui sera utilisée pour le jeu de cadres. • Définissez le jeu de cadres et nommez les cadres. Dans le document contenant les cadres, vous pouvez définir les cadres de manière à faire défiler leur contenu. Vous pouvez également spécifier si les bords des cadres doivent ou non être visibles. Vous avez de plus la possibilité de concevoir des cadres fixes ou ajustables à la taille des fenêtres des navigateurs. (Voir « Configuration du jeu de cadres », page 94.) Remarque : Il est nécessaire qu’au moins un cadre du jeu de cadres soit redimensionnable. • Liez chaque cadre à une page de contenu. Si le cadre doit afficher plusieurs pages, liezle à la première page à afficher par défaut. (Voir « Configuration de chaque cadre du jeu de cadres », page 96.) • Ouvrez la page de contenu à utiliser comme aide à la navigation ou table des matières, puis spécifiez les pages et le cadre cible pour chaque lien de la page. (Voir « Définition des cadres cible », page 97.) Vous pouvez ouvrir la page de contenu dans une autre fenêtre en cliquant deux fois sur son icône. Configuration du jeu de cadres La palette Objets propose une gamme de jeux de cadres pouvant être placés par glisserdéposer dans la fenêtre du document afin de créer une page Web avec cadres. A B C D E Le cadre gauche est fixe, tandis que le cadre droit s’ajuste automatiquement à la fenêtre du navigateur. A. Onglet de l’éditeur de cadres B. Séparateur du jeu de cadres C. Nom du cadre D. Icône représentant la page liée au cadre E. Les zones en rose représentent les cadres dont la taille (en pixels) est fixe. Comment utiliser l'aide | Sommaire | Index Page précédente 94 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 95 Pour configurer le jeu de cadres : 1 Ouvrez une nouvelle fenêtre de document, puis cliquez sur l’onglet de l’éditeur de cadres dans la partie supérieure de la fenêtre. 2 Activez le panneau Cadres de la palette Objets, puis faites glisser une icône de jeu de cadres vers votre page. Vous pouvez également cliquer deux fois sur cette icône. Lorsque vous positionnez votre pointeur au dessus d’une icône de la palette, une description du jeu de cadres s’affiche dans le coin inférieur droit et indique, par exemple, quels cadres ont une taille fixe ou sont redimensionnables. 3 Sélectionnez le jeu de cadres en cliquant sur l’un de ses séparateurs horizontaux ou verticaux. 4 Dans l’inspecteur de jeu de cadres, effectuez l’une des opérations suivantes : • Sélectionnez une option d’orientation afin d’organiser les cadres du jeu de cadres horizontalement (tous les cadres dans une colonne) ou verticalement (tous les cadres dans une rangée). Vous pouvez également sélectionner l’option Matrice et spécifier le nombre de colonnes et de lignes voulu dans les zones de texte des options correspondantes. • Sélectionnez l’option Taille du bord afin de modifier l’épaisseur du séparateur sélectionné dans la fenêtre de document, puis spécifiez une valeur en pixels. • Pour masquer un bord vertical ou horizontal, sélectionnez l’option Taille du bord, puis saisissez la valeur 0 dans la zone de texte. Sélectionnez ensuite l’option Cadre du bord et choisissez Non dans le menu contextuel. (Cette action définit les attributs pour tous les navigateurs.) • Pour affecter une couleur à tous les bords du jeu de cadres, sélectionnez l’option Couleur du bord, cliquez sur la case échantillon, puis sélectionnez une couleur dans la palette de couleurs. Cette couleur remplace le gris affiché par défaut par la plupart des navigateurs Web. Remarque : Pour ajouter une couleur de fond à un cadre, vous devez sélectionner une couleur de fond pour la page que vous souhaitez afficher dans ce cadre. (Voir « Application d’images ou d’une couleur de fond à une page », page 49.) 5 Dans l’éditeur de mise en page, spécifiez un titre de page pour le document à cadres. (Voir « Modification du titre de la page », page 45.) 6 Enregistrez le document contenant le jeu de cadres. Veillez à utiliser l’extension .html (jeu_de_cadres.html, par exemple). Pour ajouter un autre cadre au jeu de cadres : Faites glisser l’icône de cadres du panneau Cadres cadres. de la palette Objets vers le jeu de Pour déplacer ou copier un cadre ou un jeu de cadres imbriqués : Pour déplacer un cadre ou un jeu de cadres imbriqués, cliquez dessus en maintenant la touche Maj enfoncée. Pour copier un cadre ou un jeu de cadres, faites-le glisser en maintenant la touche Ctrl (Windows) ou Option (Mac OS) enfoncée. Comment utiliser l'aide | Sommaire | Index Page précédente 95 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 96 Tandis que vous procédez à cette opération, vous remarquerez que l’orientation du cadre limite le sens du déplacement. Vous pouvez faire glisser les cadres verticaux latéralement et les cadres horizontaux verticalement, mais vous ne pouvez pas étendre un jeu de cadres en le faisant glisser au-delà de ses limites. Vous pouvez copier un jeu de cadres dans d’autres documents ou enregistrer une copie réutilisable du jeu de cadres en le faisant glisser vers le panneau Bibliothèque de la fenêtre de site ou de la palette Objets. (Voir « Utilisation des objets de bibliothèque », page 347.) Configuration de chaque cadre du jeu de cadres L’inspecteur de cadre permet de nommer chaque cadre et de le lier à une page Web. Vous pouvez utiliser le nom du cadre comme cible lorsque vous créez des liens pointant vers ce cadre sur d’autres pages, par exemple, afin de faire apparaître la page cible d’un lien dans le cadre. (Les noms attribués à chacun des cadres ne sont pas affichés dans la fenêtre du navigateur.) Vous pouvez également définir des barres de défilement pour chaque cadre et spécifier si la taille du cadre est fixe ou si elle s’ajuste automatiquement à la fenêtre du navigateur. Pour nommer un cadre du jeu de cadres : 1 Cliquez sur le cadre pour le sélectionner. 2 Dans l’inspecteur de cadre, saisissez un nom dans la zone de texte Nom. Pour lier un cadre à une page : Faites glisser la page de la fenêtre de site vers le cadre. Vous pouvez également sélectionner le cadre et spécifier la page dans la zone de texte d’URL de l’inspecteur de cadre. (Voir « Liaison des fichiers », page 55.) Remarque : Pour que le contenu d’un cadre change lorsqu’un internaute clique sur les liens d’une page affichée dans un autre cadre, le premier cadre doit être le cadre cible de chaque lien. (Voir « Définition des cadres cible », page 97.) Pour associer des barres de défilement à un cadre : Dans le menu Affichage de la barre de défilement de l’inspecteur de cadre, choisissez Oui, Non ou Automatique afin d’afficher ou de masquer les barres de défilement. L’option Automatique masque les barres de défilement si elles ne sont pas nécessaires et les affiche si tout le contenu ne tient pas dans le cadre. Pour définir la taille d’un cadre : Dans l’inspecteur de jeu de cadres, effectuez l’une des opérations suivantes : • Choisissez Variable dans le menu de taille si vous voulez que le cadre soit automatiquement ajusté à la fenêtre du navigateur. • Choisissez Pixels dans le menu de taille, puis saisissez la taille souhaitée en pixels si vous voulez que la taille du cadre soit fixe. Utilisez cette technique lorsqu’une image aux dimensions réduites connues figure dans un cadre. Remarque : Lorsque vous indiquez la taille absolue d’un cadre en pixels, vous devez définir la taille d’au moins un cadre doté de la même orientation (horizontale ou verticale) sur Variable, sinon le jeu de cadres redimensionne l’ensemble des cadres dans l’orientation du premier cadre. Comment utiliser l'aide | Sommaire | Index Page précédente 96 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Fonctions de mise en page Page précédente 97 Sélectionnez Pour cent dans le menu de taille afin de définir un taux fixe par rapport à la hauteur ou à la largeur totales du jeu de cadres. Définissez ensuite un pourcentage en saisissant une valeur dans la zone de texte de taille. Cet attribut permet de gérer la hauteur relative des cadres orientés horizontalement, ainsi que la largeur relative des cadres orientés verticalement. Pour redimensionner un cadre par glissement : • Cliquez au sein du cadre pour le sélectionner, puis redimensionnez la hauteur ou la largeur en faisant glisser son bord vertical ou horizontal. • Dans le menu de taille de l’inspecteur de cadre, choisissez Pixels ou Pour cent, puis faites glisser le bord du cadre pour le redimensionner. Pour définir le bord d’un cadre : Sélectionnez le bord vertical ou horizontal. Dans l’inspecteur de jeu de cadres, sélectionnez Cadre du bord, puis saisissez une valeur (en pixels) dans la zone de texte. Définition des cadres cible Lorsque vous définissez des liens de navigation pointant vers des pages affichées dans un jeu de cadres, vous devez spécifier chaque cadre cible en plus de l’URL de la page. Si, par exemple, vous utilisez un jeu de cadres afin d’afficher une table des matières dans un cadre et les pages liées à cette table des matières dans un autre cadre, chaque lien de la table des matières doit spécifier le cadre cible dans lequel la page liée doit s’afficher. Chaque lien de navigation spécifie à la fois la page cible (intro.html) et le cadre cible (corps). Pour définir le cadre cible des pages liées : 1 Ouvrez la page de contenu dans laquelle se trouvent les liens de navigation. (Vous pouvez cliquer deux fois sur l’icône de page dans le cadre pour ouvrir la page.) Pour plus de détails sur la création des liens de navigation, voir « Liaison des fichiers », page 55. Comment utiliser l'aide | Sommaire | Index Page précédente 97 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 98 2 Dans l’inspecteur de texte ou dans le panneau Liens de l’inspecteur d’image, spécifiez le cadre cible dans lequel la page liée doit s’afficher. Pour ce faire, choisissez une option dans le menu Cible : • Le nom d’un cadre spécifie la page liée se trouvant dans ce cadre. Les noms des cadres du jeu de cadres ouvert figurent dans la partie supérieure du menu. • Le paramètre _top affiche la page liée dans la fenêtre entière du navigateur Web en remplaçant complètement le jeu de cadres actif. • Le paramètre _parent affiche la page liée dans le parent du document actif. Si la page active ne possède pas de parent, le paramètre _self cible est utilisé. (Le parent constitue le jeu de cadres supérieur dans l’arborescence.) • Le paramètre _self affiche la page liée dans la fenêtre ou dans le cadre contenant le lien et remplace la page de navigation. • Le paramètre _blank affiche la page liée dans une nouvelle fenêtre sans titre. • Le paramètre Par défaut supprime toute cible déjà définie pour la page. Vous pouvez utiliser l’action Inclure dans un jeu pour empêcher les navigateurs d’afficher une page hors du jeu de cadres créé pour elle. Vous avez également la possibilité d’utiliser des actions visant à définir plusieurs cadres cible pour un seul lien. (Pour plus de détails sur les actions Inclure dans un jeu et Lier à deux cadres, voir « Utilisation d’actions GoLive », page 254) Prévisualisation du contenu d’un jeu de cadres Utilisez le panneau Aperçu (Windows) ou Aperçu du cadre (Mac OS) pour prévisualiser le contenu intégral du jeu de cadres dans la fenêtre de document. Il n’est pas possible de modifier le jeu de cadres ou d’ouvrir des pages liées en mode d’aperçu. (Pour ouvrir et modifier des pages liées, cliquez deux fois sur les icônes de page correspondantes dans l’éditeur de cadres.) Si vous utilisez GoLive sous Mac OS, vous pouvez également prévisualiser le contenu de cadres individuels dans l’éditeur de cadres à l’aide de l’inspecteur. Pour prévisualiser le contenu d’un cadre au sein du jeu de cadres, cliquez sur le bouton Aperçu du cadre dans l’inspecteur de cadre. Pour masquer le contenu, cliquez à nouveau sur le bouton. Les boutons Afficher l’aperçu du jeu et Ne plus afficher l’aperçu du jeu de l’inspecteur de jeu de cadres permettent de prévisualiser le contenu de tous les cadres. Remarque : GoLive pour Mac OS ne peut pas afficher d’aperçus d’URL externes. Vous devez pour cela utiliser un navigateur. Ajout d’éléments spéciaux à une page GoLive propose des éléments spéciaux à ajouter aux pages afin de répondre à des besoins spécifiques de mise en page. Vous pouvez également utiliser l’objet Routeur du navigateur du panneau SmartObjects de la palette Objets afin de donner aux navigateurs des instructions relatives à l’affichage de pages de remplacement. (Voir « Ajout de scripts de routage de navigateurs », page 54.) Comment utiliser l'aide | Sommaire | Index Page précédente 98 Aide d'Adobe GoLive Fonctions de mise en page Comment utiliser l'aide | Sommaire | Index Page précédente 99 Ajout de commentaires A mesure que vous mettez en page le contenu de vos pages Web, vous pouvez ajouter des commentaires relatifs à la conception. Les commentaires sont uniquement affichés dans GoLive (dans l’inspecteur de commentaire et dans le code source) ou dans d’autres éditeurs HTML, et n’apparaissent pas dans les pages affichées dans des navigateurs Web. Vous pouvez également ajouter des commentaires aux sections d’en-tête des pages. (Voir « Ajout d’éléments ou de scripts dans la section d’en-tête », page 51.) Pour ajouter des commentaires à une page : 1 Faites glisser l’icône Commentaire du panneau Standard de la palette Objets vers l’emplacement voulu sur la page ou cliquez deux fois sur cette icône pour l’ajouter au point d’insertion. Le symbole s’affiche au sein du texte afin d’indiquer l’emplacement du commentaire. 2 Saisissez votre commentaire dans l’inspecteur de commentaire. Ajout d’un marquage de date et d’heure Vous pouvez afficher l’heure et la date du dernier enregistrement de la page afin, par exemple, d’informer les internautes de la date de sa dernière mise à jour. GoLive lit la date ou l’heure en cours sur l’horloge intégrée de votre ordinateur, puis l’écrit dans une balise personnalisée. Il met ensuite à jour ces informations de façon dynamique à chaque enregistrement de la page. Pour ajouter un marquage d’heure et de date à votre page : 1 Si vous souhaitez ajouter un texte descriptif avant la date et l’heure (par exemple, « Dernière révision : »), saisissez-le dans la page. 2 Faites glisser l’icône Date de modification du panneau SmartObjects de la palette Objets vers la page ou cliquez deux fois sur l’icône pour l’ajouter au point d’insertion. 3 Dans l’inspecteur de date de modification, choisissez un pays dans le menu Format, puis sélectionnez un format de date et d’heure dans la liste des options spécifiques au pays sélectionné. Ajout de menus déroulants d’URL Si une page comporte plusieurs liens hypertexte, ces liens peuvent être affichés dans un menu contextuel, à partir duquel il est possible de les sélectionner. Pour pouvoir tester les liens du menu, la page doit être prévisualisée dans un navigateur Web. Pour ajouter un menu déroulant d’URL à votre page : 1 Faites glisser l’icône Menu déroulant d’URL du panneau SmartObjects de la palette Objet vers votre page. A B Vous pouvez modifier le libellé Choisir situé dans le haut du menu ou le laisser en blanc. A. Menu déroulant d’URL sur la page B. Icône Menu déroulant d’URL dans la palette Objets Comment utiliser l'aide | Sommaire | Index Page précédente 99 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 100 2 Dans l’inspecteur Menu déroulant d’URL, effectuez les opérations suivantes : • Dans la zone de texte Libellé, saisissez un nouveau libellé à afficher dans le haut du nouveau menu déroulant. Vous pouvez également laisser ce libellé en blanc. • Pour ajouter un URL à un nouveau menu déroulant, cliquez sur le bouton Nouvel élément . Saisissez un nouveau libellé pour cet URL dans la zone de texte URL, puis spécifiez la cible du lien dans la zone de texte d’URL. (Voir « Liaison des fichiers », page 55.) Si vous utilisez un jeu de cadres, spécifiez le cadre cible de l’URL dans la zone de texte Cible. (Voir « Utilisation de cadres », page 92.) Vous pouvez également cliquer sur le bouton Dupliquer les éléments sélectionnés pour créer une copie de l’URL figurant déjà dans le menu déroulant, puis modifier le libellé ou l’URL dans les zones de texte Libellé, URL ou Cible. • Pour déplacer un élément vers le haut ou vers le bas de la liste, sélectionnez-le, puis cliquez sur les flèches vers le haut ou vers le bas. • Pour supprimer un élément de la liste, sélectionnez-le, puis cliquez sur Supprimer les éléments sélectionnés . Pour plus de détails sur la création des liens hypertexte, voir « Création de liens hypertexte », page 121. 3 Prévisualisez le menu déroulant d’URL et chaque lien dans un navigateur Web. (Voir « Prévisualisation des fichiers », page 63.) Ajout de lignes horizontales Vous avez la possibilité d’ajouter des lignes horizontales (également appelées règles) pour séparer visuellement des blocs de texte. Ces lignes horizontales peuvent être placées dans des zones de texte, mais il n’est pas possible de les ajouter directement à une grille de mise en page. Pour ajouter une ligne horizontale dans une zone de texte : 1 Faites glisser l’icône Ligne du panneau Standard de la palette Objets vers une zone de texte ou cliquez deux fois sur cette icône pour l’insérer au point spécifié dans le texte. (Les lignes horizontales ne doivent jamais être placées directement sur une grille de mise en page, mais doivent être insérées dans une zone de texte.) 2 Dans l’inspecteur de ligne, effectuez l’une des opérations suivantes : • Cliquez sur un des boutons de style : le bouton de gauche permet d’appliquer un style plein et celui de droite un style en relief. • Choisissez une mesure dans le menu Largeur. Avec les options Totale et Pour cent, les mesures sont réalisées par rapport aux conteneurs (tels qu’une zone de texte, une cellule de tableau ou la fenêtre de document). • Dans la zone de texte Hauteur, saisissez une nouvelle hauteur de ligne (en pixels). Vous pouvez également sélectionner la ligne et faire glisser sa poignée afin d’ajuster la hauteur. • Cliquez sur un bouton pour aligner la ligne par rapport à la zone de texte, à la grille de mise en page ou à la fenêtre de document. (Ces boutons apparaissent en grisé si vous avez choisi Totale pour la largeur de la ligne.) Comment utiliser l'aide | Sommaire | Index Page précédente 100 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 101 Ajout d’espacements ou d’images GIF transparentes Les espacements sont des éléments Netscape utilisés pour créer des espaces horizontaux entre un texte et des objets. Ces espacements étant ignorés par les navigateurs Internet Explorer, il est recommandé de créer des espaces dans une page à l’aide d’images GIF transparentes. (Aucune de ces deux méthodes n’est nécessaire si vous utilisez une grille de mise en page.) Les images GIF transparentes sont peu volumineuses et peuvent être rapidement téléchargées. Il est en outre possible de les redimensionner de façon à remplir l’espace disponible. Vous pouvez également créer des espaces insécables dans le texte. Pour effectuer un espacement à l’aide d’une image GIF transparente : 1 Créez une petite image GIF transparente (1x1 pixel) dans votre logiciel d’édition d’images, puis faites-la glisser dans le panneau Fichiers de la fenêtre de site. 2 Faites glisser l’image GIF transparente de la fenêtre de site vers l’emplacement voulu dans le texte. (Voir « Spécification de l’URL cible d’un lien », page 57.) 3 Dans la fenêtre de document, redimensionnez l’image en faisant glisser ses poignées de sélection ou à l’aide de l’inspecteur d’image. Vous pouvez également utiliser l’inspecteur d’image pour aligner l’image transparente horizontalement et verticalement dans le texte. Si vous avez des difficultés à sélectionner l’image sur la page, cliquez sur la balise <img> dans la barre d’arborescence des balises situé dans le bas de la fenêtre de document. (Voir « Déplacement, alignement et répartition des objets », page 78.) Vous pouvez enregistrer l’image GIF transparente redimensionnée en vue de sa réutilisation dans d’autres pages. Pour ce faire, faites-la glisser vers le panneau Bibliothèque de la fenêtre de site. (Voir « Utilisation des objets de bibliothèque », page 347.) Pour créer un espace insécable : Appuyez sur la barre d’espacement en maintenant la touche Maj (Windows) ou Option (Mac OS) enfoncée. Pour utiliser un élément d’espacement insécable : 1 Faites glisser l’icône Espacement horizontal du panneau Standard de la palette Objets vers l’emplacement voulu dans le texte. 2 Dans l’inspecteur d’espacement, sélectionnez l’option de redimensionnement Horizontal, Vertical ou Bidirectionnel. (L’option Bidirectionnel permet de redimensionner l’espacement à la fois horizontalement et verticalement). 3 Sélectionnez l’espacement à redimensionner et faites glisser ses poignées. 4 Pour aligner un bloc d’espacement bidirectionnel sur un texte, sélectionnez-le, puis choisissez une option dans le menu Alignement de l’inspecteur d’espacement. Remarque : Les espacements sont basés sur un élément spécifique de Netscape reconnu par les versions 3.0 et ultérieures de Netscape Navigator. En revanche, ils ne sont pas pris en compte par Microsoft Internet Explorer. Comment utiliser l'aide | Sommaire | Index Page précédente 101 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Fonctions de mise en page Page précédente 102 Ajout de banderoles animées Les banderoles de texte animées sont uniquement prises en charge par les navigateurs Internet Explorer. (Le texte ne défile pas dans les navigateurs Netscape.) Pour créer un message défilant sur une page Web dans les deux types de navigateurs, utilisez plutôt une animation SWF, un applet Java ou une image GIF animée. Vous pouvez également créer un effet similaire à l’aide de boîtes flottantes associées à l’action Créer un fondu. (Pour plus de détails sur l’action Créer un fondu, voir « Masquage et affichage des boîtes flottantes », page 88.) (Voir « Utilisation d’actions GoLive », page 254) Pour créer une banderole animée : 1 Faites glisser l’icône Banderole du panneau Standard de la palette Objets dans la page. Si vous souhaitez définir la police et le style du texte de la banderole dans une grille de mise en page, placez la banderole dans une zone de texte. 2 Dans la zone Texte de l’inspecteur de la banderole, saisissez le message de la banderole. 3 Choisissez l’une des options suivantes dans le menu contextuel Mouvement : • Défilement pour que la banderole défile de façon continue. • Glissement pour afficher et conserver le message dans la zone de texte de la banderole. • Va-et-vient pour afficher le message dans la zone de texte de la banderole et le faire rebondir dans la zone de texte. 4 Déterminez la durée d’affichage de la banderole : • Sélectionnez Infini pour que le message défile continuellement. • Entrez une valeur correspondant au nombre de répétitions dans la zone de texte Boucle(s). 5 Saisissez la vitesse de défilement dans la zone de texte Vitesse (la vitesse de défilement, en pixels, correspond à la durée, en millisecondes, qui s’écoule entre chaque défilement). 6 Saisissez la fréquence de défilement dans la zone de texte Fréquence. 7 Sélectionnez Gauche ou Droite en fonction de la direction de défilement souhaitée. Lorsque Gauche est sélectionné, le message s’affiche sur le côté droit de la fenêtre et défile vers la gauche. 8 Activez le panneau Avancé dans l’inspecteur de banderole, puis effectuez l’une des opérations suivantes : • Spécifiez la largeur et la hauteur (en pixels ou en pourcentage) de la banderole dans les zones de texte correspondantes. • Entrez une valeur dans la zone de texte Esp. horiz. ou Esp. vert. afin de définir l’espacement horizontal ou vertical autour du texte de la banderole. • Dans le menu d’alignement, choisissez un alignement pour l’objet de la banderole par rapport au texte ou aux autres objets de la ligne de texte. • Cliquez sur la case échantillon et sélectionnez une couleur dans la palette des couleurs à utiliser comme fond pour la banderole. Remarque : La fonction de banderole animée est constituée d’une extension Internet Explorer et ne fonctionne pas dans les navigateurs Netscape. Comment utiliser l'aide | Sommaire | Index Page précédente 102 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 103 Formatage du texte A propos du formatage de texte HTML Le texte ajouté à une page Web est en premier lieu inséré dans un paragraphe HTML simple. Vous pouvez améliorer la présentation et la lisibilité de ce texte en le divisant en sections et en ajoutant des en-têtes HTML. Vous pouvez modifier la mise en forme et la couleur des éléments de structure (et des mots qui les composent) à l’aide de feuilles de style en cascade ou d’attributs de formatage HTML. Il est également possible de formater une partie du texte en liens hypertexte renvoyant à des ancres placées sur cette page ou sur d’autres. (Voir « Création de liens hypertexte », page 121.) GoLive permet de formater le contenu textuel des pages Web de trois manières différentes. Utilisation de feuilles de style en cascade Les feuilles de style en cascade permettent de définir en une seule fois des attributs de formatage qui seront réutilisés par les navigateurs Web à chaque fois qu’une page y fait référence. (Cette méthode permet de limiter le code source contenu dans les pages et ainsi de réduire le temps de téléchargement de chacune d’elles.) Les feuilles de style offrent un contrôle accru de la mise en forme par rapport à l’utilisation simple du code HTML. Vous pouvez ainsi gérer les couleurs, la typographie, l’alignement, le positionnement dans la page, les polices, les bordures, etc. Elles facilitent également la mise à jour de la mise en forme : lorsque vous modifiez un style de la feuille de style, les modifications s’appliquent automatiquement à toutes les pages contenant du texte faisant référence à ce style. (Voir « Utilisation de feuilles de style en cascade », page 134.) Application ponctuelle d’attributs de texte HTML Le menu Texte et la barre d’outils permettent d’appliquer au texte des attributs de formatage et de structure HTML. Les attributs accessibles via la barre d’outils permettent de définir les en-têtes, les caractères en gras, italique et télétype, l’alignement, la taille et la couleur du texte, ainsi que les listes numérotées et à puces. Outre ces mêmes options, le menu Texte offre des commandes de création et de définition de jeux de polices. Les menus contextuels permettent d’appliquer rapidement ces attributs de formatage. (Voir « Utilisation des menus contextuels », page 34.) Comment utiliser l'aide | Sommaire | Index Page précédente 103 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 104 Utilisation de la palette Styles HTML Les attributs de formatage de texte HTML appliqués individuellement à des éléments de texte de vos pages peuvent être enregistrés (ou capturés) collectivement au sein de la palette Styles HTML. Vous pouvez ainsi réutiliser la palette pour appliquer instantanément ce groupe d’attributs à du texte situé ailleurs. La palette contient plusieurs styles prédéfinis pour vous donner un aperçu des types de styles que vous pouvez créer. Pour enregistrer un style dans la palette Styles HTML, vous pouvez capturer les attributs d’un texte formaté ou sélectionner les attributs souhaités dans la boîte de dialogue Nouveau style. Contrairement aux styles CSS, les styles HTML ne sont pas liés au texte, de sorte que la modification d’un style n’affecte pas les éléments de texte formatés à l’aide de ce style. Vous pouvez conserver des jeux de styles hors de la palette Styles HTML et les importer dans la palette lorsque vous en avez besoin. Enregistrez, par exemple, un jeu d’en-têtes HTML et d’attributs de structure du texte de base. Vous pouvez ensuite utiliser la palette Styles HTML pour les appliquer rapidement à du texte, puis faire appel aux feuilles de style en cascade pour les modifier et les améliorer. Utilisation conjointe d’attributs de texte HTML et de feuilles de style en cascade Le chargement de pages dotées de feuilles de style en cascade dans la fenêtre du navigateur est beaucoup plus rapide que celui de pages formatées individuellement à l’aide d’attributs HTML. Les CSS ne sont toutefois pas prises en charge par les navigateurs les plus anciens. Pour remédier à cela, formatez d’abord votre texte à l’aide d’éléments de structure et d’attributs HTML de manière à soigner l’aspect de vos pages lorsqu’elles sont affichées dans des navigateurs anciens qui ne prennent pas en charge les CSS. Utilisez des feuilles de style en complément de la structure HTML de base pour obtenir un excellent résultat dans des navigateurs prenant en charge les CSS. Parmi les éléments de structure HTML fonctionnant particulièrement bien avec les feuilles de style en cascade, on compte les en-têtes (l’élément h1, par exemple), les blocs (pour la création de retraits de blocs) et les listes (numérotées ou à puces). Cependant, certains attributs de formatage de texte HTML, tels que l’élément de police, sont un facteur de problème avec les navigateurs essayant d’interpréter des feuilles de styles. Le cas échéant, mieux vaut utiliser les feuilles de style en cascade que ces attributs. (Voir « Définition de la police, du corps de police et de la couleur du texte », page 113.) Pour éviter les problèmes liés aux navigateurs, vous pouvez ajouter un script de routage de navigateur à vos pages afin de rediriger les navigateurs vers des pages de substitution formatées exclusivement à l’aide d’attributs HTML ou de CSS. (Voir « Ajout de scripts de routage de navigateurs », page 54.) Ajout de texte à des pages Web Vous pouvez saisir du texte directement dans la fenêtre du document, copier du texte dans une autre application pour le coller dans la page ou importer du texte dans un tableau de la page à partir d’un autre programme. Vous pouvez également insérer du texte sur la page en utilisant des zones de texte sur une grille de mise en page et des boîtes flottantes, ce qui facilite la réorganisation du texte par simple déplacement ou alignement des boîtes. Comment utiliser l'aide | Sommaire | Index Page précédente 104 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 105 Par défaut, lorsque vous sélectionnez un paragraphe de texte entier à l’aide de la souris, GoLive ne sélectionne pas les balises ouvrante et fermante (<p> et </p>, par exemple). Par conséquent, si vous copiez et collez le paragraphe sélectionné dans la page, le texte ne devient pas un nouveau paragraphe. Utilisez la barre d’arborescence des balises du panneau Mise en page pour sélectionner rapidement les balises appropriées. Pour ajouter directement du texte à une page ou à un élément conteneur : 1 Cliquez dans la page, la zone de texte, la cellule de tableau ou la boîte flottante afin d’y placer le point d’insertion. (Pour ajouter du texte à une grille, vous devez utiliser une zone de texte. Voir « Ajout de contenu à la grille de mise en page », page 76.) 2 Tapez le texte ou choisissez Edition > Coller pour insérer du texte préalablement copié. Vous pouvez aussi faire glisser vers la fenêtre du document soit du texte sélectionné dans une autre page, soit l’un des éléments de construction situés dans la palette Objets. (Voir « Utilisation des objets de bibliothèque », page 347 et « Utilisation de composants », page 345.) Pour importer du texte délimité par tabulation dans un tableau : 1 Sélectionnez le tableau dans la page. 2 Dans l’inspecteur du tableau, cliquez sur Importer, sélectionnez le fichier texte contenant les lignes et colonnes de texte délimitées par des tabulations, puis cliquez sur Ouvrir. GoLive place le texte dans des cellules de tableau en fonction du nombre de marques de tabulation (définissant les colonnes) et de paragraphe (définissant les lignes) présents dans le texte. (Voir « Ajout de texte à des tableaux », page 174.) Cette fonction est particulièrement pratique pour insérer rapidement dans un tableau des données ayant été exportées d’une base de données ou d’une feuille de calcul sous forme de fichier texte délimité par tabulation. Pour coller du texte délimité par tabulation dans un tableau : 1 Copiez le texte délimité par tabulation ou le contenu de cellules d’une feuille de calcul dans le presse-papiers. Il est possible de copier des feuilles de calcul Excel ou des tableaux Microsoft Word dans d’autres programmes de traitement de texte. 2 Ajoutez un tableau en faisant glisser l’icône Tableau du panneau Standard de la palette Objets dans la page. (Peu importe le nombre de lignes et de colonnes du tableau.) 3 Sélectionnez un tableau sur votre page, puis une ligne ou une colonne de ce tableau, ou bien utilisez la palette Tableau pour sélectionner une cellule. (Cliquez dans une cellule de tableau uniquement si vous souhaitez y coller du texte.) 4 Choisissez Edition > Coller. GoLive remplit automatiquement les cellules du tableau avec le texte délimité par tabulation et crée de nouvelles lignes et colonnes en fonction de ce texte. Pour copier du texte : Dans le panneau Mise en page, sélectionnez le texte à copier, puis choisissez Edition > Copier. Vous pouvez également maintenir la touche Ctrl (Windows) ou Option (Mac OS) enfoncée pendant que vous faites glisser le texte sélectionné afin de le copier au nouvel emplacement. Comment utiliser l'aide | Sommaire | Index Page précédente 105 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 106 Pour copier un paragraphe avec les balises (<p> et </p>) : 1 Cliquez à l’intérieur du paragraphe que vous souhaitez copier. 2 Cliquez sur les balises (<p>, <h1>, etc.) dans la barre d’arborescence des balises au bas de la fenêtre du document. Cliquez sur une balise dans la barre d’arborescence des balises pour sélectionner l’élément entier. 3 Choisissez Edition > Copier. Formatage des paragraphes GoLive offre un éventail de méthodes pour structurer les paragraphes contenant du texte. Vous pouvez créer des en-têtes principaux et secondaires, aligner ou décaler les paragraphes par rapport aux marges de gauche et de droite, ou créer des listes de paragraphes numérotées ou à puces. Vous avez également la possibilité de gérer le flux de texte dans les paragraphes, en supprimant les retours à la ligne pour afficher le texte sur une seule ligne ou en ajoutant un saut de ligne pour définir comment il contourne un objet adjacent. Une fois les paragraphes structurés, utilisez les feuilles de style en cascade pour terminer le formatage. (Voir « Utilisation de feuilles de style en cascade », page 134.) Utilisation de formats de paragraphes HTML Pour structurer votre texte, utilisez l’un des formats de paragraphe HTML suivants : • Utilisez les options d’en-tête pour remplacer la balise <p> par l’une des six balises d’entête HTML : <h1>, <h2>, <h3>, <h4>, <h5> ou <h6>. La plupart des navigateurs affichent les en-têtes selon des corps de police décroissants, <h1> correspondant à la plus grande taille et <h6> à la plus petite. • Sélectionnez l’option Adresse pour affecter la balise <address> à un paragraphe contenant l’adresse électronique de l’auteur. • Sélectionnez l’option Préformaté pour préserver l’intégrité des espacements de caractères et de lignes d’un paragraphe. Cette option est pratique pour aligner uniformément des nombres dans une colonne ou présenter le code source avec l’espacement approprié. Les navigateurs affichent le texte à l’intérieur des balises <pre> et </pre> dans une police à espacement fixe. • Sélectionnez l’option Paragraphe pour appliquer le formatage défini par défaut dans les préférences du navigateur. Comment utiliser l'aide | Sommaire | Index Page précédente 106 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Formatage du texte Page précédente 107 Sélectionnez l’option Aucun pour supprimer les balises <p> et </p> d’une section de texte. Tous les formats de paragraphe sont compatibles avec les feuilles de style en cascade. (Voir « Création de styles d’élément HTML », page 139.) Pour annuler le formatage d’un paragraphe (la sélection de l’option Adresse, par exemple), vous pouvez utiliser non seulement la palette Historique et la commande d’annulation du menu Edition mais aussi la palette Styles HTML. L’option Effacer les styles de paragraphe du menu de cette palette permet d’annuler tous les styles appliqués à un paragraphe. (Voir « Application et suppression de styles HTML », page 120.) Pour formater un paragraphe (options En-tête, Adresse ou Préformaté) : 1 Cliquez à l’intérieur du paragraphe que vous souhaitez formater. 2 Choisissez le format souhaité via le menu Texte > Format du paragraphe ou le menu Paragraphe de la barre d’outils. Lorsque vous définissez les feuilles de style en cascade à appliquer à vos pages, faites glisser les paragraphes formatés dans la palette Styles HTML de manière à pouvoir appliquer rapidement des en-têtes ou d’autres éléments de structure de paragraphe à d’autres sections de texte. (Voir « Enregistrement de styles HTML », page 117.) Pour rétablir le format par défaut sélectionné dans les préférences du navigateur : Choisissez Texte > Format du paragraphe > Paragraphe. Pour supprimer les balises <p> et </p> du paragraphe sélectionné : Choisissez Texte > Format du paragraphe > Aucun. Formatage des listes Vous avez la possibilité de formater des paragraphes sous la forme de listes numérotées, de listes à puces ou de listes de définitions, et d’appliquer une structure aux listes que vous créez. Les options de liste incluent des chiffres arabes, chiffres romains, lettres de l’alphabet ainsi que différents types de puces. Pour les listes de définitions (ou glossaire), vous pouvez également formater les paragraphes comme le terme ou comme la définition du terme. Si vous utilisez des feuilles de style en cascade, appliquez tout d’abord un format de liste par défaut (via le menu Texte > Liste) aux paragraphes de texte et utilisez ensuite une feuille de style pour affiner les puces ou la numérotation. (Voir « Création de styles d’élément HTML », page 139.) Pour formater des paragraphes sous la forme de listes : 1 Sélectionnez le paragraphe que vous souhaitez formater. 2 Choisissez une option de liste dans le menu Texte > Liste ou dans le menu contextuel. Vous pouvez également cliquer sur le bouton Liste numérotée ou Liste à puces dans la barre d’outils. Comment utiliser l'aide | Sommaire | Index Page précédente 107 Aide d'Adobe GoLive Formatage du texte Comment utiliser l'aide | Sommaire | Index Page précédente 108 Pour définir une hiérarchie au sein d’une liste : 1 Sélectionnez l’un des paragraphes de la liste. 2 Choisissez Ajouter un niveau ou Réduire d’un niveau dans le menu Texte > Liste. Vous pouvez également utiliser le menu contextuel ou les boutons de la barre d’outils. Lorsque vous appliquez l’option Réduire d’un niveau au premier paragraphe de la hiérarchie, celui-ci reprend le style normal. 3 Choisissez une option de liste dans le menu Texte > Liste pour modifier le caractère de numérotation affecté au paragraphe. Alignement d’un paragraphe ou application d’un retrait Vous pouvez aligner un paragraphe sur les bords gauche ou droite, ou sur le centre d’une page ou d’un élément conteneur (tel qu’une zone de texte). Vous pouvez également utiliser une balise <blockquote> pour décaler le paragraphe par rapport aux marges de gauche et de droite sans affecter son alignement. Si vous utilisez des feuilles de style en cascade, assurez-vous que le type d’alignement défini correspond à celui du style CSS. Vous avez la possibilité d’aligner, ou d’habiller, le texte autour d’images ou d’autres objets sur la page ou à l’intérieur d’une zone de texte, d’une cellule de tableau ou d’une boîte flottante. (Voir « Déplacement, alignement et répartition des objets », page 78.) Pour aligner un paragraphe ou lui appliquer un retrait : 1 Cliquez à l’intérieur du paragraphe que vous souhaitez aligner ou mettre en retrait. 2 Effectuez l’une des opérations suivantes : • Choisissez Texte > Alignement et sélectionnez une option d’alignement dans le menu. L’option Par défaut permet de supprimer tout alignement existant du paragraphe sélectionné. • Cliquez sur le bouton Aligné à gauche d’outils. • Pour augmenter et réduire par incréments l’espace entre le paragraphe et ses marges de droite et de gauche, choisissez Augmenter le retrait du bloc et Réduire le retrait du bloc dans le menu Texte > Alignement. • Choisissez une option d’alignement ou de retrait dans le menu contextuel. , Centré ou Aligné à droite de la barre Alignement d’images ou d’objets sur le texte Vous pouvez formater vos paragraphes de texte de telle sorte qu’ils habillent les images ou autres objets, ou créer des effets de titre ou de légende en alignant l’image ou l’objet sur le texte. Il est également possible d’utiliser les sauts de lignes pour contrôler la manière dont le texte contourne l’image ou l’objet. (Voir « Contrôle du déroulement du texte sur une page », page 109.) Pour habiller de texte une image ou un objet : 1 Placez une image ou un objet au début ou à l’intérieur d’une ligne de texte. 2 Sélectionnez l’image ou l’objet et choisissez Gauche ou Droite dans le menu Alignement de l’inspecteur. Comment utiliser l'aide | Sommaire | Index Page précédente 108 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 109 3 Faites glisser l’image ou l’objet vers le haut ou vers le bas, jusqu’à ce que vous soyez satisfait de son emplacement au sein du paragraphe. Lorsque vous habillez de texte vos images et objets, gardez à l’esprit que l’aspect final de la page peut varier en fonction des préférences du navigateur et de la plate-forme de l’internaute. (Voir « Affichage des corps de polices sur les différentes plates-formes », page 116 et « Prévisualisation des fichiers », page 63.) Pour visualiser les profils de mise en page des différentes plates-formes, utilisez la palette Affichage. (Voir « Définition des options d’affichage de mise en page », page 48.) Pour modifier l’alignement d’une image ou d’un objet à l’intérieur d’une ligne de texte : Sélectionnez l’objet et choisissez l’une des options suivantes dans le menu Alignement de l’inspecteur : • L’option Par défaut aligne l’objet sur la ligne de base du texte, sur les objets adjacents au sein de cette ligne, ou sur le bord gauche de la fenêtre du document ou de l’élément conteneur. • Les options Haut, Milieu ou Bas alignent la partie supérieure, centrale ou inférieure de l’objet sur le haut, le centre, ou le bas de la ligne de base du texte ou sur des objets adjacents situés sur la ligne. • Les options Gauche ou Droite alignent le côté gauche ou droit de l’objet sur le bord gauche ou droit de la ligne, de la fenêtre du document ou de l’élément conteneur. Tout texte situé à l’intérieur de la ligne se déplace vers la gauche de l’objet. Si la ligne ne renferme aucun autre objet ou texte, l’objet est aligné sur le bord gauche ou droit de la fenêtre ou de l’élément conteneur. • L’option Haut du texte aligne la partie supérieure de l’objet sur le haut du texte (c’est-àdire, sur l’extrémité supérieure de la hampe des caractères) de la ligne. • Les options Milieu absolu, Ligne de base et Bas absolu alignent les parties centrale et inférieure de l’objet sur le milieu absolu (point central séparant le haut du bas), sur la ligne de base du texte ou sur le bas absolu (c’est-à-dire, sur l’extrémité inférieure du jambage des caractères) du texte ou des objets de la ligne. Contrôle du déroulement du texte sur une page Vous pouvez contrôler la manière dont le texte se déroule en insérant des sauts de ligne (<br>) ou des éléments insécables (<nobr>) à la fin des lignes d’un paragraphe. Par exemple, vous insérerez un saut de ligne pour forcer les navigateurs à renvoyer le texte à la ligne après un mot spécifique et opterez pour un élément insécable si vous souhaitez coller deux mots ensemble et vous assurer qu’ils ne seront jamais séparés. La taille de la fenêtre des navigateurs n’a aucune incidence sur le fonctionnement de ces éléments. Vous pouvez utiliser l’attribut Effacer conjointement avec un saut de ligne afin d’effacer une image à l’aide d’une ligne rompue dans un flux de texte. En outre, les sauts de ligne vous permettent de contrôler l’espacement entre les paragraphes, plutôt que de laisser aux navigateurs Web le soin de s’en charger. Pour insérer un élément insécable : 1 Sélectionnez les mots que vous souhaitez afficher sur une même ligne. 2 Choisissez Texte > Supprimer les sauts de ligne. Comment utiliser l'aide | Sommaire | Index Page précédente 109 Aide d'Adobe GoLive Formatage du texte Comment utiliser l'aide | Sommaire | Index Page précédente 110 Pour insérer un saut de ligne : Effectuez l’une des opérations suivantes : • Cliquez à l’intérieur de la ligne et appuyez sur les touches Maj + Entrée ou Maj + Retour. • Faites glisser l’icône Saut de ligne du panneau Standard de la palette Objets vers la ligne ou cliquez deux fois sur l’icône pour la placer au point d’insertion. A B Le retour à la ligne s’effectue à l’emplacement défini, quelle que soit la taille de la fenêtre. A. Marqueur de saut de ligne B. Icône Saut de ligne Pour définir la césure du texte situé après un objet sur la ligne : 1 Sélectionnez le marqueur de saut de ligne. 2 Dans l’inspecteur du saut de ligne, cochez la case Effacer et choisissez une option dans le menu contextuel : • L’option Tout permet de déplacer le texte suivant le saut de ligne au-dessous de tout objet situé sur la ligne. • L’option Gauche permet de déplacer le texte suivant le saut de ligne au-dessous d’un objet aligné à gauche. • L’option Droite permet de déplacer le texte suivant le saut de ligne au-dessous d’un objet aligné à droite. Remarque : Lorsque vous habillez de texte un objet situé à l’intérieur d’une boîte flottante, l’objet en question doit être aligné à gauche ou à droite pour que l’attribut Effacer fournisse le résultat escompté dans un flux de texte HTML. Formatage des caractères Vous pouvez appliquer à du texte en ligne des attributs HTML physiques et structurels sans affecter le reste du paragraphe. Utilisez ces attributs conjointement avec des feuilles de style en cascade pour une mise en forme encore plus soignée du texte. (Voir « Création d’une feuille de style », page 137.) Application d’attributs HTML physiques à du texte en ligne Les attributs de texte physiques vous permettent de définir le style du texte sélectionné, sans faire appel aux méthodes de classification structurelles qui consistent à mettre le texte en italique pour le faire ressortir ou en gras pour l’accentuer. Ces attributs (italique et gras) sont interprétés de la même manière par tous les navigateurs Web. (Pour plus de détails sur l’utilisation de styles CSS pour appliquer ces attributs, voir « Définition des propriétés de police », page 144.) Comment utiliser l'aide | Sommaire | Index Page précédente 110 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 111 Les attributs de texte physiques sont les suivants : • L’option Normal correspond au format standard utilisé pour le texte HTML. Les attributs de feuilles de style sont prioritaires sur ce format. • L’option Italique indique au navigateur qu’il doit utiliser une police italique ou oblique. Si cette police n’est pas disponible, les fonctions de mise en évidence, de vidéo inverse et de soulignement peuvent être utilisées. • L’option Gras indique au navigateur qu’il doit utiliser une police en gras. Si cette police n’est pas disponible, les navigateurs peuvent utiliser les fonctions de vidéo inverse et de soulignement. • L’option Souligné indique au navigateur qu’il doit souligner les textes, les espaces et la ponctuation. (Cet attribut est susceptible de disparaître des versions suivantes de HTML.) • L’option Barré indique au navigateur qu’il doit barrer le texte d’une ligne. (Cet attribut est susceptible de disparaître des versions suivantes de HTML.) • L’option Exposant permet d’afficher le texte légèrement plus haut que le reste du texte. • L’option Indice permet d’afficher le texte légèrement plus bas que le reste du texte. • L’option Télétype (tt) indique au navigateur qu’il doit afficher le texte dans une police à espacement fixe. • L’option Clignotant est une extension de Netscape qui permet d’inverser les couleurs de premier plan et d’arrière-plan du texte afin de produire un effet clignotant. Remarque : Il se peut que certaines versions plus anciennes des navigateurs ne prennent en charge que les attributs physiques de base, tels que normal, gras et italique. Pour appliquer un attribut de texte HTML physique : 1 Effectuez l’une des opérations suivantes : • Sélectionnez le texte que vous souhaitez formater. Ensuite, choisissez une option dans le menu Texte > Style, cliquez sur le bouton Gras , Italique ou Télétype dans la barre d’outils, ou sélectionnez une option dans le menu contextuel Style. • Choisissez une option dans le menu Texte > Style et saisissez votre texte. Le style défini reste en vigueur après que la touche Entrée ou Retour a été enfoncée. Remarque : Le texte formaté à l’aide de l’attribut Clignotant est uniquement compatible avec les navigateurs Netscape Navigator. Pour supprimer du texte sélectionné tous les attributs HTML physiques : Choisissez Texte > Style > Normal. Application d’attributs HTML structurels à du texte en ligne Les attributs de texte structurels (également appelés styles de contenu HTML) vous permettent de distribuer le texte sélectionné par catégories en fonction de l’effet souhaité (distinction, accentuation, etc.). L’interprétation de ces attributs varie ensuite d’un navigateur Web à l’autre, selon les préférences de l’internaute. Par exemple, la restitution de l’attribut Distinction pourra s’effectuer, sur différents navigateurs, à l’aide d’une police italique, d’une police en gras, voire de la lecture d’un son sur le navigateur d’un internaute malvoyant. Comment utiliser l'aide | Sommaire | Index Page précédente 111 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 112 L’utilisation de styles CSS dans vos feuilles de style vous permet de concevoir des attributs structurels. Par exemple, pour faire ressortir un mot, vous utiliserez dans un premier temps un élément Distinction afin d’appliquer la structure HTML au texte, puis un style CSS pour définir son aspect (corps de police élevé et en gras). (Voir « Création de styles d’élément HTML », page 139.) • L’attribut Distinction est utilisé le plus fréquemment pour ressortir un texte. La plupart des navigateurs le restituent à l’aide d’une police en italique. • L’attribut Accentuation est utilisé pour accentuer fortement le texte. La plupart des navigateurs le restituent à l’aide d’une police en gras. • L’attribut Citation permet d’identifier le texte sélectionné comme un contenu provenant d’une source externe. La plupart des navigateurs affichent les citations en italique et dans un corps de police réduit. • L’attribut Exemple permet d’identifier une série de caractères hors de leur contexte normal. La plupart des navigateurs affichent les exemples dans une police à espacement fixe. • L’attribut Définition (dfn) permet de définir certains termes ou expressions et facilite la création d’une page d’index ou d’un glossaire. La plupart des navigateurs affichent les définitions dans un style de texte normal. • L’attribut Variable (var) est généralement utilisé conjointement avec l’attribut Code pour représenter les noms de variables ou les valeurs définies par l’utilisateur à l’intérieur d’un code. La plupart des navigateurs affichent les variables dans une police italique à espacement fixe. • L’attribut Code est généralement utilisé pour du texte à contenu informatique, tel que du code source. La plupart des navigateurs affichent le code dans une police télétype à espacement fixe, telle que Courier. • L’attribut Clavier (kbd) permet d’identifier le texte sélectionné comme des données devant être saisies au clavier. La plupart des navigateurs affichent les entrées clavier dans une police à espacement fixe. Pour appliquer un attribut de texte HTML structurel : Effectuez l’une des opérations suivantes : • Sélectionnez le texte que vous souhaitez formater, puis choisissez une option dans le menu Texte > Structure ou dans le menu contextuel Style. • Sélectionnez un style dans le menu Texte > Structure et saisissez votre texte. Le style défini reste en vigueur lorsque la touche Entrée ou Retour a été enfoncée. Pour supprimer du texte sélectionné tous les attributs HTML structurels : Choisissez Texte > Structure > Normal. Comment utiliser l'aide | Sommaire | Index Page précédente 112 Aide d'Adobe GoLive Formatage du texte Comment utiliser l'aide | Sommaire | Index Page précédente 113 Définition de la police, du corps de police et de la couleur du texte Les styles CSS et les attributs de formatage de texte HTML permettent de définir la police, le corps de police et la couleur du texte sélectionné. Les jeux de polices que vous créez (groupes de polices mis à la disposition des navigateurs Web) sont affichés dans l’inspecteur du sélecteur CSS et dans le menu Texte > Police. Lorsque vous associez des jeux de polices, des corps de polices relatifs ou des attributs de couleurs au texte sélectionné à l’aide du menu Texte > Police ou de la barre d’outils, GoLive insère les attributs correspondants dans l’élément de police. Celui-ci étant susceptible de poser des problèmes avec les navigateurs essayant d’interpréter les feuilles de style, il est déconseillé de combiner les méthodes d’application de ces attributs. Pour plus de détails sur l’application d’attributs au texte à l’aide des styles CSS, voir « Définition des propriétés de police », page 144. Création et application de jeux de polices Les navigateurs Web affichent généralement le texte HTML des pages dans la police proportionnelle définie par défaut dans les préférences du navigateur. Si vous souhaitez disposer d’un contrôle accru sur la police utilisée par le navigateur, vous pouvez associer un jeu de polices à votre texte. Lors de l’affichage d’un texte ainsi formaté, le navigateur Web tente d’utiliser la première police du jeu, puis la deuxième, etc. Si aucune n’est installée sur l’ordinateur de l’internaute, le navigateur affiche le texte dans sa police par défaut. Le menu Texte > Police présente la liste de tous les jeux de polices disponibles pour la page active. Les jeux de polices enregistrés avec l’application GoLive sont affichés par défaut en haut du menu. Ceux enregistrés pour des pages individuelles ou stockés dans le fichier projet d’un site n’apparaissent que lorsque la fenêtre associée est ouverte. Pour plus de détails sur le stockage des jeux de polices et leur affichage dans l’inspecteur du sélecteur CSS et dans le menu Texte > Police, voir « Rassemblement de jeux de polices à utiliser dans un site », page 351. Pour créer un jeu de polices : 1 Choisissez Texte > Police > Modifier les jeux de polices. 2 Dans l’éditeur des jeux de polices, effectuez l’une des opérations suivantes : • Pour créer un jeu de polices global à utiliser pour plusieurs pages, sélectionnez Jeux de polices par défaut ou choisissez l’une des polices répertoriées dans la liste. • Pour créer un jeu de polices à utiliser uniquement pour la page active, sélectionnez la page ou l’un des jeux de polices répertoriés sous son nom. 3 Cliquez sur le bouton Nouveau jeu de polices Comment utiliser l'aide | Sommaire | Index . Page précédente 113 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 114 Un nouveau jeu de polices, contenant une seule police, est affiché dans la liste appropriée (en fonction du choix effectué à l’étape 2). A B Le nom du jeu de polices est défini en fonction de la première police du jeu. A. Nouveau jeu de polices B. Nouvelle police GoLive affecte au jeu de polices le nom de la première police qu’il contient. (Pour personnaliser le nom du jeu, ajoutez dans un premier lieu le jeu de polices à votre site, puis renommez-le à partir de l’inspecteur du jeu de polices.) Voir « Rassemblement de jeux de polices à utiliser dans un site », page 351. 4 Sélectionnez la nouvelle police dans le jeu de polices et choisissez une police dans le menu situé au bas de l’éditeur des jeux de polices. (Vous pouvez également saisir le nom de la police dans la zone de texte.) 5 Pour ajouter des polices à un nouveau jeu de polices, sélectionnez la première police du jeu et cliquez sur le bouton Nouvelle police . Ensuite, sélectionnez une autre police dans le menu. 6 Utilisez les boutons fléchés et pour déplacer les polices vers le haut ou le bas de la liste. (L’ordre d’affichage des polices dans cette liste correspond à l’ordre dans lequel le navigateur Web tente de les utiliser.) 7 Cliquez sur OK. Pour modifier un jeu de polices : 1 Choisissez Texte > Police > Modifier les jeux de polices. 2 Dans l’éditeur des jeux de polices, sélectionnez le jeu de polices ou au moins l’une des polices qu’il contient. Cliquez sur le bouton de la souris en maintenant la touche Maj enfoncée pour sélectionner plusieurs polices. Pour sélectionner des polices non consécutives, maintenez la touche Ctrl (Windows) ou Majuscule (Mac OS) enfoncée lorsque vous cliquez. 3 Effectuez l’une des opérations suivantes : • Pour ajouter une nouvelle police, cliquez sur le bouton Nouvelle police . Saisissez dans la zone de texte le nom de la nouvelle police ou choisissez-en un dans le menu. Selon l’élément sélectionné, la nouvelle police est ajoutée au bas de la liste du jeu ou audessus de la police sélectionnée. Le nom de la nouvelle police est défini en fonction du nom du jeu ou de la police sélectionnés. Comment utiliser l'aide | Sommaire | Index Page précédente 114 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 115 • Pour modifier le nom de la police sélectionnée, saisissez dans la zone de texte un nouveau nom ou choisissez-en un dans le menu. • Pour créer une copie de la police ou du jeu de polices sélectionnés, cliquez sur le bouton Dupliquer . La copie s’affiche sous la sélection. • Pour modifier le nom d’un jeu de polices, sélectionnez tout d’abord la première police du jeu, puis saisissez dans la zone de texte un nouveau nom ou choisissez-en un dans le menu. • Pour modifier l’ordre dans lequel les polices d’un jeu ou groupe de polices sont affichées dans l’éditeur des jeux de polices, sélectionnez le jeu ou les polices voulus et cliquez sur le bouton fléché ou . • Pour supprimer de la liste le jeu de polices ou les polices sélectionnés, cliquez sur le bouton Supprimer . 4 Cliquez sur OK. Pour associer un jeu de polices au texte via le menu Texte > Police : 1 Sélectionnez le texte que vous souhaitez formater. 2 Choisissez Texte > Police et sélectionnez un jeu de polices dans le menu. Choisissez Police par défaut si vous souhaitez que les navigateurs Web utilisent leurs polices par défaut. Pour plus de détails sur l’ajout de jeux de polices à des feuilles de style, voir « Définition des propriétés de police », page 144. Application de corps de polices relatifs Le texte doté d’un corps de police relatif apparaît dans un corps calculé en fonction de celui défini dans les préférences du navigateur Web. Dans la plupart des cas, les navigateurs des internautes sont configurés pour afficher le texte en 12 points. Si vous lui appliquez un corps de police relatif, il apparaîtra dans un corps plus grand, plus petit ou identique à celui défini dans les préférences du navigateur, ou bien dans un corps inférieur ou supérieur au corps de police par défaut ou de base du document. Remarque : Les attributs de corps relatifs font partie de l’élément de police qui est susceptible de poser des problèmes avec les navigateurs essayant d’interpréter les feuilles de style. Pour appliquer les corps de polices à l’aide des styles CSS, voir « Définition des propriétés de police », page 144. Pour appliquer au texte un corps de police relatif : 1 Sélectionnez le texte que vous souhaitez formater. 2 Sélectionnez un corps de police relatif dans le menu Texte > Corps ou dans le menu contextuel Corps de la barre d’outils : • Définissez un corps compris entre 1 et 7 pour afficher une taille relative aux préférences du navigateur : l’option 3 affichera le texte dans le corps défini par défaut dans les préférences du navigateur, les options 1 et 2 l’afficheront dans un corps plus petit, et les options 4 à 7 dans un corps plus grand. • Choisissez une option comprise entre +1 et +7 pour afficher le texte dans un corps plus grand que celui défini par défaut ou que le corps de base du document (+1 affichera le texte avec un corps de plus et ainsi de suite). Comment utiliser l'aide | Sommaire | Index Page précédente 115 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Formatage du texte Page précédente 116 Choisissez une option comprise entre -1 et -7 pour afficher le texte dans un corps plus petit que celui défini par défaut ou que le corps de base du document (-1 affichera le texte avec un corps de moins et ainsi de suite). Affichage des corps de polices sur les différentes plates-formes Le corps des polices est relatif à celui défini dans les préférences des navigateurs Web. Par ailleurs, il est également légèrement plus grand sous Windows que sur Mac OS, du fait d’une différence de résolution en pixels entre ces deux plates-formes. Pour vous assurer que votre page accepte divers corps de polices sur différentes plates-formes, suivez ces instructions lors de sa conception : • Vous pouvez contrôler les corps de polices sur les différentes plates-formes en utilisant des styles CSS. Lorsque vous définissez le corps de police pour un style de feuille de style en cascade, utilisez des pixels plutôt que des points. En effet, les corps définis en points varient selon les plates-formes en raison des différences de résolutions en pixel, alors que ceux définis en pixels restent fixes. Dans le menu Corps du panneau Police de l’inspecteur du sélecteur CSS, sélectionnez Pixel. (Voir « Définition des propriétés de police », page 144.) • Avant de publier votre page sur le Web, il est recommandé de la visualiser dans plusieurs corps de polices sur différentes plates-formes et dans différents navigateurs. Vous pouvez également prévisualiser l’aspect qu’aura la page dans un navigateur Web, sous Windows comme sous Mac OS, à l’aide de la palette Affichage. (Voir « Définition des options d’affichage de mise en page », page 48.) • L’utilisation d’attributs d’en-tête HTML (tels que h1) est déconseillée avec les corps de polices relatifs. En effet, l’utilisation d’un tel corps risque de provoquer un retour à la ligne dans le titre et d’affecter ainsi votre mise en page. • Utilisez des zones de texte pour contrôler l’espace affiché entre le texte et les images. Lorsque le texte est affiché dans un corps de police différent de celui utilisé pour la mise en page, l’image est déplacée vers le haut ou vers le bas pour tenir compte du redimensionnement du texte. • N’oubliez pas que la taille d’une zone de texte ne diminue pas lorsque le texte est affiché dans un corps de police inférieur à celui que vous avez utilisé pour la mise en page. Un espace supplémentaire risque donc d’apparaître entre le texte de cette zone et les objets situés au-dessous de celle-ci. Lorsque le texte est affiché dans un corps de police supérieur à celui que vous avez utilisé pour la mise en page, la taille de la zone de texte augmente en conséquence. Dans ce cas, les objets situés au-dessous de cette zone sont déplacés vers le bas sur la page. (Cela dit, si vous définissez vos corps de polices en pixels dans un style CSS, ceux-ci resteront inchangés quelle que soit la plateforme, et par conséquent la taille de la zone de texte également.) • N’oubliez pas que le corps de police affiché par défaut dans l’éditeur de mise en page ne reflète pas nécessairement l’aspect final du texte dans les navigateurs Web, pas plus que la modification du corps de police par défaut dans les préférences de polices n’a d’incidence sur le corps effectivement affiché sur la page. (La définition des préférences de polices n’a d’influence que sur l’affichage des polices dans GoLive.) Comment utiliser l'aide | Sommaire | Index Page précédente 116 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 117 Ajout de couleur au texte Vous pouvez appliquer des couleurs au texte sélectionné sans affecter les autres couleurs de la page. Lorsque vous appliquez la couleur à l’aide de la palette des couleurs ou de la barre d’outils, GoLive insère l’attribut correspon-dant dans l’élément de police. Celui-ci étant susceptible de poser des problèmes avec les navigateurs essayant d’interpréter les feuilles de style, il est préférable d’appliquer les couleurs à l’aide de styles CSS. (Voir « Définition des propriétés de police », page 144.) Il est possible d’appliquer une couleur à l’ensemble du texte d’une page et aux différents états de liens hypertexte sans passer par l’élément de police ni par une feuille de style. (Voir « Définition de la couleur par défaut d’un texte ou des liens d’une page », page 50.) Pour appliquer une couleur au texte à l’aide de la barre d’outils et de la palette de couleurs : 1 Sélectionnez le texte auquel vous souhaitez appliquer une couleur. 2 Cliquez sur la case échantillon Couleur du texte de la barre d’outils. La palette de couleurs s’ouvre automatiquement. 3 Dans la palette de couleurs, sélectionnez une couleur parmi les jeux de couleurs proposés. (Les jeux Liste des couleurs Web et Liste des couleurs du site sont les plus appropriés et les plus fréquemment utilisés pour afficher des couleurs sur le Web. Voir « Utilisation de la palette de couleurs », page 60. GoLive applique automatiquement la couleur au texte sélectionné et dans la case échantillon Couleur du texte de la barre d’outils. Si le texte sélectionné est situé en fin de ligne, la couleur reste en vigueur lorsque vous enfoncez la touche Retour ou Entrée et continuez à saisir du texte. Vous pouvez également appliquer une couleur au texte sélectionné en la faisant glisser du panneau Couleurs de la fenêtre du site vers la sélection sur la page. (Voir « Utilisation de couleurs dans un site », page 350.) Pour supprimer un attribut de couleur du texte sélectionné : Sélectionnez le texte et choisissez Texte > Supprimer la couleur. GoLive rétablit la couleur du texte par défaut de la page. Enregistrement de styles HTML La palette Styles HTML vous permet d’enregistrer du texte formaté sous la forme de styles personnalisés que vous pouvez appliquer à d’autres textes. A partir de cette palette, vous pouvez également créer de nouveaux styles en spécifiant des options de formatage ou des attributs et valeurs HTML. Les styles que vous créez peuvent être appliqués à des paragraphes ou à du texte en ligne, et compléter ou remplacer, selon vos préférences, les options de formatage existantes. Il est possible de partager un jeu de styles HTML avec d’autres utilisateurs travaillant sur le même projet de site. La palette Styles HTML s’avère particulièrement pratique pour structurer rapidement vos textes dotés d’attributs de feuilles de style en cascade. Vous pouvez mettre en forme une page de texte en lui ajoutant en-têtes, listes par défaut, retraits de blocs et attributs de texte structurels (tels que l’élément Distinction), puis utiliser la palette Styles HTML pour enregistrer les attributs de formatage définis. Elle vous permet par exemple Comment utiliser l'aide | Sommaire | Index Page précédente 117 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 118 d’exporter un jeu d’attributs vers un fichier XML, qu’il vous suffira d’importer pour en réutiliser les attributs. Par ailleurs, vous pouvez également enregistrer la page comme gabarit ou modèle de page (voir « Utilisation de modèles de page », page 338 et « Utilisation de gabarits », page 346) à ouvrir chaque fois que vous créez une nouvelle page (voir « Définition des préférences d’ouverture des pages », page 66). A propos de la palette Styles HTML GoLive propose une gamme de styles personnalisés affichés par défaut dans la palette Styles HTML. Chacun de ces styles est doté d’un nom et d’attributs de formatage (couleur, police et corps) personnalisés. Les symboles affichés dans la colonne de gauche correspondent au type du style, indiquant si ce dernier est appliqué à du texte en ligne ou à un paragraphe entier et s’il est destiné à compléter ou à remplacer le texte. Grâce à la palette Styles HTML, vous pouvez exporter et importer des jeux de styles vers et depuis des fichiers XML. Pour afficher la palette Styles HTML, choisissez Fenêtre > Styles HTML. A B C Les symboles affichés en regard du nom du style indiquent s’il est destiné à compléter ou à remplacer un paragraphe ou un attribut de texte en ligne. A. Remplace le paragraphe sélectionné B. Complète le paragraphe sélectionné C. Complète le texte en ligne sélectionné Création et modification de styles HTML Vous avez la possibilité de créer un style à partir d’un texte existant sur une page, en choisissant des options de formatage dans le panneau Standard de la boîte de dialogue Nouveau style, ou en saisissant des attributs et valeurs HTML dans le panneau Avancé. Vous pouvez enregistrer des styles comme styles de paragraphe ou de texte en ligne et les définir de telle sorte qu’ils complètent ou remplacent le formatage existant. Pour modifier un style, changez-en les options ou les attributs dans la boîte de dialogue Modifier le style, ou appliquez-lui les attributs du texte sélectionné. Pour créer un nouveau style : 1 Si vous souhaitez baser votre nouveau style sur un texte déjà formaté, sélectionnez le texte voulu sur la page. 2 Dans la palette Styles HTML, cliquez sur le bouton Nouveau style . 3 Dans la zone de texte Nom de la boîte de dialogue Nouveau style, saisissez un nom évocateur pour le style. 4 Pour définir les attributs de formatage du texte pour le nouveau style, effectuez l’une des opérations suivantes : • Choisissez dans le panneau Standard des options de formatage telles que Police, Corps ou Couleur. Comment utiliser l'aide | Sommaire | Index Page précédente 118 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Formatage du texte Page précédente 119 Activez le panneau Avancé et cliquez sur le bouton Attribut pour ajouter un attribut en haut de la liste déroulante. Spécifiez le nom, l’attribut et la valeur de l’attribut sélectionné dans les zones de texte appropriées. Si vous avez sélectionné un texte formaté à l’étape 1, les attributs de formatage correspondants sont indiqués dans la boîte de dialogue Nouveau style. La zone d’aperçu située au bas de la boîte de dialogue reflète la combinaison des attributs du style. 5 Cliquez sur le bouton Texte en ligne ou Paragraphe afin de définir le type du style. Les styles de texte en ligne s’appliquent au texte sélectionné uniquement et les styles de paragraphe s’appliquent au paragraphe entier, quel que soit l’élément sélectionné dans le paragraphe. Remarque : Les attributs En-tête, Adresse, Préformaté et les divers attributs d’alignement peuvent être utilisés uniquement pour définir des styles de paragraphe, et non pour des styles de texte en ligne. Lorsque vous cliquez sur le bouton Texte en ligne, GoLive rétablit les attributs sur « paragraphe ». 6 Choisissez Ajouter ou Remplacer dans le menu Appliquer un mode. Les styles définis sur le mode Ajouter sont appliqués au texte en complément du formatage existant. Ceux dotés du mode Remplacer écrasent le formatage de texte existant. 7 Cliquez sur OK. Pour modifier un style : 1 Sélectionnez le style voulu dans la palette Styles HTML. 2 Effectuez l’une des opérations suivantes : • Pour remplacer le style avec les attributs de formatage du texte sélectionné sur la page, cliquez sur le bouton Capturer le style . • Pour modifier les attributs de formatage, le type ou le mode d’application du style, cliquez sur le bouton Modifier le style . La boîte de dialogue Modifier le style s’affiche, reflétant dans sa zone d’aperçu les changements apportés au style. Modifiez les options de votre choix et cliquez sur OK. Vous pouvez également maintenir la touche Ctrl (Windows) ou Commande (Mac OS) enfoncée lorsque vous cliquez sur un style dans la palette pour ouvrir la boîte de dialogue Modifier le style. Pour supprimer un style à partir de la palette Styles HTML : Dans la palette Styles HTML, sélectionnez le style que vous souhaitez supprimer et cliquez sur le bouton Supprimer . Exportation et importation de styles HTML La palette Styles HTML vous permet d’exporter les styles actifs vers un fichier XML pour les enregistrer dans un jeu distinct. Lorsque vous importez un jeu de styles dans la palette Styles HTML à partir d’un fichier XML, tous les styles de la palette sont écrasés par les styles importés. Par défaut, les styles HTML prédéfinis livrés avec GoLive sont stockés dans un fichier html.xml situé dans le dossier Settings > Styles de l’application Adobe GoLive 6. Pour exporter le jeu d’attributs de styles HTML actif : 1 Dans la palette Styles HTML, cliquez sur le bouton Exporter . 2 Spécifiez le nom du fichier et son emplacement, puis cliquez sur Enregistrer. Comment utiliser l'aide | Sommaire | Index Page précédente 119 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 120 Pour importer un jeu d’attributs de styles HTML : 1 Créez une copie du jeu d’attributs de styles HTML actif en exportant les styles vers un fichier XML. (Si vous ne le faites pas, ils seront écrasés par les styles importés.) 2 Effectuez l’une des opérations suivantes : • Dans la palette Styles HTML, cliquez sur le bouton Importer . Sélectionnez le fichier XML contenant le jeu de styles que vous souhaitez importer et cliquez sur Ouvrir. • Faites glisser vers la palette Styles HTML le fichier XML contenant le jeu de styles que vous souhaitez importer. Application et suppression de styles HTML Les symboles affichés en regard de chaque style dans la palette Styles HTML indiquent s’il s’agit d’un style de texte en ligne ou de paragraphe. Les styles de paragraphe sont appliqués au paragraphe entier contenant le texte sélectionné ou le point d’insertion. Ces symboles désignent également le mode d’application du style, indiquant si celui-ci est destiné à remplacer le formatage du texte ou à le compléter. Vous avez la possibilité d’appliquer plusieurs styles au texte sélectionné et de supprimer tous les styles en une seule opération. Pour appliquer un style au texte : 1 Sélectionnez le texte voulu ou cliquez à l’intérieur du paragraphe que vous souhaitez formater. 2 Dans la palette Styles HTML, effectuez l’une des opérations suivantes : • Faites glisser un style de la palette vers le texte sélectionné sur la page. • Cliquez deux fois sur un style pour l’appliquer à la sélection. • Sélectionnez un style et cliquez sur le bouton Appliquer des styles . Un style peut appliquer plusieurs attributs HTML au texte à la fois. Pour supprimer tous les styles du texte sélectionné : Dans le menu de la palette Styles HTML, choisissez Effacer les styles en ligne ou Effacer les styles de paragraphe. Remarque : Pour annuler l’application d’un style, utilisez la palette Historique ou la commande d’annulation du menu Edition. (Voir « Annulation et restauration de modifications », page 62.) Comment utiliser l'aide | Sommaire | Index Page précédente 120 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 121 Création de liens hypertexte Vous pouvez lier le texte d’une page à un autre emplacement sur la même page ou à une autre page de votre site ou sur le Web. Le texte peut également contenir des liens pointant vers des ressources autres que Web, telles que des serveurs FTP, des forums de discussion et des adresses électroniques. Pour plus de détails sur la création de liens ayant pour origine des images ou des parties d’une image, voir « Options supplémentaires relatives aux images », page 186 et « Création de mappages d’images », page 217. Vous pouvez également créer des liens déclenchés par des actions autres que des clics de souris. (Voir « Configuration d’actions », page 250.) Pour plus de détails sur le stockage des URL, signets et adresses électroniques de destination comme éléments de construction de site réutilisables, voir « Utilisation d’URL et d’adresses électroniques dans un site », page 352. Pour créer un lien hypertexte : 1 Sélectionnez le texte que vous souhaitez utiliser comme origine du lien. 2 Spécifiez la destination du lien en effectuant l’une des opérations suivantes : • Dans l’inspecteur de texte, cliquez sur le bouton Nouveau lien et sélectionnez le fichier cible du lien en utilisant l’une des méthodes décrites dans la section « Liaison des fichiers », page 55. Si vous saisissez un URL ou une adresse électronique dans la zone de texte, incluez respectivement « http:// » ou « mailto: » en début d’adresse. • Maintenez la touche Ctrl (Windows) ou Commande (Mac OS) et faites glisser le texte sélectionné vers l’une des destinations suivantes : un autre emplacement sur la même page (une ancre est crée automatiquement), une icône de page ou une icône d’ancre sur une autre page ouverte, un fichier ou une ancre HTML dans le panneau Fichiers, ou un URL ou une adresse électronique dans le panneau Externe de la fenêtre de site. Pour plus de détails sur la création d’ancres, voir « Utilisation d’ancres en tant que liens », page 60. Maintenez la touche Ctrl ou Commande lorsque vous faites glisser pour créer une ancre et un lien hypertexte. 3 Si vous souhaitez faire apparaître la destination du lien dans un cadre ou sur une nouvelle page du navigateur Web, choisissez une option dans le menu contextuel Cible de l’inspecteur du texte. Choisissez _top, _parent ou _self pour afficher la page de destination dans un cadre. (Voir « Définition des cadres cible », page 97.) Choisissez _blank pour afficher la page dans une nouvelle fenêtre du navigateur. Comment utiliser l'aide | Sommaire | Index Page précédente 121 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 122 4 Saisissez un titre évocateur pour le lien dans l’inspecteur du texte. Certains navigateurs affichent ce titre lorsque l’internaute maintient le pointeur de la souris sur le lien. Vous pouvez également créer des liens hypertexte en faisant glisser des fichiers HTML de la fenêtre du site vers la page. GoLive crée des libellés de texte pour les liens en utilisant les noms de fichiers. Pour supprimer un lien hypertexte : Sélectionnez le texte qui est à l’origine du lien, puis cliquez sur le bouton Supprimer le lien de l’inspecteur du texte. Vérification orthographique Vous pouvez procéder à la vérification orthographique d’une seule page comme d’un site Web tout entier. Lorsque vous vérifiez un site, GoLive ouvre chaque page contenant un mot suspect et referme chaque page après vérification. GoLive ignore automatiquement les codes HTML lorsqu’il procède à la vérification orthographique. Si GoLive met en doute l’orthographe d’un mot correct, vous pouvez ajouter ce mot dans un dictionnaire personnel afin qu’il soit reconnu lors des vérifications ultérieures. Vous pouvez créer un dictionnaire personnel pour chaque langue installée. Remarque : Pour utiliser des langues supplémentaires, vous devez les installer à l’aide de l’option d’installation personnalisée du CD-Rom de GoLive . Pour vérifier l’orthographe d’une page ou d’un site : 1 Activez le panneau Mise en page, le panneau Source ou la fenêtre de site. 2 Choisissez Edition > Orthographe. 3 Définissez les options de vérification orthographique : • Choisissez la langue de vérification orthographique dans le menu Langue. • Sélectionnez l’option Du début pour commencer la vérification orthographique au début de la page ouverte, et non au point d’insertion. • Développez la liste Autres options et spécifiez les options de vérification voulues (Ignorer les chiffres, par exemple). 4 Pour procéder à la vérification de plusieurs fichiers, sélectionnez Site et choisissez dans le menu les fichiers de site voulus ou cliquez sur Ajouter des fichiers pour créer une liste de fichiers personnalisée. 5 Cliquez sur Commencer. GoLive propose dans la zone de texte une suggestion de correction pour le premier mot suspect rencontré. 6 Pour corriger le mot en question, effectuez l’une des opérations suivantes : • Cliquez sur Remplacer pour accepter la première suggestion. • Cliquez deux fois sur une autre entrée dans la liste des suggestions. • Modifiez la suggestion dans la zone de texte et cliquez sur Remplacer. 7 Pour déclarer le mot correct, effectuez l’une des opérations suivantes : • Cliquez sur Ignorer pour autoriser uniquement cette occurrence. Comment utiliser l'aide | Sommaire | Index Page précédente 122 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 123 • Cliquez sur Tout ignorer si vous souhaitez autoriser le mot pour toute la session active. GoLive ne tiendra pas compte des autres occurrences de ce mot dans la page ou dans le site. • Cliquez sur Conserver pour ajouter le mot à votre dictionnaire personnel. GoLive l’identifiera par la suite comme étant correct. 8 Cliquez sur Supprimer pour supprimer le mot de la page. 9 Si vous vérifiez l’orthographe d’un site, cliquez sur Fichier suivant pour fermer la page active et commencer la vérification de la page suivante. 10 Vous pouvez mettre fin à la vérification orthographique à tout moment en cliquant sur Arrêter. Pour modifier un dictionnaire personnel : 1 Choisissez Edition > Préférences. 2 Cliquez sur Orthographe dans le panneau gauche de la boîte de dialogue Préférences. 3 Choisissez un jeu de règles orthographiques dans le menu contextuel Dictionnaire personnel dans le panneau droit de la boîte de dialogue. 4 Pour modifier un mot dans la liste, sélectionnez-le, modifiez-le dans la zone de texte située sous la zone de liste, puis appuyez sur Entrée. 5 Pour ajouter un mot, cliquez sur le bouton Nouveau terme dans la zone de texte, puis appuyez sur Entrée. , saisissez le mot voulu 6 Pour supprimer un mot, sélectionnez-le dans la liste, puis cliquez sur le bouton Supprimer . 7 Cliquez sur OK. Recherche de texte ou de code HTML Les outils de recherche de GoLive vous permettent de rechercher et de remplacer du texte ou des chaînes de code HTML dans n’importe quel fichier de votre site Web. Vous pouvez lancer une recherche sur plusieurs fichiers à la fois, spécifier des paramètres destinés à affiner la recherche et utiliser des caractères génériques. Les outils de recherche de GoLive vous permettent également de rechercher des éléments HTML selon des critères spécifiques (voir « Recherche d’éléments », page 454), de rechercher des fichiers dans un site (voir « Recherche de fichiers », page 330) et de créer et d’enregistrer des rapports de sites complets basés sur des recherches (voir « Génération de rapports sur les sites », page 331). Recherche dans le document actif Vous pouvez utiliser la fonction de recherche et de remplacement dans les éditeurs de mise en page, de structure et de code source pour rechercher du texte ou des chaînes de code HTML dans le document actif. Dès que vous trouvez l’élément recherché, vous pouvez le remplacer automatiquement. Il est également possible de rechercher le texte sélectionné sans ouvrir la fenêtre Rechercher. Comment utiliser l'aide | Sommaire | Index Page précédente 123 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 124 Pour rechercher et remplacer du texte ou du code HTML dans le document actif : 1 Choisissez Edition > Rechercher et cliquez sur l’onglet Rechercher et remplacer. 2 Effectuez l’une des opérations suivantes : • Saisissez ou collez le texte ou le code HTML dans la zone de texte Rechercher. • Sélectionnez du texte ou du code HTML dans la fenêtre du document et faites-le glisser dans la zone de texte de recherche. • Reprenez un élément qui a déjà fait l’objet d’une recherche en le sélectionnant dans le menu contextuel associé à la zone de recherche. Les chaînes précédemment recherchées sont affichées dans le menu contextuel avec les expressions régulières prédéfinies. Remarque : Si le texte ne peut pas être affiché intégralement dans la zone de texte, vous pouvez soit le parcourir, soit cliquer sur l’icône de crayon pour l’afficher dans une boîte de dialogue redimensionnable. 3 Sélectionnez les options de recherche de votre choix (Ignorer la casse, Mot entier, En arrière, Du début, En boucle) ou utilisez des caractères génériques (expressions régulières) dans vos recherches de texte. Utilisez les expressions régulières uniquement si vous avez une bonne connaissance de l’utilisation des caractères génériques. En effet, cette fonction puissante peut donner des résultats inattendus, notamment lors d’opérations de recherche et de remplacement menées sur de multiples éléments. Pour plus de détails, voir « Utilisation de caractères génériques », page 127. 4 Ouvrez la zone Remplacer en cliquant sur le triangle et saisissez le texte de remplacement voulu ou sélectionnez dans le menu contextuel une chaîne ayant déjà fait l’objet d’une recherche. 5 Cliquez sur Rechercher. Si la recherche est fructueuse, GoLive met en évidence la première occurrence. (Vous pouvez définir via les préférences si vous souhaitez afficher la fenêtre de recherche à l’arrière-plan ou au premier plan, ou si vous voulez qu’elle se ferme dès qu’une occurrence est détectée.) Choisissez Edition > Préférences, sélectionnez Recherche dans le panneau gauche, puis choisissez l’option voulue dans le menu contextuel sur le panneau droit et sur OK. 6 Effectuez l’une des opérations suivantes : • Cliquez sur Suivant pour rechercher l’occurrence suivante du texte recherché. • Cliquez sur Remplacer pour remplacer le texte sélectionné. • Cliquez sur Rempl. et rech. pour remplacer le texte et rechercher l’occurrence suivante. Comment utiliser l'aide | Sommaire | Index Page précédente 124 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Formatage du texte Page précédente 125 Cliquez sur Tout remplacer pour remplacer automatiquement toutes les occurrences du texte dans le document. Pour poursuivre la recherche sans passer par la fenêtre de recherche : 1 Sélectionnez le texte voulu dans le panneau Mise en page, Code source ou Aperçu. 2 Choisissez Edition > Rechercher la sélection. GoLive recherche le texte sélectionné dans le document actif et met en évidence l’occurrence suivante sur la base de la configuration active de la fenêtre de recherche. Vous pouvez également rechercher et remplacer du texte sans rouvrir la fenêtre de recherche, ni la replacer au premier plan. Pour ce faire, il suffit de choisir Edition > Remplacer ou Edition > Remplacer et rechercher. Ces commandes sont uniquement disponibles si l’élément recherché a été trouvé ou est encore sélectionné. Recherche dans plusieurs fichiers Il est possible de rechercher et remplacer du texte ou des chaînes de code HTML dans plusieurs fichiers ou dans l’ensemble d’un site, sans avoir à ouvrir chaque fichier. (Pour plus de détails sur la spécification des critères de recherche pour les éléments HTML, voir « Recherche d’éléments », page 455.) Remarque : Si vous avez l’intention de procéder à une recherche globale dans plusieurs fichiers, veillez tout d’abord à effectuer une copie de sauvegarde de vos fichiers et du site, surtout si vous utilisez des caractères génériques. Pour rechercher et remplacer du texte ou des éléments HTML dans plusieurs fichiers : 1 Choisissez Edition > Rechercher et cliquez sur l’onglet Rechercher et remplacer. 2 Saisissez les chaînes de texte ou de code HTML voulues dans les zones de texte Rechercher et Remplacer, puis sélectionnez des options de recherche. 3 Cliquez sur le triangle situé à côté de l’option Recherche dans des fichiers et effectuez l’une des opérations suivantes : • Choisissez Personnalisé dans le menu Fichiers de, puis cliquez sur Ajouter des fichiers et sélectionnez les fichiers qui vous intéressent. Les fichiers sont ajoutés à la liste déroulante située dans la partie inférieure de la fenêtre de recherche. • Choisissez Personnalisé dans le menu Fichiers de, puis faites glisser les fichiers qui vous intéressent depuis le bureau ou la fenêtre du site dans la liste déroulante située dans la partie inférieure de la fenêtre de recherche. • Choisissez le site qui vous intéresse dans le menu Fichiers de. (La fenêtre de site correspondante doit être ouverte.) Comment utiliser l'aide | Sommaire | Index Page précédente 125 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 126 Toutes les pages du site sont affichées dans la liste située dans la partie inférieure de la fenêtre de recherche. Vous pouvez alors supprimer des fichiers individuels en les sélectionnant dans la liste, puis en appuyant sur la touche Ret. arr. ou Suppr. Faites glisser les fichiers qui vous intéressent dans la recherche dans la fenêtre Rechercher. 4 Sélectionnez l’encodage de langue souhaité dans le menu approprié. 5 Choisissez le mode voulu (Mise en page ou Source) dans le menu Traiter les fichiers. Le mode de mise en page permet de rechercher le contenu visible uniquement. En mode Source, vous pouvez traiter les occurrences dans l’éditeur de code source, qui affiche le contenu visible ainsi que le code source. Important : Utilisez le mode source avec prudence si vous avez recours à la fonction de recherche et de remplacement. En effet, si vous optez pour ce mode, GoLive recherche et remplace toutes les occurrences de texte, qu’il s’agisse d’éléments textuels visibles ou de codes HTML invisibles. Par exemple, si vous recherchez le terme « nations » en mode source dans tous les fichiers d’un projet, GoLive remplacera aussi ce mot dans les hyperliens associés à un nom de fichier (nations_unies.html, par exemple), entraînant une rupture de ces liens. 6 Cliquez sur Rechercher. GoLive indique le premier fichier contenant une occurrence de la chaîne recherchée et ouvre ce fichier. 7 Effectuez l’une des opérations suivantes : • Cliquez sur Suivant pour rechercher et afficher l’occurrence suivante dans le même document ou dans un autre. Comment utiliser l'aide | Sommaire | Index Page précédente 126 Aide d'Adobe GoLive Formatage du texte Comment utiliser l'aide | Sommaire | Index • Page précédente 127 Cliquez sur Tout rechercher pour rechercher et afficher toutes les occurrences. Tous les fichiers comportant des occurrences se voient assigner un nombre en fonction des correspondances détectées. Cliquez deux fois sur un fichier contenant des occurrences afin de l’ouvrir et de mettre la première occurrence en évidence. Une flèche située dans la colonne Fichiers indique que la recherche est en cours. Le nombre d’occurrences trouvées est affiché à droite du nom du fichier. Utilisation de caractères génériques Si vous cochez la case Expression régulière dans la fenêtre de recherche, vous avez la possibilité d’utiliser des caractères génériques dans votre recherche. GoLive permet une utilisation particulièrement souple de caractères génériques modifiables qui sont affichés dans le menu de l’historique des recherches de la fenêtre de recherche. Les modèles de recherche par caractères génériques sont affichés dans la partie inférieure du menu de l’historique des recherches. Pour utiliser des caractères génériques : 1 Dans la fenêtre de recherche, choisissez un modèle de recherche par caractères génériques dans le menu de l’historique des recherches, situé dans la partie supérieure de la fenêtre. Vous pouvez également saisir une chaîne de recherche dans la zone de texte de recherche. (Voir les options de recherche par caractères génériques dans le tableau ciaprès.) 2 Sélectionnez Expression régulière. 3 Cliquez sur Rechercher. Pour modifier un modèle de recherche par caractères génériques du menu de l’historique des recherches : 1 Choisissez Edition > Préférences, puis sélectionnez Rechercher > Expressions régulières dans le panneau gauche de la boîte de dialogue Préférences. 2 Dans le panneau droit de la boîte de dialogue, effectuez l’une des opérations suivantes : • Cliquez sur Nouvel élément afin d’ajouter un modèle à la liste. • Sélectionnez un modèle de recherche dans la liste et saisissez un nouveau nom, une expression régulière et une valeur de remplacement dans les zones de texte situées sous la liste. • Sélectionnez un modèle de recherche et cliquez sur le bouton de supprimer le supprimer de la liste. Comment utiliser l'aide | Sommaire | Index Page précédente afin de 127 Aide d'Adobe GoLive Formatage du texte Comment utiliser l'aide | Sommaire | Index Cliquez sur Rétablir les paramètres par défaut modèles de recherches. • Page précédente 128 pour rétablir la liste d’origine des 3 Cliquez sur OK. Les changements apportés à la liste sont reflétés dans le menu de l’historique des recherches de la fenêtre de recherche. Veillez à respecter les règles suivantes lorsque vous utilisez des caractères génériques : • Les signes réservés aux caractères génériques comme ?, \, [ et ] doivent être précédés d’une barre oblique inverse si vous souhaitez les rechercher dans un fichier. Ainsi, pour rechercher un point d’interrogation, saisissez \? dans la zone de recherche. • Le signe ^ ne peut être utilisé que comme caractère générique lorsqu’il précède une série de caractères comme dans [^A-Z]. • Le tiret n’est pas un caractère générique lorsqu’il précède une série de caractères, comme dans [-ABC] ou [^-ABC]. Dans tous les autres cas, il l’est et a une valeur de « fourchette ». Le tableau ci-après indique les caractères génériques disponibles pour la fonction de recherche. Caractères génériques Action Eléments individuels . Recherche n’importe quel caractère. [] Recherche n’importe quel caractère placé entre les crochets. Par exemple : [0123456789] recherche n’importe quel chiffre. [a-zA-Z] recherche n’importe quelle lettre. Recherche n’importe quel caractère dans la fourchette indiquée entre crochets. Par exemple : [0-9] recherche n’importe quel chiffre. [^] Recherche n’importe quel caractère à l’exception de ceux qui suivent le signe ^ dans les crochets. Par exemple : [^ab] recherche n’importe quel caractère à l’exception de « a » et de « b ». \d (ou [0-9]) Recherche n’importe quel chiffre. \D (ou [^0-9]) Recherche n’importe quel caractère à l’exception des chiffres. \w (ou [a-zA-Z]) Recherche n’importe quel caractère. [a-zA-Z]+ Recherche n’importe quel mot. \W (ou [^a-zA-Z]) Recherche n’importe quel caractère à l’exception de lettres. \s (ou [ESPACEMENT+\t]) Recherche n’importe quel espace (ESPACEMENT = barre d’espacement). \S Recherche n’importe quel caractère à l’exception d’un espace. \r Recherche n’importe quel saut de ligne dans le code source HTML. Comment utiliser l'aide | Sommaire | Index Page précédente 128 Aide d'Adobe GoLive Formatage du texte Comment utiliser l'aide | Sommaire | Index Page précédente 129 Caractères génériques Action \t Recherche n’importe quelle tabulation, comme les retraits dans le code source HTML. \x00 - \xff Recherche n’importe quel caractère par sa valeur ASCII. Par exemple : \X43 recherche « C ». Quantificateurs ? Le point d’interrogation rend la chaîne ou le caractère qui le précède (placé entre parenthèses) facultatif. Par exemple : (Adobe )?GoLive recherche Adobe GoLive et GoLive . + Le signe plus recherche une ou plusieurs occurrences successives du caractère ou de la chaîne. Par exemple : « ba+ » recherche « ba », « baa », « baaa », etc. * L’astérisque équivaut au point d’interrogation (?) associé au signe plus (+) et la recherche peut donner le message « introuvable » si aucune occurrence n’est détectée. Le caractère placé avant l’astérisque est facultatif. Par exemple : « ba* » recherche « b », « ba », « baa », etc. Autres modificateurs de chaînes de recherche | Le pipe joue le rôle de séparateur de chaînes de recherche multiples. Par exemple : Adobe|GoLive|4.0 recherche Adobe, GoLive et 4.0. () Les parenthèses contiennent une chaîne de recherche servant de définition aux quantificateurs. Pour plus de détails, voir la description du point d’interrogation (?) cidessus. ^ En mode source, le signe ^ recherche le début d’une ligne. Dans l’éditeur de mise en page, il recherche le début d’un paragraphe. $ En mode source, le signe dollar ($) recherche la fin d’une ligne. Dans l’éditeur de mise en page, il recherche la fin d’un paragraphe. La chaîne recherche Adobe|GoLive Adobe ou GoLive ma(l|t)in malin ou matin Adobe(GoLive)? GoLive ou, à défaut, Adobe </?HTML> <HTML> et </HTML> Ou+i Le mot Oui contenant un nombre indéfini de « u » successifs (Oui, Ouui, Ouuui, etc.) Comment utiliser l'aide | Sommaire | Index Page précédente 129 Aide d'Adobe GoLive Formatage du texte Comment utiliser l'aide | Sommaire | Index Page précédente 130 La chaîne recherche Michael J[a-z]* Toute chaîne commençant par « Pierre B » suivi d’un nombre de lettres indéterminé en minuscules comme, par exemple, Pierre Bellemart, Pierre Brasseur et Pierre Bachelet <H[1-6]> Les titres HTML, de H1 à H6 en passant par tous les niveaux intermédiaires <[a-zA-Z][a-zA-Z0-9]*> Toutes les balises ouvrantes dépourvues d’attributs comme <P>, <b>, <H2> ou <ImaGe> <[a-zA-Z][a-zA-Z0-9]*[^>]*> Toutes les balises ouvrantes, y compris celles dotées d’attributs comme <image width=20> Utilisation des renvois dans les recherches par caractères génériques Les renvois permettent de remplacer une sélection par une partie de la chaîne de caractères génériques saisie dans la zone de texte de recherche. Un renvoi est représenté par une barre oblique inverse suivie d’un chiffre comme, par exemple, \1, \2, etc. Le chiffre fait référence, dans la zone de texte de recherche, à une sous-expression (placée entre parenthèses) du modèle de recherche par caractères génériques. • \1 fait référence à la première sous-expression du modèle de recherche par caractères génériques. La sous-expression commence à la première parenthèse ouvrante à partir de la gauche et se termine à la parenthèse fermante correspondante. • \2 fait référence à la deuxième sous-expression qui commence à la parenthèse ouvrante et se termine à la parenthèse fermante correspondante. Lorsque vous cliquez sur Remplacer, chaque sélection est remplacée par la partie de la correspondance qui a été reconnue par la sous-expression à laquelle le renvoi fait référence. Par exemple, saisissez le modèle de recherche ((Adobe)?GoLive) dans la zone de texte de recherche pour trouver toutes les occurrences d’Adobe GoLive ou GoLive . Le signe ? rend le second jeu de parenthèses contenant Adobe facultatif. Si vous insérez le renvoi \1 6.0 dans la zone de texte Remplacer, le texte trouvé est remplacé par le contenu du premier jeu de parenthèses, suivi du nombre 6.0. Si l’occurrence est Adobe GoLive, le résultat est GoLive 6.0. Si l’occurrence est GoLive, le résultat est GoLive 6.0. Comment utiliser l'aide | Sommaire | Index Page précédente 130 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 131 Utilisation des jeux de caractères non romains Le système d’exploitation dont vous disposez détermine les possibilités d’alternance entre les jeux de caractères romains et non romains. Dans les versions de Windows antérieures à 2000, il est impossible de créer des pages Web en caractères non romains (codés sur deux octets) directement sur un système d’exploitation prenant en charge des caractères romains (codés sur un seul octet). L’importation de fichiers HTML contenant des caractères codés sur deux octets préalablement créés sur un autre système d’exploitation est, par contre, réalisable. Il suffit de visualiser ensuite le code source HTML dans GoLive, même si le texte contenant des caractères codés sur deux octets n’est pas correctement affiché dans l’éditeur de mise en page ou en mode Aperçu. Les versions 4.0 et ultérieures de Microsoft Internet Explorer permettent d’afficher des scripts contenant des caractères codés sur deux octets. Vous pouvez prévisualiser de tels fichiers au moyen de la commande Afficher dans le navigateur de GoLive. Le système d’exploitation Windows 2000 comprenant Microsoft Internet Explorer 6.0 permet d’afficher et de créer un contenu contenant des caractères codés sur deux octets sans avoir recours à l’ensemble du système d’exploitation du script natif. Vous pouvez installer Language Pack en personnalisant les fonctions selon vos besoins spécifiques. Pour plus de détails, consultez la documentation de votre système. Les versions 9.1 et ultérieures de Mac OS comprennent l’option d’installation facultative Multilingual Internet Access (Accès Internet multilingue). Ce logiciel permet à GoLive d’afficher des scripts pour caractères codés sur deux octets en l’absence du système d’exploitation natif. Une fois le kit approprié installé, vous pouvez créer et modifier un texte en caractères non romains. Pour plus de détails, consultez la documentation de votre système. Utilisation d’un texte contenant des caractères codés sur deux octets dans GoLive (Windows 2000 et Mac OS uniquement) Lorsque vous installez GoLive, les pages que vous créez prennent par défaut l’encodage de type Western (Latin 1) sous Windows ou GL-Western sous Mac OS. Si vous souhaitez créer du texte dans une langue occidentale (français, anglais américain ou britannique, allemand, espagnol ou suédois), il n’est pas nécessaire de modifier ce paramètre. Vous pouvez saisir le texte directement dans la fenêtre du document. Si vous envisagez toutefois de créer un contenu dans une langue provenant d’un système de script différent, il est indispensable que vous vous procuriez les ressources et polices appropriées. Le module d’encodage doit être installé et actif. Vous devez également modifier le paramètre d’encodage dans les préférences afin que l’encodage sur deux octets souhaité s’affiche dans le sous-menu Fichier > Encodage du document. L’encodage du document pris en charge est déterminé par le système d’exploitation. Configuration de la langue et des polices Les préférences d’encodage et de polices permettent de sélectionner le script de langue par défaut, d’activer des scripts de langue afin de les afficher dans le sous-menu Encodage du document, et de définir les polices par défaut. Remarque : Les encodages qui ne sont ni activés ni pris en charge par le logiciel du système n’apparaissent pas dans le sous-menu Fichier > Encodage du document. Comment utiliser l'aide | Sommaire | Index Page précédente 131 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 132 Pour activer l’encodage de scripts de langue : 1 Choisissez Edition > Préférences, puis cliquez sur Modules dans le panneau gauche de la boîte de dialogue Préférences. Assurez-vous que le module Encodages est sélectionné. S’il ne l’est pas, vous devez le sélectionner et relancer GoLive pour l’initialiser. 2 Cliquez sur Encodages dans le panneau gauche de la boîte de dialogue des préférences. 3 Dans le panneau droit de la boîte de dialogue, sélectionnez l’option d’encodage souhaitée afin de l’activer. 4 Pour qu’une option d’encodage devienne la valeur par défaut, il suffit de cliquer sur le nom de l’option, puis de sélectionner Encodage par défaut, ou de cliquer deux fois sur le nom de l’option. Le nom de la sélection par défaut apparaît en caractères gras et soulignés. 5 Sélectionnez Utiliser les informations sur le jeu de caractères pour inclure les informations portant sur l’encodage et sur le jeu de caractères dans l’attribut de contenu de l’élément méta. Lorsque cette option est sélectionnée, GoLive tente de reconnaître l’encodage selon les caractères utilisés. Désactivez l’option pour éliminer les informations de langue de l’en-tête de la page HTML. 6 La zone de texte Limiter le balayage à n caractères définit le nombre d’octets que GoLive doit localiser pour trouver les informations d’encodage et de jeu de caractères à l’ouverture d’un fichier. Désactivez l’option Utiliser les informations sur le jeu de caractères pour désactiver cette option automatiquement. Pour sélectionner les polices par défaut d’un script de langue : 1 Cliquez sur Polices dans le panneau gauche de la boîte de dialogue des préférences. 2 Développez le script qui vous intéresse pour en afficher les options. 3 Pour chaque option, choisissez une police et sa taille dans les menus contextuels Police et Corps. 4 Pour prévisualiser votre sélection, cliquez sur le triangle permettant d’afficher l’échantillon de police (Mac OS). 5 Cliquez sur OK, puis relancez GoLive. Remarque : Seules les polices pour caractères codés sur deux octets installées s’affichent dans le menu Police. Consultez la documentation de votre système d’installation pour plus de détails sur l’installation de polices. Pour créer des pages contenant des caractères codés sur deux octets : 1 Si vous créez du contenu dans une langue non occidentale, assurez-vous d’avoir installé le logiciel de script pour caractères codés sur deux octets et les polices appropriés. 2 Ouvrez une nouvelle fenêtre de document. 3 Choisissez Fichier > Encodage du document, puis sélectionnez l’option d’encodage de la langue appropriée. Assurez-vous qu’elle équivaut à l’encodage du système d’exploitation interne, par exemple, Japonais (ShiftJIS), pour ajouter ces informations méta à la section d’en-tête. 4 Ajoutez le texte voulu à votre page dans GoLive. Comment utiliser l'aide | Sommaire | Index Page précédente 132 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Formatage du texte Page précédente 133 Importation de fichiers texte encodés en langue étrangère Pour importer des fichiers en langue étrangère ou des fichiers texte provenant d’autres plates-formes, vous devez au préalable indiquer l’encodage avec lequel ils ont été écrits. Un texte ayant été enregistré dans un encodage que votre système d’exploitation ne reconnaît pas ne peut pas s’afficher correctement. Le code HTML demeure toutefois valide. Pour insérer un script écrit en langue étrangère, vous devez afficher votre document GoLive dans l’éditeur de code source et y coller le texte codé sur deux octets. Pour importer des fichiers texte encodés en langue étrangère : 1 Ouvrez une nouvelle fenêtre de document. 2 Choisissez Fichier > Encodage du document, puis sélectionnez l’encodage de langue du fichier que vous souhaitez importer. Ce faisant, vous insérez les informations d’encodage dans l’en-tête de la page. (Pour plus de détails sur l’ajout d’encodages de langue dans le menu Fichier > Encodage du document, voir « Configuration de la langue et des polices », page 131.) 3 Copiez le texte du fichier que vous souhaitez importer. 4 Revenez dans GoLive et affichez votre document dans l’éditeur de code source. 5 Collez le texte copié entre les balises <body> et </body>. Assurez-vous que vous ne tapez rien sur aucune des balises HTML. Si votre texte contient des caractères appartenant à la syntaxe HTML, tels que <, > et &, utilisez le système de notation HTML spécifique pour l’encodage des caractères spéciaux, tels que « &lt; », « &gt; » et « &amp; ». A défaut, GoLive risque de les interpréter comme des balises HTML au moment de lire le fichier texte seulement. 6 Choisissez Fichier > Enregistrer sous pour enregistrer la page avec l’extension .html ajoutée au nom du fichier. Le texte ne s’affichera pas correctement sans le système d’exploitation et les polices nécessaires. Pour prévisualiser la page, vous devez utiliser un navigateur Web doté d’un encodage correct opérationnel sur le système d’exploitation approprié. Remarque : Remplacer l’encodage alors que l’éditeur de code source est activé dans la fenêtre du document modifie non pas les informations sur l’encodage, mais les informations sur le jeu de caractères de la page active. Comment utiliser l'aide | Sommaire | Index Page précédente 133 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de feuilles de style en cascade Page précédente 134 Utilisation de feuilles de style en cascade A propos des feuilles de style en cascade Les feuilles de style en cascade (CSS) simplifient la gestion des propriétés du texte et d’autres attributs figurant sur une page ou dans un site Web. Pour mettre un style à jour, il suffit de modifier la règle correspondante afin que tout le contenu du style reflète automatiquement les nouvelles propriétés. Les feuilles de style vous permettent d’harmoniser la taille du texte sur différentes plates-formes et de placer le contenu sur une page au pixel près. Vous pouvez partager une feuille de style externe sur l’ensemble d’un site pour assurer une présentation cohérente de vos pages et mettre à jour les styles du site à l’aide d’un unique fichier. Grâce aux styles d’élément HTML, vous pouvez définir automatiquement les propriétés des balises HTML sur une page ou un site. Les styles de classe sont plus flexibles, car ils peuvent être appliqués à des sélections particulières d’une page et à différents types de contenus sans dépendre d’une balise. Propriétés de style et styles répertoriés dans l’inspecteur et dans l’éditeur de feuille de style CSS, respectivement L’une des fonctions principales de la spécification CSS est la cascade des feuilles de style. En d’autres termes, les feuilles de style externes et la feuille de style interne peuvent définir les propriétés d’une simple page et s’annuler les unes les autres en fonction de certaines règles de priorité. Des conflits risquent de se produire lorsque plusieurs feuilles de style appliquent leurs règles de formatage à une page. Pour résoudre ces conflits, vous devez créer un ordre de priorité pour chaque règle de style. Les feuilles de style internes outrepassent les règles appliquées à une feuille de style externe, et un ordre de priorité est affecté aux feuilles de style externes. Par défaut, la feuille de style d’une page Web outrepasse les valeurs par défaut du navigateur. Comment utiliser l'aide | Sommaire | Index Page précédente 134 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de feuilles de style en cascade Page précédente 135 Certains internautes ne peuvent pas visualiser les pro-priétés de style CSS si leur navigateur ne prend pas en charge les feuilles de style en cascade, si la prise en charge CSS du navigateur a été désactivée ou si la configuration du navigateur autorise le remplacement des styles de page par une feuille de style CSS. En outre, la prise en charge CSS du navigateur Web varie considérablement d’un fournisseur et d’un navigateur à l’autre. En général, Netscape 4.0 et Internet Explorer 3.0, ou versions ultérieures, prennent en charge la plupart des propriétés de feuilles de style spécifiées dans GoLive . A propos de l’interface de feuille de style en cascade Les fonctions les plus souvent utilisées lors de la conception de feuilles de style en cascade dans GoLive incluent les éditeurs de feuilles de style CSS internes et externes, l’inspecteur et la palette de feuille de style CSS. Pour pouvoir maîtriser les feuilles de style en cascade dans GoLive, vous devez d’abord comprendre la relation qui existe entre ces fonctions et le rôle qu’elles jouent dans votre flux de production. Les étapes et fonctions GoLive fréquemment utilisées lors de la création de feuilles de style en cascade sont les suivantes : • Créez une feuille de style interne dans l’éditeur de feuille de style CSS d’une page et ajoutez-lui des feuilles de style externes. La feuilles de style interne réside dans la section d’en-tête d’une page Web. Elle peut faire référence à des feuilles de style externes enregistrées dans un fichier distinct qui peut être partagé entre plusieurs pages. • Dans l’éditeur de feuille de style CSS internes ou externes, choisissez un type pour chaque style que vous créez. Les styles d’élément HTML sont appliqués à une balise HTML dans le document. Les styles de classe sont appliqués à différentes sélections de texte ou objets dans une page. Les styles ID sont rarement utilisés et ne peuvent être appliqués qu’à une seule sélection dans la page. A B Feuille de style interne dans l’éditeur de feuille de style CSS A. Référence d’une feuille de style externe B. Liste des styles internes Comment utiliser l'aide | Sommaire | Index Page précédente 135 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de feuilles de style en cascade Page précédente 136 Définissez les propriétés de chacun des styles dans l’inspecteur de la feuille de style CSS. Vous pouvez définir les jeux de polices, la taille du texte, les attributs des bords, des listes ou du fond, ainsi que les coordonnées de position absolue. • A B Définition des propriétés de style dans l’inspecteur de la feuille de style CSS A. Style sélectionné dans l’éditeur de feuille de style CSS B. Propriétés du style sélectionné répertoriées dans l’inspecteur de la feuille de style CSS • Appliquez les styles au texte et aux objets. Les styles d’élément HTML sont automatiquement appliqués aux balises HTML dans votre document. Ouvrez la palette de feuille de style CSS pour appliquer les styles de classe aux sélections du document. Vous pouvez modifier les propriétés des styles que vous venez d’appliquer dans la feuille de style. Le contenu du style reflétera automatiquement ces modifications. La palette de feuille de style CSS applique des styles de classe aux sélections dans une page. Vous pouvez également utiliser la palette de feuille de style CSS pour référencer des feuilles de style externes à partir d’un ou de plusieurs documents sélectionnés dans la fenêtre du site. Comment utiliser l'aide | Sommaire | Index Page précédente 136 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de feuilles de style en cascade Page précédente 137 Création d’une feuille de style La première étape consiste à créer une feuille de style interne ou externe contenant vos définitions de style. L’éditeur de feuille de style CSS permet de définir les styles d’une feuille de style interne et de référencer des feuilles de style externes. Pour afficher les styles dans une feuille de style externe, cliquez deux fois sur le nom de la feuille afin d’ouvrir l’éditeur de feuille de style CSS externes. Vous pouvez également ouvrir une feuille de style externe à partir de la fenêtre du site ou du disque dur dans GoLive. Création de feuilles de style internes et externes Avant de créer une feuille de style, vous devez déterminer si vous souhaitez utiliser une feuille de style interne ou externe. La feuille de style interne réside dans la section d’entête d’une page Web. Elle est généralement employée lorsque les styles ne sont utilisés que sur une page. La feuille de style externe est enregistrée dans un fichier distinct. Elle est particulièrement utile lorsque vous souhaitez partager des styles identiques entre plusieurs pages. GoLive permet d’importer les styles d’une feuille de style externe dans une feuille de style interne ou d’exporter cette dernière dans une feuille de style externe. Vous pouvez utiliser des feuilles de style internes et externes dans une même page Web. Remarque : A l’exception de leurs barres de titre, les éditeurs de feuilles de style CSS internes et externes sont identiques. L’éditeur de feuille de style CSS internes affiche le nom de la page Web « hôte » dans la barre de titre tandis que l’éditeur de feuille de style CSS externes affiche le nom de fichier de la feuille de style externe avec l’extension .css. Créez différentes feuilles de style externes et appliquez-les une par une à une page pour afficher un aperçu des différents jeux de styles. Pour créer une feuille de style interne : 1 Cliquez sur le bouton Ouvrir l’éditeur CSS mise en page. dans le coin supérieur droit de l’éditeur de 2 Ajoutez des styles à la feuille en adoptant une ou plusieurs des méthodes suivantes : • Pour créer des styles, cliquez sur le bouton Créer un style d’élément , Créer un style de classe ou Nouveau style ID . (Voir « Création de styles d’élément HTML », page 139, « Création de styles de classe », page 141 et « Création de styles ID », page 142.) • Pour référencer un fichier de feuilles de style externes, cliquez sur le bouton Créer un lien vers une feuille de style CSS externe dans l’éditeur de feuille de style CSS. Sélectionnez une feuille de style externe et cliquez sur Ouvrir. Voir « Référencement de feuilles de style externes », page 154. • Pour importer des styles d’une feuille de style externe, dans l’éditeur de feuille de style CSS, choisissez Importer une feuille de style CSS externe dans le menu contextuel ou le menu de l’éditeur de feuille de style CSS. Vous pouvez également choisir Fichier > Importer > Feuille de style externe. Sélectionnez une feuille de style externe et cliquez sur Ouvrir. Pour créer une feuille de style externe : 1 Effectuez l’une des opérations suivantes : • Pour créer une feuille de style externe, choisissez Fichier > Nouveau document spécial > Feuille de style en cascade. Comment utiliser l'aide | Sommaire | Index Page précédente 137 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Utilisation de feuilles de style en cascade Page précédente 138 Pour créer une feuille de style externe basée sur les styles d’une feuille de style interne d’une page, dans l’éditeur de feuille de style CSS internes, choisissez Exporter une feuille de style CSS interne dans le menu contextuel ou le menu de la feuille de style. Vous pouvez également choisir Fichier > Exporter > Feuille de style interne. 2 Nommez le fichier en lui attribuant une extension .css, puis enregistrez-le dans le dossier de votre site pour conserver toutes les références de fichiers. 3 Ajoutez des styles à la feuille en adoptant une ou plusieurs des méthodes suivantes : • Pour créer des styles, cliquez sur le bouton Créer un style d’élément , Créer un style de classe ou Nouveau style ID . (Voir « Création de styles d’élément HTML », page 139, « Création de styles de classe », page 141 et « Création de styles ID », page 142.) • Pour importer des styles d’une feuille de style externe, dans l’éditeur de feuille de style CSS, choisissez Importer une feuille de style CSS externe dans le menu contextuel ou le menu de l’éditeur de feuille de style CSS. Vous pouvez également choisir Fichier > Importer > Feuille de style externe. 4 Référencez la feuille de style externe à partir d’une ou de plusieurs pages. Voir « Référencement de feuilles de style externes », page 154. Pour afficher toutes les pages qui utilisent une feuille de style externe, ouvrez la palette des liens entrants et sortants, puis sélectionnez une feuille de style externe dans une fenêtre du site. Pour définir les options d’affichage de l’éditeur de feuille de style CSS : Ouvrez un éditeur de feuille de style CSS internes ou externes, puis définissez les options suivantes dans la palette Affichage : Afficher les colonnes Sélectionnez des noms de colonne ou choisissez Tout afficher ou Tout masquer dans le menu contextuel pour afficher ou masquer les colonnes dans le panneau Définitions de feuilles de style CSS de l’éditeur de feuille de style CSS. Afficher Vous pouvez sélectionner les propriétés suivantes : • Dossier des sections divise le panneau Définitions de feuilles de style CSS de l’éditeur correspondant en un dossier Interne qui répertorie les styles internes et en un dossier Externe qui contient la liste des feuilles de style externes référencées. • Dossier des styles classe la liste des styles dans des dossiers en fonction de leur type, y compris les styles ID, de classe ou d’élément. • Afficher les préfixes affiche un point avant les noms des styles de classe et un dièse avant les noms des styles ID dans la colonne Nom. Ces préfixes sont utilisés dans le code source, que cette option soit ou non sélectionnée. L’affichage des préfixes peut vous aider à identifier chaque type de style. Création de styles dans une feuille de style Vous pouvez définir trois types de styles différents dans une feuille de style : • Les styles d’élément HTML sont « reliés » à certaines balises HTML spécifiques. Cela signifie que les pro-priétés de style sont automatiquement appliquées à une balise et à son contenu, le cas échéant, quel que soit l’emplacement de la balise dans la page Web. Ce type de style permet d’afficher des pages avec précision dans des navigateurs CSS. Comment utiliser l'aide | Sommaire | Index Page précédente 138 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de feuilles de style en cascade Page précédente 139 De la même manière, les navigateurs non CSS ou ne prenant CSS en charge que partiellement bénéficient du formatage HTML inhérent aux balises que vous spécifiez dans le nom de style. Par exemple, si un style d’élément HTML est désigné pour la balise <h3>, toutes les propriétés de style que vous ajoutez au style sont appliquées à tous les textes utilisant le format de paragraphe En-tête 3 dans la page si vous l’affichez dans un navigateur CSS. Les navigateurs non CSS affichent le texte en utilisant les propriétés de texte En-tête 3. • Les styles de classe sont appliqués au texte ou aux objets sélectionnés dans un document, un peu comme les styles des traitements de texte. Les éléments se trouvant à l’intérieur d’une section BODY d’une page peuvent accueillir un style de classe. Les modifications apportées aux propriétés du style de classe sont répercutées dans tout le texte et dans tous les objets auxquels le style est appliqué. Les styles de classe sont plus flexibles que les styles d’élément HTML, car ils peuvent être appliqués à plusieurs types de contenus et aux éléments spécifiques que vous sélectionnez. Par exemple, vous pouvez appliquer un style de classe à des en-têtes utilisant le format de paragraphe Entête 4 pour les distinguer des autres en-têtes En-tête 4 de la page. • Les styles ID définissent des propriétés de style uniques pour un élément de la page. Ce type de style est utilisé uniquement lorsque les propriétés de style d’un élément doivent différer de celles des autres éléments de la page. Nous vous conseillons d’utiliser un style de classe qui peut être appliqué à un élément et au contenu d’une page sans passer par l’éditeur de source. Vous pouvez utiliser les deux principales catégories de style suivantes dans les feuilles de style en cascade : • Les styles simples traitent les éléments en fonction du type et/ou des attributs des éléments, mais non de la position des éléments dans la structure du document. H1 (tous les en-têtes de niveau 1) et H1.headline (tous les en-têtes de niveau 1 dotés de l’attribut CLASS .headline) sont des exemples de styles simples. • Les styles contextuels traitent les éléments en fonction de leur position dans la structure du document. Un style contextuel se compose de plusieurs styles simples. H1.headline B (tous les en-têtes de niveau 1 dotés de l’attribut CLASS .headline et d’une police en gras) est un exemple de style contextuel composé de deux styles simples, H1.headline et B. Création de styles d’élément HTML Avec une feuille de style en cascade, vous pouvez modifier les propriétés d’une page Web en vous basant sur la hiérarchie des balises d’élément HTML. En utilisant les éléments HTML comme base d’un style, vous pouvez améliorer la présentation d’un document tout en conservant sa compatibilité avec des navigateurs non CSS. Ainsi, les navigateurs CSS afficheront le formatage supplémentaire CSS, alors que les autres navigateurs feront apparaître un document structuré au format HTML. Vous pouvez utiliser les styles d’élément de deux manières différentes : • Les styles d’élément simple reformatent toutes les occurrences d’un élément spécifique d’une page. Par exemple, si vous créez un style avec la propriété de texte 36 points et que vous lui attribuez le nom de la balise <h1>, la taille du texte utilisant le format de paragraphe En-tête 1 sera de 36 points. Comment utiliser l'aide | Sommaire | Index Page précédente 139 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Utilisation de feuilles de style en cascade Page précédente 140 Les styles d’élément contextuel reformatent toutes les occurrences d’un élément spécifique imbriqué dans un autre. Par exemple, si vous créez un style portant le nom des balises <h1> <i> et que vous lui attribuez la couleur vert citron, le texte situé entre les balises ouvrantes et fermantes <i> (style italique HTML) elles-mêmes imbriquées dans les balises ouvrantes et fermantes <h1> sera affiché en vert citron. Dans cet exemple, le nom de style approprié est « h1 i » sans les guillemets. Si vous insérez une virgule dans le nom du style (h1,i), le texte situé entre les balises ouvrantes et fermantes <h1> ou <i> utilisera ce style. Pour créer un lien hypertexte qui change de couleur lorsque le pointeur de la souris le survole, utilisez un style d’élément contextuel portant le nom de la balise de lien <a>. Dans l’éditeur de feuille de style CSS, choisissez Nouveau style > a:hover dans le menu contextuel ou le menu de l’éditeur de feuille de style CSS. Dans le panneau Police de l’inspecteur de la feuille de style CSS, choisissez une nouvelle couleur de style. Pour créer un style d’élément HTML : 1 Dans l’éditeur de feuille de style CSS, effectuez l’une des opérations suivantes : • Cliquez sur le bouton Créer un style d’élément ou choisissez Créer un style d’élément dans le menu contextuel ou le menu de l’éditeur de feuille de style CSS. • Dans l’éditeur de feuille de style CSS, choisissez Nouveau style dans le menu contextuel ou le menu de l’éditeur de feuille de style CSS, puis sélectionnez un style. • Sélectionnez un style d’élément HTML, puis choisissez Dupliquer dans le menu contextuel ou le menu Edition. 2 Sélectionnez le nouveau style dans l’éditeur de feuille de style CSS puis, dans lepanneau Standard de l’inspecteur de la feuille de style CSS, saisissez un nom d’élément HTML dans la zone de texte Nom. Pour appliquer les mêmes propriétés à plusieurs éléments, séparez chaque nom d’élément par une virgule dans la zone de texte Nom. Les styles d’élément utilisent des balises ouvrantes HTML sans le signe inférieur à (<) ni le signe supérieur à (>) : par exemple, h2 pour les en-têtes de deuxième niveau, p pour les paragraphes, td pour les cellules de tableau et a pour les liens hypertexte. Pour plus de détails sur l’attribution de noms aux styles d’élément HTML en vue de formater les tableaux et leur contenu, voir « Formatage de tableaux et de leur contenu avec des feuilles de style en cascade », page 171. Vous pouvez définir les propriétés partagées du texte d’une page en créant un style d’élément HTML portant le nom des balises <body>, <div> et <td> (pour les cellules de tableau). Ajoutez un style d’élément HTML à l’éditeur de feuille de style CSS puis, dans le panneau Standard de l’inspecteur de la feuille de style CSS, saisissez « td, body, div » dans les guillemets. Définissez les propriétés de style. Pour plus de détails, voir « Définition de propriétés de styles », page 143. 3 Dans l’inspecteur de la feuille de style CSS, ajoutez des propriétés de style. Pour plus de détails, voir « Définition de propriétés de styles », page 143. Comment utiliser l'aide | Sommaire | Index Page précédente 140 Aide d'Adobe GoLive Utilisation de feuilles de style en cascade Comment utiliser l'aide | Sommaire | Index Page précédente 141 Les nouvelles propriétés de style que vous ajoutez sont automatiquement appliquées à l’élément HTML ayant donné son nom au style, quel que soit l’emplacement de la balise dans la page. A B C Inspecteur de la feuille de style CSS A. Nom du style d’élément HTML B. Propriétés de style C. Le style TD est automatiquement appliqué au texte dans les cellules du tableau de la page. Création de styles de classe Vous pouvez appliquer des classes à autant de sélections que vous le souhaitez et à la plupart des types de contenus, y compris un bloc de texte, une cellule de tableau, une image et une boîte flottante. En général, les classes sont utilisées pour le formatage particulier d’en-têtes, de citations, d’avertissement ou d’informations spéciales dont les éléments doivent être mis en relief. Elles servent également à créer des effets typographiques, tels que des différences de corps ou de couleur de police dans un mot. Remarque : N’utilisez pas les classes pour structurer l’apparence d’un document. Non seulement les effets ne seraient pas visibles dans des navigateurs non CSS, mais la page aurait une apparence complètement désorganisée. Faites usage des classes pour le formatage de sections spécifiques, telles que certaines parties du texte ou certains paragraphes. Pour créer un style de classe : 1 Dans l’éditeur de feuille de style CSS, effectuez l’une des opérations suivantes : • Cliquez sur le bouton Créer un style de classe ou choisissez Créer un style de classe dans le menu contextuel ou le menu de l’éditeur de feuille de style CSS. • Sélectionnez un style de classe, puis choisissez Dupliquer dans le menu contextuel ou le menu Edition. 2 Sélectionnez le nouveau style dans l’éditeur de feuille de style CSS puis, dans le panneau Standard de l’inspecteur de la feuille de style CSS, saisissez un nom de classe alphanumérique précédé d’un point et sans espace dans la zone de texte Nom, par exemple .ma_classe_en_gras. Important : Le point doit précéder le nom de classe, sinon vous obtenez un style d’élément HTML. 3 Dans l’inspecteur de la feuille de style CSS, ajoutez des propriétés de style. Pour plus de détails, voir « Définition de propriétés de styles », page 143. Comment utiliser l'aide | Sommaire | Index Page précédente 141 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de feuilles de style en cascade Page précédente 142 4 Pour appliquer le style de classe, sélectionnez une section de texte ou un élément dans la fenêtre du document, puis choisissez une option dans la palette de feuille de style CSS. Pour plus de détails, voir « Application de styles », page 153. Remarque : Dans la palette de feuille de style CSS, les options permettant d’appliquer les styles de classe varient en fonction de la sélection effectuée dans la fenêtre du document. Par exemple, si le texte est sélectionné, la palette de feuille de style CSS affiche les options En ligne, Par. et Div. Si une cellule de tableau est sélectionnée, la palette affiche une option pour la balise <td>. Création de styles ID Contrairement aux classes qui peuvent être appliquées à un nombre illimité d’éléments dans une page, les styles ID ne permettent d’appliquer un style spécifique qu’une seule fois dans un document. Utilisez les identifiants pour un paragraphe ou une section de texte spécifique, tels qu’un titre, un avertissement ou un texte dont le format doit être différent du reste. Les boîtes flottantes de GoLive utilisent des styles ID pour définir leurs propriétés. Si votre document contient des boîtes flottantes, l’éditeur de feuille de style CSS du document répertorie un style ID pour chaque boîte flottante. Vous pouvez faire appel à l’inspecteur de la feuille de style CSS pour modifier plusieurs propriétés de boîte flottante, telles que la taille et le style d’un bord, qui ne sont pas disponibles dans l’inspecteur de la boîte flottante. L’inspecteur ne contient pas toutes ces propriétés, car les navigateurs ne les prennent pas toujours en charge. Pour créer un style ID : 1 Dans l’éditeur de feuille de style CSS, effectuez l’une des opérations suivantes : • Cliquez sur le bouton Nouveau style ID ou choisissez Nouveau style ID dans le menu contextuel ou le menu de l’éditeur de feuille de style CSS. • Sélectionnez un style ID, puis choisissez Dupliquer dans le menu contextuel ou le menu Edition. 2 Sélectionnez le nouveau style dans l’éditeur de feuille de style CSS puis, dans le panneau Standard de l’inspecteur de la feuille de style CSS, saisissez un nom d’identifiant alphanumérique précédé d’un dièse (#) et sans espace dans la zone de texte Nom, par exemple #mon_ID_titre. 3 Dans l’inspecteur de la feuille de style CSS, ajoutez des propriétés de style. Pour plus de détails, voir « Définition de propriétés de styles », page 143. 4 Si vous souhaitez appliquer un style ID, vous devez modifier manuellement le code source de la page. Pour plus de détails, voir « Application de styles », page 153. Suppression de styles Vous pouvez supprimer des styles dans l’éditeur de feuille de style CSS. Pour supprimer un style : Sélectionnez le ou les styles dans l’éditeur de feuille de style CSS, puis choisissez Supprimer dans le menu contextuel ou le menu Edition, ou cliquez sur le bouton Supprimer les éléments sélectionnés dans la palette. Comment utiliser l'aide | Sommaire | Index Page précédente 142 Aide d'Adobe GoLive Utilisation de feuilles de style en cascade Comment utiliser l'aide | Sommaire | Index Page précédente 143 Définition de propriétés de styles Lorsque vous avez ajouté des styles à vos feuilles de style en cascade, vous devez définir les propriétés de chaque style dans l’inspecteur de la feuille de style CSS qui contient toutes les propriétés de style prises en charges par GoLive . Ces propriétés couvrent la majeure partie de la spécification CSS, à l’exception de certaines options de style qui ne sont pas systématiquement prises en charge par les navigateurs. Si une propriété que vous souhaitez ajouter n’est pas disponible dans l’inspecteur, vous pouvez saisir la propriété et une valeur dans le panneau Liste et divers de l’inspecteur de la feuille de style CSS (voir l’« Définition de propriétés Liste et divers », page 151) ou manuellement dans le panneau Source de l’éditeur de feuille de style CSS. Certaines propriétés de style sont automatiquement héritées des éléments contenus dans l’élément qui renferme un style. Pour plus de détails, voir « A propos de l’héritage de propriétés », page 143. Si plusieurs styles partagent un même ensemble de propriétés, vous pouvez définir simultanément les propriétés partagées de chaque style. Dans le panneau Définitions de feuilles de styles CSS de l’éditeur, cliquez sur chaque style devant partager les propriétés en appuyant sur la touche Maj, puis définissez les propriétés partagées dans l’inspecteur de la feuille de style CSS. A propos de l’héritage de propriétés Le contenu et les balises compris dans un élément renfermant un style hérite automatiquement des propriétés de style. Si vous attribuez un style à une balise HTML ou à une sélection dans votre document, les balises et le contenu compris entre les balises ouvrantes et fermantes ou inclus dans la sélection héritent de ces spécifications de style. Prenons, par exemple, un style d’élément HTML de couleur bleue, portant le nom de la balise <h1> (format de paragraphe En-tête 1). Si la page contient un texte utilisant le format de paragraphe En-tête 1 et si une partie de l’en-tête est en italique (balise <i>), le texte en italique hérite des propriétés de couleur bleue des balises ouvrantes et fermantes <h1> qui le renferment. <h1>En-tête <i>de taille un<i>.</h1> Si nous créons un style d’élément HTML supplémentaire portant le nom de la balise <i> et que nous lui appliquons la couleur rose, le style d’élément HTML de la balise <i> a priorité sur celui de la balise <h1>, car les balises <i> sont imbriquées dans les balises <h1>. Le texte en italique doit alors s’afficher en rose et le reste de l’en-tête en bleu. L’héritage peut également avoir des répercussions sur la valeur d’un style. La propriété d’une valeur de style peut être exprimée par un pourcentage faisant référence à une propriété qui la précède. Dans l’exemple suivant, la valeur de la hauteur de ligne de 120 % est déterminée par la propriété de corps de police qui la précède dans la feuille de style. H1 { corps de police : 24 pt } H1 { hauteur de ligne : 120% } Les enfants de la balise H1 héritent de la valeur de hauteur de ligne calculée (28,8 points), mais non de la valeur en pourcentage. Lorsque vous appliquez une propriété de style à une page, testez-la d’abord dans tous les navigateurs courants prenant en charge les feuilles de style en cascade. Pour obtenir une liste des fonctions garanties dans les navigateurs, voir Web Review’s Cascading Style Sheets Guide à l’adresse http://webreview.com/style/. Comment utiliser l'aide | Sommaire | Index Page précédente 143 Aide d'Adobe GoLive Utilisation de feuilles de style en cascade Comment utiliser l'aide | Sommaire | Index Page précédente 144 A propos des unités relatives, absolues et des pourcentages Il existe deux types d’unités de longueur : les unités relatives et les unités absolues. Les valeurs relatives spécifient une longueur dépendant d’une autre propriété de longueur. Les unités relatives facilitent la mise à l’échelle des feuilles de style lorsque l’entrée et la sortie de données s’effectuent sur des supports différents (par exemple, lorsque les données sont entrées sur un ordinateur et sorties sur une imprimante laser). Les unités relatives réduisent également les différences de corps de police entre plates-formes. Les unités relatives prises en charge sont les suivantes : • pixel correspond au nombre de pixels par rapport à la résolution de l’écran de l’ordinateur. Nous vous conseillons d’utiliser cette unité pour afficher les différences entre les navigateurs sur des plates-formes Windows et Mac OS. • em représente la hauteur de la police de l’élément. • ex représente la hauteur de la lettre X. • Les valeurs en pourcentage (%) dépendent toujours d’une autre valeur, par exemple une unité de longueur. • Les mots-clés, par exemple Xxsmall à Xlarge, spécifient le corps de police par rapport à l’élément parent. Les unités de longueur absolues s’avèrent pratiques uniquement lorsque les propriétés physiques du support de sortie sont connues. Les unités absolues prises en charge sont les suivantes : • Le pouce (in), qui équivaut à 2,54 centimètres ; • Les centimètres (cm) ; • Les millimètres (mm) ; • Le point (pt), qui équivaut à 1/72 de pouce ; • Le pica (pc), qui équivaut à 12 points. Certaines propriétés autorisent les valeurs d’unités de longueur négatives. Toutefois, ces dernières rendent le formatage plus complexe et risquent de ne pas être prises en charge par certains navigateurs. Définition des propriétés de police Le panneau Police de l’inspecteur de feuilles de style CSS permet de définir une famille de polices et de créer des paramètres de style, y compris la couleur, le corps de police et la hauteur de ligne. Pour modifier les propriétés de police d’un style : 1 Sélectionnez un style dans l’éditeur de feuille de style CSS. Dans le panneau Police de l’inspecteur de la feuille de style CSS, choisissez une couleur de police dans le menu contextuel Couleur ou faites glisser une couleur de la palette de couleurs afin de définir la propriété de couleur de premier plan. Comment utiliser l'aide | Sommaire | Index Page précédente 144 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de feuilles de style en cascade Page précédente 145 2 Choisissez une unité de longueur absolue ou relative ou un pourcentage dans le menu contextuel des unités. Si vous choisissez une unité de longueur ou un pourcentage, saisissez un corps de police ou un pourcentage dans la zone de texte Taille. Pour plus de détails sur les unités, voir « A propos des unités relatives, absolues et des pourcentages », page 144. Choisissez des unités en pixel pour uniformiser l’affichage sur les plates-formes Mac OS et Windows. 3 Saisissez un nombre dans la zone de texte Hauteur de ligne. La hauteur de ligne constitue la distance entre les lignes de base de deux lignes de texte adjacentes. Sélectionnez une unité dans le menu contextuel des unités. 4 Sélectionnez un style de police dans le menu contextuel Style. 5 Sélectionnez une graisse de police dans le menu contextuel Graisse. Les valeurs comprises entre 100 et 300 correspondent à des polices fines et les valeurs comprises entre 500 et 900 correspondent à des polices épaisses. Les options Moins gras et Plus gras appliquent des graisses de police en fonction de la graisse de l’élément parent. 6 Choisissez la famille de polices la mieux adaptée au style et alternez entre plusieurs familles de polices si la police voulue n’est pas disponible sur le système de l’internaute. Pour ajouter des familles de polices à la liste Famille de polices, effectuez l’une des opérations suivantes : • Sélectionnez un jeu de polices dans le menu contextuel correspondant. • Cliquez sur Nouvelle police et choisissez une police dans le menu contextuel des polices ou saisissez un nom de police. • Pour modifier l’ordre de priorité des polices, sélectionnez-en une dans la liste et cliquez sur les boutons Déplacer l’élément vers le haut ou Déplacer l’élément vers le bas pour faire monter ou descendre la police dans la liste. Une police située au-dessus d’une autre dans la liste a priorité sur elle. Si aucune des polices de la liste n’est disponible sur le système de l’internaute, le navigateur se servira d’une police correspondant à la spécification de l’une des polices de la liste (sans serif, par exemple). 7 Sélectionnez les propriétés de police dans la zone Effets afin de définir une propriété d’effet de texte. Pour supprimer les soulignés d’un texte hyperlien, créez un style d’élément HTML et nommez-le « a » comme la balise <a> utilisée pour les liens. Dans le panneau Police de l’inspecteur de la feuille de style CSS, définissez la propriété Effets sur Aucun. Définition des propriétés du texte Le panneau Texte de l’inspecteur de la feuille de style CSS permet de définir les propriétés d’espacement, de casse et d’alignement du style actif. Pour plus de détails sur les unités, voir « A propos des unités relatives, absolues et des pourcentages », page 144. Pour modifier les propriétés d’espacement, de casse et d’alignement d’un style : 1 Sélectionnez un style dans l’éditeur de feuille de style CSS. Dans le panneau Texte l’inspecteur de la feuille de style CSS, choisissez une unité de longueur ou un pourcentage dans le menu contextuel des unités afin de définir le retrait du texte. Saisissez une valeur numérique dans la zone de texte Retrait du texte. Comment utiliser l'aide | Sommaire | Index Page précédente 145 de Aide d'Adobe GoLive Utilisation de feuilles de style en cascade Comment utiliser l'aide | Sommaire | Index Page précédente 146 2 Pour définir l’intermots (ajouté à l’intermots par défaut), choisissez une unité de longueur dans le menu contextuel des unités et saisissez une valeur numérique dans la zone de texte Intermots. 3 Pour définir l’interlettrage (ajouté à l’interlettrage par défaut), choisissez une unité de longueur dans le menu contextuel des unités et saisissez une valeur numérique dans la zone de texte Interlettrage. 4 Pour définir l’alignement vertical d’un style, choisissez l’une des options suivantes dans le menu contextuel Alignement vertical. • Pour cent augmente ou diminue la propriété de hauteur de ligne de l’élément en fonction de son parent. Saisissez une valeur suivie du signe de pourcentage %. • Ligne de base aligne la ligne de base de l’élément de style avec celle du parent. • Indice ajoute un indice à l’élément de style. • Exposant ajoute un exposant à l’élément de style. • Haut aligne la partie supérieure de l’élément de style avec l’élément le plus haut de la ligne (en fonction de la ligne formatée sur laquelle se trouve l’élément de style). • Haut du texte aligne la partie supérieure de l’élément de style avec le haut de la police du parent. • Milieu aligne le centre vertical de l’élément de style (en général, une image) avec la ligne de base ajoutée à la moitié de la hauteur X du parent. • Bas aligne la partie inférieure de l’élément de style avec l’élément le plus bas de la ligne (en fonction de la ligne formatée sur laquelle se trouve l’élément de style). • Bas du texte aligne la partie inférieure de l’élément de style avec le bas de la police du parent. 5 Pour définir des petites majuscules, choisissez Petites majuscules dans le menu contextuel Variante de police. 6 Pour définir la casse du texte (Capitales, Majuscules, Minuscules ou Aucun), choisissez une option dans le menu contextuel Transformation. 7 Pour définir l’alignement horizontal (Gauche, Centre, Droite ou Justifié), choisissez une option dans le menu contextuel Alignement. Définition des propriétés de bloc Le panneau Bloc de l’inspecteur de la feuille de style CSS permet de définir les propriétés d’espacement entre l’élément de style et les dimensions de la zone de l’élément. Pour plus de détails, voir « A propos du modèle de formatage CSS1 », page 147. Les propriétés de ce panneau ne sont pas toutes prises en charge par les navigateurs et plates-formes. Par conséquent, testez vos pages sur plusieurs navigateurs, versions ou plates-formes. Comment utiliser l'aide | Sommaire | Index Page précédente 146 Aide d'Adobe GoLive Utilisation de feuilles de style en cascade Comment utiliser l'aide | Sommaire | Index Page précédente 147 Pour plus de détails sur les unités, voir « A propos des unités relatives, absolues et des pourcentages », page 144. C A D E B Panneau Bloc de l’inspecteur de la feuille de style CSS A. Définit des marges invisibles autour de l’élément de style B. Définit la position et la taille de l’élément de style flottant C. Définit la distance entre le bord et l’élément de style D. Définit l’élément de style comme boîte flottante E. Efface ou autorise les boîtes flottantes de chaque côté de l’élément de style A propos du modèle de formatage CSS1 Les feuilles de style en cascade sont créées à partir d’un modèle dont le format se base sur des blocs simples. Chaque élément accueillant un style se compose d’un ou de plusieurs blocs rectangulaires comprenant une zone de contenu principale et, parfois, une zone de remplissage, de bords et de marges. Ce modèle de formatage rend la gestion de l’espacement des objets plus souple. A B C D E F Propriétés de bloc des feuilles de style en cascade A. Largeur du bloc B. Marge (transparente) C. Bord D. Remplissage E. Contenu F. Largeur de l’élément Pour modifier les propriétés de bloc d’un style : 1 Sélectionnez un style dans l’éditeur de feuille de style CSS. Dans le panneau Bloc de l’inspecteur de la feuille de style CSS, choisissez une unité de longueur ou un pourcentage (recommandé pour conserver la possibilité d’une mise à l’échelle) dans le menu contextuel des unités afin de définir les marges d’un élément de bloc. Saisissez une valeur numérique dans les zones de texte Haut, Droite, Gauche et Bas. Vous pouvez également sélectionner l’option permettant de définir les quatre marges en une seule opération. Comment utiliser l'aide | Sommaire | Index Page précédente 147 Aide d'Adobe GoLive Utilisation de feuilles de style en cascade Comment utiliser l'aide | Sommaire | Index Page précédente 148 Vous avez la possibilité de réduire l’espacement entre les éléments en saisissant des valeurs négatives qui permettent le chevauchement de deux éléments. Dans la palette Affichage de l’éditeur de mise en page, sélectionnez l’option Superposer les paragraphes afin de simuler la manière dont les éléments dotés de valeurs de marges négatives chevauchent les éléments adjacents. 2 Dans la zone Remplissage, définissez l’espacement entre le bord du bloc et l’élément de style. Choisissez une unité de longueur ou un pourcentage (recommandé pour conserver la possibilité d’une mise à l’échelle) dans le menu contextuel des unités, puis saisissez une valeur dans les zones de texte Haut, Droite, Gauche et Bas. Vous pouvez également sélectionner l’option permettant de définir les quatre espacements en une seule opération. 3 Dans la zone Bidirectionnel, définissez les propriétés de largeur et de hauteur pour tout élément formaté à l’aide du style actif. Cette propriété s’avère très pratique pour les éléments référencés, tels que des images. Choisissez une unité de longueur ou un pourcentage dans les menus contextuels de largeur ou de hauteur, puis saisissez un nombre dans la zone de texte correspondante. L’une des unités doit être définie sur Automatique pour que la mise à l’échelle de l’élément soit proportionnelle. Si les deux propriétés sont définies sur Automatique, l’élément référencé s’affiche dans sa taille d’origine. 4 Dans le menu contextuel Cadrage, la propriété de cadrage crée un élément de style ne faisant pas partie du flux du texte. Effectuez une sélection parmi les options suivantes : • Gauche déplace l’élément de style vers la gauche afin que le texte effectue un retour à la ligne à droite de l’élément. • Droite déplace l’élément de style vers la droite afin que le texte effectue un retour à la ligne à gauche de l’élément. • Aucun affiche l’élément de style à l’endroit où il se trouve dans le texte. 5 Dans le menu contextuel Effacer, spécifiez l’emplacement des éléments flottants. • Gauche affiche l’élément sous les éléments flottants, à gauche. • Droite affiche l’élément sous les éléments flottants, à droite. • Aucun affiche les éléments flottants de tous les côtés. Définition des propriétés de position Le panneau Position de l’inspecteur de la feuille de style CSS permet de définir les propriétés de positionnement des éléments flottants formatés avec le style, y compris leur position, leur comportement de troncature, leur position dans la pile, leur comportement de débordement et leur visibilité. Les propriétés de ce panneau ne sont pas toutes prises en charge par les navigateurs et plates-formes. Par conséquent, testez vos pages sur plusieurs navigateurs, versions ou plates-formes pour identifier les problèmes. Pour plus de détails sur les unités, voir « A propos des unités relatives, absolues et des pourcentages », page 144. Comment utiliser l'aide | Sommaire | Index Page précédente 148 Aide d'Adobe GoLive Utilisation de feuilles de style en cascade Comment utiliser l'aide | Sommaire | Index Page précédente 149 Pour modifier les propriétés de position d’un style : 1 Sélectionnez un style dans l’éditeur de feuille de style CSS. Dans le panneau Position de l’inspecteur de la feuille de style CSS, choisissez une méthode de positionnement dans le menu Catégorie : • Absolu permet de spécifier la position de l’élément de style flottant par rapport au coin supérieur gauche de la fenêtre du navigateur. Choisissez une unité (de préférence en pixels) dans les menus contextuels Haut et Gauche et saisissez des valeurs numériques dans les zones de texte correspondantes. • Statique permet à l’élément de style de suivre le flux du texte. • Relatif permet de spécifier la position de l’élément de style par rapport à son parent. Choisissez une unité dans les menus Haut et Gauche et saisissez des valeurs numériques dans les zones de texte correspondantes. 2 Pour spécifier les dimensions de l’élément de style, choisissez une unité dans les menus contextuels de largeur et de hauteur, puis saisissez des valeurs numériques dans les zones de texte correspondantes. 3 Dans la zone Troncature, pour indiquer l’emplacement et la méthode de troncature de l’élément de style lorsque celui-ci chevauche les éléments adjacents, sélectionnez une méthode de troncature dans le menu contextuel correspondant. • L’option Automatique permet au navigateur de déterminer les propriétés de troncature. • Hérité force l’élément de style à hériter de la méthode de troncature de son parent. • Rect to crop the element to a rectangular box. Choisissez une unité dans les menus contextuels Haut, Droite, Bas et Gauche et saisissez une valeur numérique dans les zones de texte. 4 Pour définir l’ordre d’un élément de style flottant par rapport aux autres dans la pile, saisissez une valeur numérique pour le calque dans la zone de texte Index Z. Lorsque deux éléments flottants se chevauchent, celui qui dispose de la valeur d’index Z la plus élevée chevauche l’autre. 5 Pour déterminer le comportement de l’élément de style flottant lorsque son contenu dépasse les dimensions spécifiées, dans le menu contextuel Débordement, choisissez l’une des propriétés suivantes : • Visible permet d’adapter la taille de l’élément de style flottant au volume du contenu. • Défilement ajoute une barre de défilement verticale ou horizontale à l’élément de style flottant. • Non masque les sections du contenu qui dépassent les dimensions des éléments de style flottants. • Automatique utilise les préférences du navigateur pour gérer le contenu excessif. 6 Dans le menu contextuel Visibilité, définissez les propriétés de visibilité afin de déterminer si l’élément s’affiche ou non lorsque le navigateur charge la page. La propriété de visibilité s’avère très pratique comme paramètre initial qui peut être écrasé ultérieurement par un script. Choisissez l’une des options suivantes : • Héritée permet de conserver la propriété de visibilité de l’élément parent. Comment utiliser l'aide | Sommaire | Index Page précédente 149 Aide d'Adobe GoLive Utilisation de feuilles de style en cascade Comment utiliser l'aide | Sommaire | Index Page précédente 150 • Visible permet d’afficher l’élément de style flottant lorsque le navigateur charge la page. • Non masque l’élément de style flottant de la vue. Définition des propriétés de bord Le panneau Bord de l’inspecteur de la feuille de style CSS permet de définir les bords du bloc généré par un style, y compris la largeur, la couleur et le style de ligne. Voir « A propos du modèle de formatage CSS1 », page 147 pour plus de détails sur le modèle de bloc CSS. Les propriétés de ce panneau ne sont pas toutes prises en charge par les navigateurs et plates-formes. Par conséquent, testez vos pages sur plusieurs navigateurs, versions ou plates-formes. Pour plus de détails sur les unités, voir « A propos des unités relatives, absolues et des pourcentages », page 144. Pour modifier les propriétés de bord d’un style : 1 Sélectionnez un style dans l’éditeur de feuille de style CSS. Dans le panneau Bord de l’inspecteur de la feuille de style CSS, choisissez une unité dans les menus contextuels des unités, puis saisissez un nombre dans les zones de texte de bord pour définir la largeur des bords supérieur, inférieur, gauche et droit. Vous pouvez également sélectionner l’option permettant de définir les quatre bords en une seule opération. 2 Choisissez une couleur de bord dans les menus contextuels de couleurs ou faites glisser une couleur de la palette de couleurs. 3 Sélectionnez un style de ligne dans le menu contextuel correspondant. Définition des propriétés de fond Le panneau Fond de l’inspecteur de la feuille de style CSS permet de définir le fond du bloc généré par un style. Vous pouvez utiliser une image ou une couleur en tant que fond. Voir « A propos du modèle de formatage CSS1 », page 147 pour plus de détails sur le modèle de bloc CSS. Les propriétés de ce panneau ne sont pas toutes prises en charge par les navigateurs et plates-formes. Par conséquent, testez vos pages sur plusieurs navigateurs, versions ou plates-formes. Pour modifier les propriétés de fond d’un style : 1 Sélectionnez un style dans l’éditeur de feuille de style CSS. Dans le panneau Fond de l’éditeur de feuille de style CSS, cochez la case Image, puis référencez un fichier image pour définir une image de fond. 2 Choisissez une couleur de fond dans le menu contextuel Couleur ou faites glisser une couleur de la palette de couleurs. Même si vous avez déjà défini une image de fond, nous vous conseillons d’utiliser une couleur de fond qui s’affiche lors du téléchargement de l’image de fond ou lorsque cette dernière n’est pas disponible. 3 Pour afficher l’image de fond en mosaïque verticale, horizontale ou les deux, choisissez une option dans le menu contextuel Répéter. • Choisissez Répéter afin que l’image s’affiche en mosaïque horizontale et verticale. • Choisissez Répéter x afin que l’image s’affiche en mosaïque horizontale. • Choisissez Répéter y afin que l’image s’affiche en mosaïque verticale. Comment utiliser l'aide | Sommaire | Index Page précédente 150 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Utilisation de feuilles de style en cascade Page précédente 151 Choisissez Une fois afin de désactiver l’affichage en mosaïque. Dans ce cas, l’image n’est pas répétée. 4 Pour qu’un fond défile ou non avec les autres éléments de la page, choisissez une option dans le menu contextuel Ancrage : • Choisissez Défilement afin que l’image défile. • Choisissez Fixe afin que l’image ne défile pas. 5 Pour définir la position de l’image dans le bloc de l’élément de style, choisissez l’une des options Gauche, Centre, Droite ou Haut, Centre, Bas dans les menus contextuels Haut et Gauche. Vous pouvez également choisir une unité de longueur ou un pourcentage, puis saisir un nombre dans les zones de texte correspondantes. Définition de propriétés Liste et divers Le panneau Liste et divers de l’inspecteur de la feuille de style CSS permet de définir l’apparence des marqueurs d’éléments de liste, par exemple les puces. Vous pouvez spécifier la forme et la position des marqueurs d’éléments de liste ou définir une image personnalisée comme marqueur. Les propriétés de ce panneau ne sont pas toutes prises en charge par les navigateurs et plates-formes. Par conséquent, testez vos pages sur plusieurs navigateurs, versions ou plates-formes. A B C D E Panneau Liste et divers de l’inspecteur de la feuille de style CSS A. Image utilisée comme marqueur de liste B. Style du marqueur de liste C. Position du marqueur de liste par rapport au texte D. Propriétés CSS non prises en charge E. Nom de propriété et zones de texte non pris en charge Pour modifier les propriétés de marqueur d’élément de liste : 1 Sélectionnez un style dans l’éditeur de feuille de style CSS. Dans le panneau Liste et divers de l’inspecteur de la feuille de style CSS, cochez la case Image, puis référencez un fichier image pour utiliser une image personnalisée comme marqueur d’élément de liste. 2 Pour définir le type de marqueur d’élément de liste, choisissez l’une des propriétés suivantes dans le menu contextuel Style : • Pour créer des listes à puces, choisissez Puce, Cercles ou Carrés. • Pour créer des listes numérotées, choisissez Décimales, Chiffres romains minuscules ou Chiffres romains majuscules. • Pour créer une liste alphabétique, choisissez Alphabétique minuscules ou Alphabétique majuscules. Comment utiliser l'aide | Sommaire | Index Page précédente 151 Aide d'Adobe GoLive Utilisation de feuilles de style en cascade Comment utiliser l'aide | Sommaire | Index Page précédente 152 3 Pour définir la position du marqueur d’élément de liste, choisissez l’une des options suivantes dans le menu contextuel Position : • Choisissez Intérieur afin d’aligner le marqueur d’élément de liste avec la deuxième ligne de texte, avec la troisième et avec les suivantes. • Choisissez Extérieur afin d’ajouter un retrait à la première ligne, de sorte que le marqueur soit mis en relief par rapport au reste du texte (telle une puce devant l’élément de la liste). Définition des propriétés non prises en charge Pour assurer la compatibilité de cette spécification CSS avec les versions ultérieures, GoLive permet de définir de nouvelles propriétés et leurs valeurs. Pour spécifier une nouvelle propriété de style : 1 Sélectionnez un style dans l’éditeur de feuille de style CSS, puis effectuez l’une des opérations suivantes : • Dans le panneau Listes et divers de l’inspecteur de la feuille de style CSS, cliquez sur le bouton Nouvelle propriété . Saisissez le nom de la nouvelle propriété dans la première zone de texte figurant au bas de l’inspecteur, puis spécifiez une valeur de propriété dans la deuxième zone de texte. • Dans le panneau Source de l’éditeur de feuille de style CSS, saisissez la propriété et la valeur entre les accolades adjacentes au nom de style. Pour plus de détails, voir « Suppression de styles », page 142. Affichage des propriétés de style Vous pouvez afficher les propriétés d’un style dans trois fonctions GoLive différentes. Pour afficher les propriétés d’un style : Sélectionnez un style dans le panneau Définitions de feuilles de styles CSS de l’éditeur de feuille de style CSS, puis effectuez l’une des opérations suivantes : • Affichez ses propriétés dans l’inspecteur de la feuille de style CSS. • Consultez les informations de la colonne Source adjacente dans le panneau Définitions de feuilles de styles CSS de l’éditeur. • Cliquez sur l’onglet Source de l’éditeur de feuille de style CSS pour afficher le code source du style sélectionné. Application de styles et référence de feuilles de style externes Lorsque vous avez créé votre feuille de style en cascade, ajouté des styles et modifié leurs propriétés, vous devez appliquer des styles de classe et des styles ID au texte ou aux objets de vos pages et référencer les feuilles de style externes. Les styles d’élément HTML s’appliquent automatiquement aux balises dans le code source. Pour vérifier l’accessibilité d’une page CSS améliorée dans les navigateurs qui ne prennent pas CSS en charge, affichez un aperçu de vos pages ou désactivez l’option de prise en charge CSS dans les navigateurs qui prennent cette fonction en charge. Par ailleurs, dans les paramètres Web de GoLive, vous pouvez créer un nouveau profil de Comment utiliser l'aide | Sommaire | Index Page précédente 152 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de feuilles de style en cascade Page précédente 153 navigateur ne prenant pas CSS en charge. Il est possible de choisir le nouveau profil dans la palette Affichage pour afficher un aperçu de la page dans le navigateur. (Voir « Création d’un nouveau profil de navigateur », page 639) Application de styles Vous pouvez appliquer des styles au texte ou autres objets de trois façons, selon le type de style : • Les styles d’élément HTML s’appliquent automatiquement aux balises HTML qui partagent les noms de style. • Avec les styles de classe, vous devez sélectionner le texte ou d’autres éléments dans la page et appliquer le style à l’aide la palette de feuille de style CSS. Celle-ci dresse la liste de tous les styles de classe dans les feuilles de style internes et externes d’un document. • Avec les styles ID, vous devez appliquer le style manuellement dans l’éditeur du code source de la page. Pour appliquer un style de classe : 1 Sélectionnez le texte, le tableau, la cellule, l’image, la balise d’arborescence des balises ou tout autre objet devant accueillir le style. 2 Dans la palette de feuille de style CSS, sélectionnez l’une des options suivantes en regard du nom de classe : Remarque : Les options de la palette de feuille de style CSS varient en fonction de la sélection effectuée dans la fenêtre du document. Par exemple, si le texte est sélectionné, la palette de feuille de style CSS affiche les options En ligne, Par. et Div. Si une cellule de tableau est sélectionnée, la palette affiche une option pour la balise <td>. • Pour appliquer le style au texte sélectionné dans un paragraphe, sélectionnez Fusion colonnes. • Pour formater tout un paragraphe, placez un point d’insertion dans le paragraphe, puis effectuez une sélection dans la colonne Par. • Pour séparer une section du reste du flux de code HTML, cliquez sur un paragraphe, puis effectuez une sélection dans la colonne Div. • Pour appliquer un style à une section de corps d’une page, cliquez dans l’arborescence des balises au bas de la page pour sélectionner la balise <body> ou cliquez sur l’icône de page dans le coin supérieur gauche de la page. Sélectionnez un style sous la colonne <body> dans la palette de feuille de style CSS. • Pour appliquer le style à un objet sélectionné, tel qu’une cellule de tableau, une image ou une boîte flottante, cliquez dans la colonne de la balise HTML respective. Par exemple : la balise <td> pour une cellule de tableau, la balise <img> pour une image et la balise <div> pour une boîte flottante. Comment utiliser l'aide | Sommaire | Index Page précédente 153 Aide d'Adobe GoLive Utilisation de feuilles de style en cascade Comment utiliser l'aide | Sommaire | Index Page précédente 154 Pour plus de détails sur l’attribution de noms aux styles d’élément HTML en vue de formater les tableaux et leur contenu, voir « Formatage de tableaux et de leur contenu avec des feuilles de style en cascade », page 171. Application d’un style à un paragraphe et d’un autre style à une sélection de cellules de tableau Pour appliquer un style ID : 1 Dans l’éditeur de mise en page, sélectionnez le texte, le paragraphe ou l’objet auquel vous souhaitez attribuer l’identifiant. 2 Cliquez sur l’onglet Editeur de code source, localisez le code source mis en évidence pour l’élément sélectionné, puis effectuez l’une des opérations suivantes : • Si le texte à reformater est une section de paragraphe, vous devez l’inclure dans des balises ouvrantes et fermantes <SPAN> ou <DIV>, puis ajouter le style ID comme attribut dans la balise ouvrante. Par exemple, si le nom de l’identifiant est #headerbox et que vous souhaitez appliquer le style au texte TravelEZ, modifiez le code comme suit : <P> Welcome to <SPAN ID="headerbox">TravelEZ</SPAN></P> • Ajoutez le nom du style ID (sans le dièse #) comme attribut dans la balise ouvrante de l’élément sélectionné. Par exemple, si le nom du style ID est #headerbox et que vous souhaitez l’appliquer à tout le paragraphe, modifiez le code comme suit : <P ID="headerbox">Welcome to TravelEZ</P> 3 Affichez l’effet dans l’aperçu de page. Référencement de feuilles de style externes Le panneau Définitions de feuilles de styles CSS de l’éditeur répertorie toutes les feuilles de style externes référencées par la page active ainsi que les styles internes. Conjointement avec l’inspecteur de la feuille de style externe, vous pouvez référencer une feuille de style externe dans votre site ou sur le Web. Il est également possible de référencer une feuille de style externe à partir de plusieurs pages dans un site sans devoir les référencer une par une. Pour afficher toutes les pages qui référencent une feuille de style externe dans votre site, sélectionnez le fichier de feuille de style dans la fenêtre du site et affichez toutes les références dans la palette des liens entrants et sortants. Comment utiliser l'aide | Sommaire | Index Page précédente 154 Aide d'Adobe GoLive Utilisation de feuilles de style en cascade Comment utiliser l'aide | Sommaire | Index Page précédente 155 Pour référencer une feuille de style externe : 1 Effectuez l’une des opérations suivantes : • Pour référencer une feuille de style externe à partir d’une page Web, dans l’éditeur de feuille de style CSS internes, cliquez sur le bouton Créer un lien vers une feuille de style CSS externe ou, dans le menu contextuel ou le menu de l’éditeur de feuille de style CSS, choisissez Créer un lien vers une feuille de style CSS externe. Sélectionnez la référence vide dans l’éditeur de feuille de style CSS et, dans l’inspecteur de la feuille de style externe, référencez la feuille de style externe dans la zone de texte Référence. • Pour référencer une feuille de style externe à partir de plusieurs pages Web, sélectionnez deux pages ou plus dans le panneau Fichiers de la fenêtre du site. Dans la palette de feuille de style CSS, référencez une feuille de style externe dans la zone de texte située en bas de la palette, puis cliquez sur Ajouter. Ajoutez des feuilles de style externes supplémentaires, le cas échéant. L’ordre des feuilles de style externes dans la palette de feuille de style CSS indique leur priorité (ordre de cascade). Les feuilles qui se trouvent plus bas dans la liste sont prioritaires sur celles qui se trouvent plus haut. Dans l’éditeur de feuille de style CSS d’une page, sélectionnez une feuille de style externe et cliquez sur le bouton Déplacer l’élément vers le haut ou Déplacer l’élément vers le bas pour modifier la priorité d’une feuille par rapport aux autres. Pour référencer un document de feuille de style à partir d’une page dans le même site, faites glisser l’icône de feuille de style de la fenêtre du site vers l’icône de page qui se trouve dans le coin supérieur gauche de la page ou vers l’éditeur de feuille de style CSS internes. Pour afficher ou modifier une feuille de style externe référencée : Effectuez l’une des opérations suivantes : • Cliquez deux fois sur la feuille de style externe dans l’éditeur de feuille de style CSS ou la fenêtre du site. • Sélectionnez la feuille de style externe dans l’éditeur et choisissez Feuille de style CSS > Ouvrir dans Adobe Golive dans le menu contextuel. Vous pouvez également sélectionner la feuille de style externe dans la fenêtre du site et choisir Ouvrir > Ouvrir dans Adobe GoLive dans le menu contextuel. Sélectionnez la feuille de style externe, puis cliquez sur Ouvrir dans l’inspecteur de la feuille de style externe. Pour modifier une référence de feuille de style externe : 1 Dans le panneau Fichiers de la fenêtre du site, sélectionnez le fichier .css que vous souhaitez remplacer. 2 Dans la palette des liens entrants et sortants, utilisez le bouton d’affectation adjacent au fichier .css et référencez le nouveau document de feuille de style dans la fenêtre du site. 3 Le cas échéant, dans la boîte de dialogue Modification de la référence, désactivez les cases à cocher des fichiers que vous ne souhaitez pas mettre à jour, puis cliquez sur OK. Tous les fichiers dont les cases sont cochées utilisent la nouvelle feuille de style externe. En revanche, les fichiers dont les cases à cocher sont désactivées emploient la feuille de style externe existante. Comment utiliser l'aide | Sommaire | Index Page précédente 155 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de feuilles de style en cascade Page précédente 156 Pour supprimer une référence à une feuille de style externe : Effectuez l’une des opérations suivantes : • Dans l’éditeur de feuille de style CSS d’une page, sélectionnez la feuille de style externe et cliquez sur le bouton Supprimer les éléments sélectionnés . • Sélectionnez une ou plusieurs pages dans la fenêtre du site puis, dans la palette de feuille de style CSS, sélectionnez la feuille de style externe et cliquez sur le bouton Supprimer. Modification manuelle des feuilles de style en cascade Si vous souhaitez modifier manuellement le code source de vos feuilles de style en cascade, faites-le dans le panneau Source de l’éditeur de feuille de style CSS internes ou externes. Pour activer ou désactiver le retour à la ligne dans le panneau Source de l’éditeur de feuille de style CSS, choisissez Afficher > Retour à la ligne dans le menu contextuel. Pour activer ou désactiver le retour à la ligne dans toutes les vues source GoLive, y compris l’éditeur de feuille de style CSS, choisissez Edition > Préférences, sélectionnez Source dans le panneau gauche, puis activez ou désactivez l’option Retour à la ligne. Respectez les instructions de base suivantes lorsque vous modifiez vos feuilles de style dans le panneau Source de l’éditeur de feuille de style CSS. Chaque style doit commencer par une nouvelle ligne. Utilisez les règles de syntaxe CSS de base suivantes : Styles de classe La syntaxe est la suivante : un point suivi d’un nom de classe, puis une propriété et une règle de valeur entre accolades : .nom_de_classe { propriété: valeur } Styles d’élément HTML La syntaxe est la suivante : une balise HTML sans les signes supérieur et inférieur < >, puis une propriété et une règle de valeur entre accolades : balise { propriété: valeur } Styles ID La syntaxe est la suivante : un dièse (#) suivi d’un nom alphanumérique, puis une propriété et une règle de valeur entre accolades : #nom_identifiant {propriété: valeur } Si un style comporte plusieurs groupes "propriété: valeur", utilisez un point-virgule pour les séparer. Par exemple : .nom_de_classe { propriété: valeur; propriété: valeur } Pour plus de détails sur la modification des feuilles de style en cascade, voir « Création de styles dans une feuille de style », page 138 et « Définition de propriétés de styles », page 143. Comment utiliser l'aide | Sommaire | Index Page précédente 156 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 157 Utilisation de tableaux A propos des fonctions de tableau GoLive Lorsque vous avez ajouté un tableau de la palette Objets à votre document, vous pouvez modifier ses propriétés en utilisant l’inspecteur ou le menu contextuel du tableau dans la fenêtre du document. Le panneau Tableau de l’inspecteur définit les propriétés qui ont une incidence sur l’ensemble du tableau. Les panneaux Ligne et Cellule définissent les propriétés d’une ligne ou des cellules sélectionnées. En outre, vous pouvez appliquer rapidement un ensemble de propriétés à un tableau ou à des cellules sélectionnées en utilisant les styles de tableau prédéfinis dans le panneau Style de la palette Tableau. Le panneau Sélectionner de la palette Tableau présente les dimensions du tableau sélectionné. Vous pouvez y sélectionner un groupe de cellules ou des tableaux imbriqués beaucoup plus facilement que dans la fenêtre du document. De plus, le panneau Sélectionner identifie les conflits entre les tailles de tableau que vous pouvez résoudre en un seul clic. Si le fichier texte séparé par des colonnes contient des données, vous pouvez les importer dans un tableau en cliquant sur l’onglet Tableau de l’inspecteur du tableau ou en ouvrant le menu contextuel du tableau. Pour trier le texte d’un tableau, activez la fonction de tri dans le panneau Sélectionner de la palette Tableau ou dans le menu contextuel du tableau. Utilisez les objets dynamiques Photoshop pour créer automatiquement un tableau dynamique qui contient des tranches optimisées d’une image tranchée Photoshop. (Voir « Utilisation d’une image tranchée Photoshop », page 189.) Création de tableaux La conception d’une page commence généralement par la création d’un ou de plusieurs tableaux qui définissent la structure de la page. Outre l’affichage d’informations dans des lignes et des colonnes, les tableaux peuvent présenter du texte et des objets sur une page. Vous pouvez insérer un texte et divers types d’objets de la palette Objets dans une cellule de tableau, notamment des images, des tableaux imbriqués, des fichiers Photoshop et des séquences QuickTime. Par ailleurs, il est possible d’ajouter des fichiers tranchés Photoshop à une page en activant l’objet dynamique Photoshop qui crée automatiquement un tableau dynamique contenant des tranches d’image optimisées. Si vous redimensionnez un tableau dynamique, les images sont automatiquement optimisées et le tableau est redimensionné. (Voir « Utilisation d’une image tranchée Photoshop », page 189.) La grille de mise en page GoLive permet de positionner le texte et les objets encore plus facilement grâce aux zones de texte. (Voir « Utilisation de la grille de mise en page », page 74.) Comment utiliser l'aide | Sommaire | Index Page précédente 157 Aide d'Adobe GoLive Utilisation de tableaux Comment utiliser l'aide | Sommaire | Index Page précédente 158 Pour ajouter un tableau à une page : Effectuez l’une des opérations suivantes : • Pour placer un tableau au point d’insertion avec un nombre spécifique de lignes et de colonnes, maintenez la touche Ctrl (Windows) ou Commande (Mac OS) enfoncée et faites glisser l’icône Tableau du panneau Standard de la palette Objets. Relâchez le bouton de la souris lorsque le nombre de lignes et de colonnes souhaité s’affiche en bas de la palette Objets. A B Tableau contextuel interactif dans la palette Objets A. Icône Tableau B. Faites glisser la souris pour définir le nombre de colonnes et de lignes. • Cliquez deux fois sur l’icône Tableau dans le panneau Standard de la palette Objets pour placer le tableau au point d’insertion, ou faites glisser l’icône Tableau vers la fenêtre du document. • Au point d’insertion, choisissez Insérer l’objet > Standard > Tableau dans le menu contextuel. • Sélectionnez une ou plusieurs cellules d’un tableau existant, puis choisissez Copier dans le menu contextuel ou le menu Edition. Définissez le point d’insertion et choisissez Coller dans le menu contextuel ou le menu Edition. • Sélectionnez une ou plusieurs cellules d’un tableau existant, faites glisser la sélection à un nouvel emplacement, puis relâchez le bouton de la souris au point d’insertion de votre choix. Pour créer un tableau dynamique à partir d’un fichier tranché Photoshop, faites glisser un objet dynamique Photoshop du panneau SmartObjects de la palette Objets vers votre page et référencez un fichier tranché Photoshop. (Voir « Utilisation d’une image tranchée Photoshop », page 189.) Méthodes de sélection dans un tableau Au fur et à mesure que vous concevez un tableau et lui ajoutez des images ou tout autre contenu, la sélection des cellules ou des tableaux imbriqués devient plus difficile. GoLive propose différentes méthodes permettant de sélectionner des cellules, des lignes, des colonnes et des tableaux imbriqués selon vos besoins. Vous pouvez effectuer des sélections directement dans la fenêtre du document, dans la barre d’arborescence des balises ou dans la structure du tableau dans le panneau Sélectionner de la palette Tableau. Ce panneau affiche une structure de tableau vide. Vous pouvez ainsi sélectionner une cellule ou un tableau imbriqué sans risquer de redimensionner la sélection ou de sélectionner le contenu par erreur. Comment utiliser l'aide | Sommaire | Index Page précédente 158 Aide d'Adobe GoLive Utilisation de tableaux Comment utiliser l'aide | Sommaire | Index Page précédente 159 Les cellules sélectionnées apparaissent en gras dans la fenêtre du document et la palette Tableau, et sont mises en évidence dans les vues du code source. Dans l’éditeur de mise en page ou la palette Tableau, vous pouvez faire glisser le rectangle noir situé dans le coin supérieur gauche des cellules sélectionnées vers un nouvel emplacement du tableau ou l’utiliser pour créer un tableau. (Les lignes bleues indiquent la zone de sélection et de tri.) A B Sélection d’une cellule de tableau dans le panneau Sélectionner de la palette Tableau A. Cellule de tableau sélectionnée B. Tableau imbriqué Si vous placez un point d’insertion dans une cellule de tableau ou si vous sélectionnez le contenu d’une cellule ou une cellule de tableau, appuyez sur les touches Ctrl + Entrée (Windows) ou Control + Retour (Mac OS) pour atteindre le niveau supérieur, à savoir une cellule, puis le tableau et une cellule de tableau parent au sein d’un tableau ou d’un tableau imbriqué. Pour sélectionner un tableau ou un tableau imbriqué : Effectuez l’une des opérations suivantes : • Dans la fenêtre du document, placez le pointeur sur le bord supérieur ou gauche du tableau pour voir apparaître le pointeur de sélection de tableau , puis cliquez. • Dans la fenêtre du document, placez un point d’insertion dans le tableau et choisissez Sélectionner un tableau dans le menu contextuel, ou cliquez sur la balise <table> dans la barre d’arborescence des balises qui se trouve en bas de la page. Vous pouvez également appuyer deux fois sur les touches Ctrl + Entrée (Windows) ou Control + Retour (Mac OS). • Placez un point d’insertion dans le tableau puis, dans le panneau Sélectionner de la palette Tableau, choisissez Sélectionner un tableau dans le menu contextuel. • Si le tableau est imbriqué dans un autre tableau (sa structure apparaît alors en gris), placez le pointeur sur le tableau imbriqué pour voir apparaître le pointeur correspondant dans le panneau Sélectionner de la palette Tableau. Ensuite, cliquez pour sélectionner le tableau imbriqué et effectuez un zoom sur ses limites dans la palette. Cliquez sur le bouton Sélectionner un tableau parent dans la palette Tableau pour resélectionner le tableau parent et quitter le tableau imbriqué en effectuant un zoom arrière. Comment utiliser l'aide | Sommaire | Index Page précédente 159 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 160 Pour sélectionner des lignes : Effectuez l’une des opérations suivantes : • Dans la fenêtre du document ou dans le panneau Sélectionner de la palette Tableau, placez le pointeur sur le bord gauche d’une ligne pour voir apparaître le pointeur de sélection de ligne , puis cliquez. Faites glisser la sélection vers le haut ou vers le bas pour ajouter des lignes adjacentes. Lorsque le pointeur de sélection de ligne est affiché, vous pouvez également cliquer sur le bord gauche de chacune des lignes supplémentaires en maintenant la touche Maj enfoncée. • Placez un point d’insertion dans la ligne, puis cliquez sur la balise <tr> à droite dans la barre d’arborescence des balises qui se trouve en bas de la page. Pour ajouter des lignes à votre sélection, placez le pointeur sur le bord gauche de chacune des lignes supplémentaires pour voir apparaître le pointeur de sélection de ligne, puis cliquez en maintenant la touche Maj enfoncée. • Placez un point d’insertion n’importe où dans le tableau, cliquez sur la balise <table> dans la barre d’arborescence des balises, faites-la glisser vers la droite pour afficher un menu contextuel, puis choisissez la balise <tr>. Pour ajouter des lignes à votre sélection, placez le pointeur sur le bord gauche de chacune des lignes supplémentaires pour voir apparaître le pointeur de sélection de ligne, puis cliquez en maintenant la touche Maj enfoncée. Sélection d’une ligne de tableau avec la barre d’arborescence des balises Pour sélectionner des colonnes : Effectuez l’une des opérations suivantes : • Dans la fenêtre du document ou dans le panneau Sélectionner de la palette Tableau, placez le pointeur sur le bord supérieur d’une colonne pour voir apparaître le pointeur de sélection de colonne , puis cliquez. Faites glisser la sélection vers la gauche ou vers la droite pour ajouter des colonnes adjacentes. Lorsque le pointeur de sélection de colonne est affiché, vous pouvez également cliquer sur le bord supérieur de chacune des colonnes supplémentaires en maintenant la touche Maj enfoncée. Comment utiliser l'aide | Sommaire | Index Page précédente 160 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 161 Pour sélectionner des cellules : Effectuez l’une des opérations suivantes : • Dans la fenêtre du document, placez le pointeur sur le bord inférieur ou droit d’une cellule pour voir apparaître une flèche , puis cliquez. Faites glisser la cellule sélectionnée pour ajouter des cellules adjacentes. Vous pouvez également cliquer à l’intérieur de chacune des cellules supplémentaires en maintenant la touche Maj enfoncée. • Placez un point d’insertion dans la cellule, puis cliquez sur la balise <td> à droite dans la barre d’arborescence des balises qui se trouve en bas de la page. Ou encore, appuyez sur les touches Ctrl + Entrée (Windows) ou Control + Retour (Mac OS). Vous pouvez également choisir Sélectionner la cellule dans le menu contextuel ou le menu Spécial > Tableau. • Dans le panneau Sélectionner de la palette Tableau, cliquez pour sélectionner une cellule. Faites glisser la cellule sélectionnée pour ajouter des cellules adjacentes. Vous pouvez également cliquer à l’intérieur de chacune des cellules supplémentaires en maintenant la touche Maj enfoncée. • Pour sélectionner toutes les cellules, sélectionnez une cellule d’angle dans la fenêtre du document ou le panneau Sélectionner de la palette Tableau, puis faites glisser le pointeur sur les cellules de votre choix. Vous pouvez également sélectionner une cellule puis, dans le menu Edition ou le menu contextuel de la fenêtre du document, choisissez Tout sélectionner. • Pour inverser la sélection des cellules dans une ligne ou une colonne, placez le pointeur sur le bord gauche de la ligne ou le bord supérieur de la colonne pour voir apparaître le pointeur de sélection de ligne ou de colonne , , puis cliquez tout en maintenant la touche Maj enfoncée. GoLive désactive les cellules sélectionnées dans la ligne ou la colonne et sélectionne celles qui étaient inactives. Ajout ou suppression de lignes ou de colonnes GoLive propose différentes méthode permettant de modifier le nombre de lignes et de colonnes dans un tableau. Vous pouvez faire glisser les bords d’un tableau, utiliser les menus contextuels, appuyer sur une touche ou tout simplement cliquer sur un bouton dans l’inspecteur du tableau pour ajouter ou supprimer des lignes et des colonnes. Pour ajouter ou supprimer des lignes ou des colonnes : Effectuez l’une des opérations suivantes : • Dans le panneau Tableau de l’inspecteur du tableau, saisissez le nombre de lignes et de colonnes de votre choix. Les lignes sont supprimées ou ajoutées en bas du tableau, tandis que les colonnes sont supprimées ou ajoutées à droite du tableau. • Pour ajouter des lignes ou des colonnes, sélectionnez une cellule puis, dans le menu contextuel ou le menu Spécial > Tableau, choisissez Insérer une ligne ou Insérer une colonne. Comment utiliser l'aide | Sommaire | Index Page précédente 161 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Utilisation de tableaux Page précédente 162 Pour ajouter des lignes ou des colonnes de manière interactive, appuyez sur les touches Ctrl + Maj (Windows) ou Commande + Majuscule (Mac OS), et placez le pointeur sur le bord inférieur (ajout de lignes) ou le bord droit (ajout de colonnes) du tableau pour voir apparaître le pointeur d’ajout de lignes ou le pointeur d’ajout de colonnes , puis faites glisser le pointeur à l’extérieur du tableau. Faites glisser le pointeur pour ajouter des colonnes dans le tableau. • Pour ajouter des lignes ou des colonnes dans le panneau Cellule de l’inspecteur du tableau, cliquez sur le bouton Ajouter une ligne avant , Ajouter une ligne après , Ajouter une colonne à gauche ou Ajouter une colonne à droite . • Pour supprimer une ligne ou une colonne sélectionnée dans le panneau Cellule de l’inspecteur du tableau, cliquez sur le bouton Supprimer une colonne ou Supprimer une ligne . Vous pouvez également choisir Couper ou Supprimer dans le menu contextuel ou le menu Edition, ou appuyer sur la touche de suppression du clavier. Pour supprimer la ligne ou la colonne adjacente à la cellule sélectionnée, dans le menu contextuel ou le menu Spécial > Tableau, choisissez Supprimer une ligne ou Supprimer une colonne. • Pour ajouter une ligne au bas du tableau, placez un point d’insertion dans la dernière cellule, puis appuyez sur la touche de tabulation. Redimensionnement des colonnes, lignes et tableaux Le panneau Sélectionner de la palette Tableau vous permet de consulter la taille et les unités de toutes les lignes ou colonnes du tableau. Vous pouvez ensuite modifier ces valeurs dans la fenêtre du document en faisant glisser le bord d’une cellule tout en maintenant une combinaison de touches enfoncées, ou en modifiant les propriétés du tableau dans l’inspecteur correspondant. Le panneau Sélectionner de la palette Tableau permet également d’identifier les conflits qui existent entre les tailles des colonnes, des lignes ou des tableaux, et de les résoudre rapidement. Ces conflits peuvent survenir lorsque les dimensions du contenu d’un tableau dépassent les propriétés de ce dernier ou lorsque ces propriétés sont conflictuelles. Utilisez la palette Tableau pour localiser le problème, puis corrigez-le dans la palette Tableau ou l’inspecteur correspondant. Pour identifier les tailles des tableaux, lignes et colonnes dans la palette Tableau : 1 Sélectionnez un tableau, une ligne, une colonne ou une cellule. Dans le panneau Sélectionner de la palette Tableau, les cellules sélectionnées apparaissent en gras et les lignes bleues indiquent les colonnes et les lignes partagées par la sélection. Comment utiliser l'aide | Sommaire | Index Page précédente 162 Aide d'Adobe GoLive Utilisation de tableaux Comment utiliser l'aide | Sommaire | Index Page précédente 163 2 La largeur du tableau actif est indiquée au-dessus de la structure du tableau, entre les lignes horizontales qui définissent la largeur du tableau. La hauteur du tableau s’affiche entre les lignes verticales qui définissent la hauteur du tableau, à gauche. La taille des colonnes apparaît au-dessus de chaque colonne et celle des lignes à gauche de chaque ligne. 3 La taille des propriétés du tableau est affichée en noir, gris ou rouge, pour indiquer différents types de valeurs : • Si des caractères gris sont utilisés, la taille de la propriété est définie sur Automatique dans l’inspecteur du tableau. Cela signifie que la taille sera automatiquement ajustée à la taille minimum requise pour accueillir un contenu dans la ligne, la colonne ou le tableau. • Si des caractères noirs sont utilisés, la taille est définie soit en pixels (lorsque la valeur est suivie d’un « p »), soit en pourcentage (lorsque la valeur est suivie d’un signe de pourcentage %). Une taille de ligne ou de colonne exprimée en pourcentage représente un pourcentage de la hauteur ou de la largeur du tableau. Une dimension de tableau exprimée en pourcentage représente un pourcentage de la fenêtre du navigateur. • Si des caractères rouges sont utilisés, la taille réelle de la dimension de ligne, de colonne ou de tableau est supérieure ou inférieure à la valeur affichée définie dans l’inspecteur du tableau. Par exemple, si la largeur du tableau est définie sur 300 pixels, mais que la largeur combinée des colonnes du tableau est inférieure ou supérieure à 300 pixels, la valeur de la largeur du tableau apparaît en rouge. Pour plus de détails sur la résolution des conflits entre les tailles de tableaux, voir « Pour résoudre les conflits entre les tailles de tableaux, de colonnes ou de lignes : », page 164. A B C D E Résolution d’un conflit de taille de colonne A. Conflit de taille B. Largeur du tableau en pixels C. Largeur de la colonne en pixels D. Taille de la colonne en pourcentage E. Largeur de la colonne en pixels automatiquement redimensionnés Comment utiliser l'aide | Sommaire | Index Page précédente 163 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 164 Pour résoudre les conflits entre les tailles de tableaux, de colonnes ou de lignes : Effectuez l’une des opérations suivantes : • Pour définir une taille de tableau appropriée en pixels, dans le panneau Sélectionner de la palette Tableau, placez le pointeur sur la valeur rouge en pixels pour voir apparaître le pointeur de correction , puis cliquez. • Pour qu’une propriété de tableau puisse être redimensionnée automatiquement, sélectionnez le tableau, la colonne ou la ligne contenant une valeur rouge en pixels et définissez la propriété conflictuelle sur Automatique ou Pour cent. Résolvez les conflits entre les tailles de tableau en définissant les propriétés Largeur et Hauteur dans le panneau Tableau de l’inspecteur. Résolvez les conflits entre les tailles de ligne en définissant la propriété Hauteur dans le panneau Cellule de l’inspecteur. Résolvez les conflits entre les tailles de colonne en définissant la propriété Largeur dans le panneau Cellule de l’inspecteur. Pour redimensionner un tableau : Effectuez l’une des opérations suivantes : • Dans le panneau Tableau de l’inspecteur du tableau, sélectionnez une unité dans le menu contextuel Largeur ou Hauteur et saisissez les dimensions souhaitées. Choisissez Automatique pour ajuster automatiquement la largeur ou la hauteur à la taille minimum requise pour accueillir un contenu dans le tableau. Choisissez Pour cent pour exprimer la largeur ou la hauteur en pourcentage de la fenêtre du navigateur. Un tableau dont la largeur est définie sur 100 % avec des marges égales à zéro sera automatiquement ajusté pour couvrir toute la largeur des fenêtres du navigateur. Cependant, certains navigateurs affichent une marge entre le côté droit du tableau et la fenêtre du navigateur. Pour supprimer cette marge, définissez la largeur du tableau sur 102 % dans l’inspecteur du tableau. Notez que le navigateur affichera une petite barre de défilement horizontale. • Pour redimensionner une dimension de tableau en utilisant des valeurs fixes en pixels, appuyez sur la touche Alt (Windows) ou Option (Mac OS), puis faites glisser le bord droit ou inférieur du tableau. Si la hauteur ou la largeur est déjà définie en pixels, il n’est pas nécessaire d’appuyer sur la touche Alt ou Option lorsque vous faites glisser le bord du tableau. Pour redimensionner une ligne ou une colonne : Effectuez l’une des opérations suivantes : • Sélectionnez une cellule de la ligne ou de la colonne que vous souhaitez redimensionner. Dans le panneau Cellule de l’inspecteur du tableau, sélectionnez une unité dans le menu contextuel Largeur ou Hauteur et saisissez les dimensions souhaitées. Choisissez Automatique pour ajuster automatiquement la largeur ou la hauteur à la taille minimum requise pour accueillir un contenu dans la ligne ou la colonne. Choisissez Pour cent pour exprimer la taille de la ligne ou de la colonne en pourcentage de la taille du tableau. Comment utiliser l'aide | Sommaire | Index Page précédente 164 Aide d'Adobe GoLive Utilisation de tableaux Comment utiliser l'aide | Sommaire | Index Page précédente 165 Pour redimensionner une ligne ou une colonne en utilisant des valeurs fixes en pixels, appuyez sur la touche Alt (Windows) ou Option (Mac OS), puis faites glisser le bord droit ou inférieur d’une cellule dans la ligne ou la colonne que vous souhaitez redimensionner. Si la ligne ou la colonne est déjà définie en pixels, il n’est pas nécessaire d’appuyer sur la touche Alt ou Option lorsque vous faites glisser le bord de la cellule. • Pour fusionner ou étendre des cellules : Sélectionnez deux cellules adjacentes ou plus et choisissez Fusionner les cellules dans le menu contextuel ou le menu Spécial > Tableau. Formatage d’un tableau à l’aide de styles prédéfinis GoLive propose différents styles de tableau prédéfinis dans le panneau Style de la palette Tableau que vous pouvez utiliser pour formater rapidement tout ou partie d’un tableau. Vous pouvez appliquer un style au tableau et le supprimer rapidement s’il ne vous convient pas. Vous pouvez également créer votre propre style de tableau, l’enregistrer et l’appliquer à d’autres tableaux sur vos pages Web afin de créer une présentation de tableau homogène sur l’ensemble de votre site Web. Enregistrez différents jeux de styles de tableau dans un fichier pouvant être partagé ou importez des styles de tableau que vous souhaitez utiliser dans des sites spécifiques. A B C D E F Panneau Style de la palette Tableau A. Bouton Importer un style de tableau B. Bouton Exporter un style de tableau C. Bouton Renommer un style de tableau D. Bouton Capturer le style de tableau E. Bouton Nouveau style de tableau F. Bouton Supprimer un style de tableau Pour appliquer un style prédéfini à un tableau ou une zone du tableau : 1 Sélectionnez le tableau ou la zone du tableau que vous souhaitez formater avec un style prédéfini. 2 Dans le tableau Style de la palette Tableau, sélectionnez un style prédéfini dans le menu contextuel situé dans le coin supérieur gauche. La palette affiche un aperçu du style sélectionné ; les crochets bleus indiquent les lignes et les colonnes contenant des styles qui doivent être reproduits. Si les deuxième et troisième lignes sont, par exemple, signalées par un crochet bleu, le style de la première ligne n’est appliqué qu’à la première ligne du tableau, tandis que les styles des deuxième et troisième lignes sont reproduits sur toutes les autres lignes. Comment utiliser l'aide | Sommaire | Index Page précédente 165 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 166 3 Redimensionnez le crochet bleu de telle sorte que les lignes ou colonnes de votre choix contiennent les styles à reproduire. Pour redimensionner un crochet bleu, faites glisser l’une de ses extrémités. La zone de redimensionnement du crochet est signalée par des traits bleus aux extrémités. Remarque : Selon le style de tableau choisi, vous risquez de ne pas pouvoir modifier les lignes ou les colonnes comportant les styles à reproduire. Si, par exemple, le style de toutes les colonnes est identique et que la deuxième colonne est signalée par un crochet bleu, vous ne pourrez pas redimensionner le crochet pour modifier le style. 4 Cliquez sur Appliquer ou choisissez Appliquer un style de tableau dans le menu de la palette Tableau afin d’appliquer le style au tableau. Pour supprimer un style prédéfini d’un tableau ou d’une zone du tableau : 1 Sélectionnez le tableau ou la zone du tableau dont vous souhaitez supprimer un style prédéfini. 2 Dans le panneau Style de la palette Tableau, cliquez sur Effacer ou, dans le menu de la palette Tableau, choisissez Effacer le style du tableau. Pour ajouter votre propre style au panneau Style de la palette Tableau : 1 Configurez un tableau et personnalisez sa présentation, comme décrit dans la section « Formatage de tableaux à l’aide de l’inspecteur du tableau », page 167. Les styles de tableau enregistrent les propriétés Bord, Couleur, Remp. cellule et Esp. cellule dans le panneau Tableau de l’inspecteur, ainsi que les propriétés Couleur, Style « Titre » et Alignement vertical ou horizontal dans les panneaux Ligne et Cellule de l’inspecteur. Les tableaux conservent les valeurs des propriétés existantes si la valeur est vide dans le style de tableau. 2 Effectuez l’une des opérations suivantes : • Choisissez un style de tableau dans le panneau Style de la palette Tableau, puis cliquez sur le bouton Nouveau style de tableau ou choisissez Nouveau style de tableau dans le menu de la palette Tableau pour ajouter un style au menu contextuel Style à partir d’un style existant. Saisissez un nom dans la boîte de dialogue Nouveau style de tableau. • Sélectionnez un style dans le panneau Style de la palette Tableau, puis cliquez sur le bouton Capturer le style de tableau ou choisissez Capturer le style du tableau dans le menu de la palette Tableau pour remplacer un style dans le menu contextuel Style par le style de tableau sélectionné. 3 Choisissez un style de tableau, puis cliquez sur le bouton Renommer un style de tableau ou choisissez Renommer un style de tableau dans le menu de la palette Tableau pour modifier le nom d’un style de tableau. Pour supprimer un style du panneau Style de la palette Tableau : 1 Dans le panneau Style de la palette Tableau, choisissez un style dans le menu contextuel. 2 Cliquez sur le bouton Supprimer un style de tableau style de tableau dans le menu de la palette Tableau. Comment utiliser l'aide | Sommaire | Index ou choisissez Supprimer un Page précédente 166 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 167 Pour exporter ou importer des styles de tableau : Effectuez l’une des opérations suivantes : • Pour exporter un jeu de styles de tableau, choisissez Exporter des styles de tableau dans le menu de la palette Tableau, attribuez une extension .xml au fichier, puis cliquez sur Enregistrer. • Pour importer un jeu de styles de tableau, choisissez Importer des styles de tableau dans le menu de la palette Tableau, puis ouvrez un fichier de styles de tableau portant l’extension .xml. Formatage de tableaux à l’aide de l’inspecteur du tableau Un tableau bien conçu vous permet de contrôler la mise en forme de vos pages Web et de présenter des informations de manière attrayante. Dans GoLive, vous pouvez formater un tableau en définissant des propriétés de tableau, de ligne ou de cellule dans l’inspecteur du tableau. Les propriétés du panneau Tableau de l’inspecteur correspondant ont une incidence sur l’ensemble du tableau, tandis que les propriétés des panneaux Ligne et Cellule s’appliquent à la sélection active. Le formatage de tableaux personnalisés peut être long et fastidieux. Pour gagner du temps, faites glisser le tableau que vous venez de concevoir vers le panneau Bibliothèque de la palette Objets pour pouvoir le réutiliser sur une page quelconque. Vous pouvez également faire glisser le tableau vers le panneau Bibliothèque d’une fenêtre de site pour l’enregistrer dans un site spécifique. Formatage de tableaux Les propriétés du panneau Tableau de l’inspecteur correspondant vous permettent de définir diverses propriétés qui ont une incidence sur toutes les cellules du tableau. Vous pouvez également les utiliser pour définir l’alignement du tableau en fonction des éléments environnants. En outre, il est possible d’importer un texte dans le tableau, d’ajouter une légende ou de convertir le tableau en grille de mise en page. Remarque : L’inspecteur du tableau vous permet non seulement de choisir des options de mise en forme, mais également de personnaliser l’aspect de votre tableau en lui appliquant un style prédéfini. Pour plus de détails sur les styles de tableau prédéfinis, voir « Formatage d’un tableau à l’aide de styles prédéfinis », page 165. Pour formater un tableau : 1 Dans le panneau Tableau de l’inspecteur, saisissez une largeur dans la zone Bord. Si vous définissez la largeur de bord sur 0, les bords sont représentés par un trait plein ou des traits pointillés dans l’éditeur de mise en page, mais ils n’apparaissent pas dans le navigateur. Pour masquer le bord qui encadre un tableau sans bord lors de sa conception dans l’éditeur de mise en page, choisissez Masquer les éléments invisibles dans le menu contextuel ou le menu Affichage. Cette option masque les structures de bord du tableau lorsque ce dernier n’est pas actif. 2 Pour modifier l’espacement vertical et horizontal entre les parois des cellules et leur contenu, saisissez un nombre dans la zone Remp. cellule. Comment utiliser l'aide | Sommaire | Index Page précédente 167 Aide d'Adobe GoLive Utilisation de tableaux Comment utiliser l'aide | Sommaire | Index Page précédente 168 3 Pour modifier la taille des bords entre les cellules, saisissez un nombre dans la zone Esp. cellule. A B D C E F Comparaison des propriétés de tableau Bord, Remp. cellule et Esp. cellule A. Bord de 1 pixel B. Bord de 10 pixels C. Remplissage des cellules de 5 pixels D. Remplissage des cellules de 10 pixels E. Espacement entre les cellules de 5 pixels F. Espacement entre les cellules de 10 pixels 4 Cochez la case Couleur pour appliquer une couleur de fond au tableau. Cliquez dans la case échantillon et choisissez une couleur dans la palette de couleurs. Pour plus de détails sur la palette de couleurs, voir « Ajout de couleurs ou de fonds aux éléments de page », page 80. La couleur de fond n’apparaît que dans les cellules qui contiennent un texte ou un autre contenu lorsque vous visualisez la page dans l’éditeur de mise en page ou Netscape Navigator. Pour afficher une couleur de fond dans des cellules vides, insérez un espace insécable. Sélectionnez les cellules vides et choisissez Insérer des espaces insécables dans le menu contextuel ou le menu Spécial > Tableau. Vous pouvez également cliquer à l’intérieur d’une cellule vide et appuyer sur Maj + barre d’espacement Comment utiliser l'aide | Sommaire | Index Page précédente 168 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 169 (Windows) ou sur Option + barre d’espacement (Mac OS) pour insérer un espace insécable. 5 Pour appliquer une image de fond au tableau, cochez la case Image de fond, puis sélectionnez un fichier image. 6 Choisissez une option dans le menu contextuel Alignem. pour aligner le tableau sur la fenêtre du document. Choisissez Gauche ou Droite pour insérer des retours à la ligne dans le texte ou les objets environnants à côté du tableau. Choisissez Par défaut pour insérer des retours à la ligne dans le texte ou les objets environnants sur le bord inférieur du tableau. (Ce menu ne vous permet pas d’aligner un tableau sur une grille de mise en page.) 7 Cochez la case Légende pour ajouter une légende au tableau, puis choisissez son emplacement dans le menu contextuel. Formatage de lignes Les propriétés définies dans le panneau Ligne de l’inspecteur du tableau ont une incidence sur toutes les cellules de la ligne sélectionnée, y compris celles qui sont fusionnées avec d’autres lignes vers le bas. Pour formater une ligne ou une sélection de lignes : 1 Sélectionnez les lignes ou une cellule à l’intérieur d’une ligne que vous souhaitez formater. 2 Dans le panneau Ligne de l’inspecteur du tableau, choisissez une propriété dans le menu contextuel Alignement vertical pour définir l’alignement vertical du contenu de la ligne. L’option Par défaut permet d’aligner le contenu verticalement en fonction des préférences du navigateur. 3 Choisissez une propriété dans le menu contextuel Alignement horizontal pour définir l’alignement horizontal du contenu de la ligne. L’option Par défaut permet d’aligner le texte horizontalement en fonction des préférences du navigateur. 4 Pour modifier la hauteur de la ligne, choisissez une option dans le menu contextuel Hauteur, puis saisissez les dimensions souhaitées. Choisissez Automatique pour ajuster automatiquement la hauteur à la taille minimum requise pour accueillir un contenu dans le tableau. Choisissez Pour cent pour définir la hauteur en pourcentage de la hauteur du tableau. 5 Cochez la case Couleur pour appliquer une couleur de fond à la ligne. Cliquez dans la case échantillon et choisissez une couleur dans la palette de couleurs. Pour plus de détails sur la palette de couleurs, voir « Ajout de couleurs ou de fonds aux éléments de page », page 80. Formatage de cellules La plupart des propriétés définies dans le panneau Cellule de l’inspecteur du tableau ont une incidence sur les cellules sélectionnées uniquement, tandis que d’autres vous permettent de fusionner les cellules à partir de différentes lignes et colonnes. Les boutons situés en bas du panneau Cellule permettent d’ajouter ou de supprimer des colonnes et des lignes. Pour formater une cellule ou une sélection de cellules : 1 Sélectionnez les cellules que vous souhaitez formater. Comment utiliser l'aide | Sommaire | Index Page précédente 169 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 170 2 Dans le panneau Cellule de l’inspecteur du tableau, choisissez une propriété dans le menu contextuel Alignement vertical pour définir l’alignement du contenu des cellules. L’option Par défaut permet d’aligner le texte verticalement en fonction des préférences du navigateur. 3 Choisissez une propriété dans le menu contextuel Alignement horizontal pour définir l’alignement horizontal du contenu des cellules. L’option Par défaut permet d’aligner le texte horizontalement en fonction des préférences du navigateur. 4 Effectuez l’une des opérations suivantes pour fusionner la cellule avec une ou plusieurs lignes vers le bas : • Saisissez le nombre de lignes voulu dans Fusion lignes. Fusion d’une cellule sur trois lignes • Maintenez la touche Maj enfoncée et appuyez sur la touche fléchée bas pour agrandir la cellule d’une ligne vers le bas. Maintenez la touche Maj enfoncée et appuyez sur la touche fléchée haut pour raccourcir la cellule d’une ligne vers le haut. • Sélectionnez les cellules que vous souhaitez fusionner et choisissez Fusionner les cellules dans le menu contextuel ou le menu Spécial > Tableau. 5 Effectuez l’une des opérations suivantes pour fusionner la cellule avec une ou plusieurs colonnes vers la droite : • Saisissez le nombre de colonne voulu dans Fusion colonnes. • Maintenez la touche Maj enfoncée et appuyez sur la touche fléchée droite pour agrandir la cellule d’une colonne vers la droite. Maintenez la touche Maj enfoncée et appuyez sur la touche fléchée gauche pour raccourcir la cellule d’une colonne vers la gauche. • Sélectionnez les cellules que vous souhaitez fusionner et choisissez Fusionner les cellules dans le menu contextuel ou le menu Spécial > Tableau. 6 Choisissez l’une des options du menu contextuel Hauteur ou Largeur pour modifier la hauteur ou la largeur de la cellule, puis saisissez les dimensions souhaitées. Choisissez Automatique pour ajuster automatiquement la largeur ou la hauteur à la taille minimum requise pour accueillir un contenu dans la ligne. Choisissez Pour cent pour exprimer l’une ou l’autre de ces valeurs en pourcentage de la taille du tableau. Remarque : Lorsque vous redimensionnez la hauteur ou la largeur d’une cellule, GoLive redimensionne automatiquement la hauteur ou la largeur de la ligne ou de la colonne contenant la cellule en question. Comment utiliser l'aide | Sommaire | Index Page précédente 170 Aide d'Adobe GoLive Utilisation de tableaux Comment utiliser l'aide | Sommaire | Index Page précédente 171 7 Cochez la case Style « Titre » pour formater la cellule sous forme d’un en-tête secondaire et traiter le contenu avec un style d’en-tête de tableau. 8 Cochez la case Aucun retour à la ligne pour supprimer les retours à la ligne automatiques dans la cellule. 9 Cochez la case Image de fond pour appliquer une image de fond à la cellule, puis sélectionnez un fichier image. Formatage de tableaux et de leur contenu avec des feuilles de style en cascade Vous pouvez utiliser des feuilles de style en cascade pour définir les propriétés d’un tableau et son contenu. Les styles peuvent être appliqués automatiquement à tous les tableaux de la page ou à des tableaux ou cellules spécifiques. Si vous créez un style et que vous le modifiez, les propriétés de tous les tableaux et cellules qui utilisent ce style sont mises à jour en conséquence. Les feuilles de style peuvent être enregistrées dans une page Web sous forme d’une feuille de style interne ou d’une feuille de style externe distincte utilisable par plusieurs pages. (Voir « A propos des feuilles de style en cascade », page 134.) Remarque : Certaines propriétés de l’inspecteur de sélecteur CSS (panneau Fond, par exemple) ont une incidence sur le tableau tandis que d’autres (panneau Police, par exemple) sont appliquées au contenu d’une cellule de tableau. Si un style utilisant une propriété de couleur Police est appliqué à une cellule de tableau, le texte de la cellule affiche la propriété de couleur, mais pas la cellule de tableau. B A Style de classe appliqué à une colonne de tableau A. Propriétés de style de classe dans l’inspecteur de la feuille de style CSS B. Style de classe répertorié dans l’éditeur de feuille de style CSS Pour créer un style et l’appliquer automatiquement à tous les tableaux, lignes ou cellules d’une page, effectuez l’une des opérations suivantes : • Créez un style d’élément HTML portant le nom de balise <table> pour définir les propriétés de tous les tableaux de la page. • Créez un style d’élément HTML portant le nom de balise <tr> pour définir les propriétés de toutes les lignes de tableau dans la page. Comment utiliser l'aide | Sommaire | Index Page précédente 171 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Utilisation de tableaux Page précédente 172 Créez un style d’élément HTML portant le nom de balise <td> pour définir les propriétés de toutes les cellules de tableau dans la page. Voir « Création de styles d’élément HTML », page 139. Pour créer un style et l’appliquer aux tableaux, lignes ou cellules sélectionnés : 1 Créez un style de classe. (Voir « Création de styles de classe », page 141.) 2 Sélectionnez un tableau, une ligne, une cellule ou un groupe de cellules. 3 Dans la palette de feuille de style CSS, effectuez l’une des opérations suivantes : • Sélectionnez la colonne <table> adjacente au nom de style pour appliquer la classe au tableau sélectionné. • Sélectionnez la colonne <td> adjacente au nom de style pour appliquer la classe à la ligne, à la colonne ou au groupe de cellules sélectionné(e). Si une ligne ou une colonne est sélectionnée, le nom de la colonne <td> est suivi du nombre de cellules de la sélection. Pour plus de détails sur l’application de styles de classe, voir « Application de styles », page 153. Méthodes permettant de couper, de copier et de faire glisser les sélections d’un tableau GoLive vous permet de couper, copier, coller et faire glisser des cellules de tableau. Lorsque vous coupez une sélection, vous supprimez une ou plusieurs cellules d’un tableau. En utilisant le copier-coller, vous pouvez remplacer le contenu d’un bloc de cellules similaire, ou placer la sélection sous forme d’un nouveau tableau ou d’un tableau imbriqué si vous la collez à l’intérieur d’une cellule. La méthode de glisser-déposer vous permet de déplacer les cellules sélectionnées dans le tableau parent ou dans un tableau différent, ou de créer un nouveau tableau. Pour couper des lignes et des colonnes : Sélectionnez une ligne, une colonne ou un bloc de lignes ou de colonnes adjacentes, puis effectuez l’une des opérations suivantes : • Dans le menu contextuel ou le menu Edition, choisissez Couper ou Supprimer. • Choisissez Spécial > Tableau, puis Supprimer une colonne ou Supprimer une ligne. • Appuyez sur la touche Suppr. Remarque : Pour supprimer une cellule d’un tableau, vous devez également supprimer les autres cellules qui se trouvent dans la même ligne ou colonne. Pour copier et coller des cellules : 1 Sélectionnez une cellule ou un bloc de cellules adjacentes, puis choisissez Copier dans le menu contextuel ou le menu Edition. 2 Effectuez l’une des opérations suivantes : • Sélectionnez le bloc de cellules que vous souhaitez remplacer, puis choisissez Coller dans le menu contextuel ou le menu Edition pour remplacer le contenu d’un bloc de cellules similaire. Comment utiliser l'aide | Sommaire | Index Page précédente 172 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 173 • Placez un point d’insertion dans la cellule, puis choisissez Coller dans le menu Edition ou le menu contextuel pour placer votre sélection sous forme d’un tableau imbriqué à l’intérieur d’une cellule. • Placez un point d’insertion dans la cellule, puis choisissez Coller dans le menu Edition ou le menu contextuel pour placer votre sélection sous forme d’un nouveau tableau à l’intérieur d’une zone de texte ou d’une boîte flottante. Remarque : Lorsque vous copiez et collez une sélection dans le but de remplacer le contenu d’un bloc de cellules similaire, la sélection cible doit correspondre à la sélection source. Par exemple, si vous copiez quatre cellules d’une ligne, vous ne pouvez utiliser cette sélection que pour remplacer le contenu de quatre autres cellules d’une ligne. Pour faire glisser une sélection : 1 Sélectionnez une cellule ou un bloc de cellules adjacentes dans la page ou le panneau Sélectionner de la palette Tableau, puis placez le pointeur sur l’icône carrée dans le coin supérieur gauche de la sélection pour voir apparaître un pointeur en forme de main . 2 Effectuez l’une des opérations suivantes : • Faites glisser le pointeur pour déplacer la ligne ou la colonne sélectionnée dans le tableau ou pour ajouter une sélection de cellules dans un tableau différent. Relâchez le bouton de la souris lorsqu’une ligne noire apparaît à l’emplacement choisi. Déplacement d’une colonne de tableau dans la fenêtre de document Remarque : Si vous faites glisser plusieurs cellules, vous ne pouvez les ajouter à un tableau différent que si le tableau de destination contient un nombre de lignes identique à celui des cellules que vous déplacez. Si ce n’est pas le cas, la sélection s’affiche sous forme d’un tableau imbriqué à l’intérieur d’une cellule du tableau de destination. • Faites glisser la sélection dans la fenêtre du document en maintenant la touche Ctrl (Windows) ou Option (Mac OS) enfoncée pour la copier dans le tableau existant. Relâchez le bouton de la souris et la touche lorsqu’une ligne noire apparaît à l’emplacement choisi. Comment utiliser l'aide | Sommaire | Index Page précédente 173 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Utilisation de tableaux Page précédente 174 Faites glisser la sélection et relâchez le bouton de la souris lorsqu’un point d’insertion apparaît à l’emplacement voulu pour créer un nouveau tableau à partir d’une sélection de cellules de tableau. Vous pouvez placer un nouveau tableau dans une autre cellule dans la fenêtre du document, dans une zone de texte ou dans une boîte flottante. Ajout de texte à des tableaux GoLive propose différentes méthodes permettant d’ajouter du texte à un tableau. Vous pouvez saisir un texte directement dans une cellule du tableau, le copier et le coller à partir d’une autre application (y compris une feuille de calcul Excel), le faire glisser entre plusieurs cellules ou d’autres conteneurs et importer des données à partir d’un fichier texte. Méthode pour coller et faire glisser un texte dans un tableau Vous pouvez copier un texte ou le faire glisser à partir de pages Web, de fichiers texte ou de documents dans des applications tierces, et l’ajouter aux tableaux dans GoLive. Pour copier et coller des blocs de texte : 1 Effectuez l’une des opérations suivantes : • Dans GoLive, sélectionnez le texte que vous souhaitez copier, puis choisissez Copier dans le menu contextuel ou le menu Edition. • Copiez un bloc de texte dans une autre application. 2 Dans GoLive, placez un point d’insertion dans une cellule de tableau et choisissez Coller dans le menu contextuel ou le menu Edition. Pour faire glisser un texte : Dans GoLive ou une application tierce, sélectionnez le texte que vous souhaitez copier, puis faites-le glisser dans une cellule de tableau vide dans GoLive. Pour copier et coller un texte à partir d’une feuille de calcul Excel ou d’un tableau dans une application tierce : 1 Dans Excel ou dans une autre application tierce, sélectionnez et copiez les cellules que vous souhaitez coller. 2 Dans GoLive, sélectionnez la cellule supérieure gauche qui doit accueillir le contenu copié dans Excel, puis choisissez Coller dans le menu contextuel ou le menu Edition. La copie s’étend sur toutes les colonnes situées à droite et sur toutes les lignes situées en dessous de la cellule sélectionnée. Le tableau ajoute automatiquement des lignes et des colonnes supplémentaires pour inclure toutes les informations copiées. Remarque : Si vous sélectionnez un tableau au lieu d’une cellule, les données séparées par des espaces dans les colonnes remplacent le tableau. Vous devez sélectionner la cellule dans le coin supérieur gauche du tableau ou toutes les cellules du tableau dans lesquelles vous souhaitez coller les données Excel. Comment utiliser l'aide | Sommaire | Index Page précédente 174 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 175 Importation du texte d’une feuille de calcul ou d’une base de données dans un tableau Lorsque vous importez des données dans un tableau, vous devez commencer par formater les données dans un fichier texte pour que GoLive les reconnaisse. S’il s’agit d’un tableau à une seule cellule, il suffit de formater les données telles que vous souhaitez les voir figurer dans ce tableau. Si le tableau comporte plusieurs cellules, il est recommandé de formater les données de telle sorte que chaque ligne de texte représente le contenu d’une ligne de tableau et comporte des séparateurs de colonnes (tabulations, virgules, espaces ou points-virgules) visant à répartir les données entre les différentes colonnes. La plupart des tableurs et des applications de bases de données peuvent exporter des données vers un fichier texte dans un de ces formats. Plutôt que d’utiliser un fichier séparé par des colonnes pour importer des données, vous pouvez tout simplement copier les données des cellules dans une autre application et les coller dans un tableau GoLive. Des lignes et colonnes supplémentaires sont ajoutées automatiquement dans le tableau GoLive, le cas échéant. (Voir « Méthode pour coller et faire glisser un texte dans un tableau », page 174.) Pour importer des données d’un fichier texte dans un tableau : 1 Créez un fichier texte comportant les données que vous souhaitez importer dans un tableau. 2 Dans GoLive, sélectionnez un tableau ou une cellule dans lequel ou laquelle vous souhaitez placer les données importées. Lorsque GoLive procède à l’importation des données dans le tableau, il lui ajoute au besoin des lignes et des colonnes. 3 Cliquez sur Importer dans le panneau Tableau de l’inspecteur du tableau ou sélectionnez Importer du texte délimité par tabulation dans le menu contextuel ou le menu Spécial > Tableau. 4 Dans la boîte de dialogue Ouvrir, sélectionnez le fichier texte voulu, puis choisissez une option dans le menu contextuel Séparateur de colonne pour indiquer le séparateur de colonne utilisé dans le fichier texte. Tri du contenu d’un tableau Vous pouvez trier les lignes ou colonnes d’un tableau de sorte que le contenu d’une ou de plusieurs colonnes ou lignes soit classé par ordre numérique ou alphabétique. Vous pouvez trier l’ensemble du tableau ou des lignes, des colonnes ou des cellules spécifiques. Si, par exemple, vous procédez au tri des lignes d’un tableau et que la première ligne comporte les en-têtes des colonnes, vous pouvez appliquer le tri à l’ensemble du tableau, à l’exception de la première ligne. GoLive procède d’abord au tri par ordre numérique, puis par ordre alphabétique. La casse des caractères est prise en considération, et les éléments sont triés par défaut par ordre croissant. Vous pouvez, si vous le souhaitez, modifier l’ordre et choisir un ordre décroissant. Comment utiliser l'aide | Sommaire | Index Page précédente 175 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 176 Pour trier le contenu d’un tableau : 1 Sélectionnez un tableau ou un groupe de cellules à trier, puis choisissez Trier le tableau dans le menu contextuel ou le menu Spécial > Tableau, ou cliquez sur le bouton Trier dans le panneau Sélectionner de la palette Tableau. 2 Dans la boîte de dialogue Trier le tableau, choisissez des lignes et des colonnes dans le menu contextuel Trier. Sélectionnez Lignes pour afficher le contenu d’une ou de plusieurs colonnes par ordre numérique ou alphabétique. Sélectionnez Colonnes pour afficher le contenu d’une ou de plusieurs lignes par ordre numérique ou alphabétique. 3 Dans le menu contextuel Trier par, effectuez l’une des opérations suivantes : • Si vous avez sélectionné Lignes au point 2, choisissez la première colonne dont vous souhaitez afficher le contenu par ordre numérique ou alphabétique. • Si vous avez sélectionné Colonnes au point 2, choisissez la première ligne dont vous souhaitez afficher le contenu par ordre numérique ou alphabétique. 4 Dans le menu contextuel adjacent, sélectionnez Ordre croissant ou Ordre décroissant pour indiquer l’ordre de tri. 5 Dans le premier menu contextuel Puis par, effectuez l’une des opérations suivantes : • Si vous ne souhaitez pas définir une deuxième colonne ou ligne à trier, sélectionnez Aucun. • Si vous avez sélectionné Lignes au point 2, choisissez une deuxième colonne du tableau pour laquelle vous souhaitez afficher les données par ordre numérique ou alphabétique. • Si vous avez sélectionné Colonnes au point 2, choisissez une deuxième ligne du tableau pour laquelle vous souhaitez afficher les données par ordre numérique ou alphabétique. 6 Dans le menu contextuel adjacent, sélectionnez Ordre croissant ou Ordre décroissant pour indiquer l’ordre de tri. 7 Dans le second menu contextuel Puis par, effectuez l’une des opérations suivantes : • Si vous ne souhaitez pas définir de troisième colonne ou ligne à trier, sélectionnez Aucun. • Si vous avez sélectionné Lignes au point 2, choisissez une troisième colonne du tableau pour laquelle vous souhaitez afficher les données par ordre numérique ou alphabétique. • Si vous avez sélectionné Colonnes au point 2, choisissez une troisième ligne du tableau pour laquelle vous souhaitez afficher les données par ordre numérique ou alphabétique. 8 Dans le menu contextuel adjacent, sélectionnez Ordre croissant ou Ordre décroissant pour indiquer l’ordre de tri. 9 Dans le menu contextuel situé en bas de la boîte de dialogue Trier le tableau, sélectionnez Trier l’ensemble du tableau pour trier tout le tableau. Choisissez Ignorer l’en-tête si vous ne souhaitez pas inclure la première ligne lors du tri du tableau. Si une partie seulement du tableau est sélectionnée, vous pouvez sélectionner Trier les cellules sélectionnées uniquement pour ne trier que la sélection. Comment utiliser l'aide | Sommaire | Index Page précédente 176 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation de tableaux Page précédente 177 Conversion de tableaux en grilles de mise en page Il peut arriver qu’une fois un tableau créé et complété, vous préfériez utiliser une grille de mise en page plutôt que ce tableau. Vous pouvez facilement convertir un tableau en une grille de mise en page dans l’éditeur de mise en page. Les tableaux imbriqués et les cellules du tableau parent contenant un texte ou un objet sont convertis en zones de texte que vous pouvez faire glisser sur la grille de mise en page. Par ailleurs, vous pouvez convertir une grille de mise en page en tableau si vous souhaitez modifier et peaufiner diverses propriétés de tableau de la grille dans l’inspecteur du tableau. Voir « Conversion d’une grille de mise en page en tableau », page 79. Pour convertir un tableau et tous les tableaux imbriqués en grille de mise en page : Dans le panneau Tableau de l’inspecteur du tableau, cliquez sur Convertir. Vous pouvez, si vous le souhaitez, personnaliser la présentation de la grille de mise en page et des zones de texte. Pour plus de détails, voir « Utilisation de la grille de mise en page », page 74 et « Ajout de contenu à la grille de mise en page », page 76. Comment utiliser l'aide | Sommaire | Index Page précédente 177 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 178 Ajout d’images et de fichiers multimédias Présentation de l’ajout d’images Adobe GoLive offre un procédé révolutionnaire aux créateurs pour insérer des images et des fichiers multimédias à partir d’autres applications Adobe de manière plus simple et rapide. Grâce aux objets dynamiques, il est beaucoup plus facile d’ajouter des images compatibles Web ou des mises en page complètes, telles qu'un fichier tranché Photoshop (PSD), à une page Web. Les objets dynamiques permettent une meilleure intégration aux fichiers source créés dans Photoshop, Illustrator et LiveMotion. Ces objets comprennent également une icône générique grâce à laquelle vous pouvez utiliser un fichier source créé dans d'autres applications ainsi que divers formats de fichiers, tels que PDF et EPS. L’utilisation de tels objets offre une grande flexibilité pour le travail sur les fichiers source sans perdre de données ni quitter l'application GoLive. Généralement, vous créez une image destinée au Web dans un programme, tel qu'Adobe Photoshop ou Adobe Illustrator, puis vous l'enregistrez sous un format compatible avec le Web comme JPEG ou GIF. Il est alors recommandé de conserver l'image source à son format et sa résolution d'origine afin de pouvoir, le cas échéant, lui apporter de nouvelles modifications par la suite. (Voir « Optimisation d’images pour le Web », page 197.) Objets dynamiques Les objets dynamiques GoLive rendent superflue la préparation des images dans des programmes, tels que Photoshop ou Illustrator. En fait, hormis les formats SVG et SWF, vous n'avez pas besoin de quitter GoLive pour optimiser vos images. Les objets dynamiques constituent un excellent moyen de conserver la synchronisation entre les images compatibles Web et leurs fichiers source d'origine tout en manipulant les versions formatées pour le Web sur une page Web. Ils sont particulièrement utiles pour la création d'une mise en page Web à l'aide de fichiers tranchés Photoshop. (Voir « Utilisation d’une image tranchée Photoshop », page 189.) A B C D Quatre des icônes disponibles dans le panneau SmartObjects de la palette Objets A. Photoshop B. Illustrator C. LiveMotion D. Objet générique Comment utiliser l'aide | Sommaire | Index Page précédente 178 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 179 GoLive dispose d'une fonction d'enregistrement pour le Web qui assure l'optimisation des images. Cette fonction est automatiquement activée lorsque vous faites glisser un fichier source (au format PSD ou AI par exemple) directement dans GoLive, ce qui vous permet de créer une copie compatible Web qui peut inclure du code HTML, comme dans le cas des fichiers tranchés PSD ou SVG. Cette copie, appelée fichier cible, correspond au contenu qui apparaît sur votre page Web active. (Voir « Ajout d’un objet dynamique dans l’éditeur de mise en page », page 183.) Grâce à la fonction Enregistrer pour le Web de GoLive, vous n'avez plus besoin de quitter GoLive pour modifier une image dynamique (la redimensionner par exemple). Vos fichiers image (PSD, SVG ou AI) sont optimisés à un format compatible avec le Web. Pour plus de détails sur la boîte de dialogue Enregistrer pour le Web de GoLive, voir « A propos de la boîte de dialogue Enregistrer pour le Web », page 200. A C B Objets dynamiques A. Fichier source ajouté à l'éditeur de mise en page B. GoLive active la fonction d’enregistrement pour le Web ou l'application d'origine pour créer un fichier cible. C. L'objet dynamique dans l'éditeur de mise en page conserve un lien entre les fichiers source et cible. Lorsque vous déplacez ou redimensionnez un objet dynamique, l'opération affecte uniquement le fichier cible, le fichier source restant inchangé. Cette procédure sans perte de donnée vous permet de conserver votre image source en pleine résolution et dans son format d'origine (PSD ou AI). Ainsi, votre site Web peut comprendre plusieurs images dynamiques créées à partir du même fichier source, même si leur taille ou leur format diffère. Par exemple, vous pouvez créer une petite image de vignette, puis la lier à l'image d'origine de grande taille. Comment utiliser l'aide | Sommaire | Index Page précédente 179 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 180 Lorsque vous mettez à jour l'image source, GoLive actualise automatiquement les images dynamiques se trouvant sur les pages Web ouvertes dans l'éditeur de mise en page. Ceci vous permet de gagner du temps lorsque votre site comprend une image dans plusieurs formats et limite en outre le risque d'erreur. Lorsque vous mettez à jour l'image source, vous n'avez pas besoin de régénérer ses versions compatibles Web, GoLive le fait automatiquement. Ainsi, vous ne risquez pas de remplacer par inadvertance le fichier source par la version compressée de l'image compatible Web. Remarque : Pour mettre à jour un objet dynamique, il vous suffit d'ouvrir la page le comprenant en mode de mise en page une fois que l'image source a été modifiée. Un autre avantage de l'utilisation d'objets dynamiques est que les images ont une apparence épurée même après leur redimensionnement. GoLive régénère simplement le fichier cible à la nouvelle taille en fonction des paramètres d'optimisation Web définis dans la boîte de dialogue Enregistrer pour le Web. En outre, tout code HTML accompagnant un fichier tranché est automatiquement mis à jour. Encore une fois, ce procédé ne cause aucune perte de données et n'altère pas le fichier source. Vous gagnez du temps, car vous n'avez plus besoin de retourner à l'application d'origine pour modifier votre image. Les fichiers SVG et SWF peuvent également être ajoutés à des pages Web sous la forme d'objets dynamiques. Ces formats de fichiers sont des objets vectoriels comprenant des éléments d'animation interactifs. Pour les créer sous la forme d'objets dynamiques, vous pouvez faire glisser un fichier Illustrator ou LiveMotion dans GoLive ou associer le fichier source à un objet dynamique Illustrator ou LiveMotion. GoLive lance automatiquement Illustrator ou LiveMotion pour générer les fichiers cible optimisés. S’agissant d’objets dynamiques, la modification des éléments SVG ou SWF n'altère pas le fichier source d'origine. Vous pouvez également associer plusieurs fichiers SVG ou SWF à un même fichier source. De plus, la mise à jour du fichier source entraîne celle des fichiers SVG et SWF liés sur les pages ouvertes dans l'éditeur de mise en page. Pour plus de détails sur les options d’optimisation pour les fichiers SVG et SWF, voir « Options d’optimisation pour le format SVG », page 193 et « Options d’optimisation pour le format SWF », page 195. Images tranchées pour la création de pages Web Une autre méthode habituellement utilisée pour créer une page Web consiste à créer une image représentant l’ensemble ou une partie de cette page dans Photoshop ou Illustrator. Ce fichier image est généralement tranché pour créer différentes zones utilisées comme des éléments distincts sur une page Web. Vous pouvez placer des fichiers image tranchés PSD ou SVG (avec le code HTML correspondant) dans GoLive. La fonction de GoLive pour les objets dynamiques optimise chaque tranche et fournit le code de tableau HTML nécessaire. Chaque tranche d’image est automatiquement affectée à la cellule correspondante du tableau. Vous n’avez pas besoin de créer manuellement un tableau HTML pour y placer les différentes tranches d’image. Utilisation des boutons animés dynamiques Un bouton animé est une image qui change lorsque le pointeur de la souris se trouve dessus ou que l’utilisateur clique dessus (options de survol et de clic). Vous pouvez l’utiliser comme un lien vers une autre page Web ou image activée lorsque l’utilisateur clique dessus. Pour créer un bouton animé, vous pouvez utiliser deux ou trois images distinctes, puis laisser GoLive créer le code JavaScript pour afficher l’image correspondant en fonction de l’action de l’utilisateur. Comment utiliser l'aide | Sommaire | Index Page précédente 180 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 181 GoLive vous permet de créer deux types de boutons animés : dynamiques ou simples. Les boutons animés dynamiques servent à imbriquer des actions. Bien que les boutons animés dynamiques génèrent un code JavaScript plus important que les boutons animés simples, GoLive peut extraire ce code et le placer dans un fichier JavaScript externe. Ceci permet par la suite d’obtenir un meilleur résultat que lorsque le code JavaScript est écrit directement dans le code source en ligne. (Voir « Création d’un bouton animé dynamique », page 214.) Les boutons animés simples peuvent s’avérer utiles lorsque vous voulez créer une page Web unique ou transmettre une conception de page à un programmateur Web. Ces boutons n’offrent pas les avantages des boutons animés dynamiques, mais leur code HTML est plus simple. (Voir « Création d’un bouton animé simple », page 215.) Que vous utilisiez des boutons animés dynamiques ou simples, GoLive assure la gestion des liens au sein du code JavaScript. Il peut également exporter la totalité du code JavaScript dans un fichier distinct dont les performances sont identiques à celles d’images stockées dans la mémoire cache du navigateur Web. Ceci permet le chargement plus rapide de vos sites Web, lorsqu’ils sont téléchargés et visualisés dans un navigateur. Photoshop fournit des préférences pour générer ce type de code pour GoLive. Si aucune action « onclick » n’est appliquée à un bouton animé dynamique lié à une autre page et que vous modifiez le nom ou l’emplacement de cette page, GoLive vous invite automatiquement à modifier la référence du lien pour le bouton. En outre, GoLive dispose d’une fonction très performante pour détecter les images du bouton animé qui vous permet de gagner du temps lors de l’affectation des images de bouton animé. Il vous suffit de spécifier le nom du fichier de l’image normale (affichée lorsque la page Web est ouverte pour la première fois) dans l’inspecteur, puis de vous assurer que les noms attribués aux actions de survol et de clic respectent bien les conventions utilisées pour les fichiers dans GoLive. GoLive utilise ces conventions pour affecter les autres images de boutons animés (pour les actions de survol et de clic) et fournir le code JavaScript nécessaire à l’activation. (Voir « Création de boutons animés », page 212.) Variables Les variables vous permettent de créer plusieurs versions d’un même fichier image source. Prenons l’exemple d’une image dont le texte indique le prix d’un article. Si vous souhaitez modifier rapidement ce prix, vous n’avez pas besoin de créer d’autres fichiers images. Il vous suffit de modifier la variable texte de l’image. Lorsque vous ajoutez une image créée dans Illustrator (SVG uniquement), LiveMotion (LIV) ou Photoshop (PSD) à une page Web en tant qu’objet dynamique, GoLive recherche les variables du fichier. En fonction du type de l’image (fichier Illustrator, LiveMotion ou Photoshop), vous pouvez définir des variables affectant des éléments, tels que le contenu du texte, la visibilité de l’image ou la couleur, le style et la texture de l’objet. (Voir « Utilisation de variables dans un fichier LiveMotion », page 219.) Conversion du texte en bannière GoLive dispose également d’une commande Convertir le texte en bannière qui vous permet de transformer le texte statique d’une page Web en image ou en animation SWF pour ajouter un élément de navigation attrayant à votre page Web. Pour ce faire, vous sélectionnez du texte HTML, choisissez la commande Convertir le texte en bannière et sélectionnez un fichier source PSD, SVG ou LIV comprenant des variables. Le texte HTML sélectionné est affecté à la première variable de texte. Ensuite, il vous suffit d’utiliser le flux de production de variables d’objets dynamiques pour créer le fichier cible. (Voir « Conversion du texte en image sur une page Web », page 221.) Comment utiliser l'aide | Sommaire | Index Page précédente 181 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 182 Fichiers multimédias GoLive prend en charge plusieurs modules externes permettant aux navigateurs de lire des fichiers multimédias et de placer des éléments audio et vidéo sur une page Web. Pour plus de détails sur l’ajout de fichiers multimédias à une page Web, voir « Ajout de fichiers multimédias à une page Web », page 229. A B C D E Icônes de fichiers multimédias disponibles dans le panneau Standard de la palette Objets A. Module externe B. SWF C. QuickTime D. Real E. SVG Ajout d’images à une page Web à l’aide d’objets dynamiques Les objets dynamiques constituent une méthode considérablement plus efficace que la procédure traditionnelle pour ajouter des images aux pages Web. Lorsque vous ajoutez des fichiers source Photoshop (PSD, BMP, PICT pour Mac OS uniquement, PCX, Pixar, Amiga IFF, TIFF et TARGA), Illustrator (AI et SVG), LiveMotion ou EPS à votre mise en page, GoLive insère automatiquement une balise d’emplacement d’objet dynamique dans l’éditeur de mise en page. Si votre fichier PSD, SVG ou LIV contient des variables, GoLive vous permet de définir leurs paramètres. Pour un fichier LIV, vous définissez également la couleur du cache. Ensuite, GoLive vous invite à optimiser l’image, crée un fichier cible (copie du fichier source à un format compatible avec le Web) et conserve un lien vers le fichier source. Le fichier cible (pas le fichier source) peut être téléchargé vers le serveur Web car il s’agit de l’élément de construction Web référencé actif. Lorsque GoLive génère le fichier cible, le fichier source reste inchangé et les paramètres d’optimisation sont enregistrés avec le fichier cible. Ceci vous permet de générer plusieurs copies ou versions du fichier source sur votre site Web. GoLive peut créer les fichiers cible au format d’image bitmap (pour Photoshop, Illustrator, EPS ou PDF), SVG (pour Illustrator) ou SWF (pour Illustrator ou LiveMotion). Pour plus de détails sur les formats d’images compatibles avec le Web, voir « Optimisation d’images pour le Web », page 197. Utilisation des objets dynamiques L’objet image dans l’éditeur de mise en page qui conserve un lien vers le fichier cible et le fichier source est appelé un objet dynamique. L’avantage des objets dynamiques est de pouvoir changer les paramètres pour le fichier image et apporter des de légères modifications (telles que le redimensionnement) dans GoLive sans devoir quitter l’application. Il suffit alors de cliquer deux fois sur un objet dynamique dans l’éditeur de mise en page pour ouvrir son fichier source dans son application d’origine, telle que Photoshop, Illustrator ou LiveMotion. Lorsque vous modifiez l’image source, GoLive met automatiquement à jour l’image cible. Pour plus de détails sur l’utilisation des objets dynamiques et d’autres options d’image, telles que l’ajout de liens, de texte de remplacement et de bords, voir « Options supplémentaires relatives aux images », page 186. Comment utiliser l'aide | Sommaire | Index Page précédente 182 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 183 Lorsque vous utilisez des images et des fichiers multimédias, vérifiez qu’ils sont tous placés dans votre fenêtre du site, y compris les fichiers sources. Vous pouvez stocker les fichiers source dans le sous-dossier d’objets dynamiques de votre dossier de données de site. Faites glisser les fichiers source jusqu’au sous-dossier d’objets dynamiques dans le panneau Divers de la fenêtre du site. Le fait de conserver tous vos fichiers dans la fenêtre du site facilite grandement la gestion des fichiers image, car ils sont tous dans la hiérarchie de vos dossiers de site. Cela évite de rompre des liens (images et fichiers multimédias n’apparaissant pas sur votre page Web active). Si vous ne voyez pas les fichiers dans la fenêtre de site après les avoir ajoutés à un dossier (par exemple appelé « images »), cliquez sur le bouton Rafraîchir la vue de la barre d’outils. Pour plus de détails sur la gestion des fichiers et dossiers image, voir « A propos des fichiers et des dossiers de site », page 293 et « A propos des sites GoLive », page 38. Ajout d’un objet dynamique dans l’éditeur de mise en page Pour ajouter un objet dynamique à une mise en page Web dans GoLive, il vous suffit de faire glisser un fichier source dans l’éditeur de mise en page. Vous pouvez également spécifier le fichier source dans l’inspecteur. Pour ajouter un objet dynamique à votre page Web : 1 Effectuez l’une des opérations suivantes : • Faites glisser un fichier Photoshop, Illustrator, LiveMotion, PDF ou EPS dans l’éditeur de mise en page. • Choisissez le panneau SmartObjects dans la palette Objets, puis faites glisser une icône d’objet dynamique correspondant au type d’objet créé (Photoshop, Illustrator, LiveMotion ou objet générique) du panneau SmartObjects de la palette Objets jusqu’à l’éditeur de mise en page. Remarque : L’objet générique est utilisé pour les fichiers source des formats suivants : BMP, PICT pour Mac OS uniquement, PCX, Pixar, Amiga IFF, TIFF, TARGA, PDF, EPS, JPEG (par ex. pour un appareil photo numérique) et PNG. • Cliquez deux fois sur une icône d’objet dynamique dans le panneau SmartObjects la palette Objets. de • Cliquez n’importe où dans l’éditeur de mise en page avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS), puis choisissez Insérer l’objet > SmartObjects et Photoshop, Illustrator ou LiveMotion. Remarque : Le panneau SmartObjects dans la palette Objets et le menu contextuel ne comprennent pas l’icône d’objet dynamique LiveMotion si ce programme n’est pas installé sur votre ordinateur. 2 Sélectionnez la balise d’emplacement d’objet dynamique dans l’éditeur de mise en page, puis spécifiez un fichier pour l’image dans l’inspecteur des images dynamiques. Comment utiliser l'aide | Sommaire | Index Page précédente 183 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 184 En fonction du type de fichier ajouté (Illustrator, Photoshop ou LiveMotion), GoLive ouvre la boîte de dialogue Enregistrer pour le Web et vous invite à choisir un format d’optimisation ou active l’application d’origine du fichier source pour générer le fichier optimisé. Pour plus de détails sur le reste de la procédure correspondant aux différents types d’images, voir « Ajout d’un objet dynamique Photoshop », page 188, « Ajout d’une illustration Illustrator », page 190 et « Ajout de fichiers LiveMotion », page 196. Si vous décidez par la suite de supprimer la fonction d’objet dynamique pour une image, GoLive peut convertir un objet dynamique en objet standard. Sélectionnez l’objet dynamique dans l’éditeur de mise en page, ouvrez le menu contextuel et choisissez la commande de conversion en objet standard pour rompre le lien actif entre les fichiers cible et source. Cette commande supprime en outre l’ensemble du code HTML spécifique à GoLive de l’objet dynamique ainsi que les données de configuration du fichier cible. (Voir « Options supplémentaires relatives aux images », page 186.) Mise à jour des objets dynamiques Les objets dynamiques conservent un lien entre les fichiers source et cible. Si vous devez mettre à jour le fichier source, vous pouvez l’ouvrir dans son application d’origine à partir de GoLive. Vous pouvez également mettre à jour le fichier cible sans quitter GoLive. Remarque : Sous Windows, un fichier SVG est ouvert dans le navigateur par défaut. Pour changer ce navigateur dans GoLive, choisissez Edition > Configuration de la base de données Web, cliquez sur l’onglet Association de fichiers, développez l’arborescence de l’élément « image/ » et spécifiez une autre application pour les fichiers SVG. Pour ouvrir un objet dynamique dans son application d’origine : Effectuez l’une des opérations suivantes : • Cliquez deux fois sur cet objet dans l’éditeur de mise en page. • Dans le menu contextuel, pointez sur Lien de la source, puis choisissez Modifier l’original ou l’application correspondante (Photoshop, Illustrator ou LiveMotion). Remarque : Dans l’éditeur de mise en page, lorsque vous cliquez deux fois sur un fichier PSD comprenant un élément JavaScript (tel qu’un bouton animé ou une animation), GoLive lance Photoshop (Windows) ou ImageReady (Mac OS). Sous Windows, vous devez alors passer à ImageReady pour modifier le bouton animé ou l’animation. L’objet dynamique est ouvert dans son application d’origine, ce qui vous permet de modifier l’image et d’enregistrer vos modifications. Lorsque vous retournez à l’éditeur de mise en page avec l’objet dynamique, GoLive met à jour le fichier cible conformément à vos modifications. Si l’application d’origine de l’objet dynamique ne s’ouvre pas, effectuez les opérations suivantes : Choisissez Edition > Préférences, développez l’arborescence des préférences générales, puis sélectionnez Interface utilisateur. Assurez-vous que l’option Lancer d’autres applications pour modifier les fichiers multimédias est activée. Pour réoptimiser ou mettre à jour le fichier cible d’un objet dynamique : 1 Sélectionnez un objet dynamique dans l’éditeur de mise en page. 2 Cliquez sur le bouton Configuration dans l’inspecteur. Comment utiliser l'aide | Sommaire | Index Page précédente 184 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 185 Si l’objet dynamique est au format d’image bitmap, la boîte de dialogue Enregistrer pour le Web est ouverte. S’il s’agit d’un fichier image au format SVG ou SWF, GoLive lance l’application d’origine du fichier. Redimensionnement d’objets dynamiques dans GoLive GoLive permet de modifier les dimensions d’un objet dynamique manuellement en faisant glisser l’une de ses poignées de redimensionnement. Lorsque vous relâchez le bouton de la souris, le programme active la fonction d’enregistrement pour le Web, puis régénère le fichier cible en fonction des derniers paramètres d’optimisation appliqués, sans modifier le fichier source original. Ce redimensionnement fonctionne également pour les fichiers tranchés, tels que des images tranchées PSD utilisées pour des mises en page Web. Pour ces fichiers, l’image entière est réoptimisée avec le code HTML qui est mis à jour en fonction des nouvelles tranches et de leurs positions. Remarque : Etant donné que les formats SWF et SVG sont vectoriels, leurs objets dynamiques (LiveMotion ou Illustrator) sont réoptimisés lors du redimensionnement. Si vous redimensionnez une image d’objet dynamique et que vous souhaitez rétablir sa taille d’origine, cliquez sur le bouton Définir comme taille d’origine dans le panneau Standard de l’inspecteur d’image dynamique. Vous disposez en outre du menu contextuel Ajuster aux dimensions dans l’inspecteur d’image dynamique pour définir le redimensionnement de l’image lorsque ses proportions ne sont pas respectées. Cette fonction est particulièrement utile lorsque vous modifiez un modèle de page. Copie d’un objet dynamique Vous pouvez sélectionner un objet dynamique dans l’éditeur de mise en page, puis utiliser les commandes copier et coller de votre ordinateur pour le copier à un autre endroit. La copie comprend toutes les informations de fichier de l’objet dynamique original, y compris les liens vers les fichiers source et cible d’origine. Vous devez définir un nouveau fichier cible pour la copie de l’objet dynamique. (Voir « Définition d’un nouveau fichier cible pour un objet dynamique », page 185.) Définition d’un nouveau fichier cible pour un objet dynamique Vous pouvez spécifier un nouveau fichier cible pour l’objet dynamique sans supprimer l’ancienne cible. Ceci est important lorsque vous copiez et collez des objets dynamiques. Pour créer un nouveau fichier cible pour un objet dynamique : 1 Dans l’éditeur de mise en page, sélectionnez l’objet dynamique. 2 Effectuez l’une des opérations suivantes : • Utilisez le menu contextuel pour choisir Nouveau fichier cible. • Dans le panneau Standard de l’inspecteur d’image, cliquez sur l’icône de dossier à droite de l’URL cible. Si le fichier cible de l’objet dynamique est une image bitmap, GoLive active la fonction Enregistrer pour le Web afin de créer un nouveau fichier cible. S’il s’agit d’une image SVG, GoLive lance Illustrator pour créer le nouveau fichier cible. S’il s’agit d’une image SWF, GoLive lance LiveMotion pour le créer. Comment utiliser l'aide | Sommaire | Index Page précédente 185 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 186 Options supplémentaires relatives aux images Les panneaux Standard, Avancé et Liens de l’inspecteur d’image dynamique contiennent des options supplémentaires pour les images qui vous permettent de définir un texte de remplacement pour l’image, ouvrir l’application d’origine de l’image, lier l’image à une adresse URL (Universal Resource Locator), sélectionner une version de faible résolution de l’image et incorporer un profil ICC. (Voir « Création d’images source de faible résolution », page 227 et « Utilisation de ColorSync avec des images JPEG (Mac OS) », page 228.) Certaines de ces options sont disponibles dans le menu contextuel de l’éditeur de mise en page. Le texte de remplacement est visualisé dans les navigateurs configurés pour ne pas afficher d’images ; il est également utilisé par les logiciels de reconnaissance vocale. Ce texte est aussi affiché dans le navigateur lorsqu’un utilisateur survole l’image avec le pointeur de la souris (Windows uniquement). Il s’avère utile pour les menus à images qui n’ont pas été entièrement téléchargées. Pour associer un texte de remplacement à une image : 1 Sélectionnez l’image ou l’objet dynamique sur votre page Web. 2 Dans le panneau Standard de l’inspecteur d’image dynamique, saisissez un texte dans la zone de texte Texte de remplacement. Remarque : Il est vivement recommandé de spécifier un texte de remplacement pour toutes les images. Par exemple, ce texte peut être lu par certains logiciels utilisés par les malvoyants. Par défaut, GoLive ajoute le mot « text » dans la zone du texte de remplacement. Pour activer un cadre autour de l’image et ajuster sa largeur : 1 Sélectionnez l’image ou l’objet dynamique, puis cochez la case Bord dans le panneau Standard de l’inspecteur de l’image dynamique. 2 Indiquez la largeur du bord en pixels et appuyez sur Entrée (Windows) ou Retour (Mac OS). Pour associer un lien à une image : Sélectionnez l’image et effectuez l’une des opérations suivantes : • Dans le panneau Liens de l’inspecteur d’image dynamique, spécifiez un fichier de destination pour le lien. • Utilisez le menu contextuel pour spécifier le fichier de destination du lien. Remarque : Vous pouvez associer ou modifier un lien incorporé dans un objet dynamique LiveMotion qui contient des variables. Il est également possible de mettre à jour les liens incorporés dans un fichier SVG à l’aide de la palette des liens entrants et sortants. (Voir « Utilisation de variables dans un fichier LiveMotion », page 219 et « Modification des liens dans un fichier SVG », page 192.) Si l’option Avertissements associés aux liens est sélectionnée, le bord d’une image est mis en évidence lorsque son lien est rompu. (Voir « Correction des erreurs de site », page 328.) Comment utiliser l'aide | Sommaire | Index Page précédente 186 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 187 Pour utiliser le menu Variable : Lorsque vous modifiez un modèle de page, vous pouvez définir le type d’affichage de l’objet dynamique sur la page. Choisissez l'une des options suivantes : • L’option Ajuster aux dimensions permet d’afficher la totalité de l’image dans la zone spécifiée. Les proportions d’origine ne sont pas conservées. Une distorsion risque de se produire. • L’option Aucun bord permet de définir l’image de telle sorte qu’elle remplisse la zone spécifiée tout en conservant ses proportions d’origine de l’image ou du fichier multimédia. Certaines parties de l’image ou du fichier multimédia risquent d’être écrêtées. Aucune distorsion ne se produit. • L’option Tout afficher permet de rendre la totalité de l’image ou du fichier multimédia visible dans la zone spécifiée tout en conservant ses proportions d’origine. Aucune distorsion ne se produit. Des bords transparents ou de la couleur du cache risquent d’apparaître des deux côtés de l’image ou du fichier multimédia. Pour modifier la couleur du cache (fond) d’un objet dynamique : 1 Effectuez l’une des opérations suivantes : • Cliquez sur un objet dynamique avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS) pour afficher le menu contextuel. • Faites glisser une couleur de la palette de couleurs sur l’objet dynamique. Si vous choisissez cette méthode, vous pouvez ignorer les instructions du point 2. 2 Choisissez Couleur du cache, puis l’option Aucun, Blanc, Noir ou Fond (la couleur d’arrière-plan de la page Web). Remarque : Les objets dynamiques Illustrator optimisés en SVG ou SWF ne permettent pas la modification de la couleur du cache. Pour convertir un objet dynamique en objet standard : 1 Cliquez sur un objet dynamique avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS). 2 Effectuez l’une des opérations suivantes : • Si votre objet dynamique est au format d’image bitmap, choisissez Convertir en image standard. • Si votre objet dynamique est une image au format SVG ou SWF, choisissez Convertir vers le module externe standard. • Si votre objet dynamique est une image tranchée Photoshop ou Illustrator, choisissez Convertir en tableau standard. La conversion d’objets dynamiques en objets standard est un moyen efficace de supprimer le lien entre le fichier cible et ce fichier source. De cette manière, si le fichier source subit une modification quelconque, l’image du fichier cible n’est plus mise à jour pour refléter celles-ci. Comment utiliser l'aide | Sommaire | Index Page précédente 187 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 188 Ajout d’images Photoshop Les concepteurs utilisent depuis longtemps Photoshop afin de créer des images et des mises en page pour le Web. GoLive Les objets dynamiques vous permettent d’ajouter facilement des fichiers Adobe Photoshop à une page Web, ce qui évite aux concepteurs de créer un nouveau tableau HTML pour y placer leurs tranches d’image PSD optimisées. Les fichiers PSD doivent être des images à 8 bits et peuvent être tranchés. Les procédures permettant de créer un lien vers des images Photoshop tranchées ou non diffèrent quelque peu, comme indiqué ci-après. Pour plus de détails sur l’utilisation des images tranchées Photoshop, voir « Utilisation d’une image tranchée Photoshop », page 189, « Utilisation de tranches lors de l’optimisation », page 209 et « Présentation des fonctions de mise en page », page 70. GoLive prend également en charge les formats de fichiers JPEG, GIF,PNG, BMP, PICT (Mac OS uniquement), PCX, Pixar, PDF, EPS, Amiga IFF, TIFF et TARGA. Remarque : GoLive ne vous permet pas de modifier les attributs de tableau de manière individuelle avec un objet PSD tranché. Photoshop dispose des commandes et options nécessaires à la modification des attributs de tableau. A moins que votre fichier soit composé de tranches de calque, les fichiers de calques Photoshop importés en tant qu’objets dynamiques sont aplatis pour former une seule image durant le processus d’optimisation et de conversion. En outre, si le fichier source PSD a plusieurs calques dont un calque de texte, GoLive traite le calque de texte de premier plan comme une variable. Vous disposez ainsi d’un outil performant pour créer plusieurs versions d’un fichier source avec un texte différent. Pour plus de détails sur l’utilisation des variables, voir « Utilisation d’une variable de texte dans un fichier Photoshop », page 220. Au contraire, pour conserver les calques d’un fichier Photoshop en tant qu’images distinctes, voir « Utilisation de fichiers de calques Photoshop », page 226. Ajout d’un objet dynamique Photoshop Lorsque vous créer un objet dynamique Photoshop pour la première fois, la boîte de dialogue Enregistrer pour le Web de GoLive fournit un éventail complet d’options pour contrôler l’optimisation d’une copie compatible Web de l’image source. Cette boîte de dialogue vous permet d’afficher un aperçu des images optimisées dans divers formats de fichiers image compatibles Web et avec différents attributs de fichiers. Vous pouvez visualiser simultanément plusieurs versions d’une image et modifier les paramètres d’optimisation tout en affichant l’aperçu de l’image, afin de choisir la meilleure combinaison possible compte tenu de vos besoins. Vous avez également la possibilité d’utiliser des paramètres prédéfinis pour sélectionner des options personnalisées. Pour ajouter un objet dynamique Photoshop : 1 Ajoutez un objet dynamique Photoshop à votre page. Pour plus de détails sur l’ajout d’un objet dynamique à une page Web, voir « Ajout d’un objet dynamique dans l’éditeur de mise en page », page 183. 2 Si le fichier Photoshop comprend plusieurs calques dont un calque de texte, GoLive ouvre la boîte de dialogue Configuration des variables. Le cas échéant, sélectionnez l’option Utiliser, remplacez le texte qui se trouve dans la zone de texte et cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 188 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 189 3 Dans la boîte de dialogue Enregistrer pour le Web, sélectionnez des paramètres d’optimisation prédéfinis dans le menu contextuel Paramètres ou personnalisez-les à l’aide des menus contextuels disponibles, puis cliquez sur OK. Pour plus de détails sur l’utilisation de la boîte de dialogue Enregistrer pour le Web, voir « Optimisation d’images pour le Web », page 197. 4 Enregistrez le fichier cible dans le dossier du site (par exemple, dans un sous-dossier appelé « images »), puis cliquez sur Enregistrer. Si vous n’enregistrez pas le fichier dans le dossier du site, le lien ne sera pas valable. Utilisation d’une image tranchée Photoshop La possibilité d’utiliser des images tranchées Photoshop dans GoLive en fait un outil performant pour les concepteurs, leur permettant de créer et mettre en page des sites Web. Lorsque l’objet dynamique Photoshop est lié à une image source contenant des tranches, GoLive enregistre chacune d’elles en tant qu’image distincte compatible Web avec du code HTML. GoLive vous demande tout d’abord de préciser un emplacement où il crée automatiquement un dossier image_nom.data pour les images. Pour les images contenant des animations de cadres ou des objets tranchés interactifs JavaScript, importez le fichier de Photoshop dans GoLive. Pour plus de détails sur la mise en page à l’aide d’une image tranchée Photoshop, voir « Présentation des fonctions de mise en page », page 70. Pour ajouter un objet dynamique tranché Photoshop : 1 Ajoutez un objet dynamique Photoshop à votre page. Pour plus de détails sur l’ajout d’un objet dynamique à une page Web, voir « Ajout d’un objet dynamique dans l’éditeur de mise en page », page 183. 2 Si le fichier tranché Photoshop comprend plusieurs calques dont un calque de texte, GoLive ouvre la boîte de dialogue Configuration des variables avec le texte du calque de premier plan. Le cas échéant, remplacez le texte existant, puis cliquez sur OK. (Voir « Utilisation d’une variable de texte dans un fichier Photoshop », page 220.) 3 Dans la boîte de dialogue Enregistrer pour le Web, sélectionnez des paramètres d’optimisation prédéfinis dans le menu contextuel Paramètres ou personnalisez-les à l’aide des menus contextuels disponibles. Pour plus de détails sur l’utilisation de la boîte de dialogue Enregistrer pour le Web avec une image tranchée, voir « Optimisation d’images pour le Web », page 197 et « Utilisation de tranches lors de l’optimisation », page 209. Vous pouvez spécifier un jeu de paramètres pour les tranches en sélectionnant une tranche à l’aide de l’outil correspondant , puis une optimisation. Les tranches automatiques étant liées entre elles dans une image, un jeu de paramètres s’applique à l’ensemble des tranches. Les tranches utilisateur peuvent avoir des paramètres individuels. Pour plus de détails sur l’utilisation des tranches avec la boîte de dialogue Enregistrer pour le Web, voir « Application de paramètres d’optimisation », page 203. Vous pouvez également spécifier une taille pour l’image tranchée à l’aide de la palette Taille de l’image. (Voir « Utilisation de la palette Taille de l’image », page 209.) 4 Sélectionnez l’emplacement où vous souhaitez enregistrer le fichier de données cible (image_nom.data) et cliquez sur Enregistrer. Comment utiliser l'aide | Sommaire | Index Page précédente 189 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 190 Pour associer un lien et un texte de remplacement à une tranche : 1 Sélectionnez une tranche dans l’objet dynamique. 2 Dans l’inspecteur de tranche utilisateur, cliquez sur le bouton Lien fichier de destination pour le lien. et spécifiez un 3 Spécifiez une cible pour déterminer l’emplacement auquel l’adresse URL est ouverte lorsque l’utilisateur clique sur la tranche. 4 Saisissez un texte dans la zone de texte de remplacement pour l’associer à la tranche. Pour plus de détails sur l’utilisation du texte de remplacement, voir « Options supplémentaires relatives aux images », page 186. Pour mettre à jour l’optimisation ou la taille d’un objet dynamique tranché : 1 Sélectionnez l’objet dynamique tranché. 2 Dans l’inspecteur de tableau Photoshop, cliquez sur le bouton Configuration. 3 Sélectionnez l’emplacement où vous souhaitez enregistrer le fichier de données cible mis à jour (.data) et cliquez sur Enregistrer. 4 Dans la boîte de dialogue Enregistrer pour le Web, sélectionnez des paramètres d’optimisation prédéfinis dans le menu contextuel Paramètres ou personnalisez-les à l’aide des menus contextuels disponibles. Pour plus de détails sur l’utilisation de la boîte de dialogue Enregistrer pour le Web, voir « Optimisation d’images pour le Web », page 197 et « Utilisation de tranches lors de l’optimisation », page 209. Vous pouvez également spécifier une taille pour l’image tranchée à l’aide de la palette Taille de l’image. (Voir « Utilisation de la palette Taille de l’image », page 209.) 5 Cliquez sur Enregistrer. Ajout d’une illustration Illustrator Les concepteurs utilisent souvent Illustrator pour la mise en page et la création d’images de sites Web. GoLive vous permet d’importer des fichiers Adobe Illustrator dans une page Web à l’aide des objets dynamiques. Comme pour les objets dynamiques Photoshop, GoLive crée un fichier cible et conserve le lien entre ce dernier et le fichier source. Pour plus de détails sur les objets dynamiques, voir « Utilisation des objets dynamiques », page 182. Ajout d’un objet dynamique Illustrator Les fichiers source des objets dynamiques Illustrator peuvent être au format Illustrator AI ou Illustrator SVG. Les fichiers cible créés à partir d’un fichier source AI peuvent être aux formats d’images bitmap (GIF, JPEG, PNG ou WBMP), SVG, SVGZ et SWF. Les fichiers cible créés à partir d’un fichier source SVG peuvent être aux formats GIF, JPEG, PNG et WBMP. Les tranches et les variables sont prises en charge uniquement dans les fichiers SVG. Pour plus de détails sur l’utilisation d’un fichier tranché Illustrator SVG, voir « Utilisation d’une image tranchée Illustrator SVG », page 192. Remarque : GoLive ne prend pas en charge les fichiers Illustrator à calques multiples. Les images Illustrator à calques sont aplaties lors du processus d’optimisation et de conversion. Comment utiliser l'aide | Sommaire | Index Page précédente 190 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 191 Si vous optimisez à partir du format SVG et que le fichier source Illustrator comprend des variables, GoLive peut manipuler ces dernières pour modifier le contenu et la visibilité de l’objet. Ceci vous permet de créer différentes images à partir du même fichier source. Pour plus de détails sur l’utilisation des variables, voir « Utilisation de variables dans un fichier Illustrator SVG », page 220. Remarque : La mise à jour automatique n’a pas lieu si l’image redimensionnée est optimisée au format SWF ou SVG, du fait que ces deux formats sont vectoriels. Vous pouvez également cliquer deux fois sur une image dynamique Illustrator dans l’éditeur de mise en page pour ouvrir l’image source originale dans Adobe Illustrator. Les objets SVG sous Windows constituent une exception. Si vous cliquez deux fois sur un objet dynamique Illustrator (SVG), il est ouvert dans le navigateur par défaut. Pour ajouter un objet dynamique Illustrator et l’enregistrer aux formats d’images bitmap : 1 Ajoutez un objet dynamique Illustrator à votre page (AI ou SVG). Pour plus de détails sur l’ajout d’un objet dynamique à une page Web, voir « Ajout d’un objet dynamique dans l’éditeur de mise en page », page 183. 2 Dans la boîte de dialogue Configuration de la conversion, choisissez Formats d’images bitmap, puis cliquez sur OK. Remarque : La boîte de dialogue Configuration de la conversion est affichée uniquement pour les fichiers AI, pas pour les fichiers SVG. 3 Si votre fichier Illustrator SVG comprend des variables, GoLive ouvre automatiquement la boîte de dialogue Configuration des variables. Le cas échéant, vous pouvez modifier le contenu du texte du fichier Illustrator. Il est également possible de spécifier la visibilité d’un objet variable. Pour plus de détails sur les variables, voir « Utilisation de variables dans un fichier Illustrator SVG », page 220. 4 Dans la boîte de dialogue Enregistrer pour le Web, cliquez sur l’un des onglets audessus de l’image affichée afin de sélectionner une vue. Remarque : Pour plus de détails sur les vues d’optimisation, voir « A propos de la boîte de dialogue Enregistrer pour le Web », page 200. 5 Sélectionnez des paramètres d’optimisation prédéfinis dans le menu contextuel Paramètres ou personnalisez-les à l’aide des menus contextuels disponibles, puis cliquez sur Enregistrer. 6 Dans la boîte de dialogue Spécifier le fichier cible, sélectionnez le dossier dans lequel vous souhaitez enregistrer l’image convertie, puis cliquez sur Enregistrer. Remarque : Vous devez enregistrer le fichier cible dans votre dossier du site, sinon le lien entre l’objet dynamique et le fichier cible est incorrect. Pour ajouter un objet dynamique Illustrator au format SVG, SVG compressé ou SWF : 1 Ajoutez un objet dynamique Illustrator à votre page (uniquement AI, pas SVG). Pour plus de détails sur l’ajout d’un objet dynamique à une page Web, voir « Ajout d’un objet dynamique dans l’éditeur de mise en page », page 183. 2 Dans la boîte de dialogue Configuration de la conversion, choisissez SVG, SVG compressé ou SWF, puis cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 191 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 192 GoLive lance l’application Illustrator. Cette application ouvre une boîte de dialogue avec les options d’optimisation correspondant au format sélectionné dans la boîte de dialogue Configuration de la conversion. Pour les fichiers SVG, il est important de sélectionner l’option Incorporer plutôt que Lien si le fichier AI contient une image pixellisée. 3 Sélectionnez les paramètres d’optimisation voulus et cliquez sur OK. Pour plus de détails sur les paramètres d’optimisation pour les formats SVG et SWF, voir « Options d’optimisation pour le format SVG », page 193 ou « Options d’optimisation pour le format SWF », page 195. 4 Dans la boîte de dialogue Spécifier le fichier cible, sélectionnez le dossier dans lequel vous souhaitez enregistrer l’image convertie. Ce dossier doit être un sous-dossier de celui du site, sinon le lien entre l’objet dynamique et le fichier cible est incorrect. 5 Cliquez sur Enregistrer. Pour plus de détails sur la configuration des fichiers SVG et SWF à l’aide des panneaux Standard, Avancé et Attributs de l’inspecteur de module externe, voir « Ajout de fichiers multimédias à une page Web », page 229. Modification des liens dans un fichier SVG Si votre fichier Illustrator SVG comprend un lien vers un autre fichier, GoLive peut le détecter. Lorsque le fichier est déplacé, GoLive vous invite automatiquement à mettre le lien à jour. Utilisez la palette des liens entrants et sortants pour rétablir ou modifier un lien dans votre fichier SVG. Pour mettre à jour un lien dans un fichier SVG : 1 Dans l’éditeur de mise en page, sélectionnez un objet SVG avec des liens internes ou externes. 2 Si nécessaire, choisissez Fenêtre > Liens entrants et sortants et dans la palette du même nom, spécifiez un fichier de destination pour le lien. Il est recommandé de cliquer sur l’onglet Externe de la fenêtre du site pour afficher tous les liens externes redirigés. Utilisation d’une image tranchée Illustrator SVG Désormais, lorsque vous utilisez un objet dynamique Illustrator, GoLive traite ses tranches de manière similaire à celle d’un objet Photoshop. Vous pouvez utiliser une image SVG tranchée pour créer une page Web en ajoutant des objets, tels qu’une barre de navigation ou des boutons. Chaque tranche peut être liée à une URL et désigner la cible ouverte à son activation. Les tranches peuvent également avoir plusieurs couleurs de cache (arrièreplan). Comme pour une image tranchée Photoshop, vous pouvez associer un lien et mettre à jour une image tranchée SVG. (Voir « Utilisation de tranches lors de l’optimisation », page 209.) Remarque : GoLive prend en charge uniquement les tranches d’une image Illustrator enregistrée au format SVG. Comment utiliser l'aide | Sommaire | Index Page précédente 192 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 193 Pour ajouter une image tranchée Illustrator SVG à une page Web : 1 Ajouter un objet dynamique tranché Illustrator au format SVG à votre page. Pour plus de détails sur l’ajout d’un objet dynamique à une page Web, voir « Ajout d’un objet dynamique dans l’éditeur de mise en page », page 183. 2 Sélectionnez l’emplacement où vous souhaitez enregistrer le fichier de données cible (image_nom.data) et cliquez sur Enregistrer. 3 Dans la boîte de dialogue Enregistrer pour le Web, sélectionnez des paramètres d’optimisation prédéfinis dans le menu contextuel Paramètres ou personnalisez-les à l’aide des menus contextuels disponibles. Pour plus de détails sur l’utilisation de la boîte de dialogue Enregistrer pour le Web avec une image tranchée, voir « Optimisation d’images pour le Web », page 197 et « Utilisation de tranches lors de l’optimisation », page 209. Vous pouvez spécifier un jeu de paramètres pour les tranches en sélectionnant une tranche à l’aide de l’outil correspondant , puis une optimisation. Les tranches automatiques étant liées entre elles dans une image, un jeu de paramètres s’applique à l’ensemble des tranches. Les tranches utilisateur peuvent avoir des paramètres individuels. Pour plus de détails sur l’utilisation des tranches avec la boîte de dialogue Enregistrer pour le Web, voir « Application de paramètres d’optimisation », page 203. Vous pouvez également spécifier une taille pour l’image tranchée à l’aide de la palette Taille de l’image. (Voir « Utilisation de la palette Taille de l’image », page 209.) 4 Cliquez sur Enregistrer. Options d’optimisation pour le format SVG La boîte de dialogue Options SVG s’ouvre lorsque vous ajoutez un objet dynamique Illustrator dans l’éditeur de mise en page et que vous l’enregistrez au format SVG. Les fichiers SVG peuvent contenir des éléments complexes créés dans Illustrator, tels que des dégradés, des animations et des effets de filtre. (Voir « A propos du format SVG », page 200) Jeu partiel Spécifiez une méthode pour choisir les glyphes qui sont enregistrés avec le fichier SVG. Si vous comptez modifier le texte du fichier (par exemple, en définissant des variables), ne choisissez pas l’option Aucune (utiliser les polices système) ni Glyphes utilisés seulement, sélectionnez plutôt l’une des autres options disponibles. • L’option Tous les glyphes permet d’utiliser le jeu complet de caractères latins et de police anglaise. • L’option Aucune (utiliser les polices système) permet d’ignorer toutes les polices, ce qui limite au maximum la taille du fichier. Néanmoins, cette option dépend des polices installées sur le système de l’utilisateur. • L’option Glyphes utilisés seulement permet d’utiliser le jeu de glyphes du texte contenu dans le document. Cette option n’est pas disponible pour les polices liées. Ne l’utilisez pas si le texte contenu dans le fichier SVG risque de varier. • L’option Anglais standard permet d’utiliser le jeu de caractères de police anglaise. • L’option Anglais standard et glyphes utilisés permet d’utiliser le jeu de caractères de police anglaise et tous les autres glyphes utilisés dans le document. • L’option Romain standard permet d’utiliser le jeu de caractères latins. Comment utiliser l'aide | Sommaire | Index Page précédente 193 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Ajout d’images et de fichiers multimédias Page précédente 194 L’option Romain standard et glyphes utilisés permet d’utiliser le jeu de caractères latins et tous les autres glyphes utilisés dans le document. Emplacement Sélectionnez l’une des deux options suivantes : • L’option Incorporer augmente la taille du fichier, mais permet d’assurer la disponibilité des polices, même si elles ne sont pas installées sur le système de l’utilisateur. Cette option s’avère utile, par exemple, si vous diffusez le fichier SVG via courrier électronique. • L’option Lien permet de lier le document à un fichier de polices distinct exporté à partir du fichier Illustrator d’origine. Cette option s’avère utile lorsque vous avez plusieurs fichiers SVG partageant les mêmes polices. Illustrator enregistre ces dernières au format CEF (Compact Embedded Font). Emplacement Si votre fichier AI contient une image pixellisée, sélectionnez l’option Incorporer plutôt que Lien. L’incorporation des images augmente la taille du fichier, mais garantit que l’utilisateur pourra visualiser les images pixellisées. Conserver les fonctions d’édition d’Illustrator Cette option permet de conserver les données spécifiques à Illustrator dans le fichier SVG. Options SVG avancées Cliquez sur le bouton Options avancées dans la boîte de dialogue Options SVG pour utiliser les options ci-dessous. Propriétés CSS Sélectionnez une option dans le menu contextuel Propriétés CSS afin de choisir une méthode d’enregistrement des attributs de style dans le code SVG. La méthode par défaut, Attributs de présentation <Référence de l’entité>, permet d’obtenir un rendu plus rapide et un fichier SVG de taille réduite. Choisissez la méthode Attributs de présentation si le code SVG est destiné à l’utilisation dans des transformations, telles que celles qui utilisent XSLT (Extensible Stylesheet Language Transformation), mais génère des fichiers légèrement plus volumineux. Utilisez la méthode Eléments de style si vous partagez des fichiers avec des documents HTML. Ceci vous permet de modifier le fichier SVG afin de déplacer un élément de style dans un fichier de style externe qui est également référencé par un fichier HTML. Néanmoins, cette option a également pour effet de ralentir le rendu. Positions décimales Cette option vous permet de spécifier la précision des données vectorielles dans le fichier SVG. Vous pouvez définir une valeur de 1 à 7 décimales. Les valeurs élevées produisent des fichiers plus volumineux et une meilleure qualité d’image. Codage Choisissez une méthode dans ce menu contextuel pour définir l’encodage des caractères dans le fichier SVG. Le format ISO 8859-1 convient à la plupart des langues européennes, tandis que le format UTF (Unicode Transformation Format) est préférable pour les langues non latines. (UTF-8 est un format à 8 bits et crée généralement de plus petits fichiers sans perte de données par rapport au format UTF-16 à 16 bits.) Optimiser pour l’afficheur SVG Adobe Cette option vous permet d’optimiser le fichier pour le programme de visualisation SVG Adobe grâce à un espace de nom Adobe XML. Elle tire avantage du rendu plus rapide des fonctions, telles que les effets de filtre. Inclure la syntaxe étendue pour les données variables Cette option permet d’inclure toutes les informations nécessaires à la substitution de variable dans le fichier SVG. Sélectionnez-la si vous exportez un modèle pour l’utiliser dans GoLive ou AlterCast. (Pour plus de détails, consultez le guide de l’utilisateur d’Illustrator 10.) Comment utiliser l'aide | Sommaire | Index Page précédente 194 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 195 Inclure les données sur le découpage en tranches Cette option permet de conserver les paramètres d’emplacement de tranche et d’optimisation. Inclure les informations sur le fichier Cette option permet de conserver les informations sur le document. Elle est utile pour le suivi des informations, telles que le nom de l’auteur ou les dates de création et de modification. Options d’optimisation pour le format SWF La boîte de dialogue Options de format Macromedia® Flash™ (SWF) s’affiche lorsque vous ajoutez un objet dynamique Illustrator dans l’éditeur de mise en page et que vous l’enregistrez au format SWF. Etant donné que le format SWF est vectoriel, l’illustration conserve sa qualité à différentes résolutions, ce qui en fait un format idéal pour la création d’images animées. (Voir « A propos du format SWF », page 200) Bien que le format SWF utilise des données vectorielles, il peut également utiliser des données bitmap le cas échéant. Pour plus de détails sur le traitement par le format SWF des différents types d’images et d’effets visuels créés dans Illustrator et LiveMotion, consultez les guides de l’utilisateur de ces applications. Lecture seule Cette option permet d’empêcher les utilisateurs de modifier le fichier SWF exporté. Exporter sous Choisissez Fichier AI en fichier SWF pour exporter l’illustration sous la forme d’une seule image SWF. Choisissez Calques AI en images SWF pour exporter chaque calque de l’illustration sous la forme d’une image SWF distincte et ainsi créer une animation SWF. Remarque : Sélectionnez Fichier AI en fichier SWF pour conserver les masques d’écrêtage de calque. Fréquence seconde Cette option permet de spécifier la vitesse à laquelle l’animation est lue dans un programme de visualisation SWF. (Elle est disponible uniquement si vous sélectionnez Calques AI en images SWF.) Boucle Cette option permet de définir une lecture en boucle continue dans le programme de visualisation SWF, plutôt qu’une lecture unique avec arrêt en fin d’animation. (Elle est disponible uniquement si vous sélectionnez Calques AI en images SWF.) Qualité des courbes Cette option permet de définir la précision des courbes de Bézier. Les valeurs basses réduisent la taille du fichier exporté avec une légère perte de qualité de la courbe. Plus la valeur est élevée, plus la précision la précision de la reproduction de la courbe est grande, mais plus le fichier est volumineux. Options d’image Ces options vous permettent de définir la résolution et le format des images bitmap dans le fichier SWF. Comment utiliser l'aide | Sommaire | Index Page précédente 195 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 196 Ajout de fichiers LiveMotion GoLive vous permet d’ajouter des animations SWF à votre page Web à l’aide des objets dynamiques LiveMotion. L’objet dynamique LiveMotion offre tous les avantages des objets dynamiques, ainsi que des options qui ne sont pas disponibles lorsque vous faites simplement glisser un fichier SWF jusqu’à votre mise en page. Avec un objet dynamique LiveMotion, GoLive crée un fichier cible au format SWF à partir d’un fichier source et conserve le lien entre les fichiers cible et source. Grâce à la fonction de détection des balises de remplacement (variables) dans un fichier LiveMotion de GoLive, vous pouvez créer différentes versions d’un fichier source avec un autre texte, des liens modifiés ou un nouveau style d’animation. La boîte de dialogue Configuration des variables de GoLive vous permet de contrôler LiveMotion pour la génération du fichier cible à partir du fichier source. Dans cette boîte de dialogue, vous pouvez en outre visualiser, associer ou modifier un lien incorporé à une adresse URL dans le fichier SWF. (Voir « Utilisation de variables dans un fichier LiveMotion », page 219.) Utilisation d’un objet dynamique LiveMotion Si vous modifiez l’image source d’un objet dynamique LiveMotion que vous avez créé, GoLive met automatiquement à jour toutes les copies au format SWF sur les pages ouvertes dans l’éditeur de mise en page. Etant donné que le format SWF est vectoriel, le redimensionnement d’un objet dynamique LiveMotion ne nécessite pas la mise à jour du fichier cible. Vous pouvez également cliquer deux fois sur une image LiveMotion dans la fenêtre du document pour ouvrir l’image source dans LiveMotion. (Voir « Utilisation des objets dynamiques », page 182.) Utilisez l’inspecteur de module externe dynamique pour définir les options de l’objet dynamique LiveMotion. (Voir « Configuration des modules externes », page 230 et « Options du module externe SWF », page 232.) Lorsque vous cliquez sur un objet dynamique LiveMotion avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS), un menu contextuel s’affiche pour vous permettre d’apporter des modifications à l’objet dynamique LiveMotion, telles que le changement de couleur de fond et l’association d’un lien. (Voir « Options supplémentaires relatives aux images », page 186.) Remarque : Certaines commandes pour les objets dynamiques LiveMotion, telles que l’utilisation de variables et la modification de la couleur de fond, fonctionnent uniquement pour les fichiers LiveMotion 2. Pour ajouter un objet dynamique LiveMotion : 1 Ajoutez un objet dynamique LiveMotion à votre page. Pour plus de détails sur l’ajout d’un objet dynamique à une page Web, voir « Ajout d’un objet dynamique dans l’éditeur de mise en page », page 183. LiveMotion est lancé et enregistre le fichier source au format SWF. 2 Si votre fichier source LiveMotion comprend des balises de remplacement (variables), la boîte de dialogue Configuration des variables s’affiche. Modifiez les paramètres nécessaires, puis cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 196 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 197 Les paramètres de cette boîte de dialogue affectent uniquement le fichier cible généré (la copie au format SWF) ; le fichier source LiveMotion reste inchangé. Pour plus de détails sur l’utilisation des variables, voir « Utilisation de variables dans un fichier LiveMotion », page 219. 3 Dans la boîte de dialogue Couleur du cache, effectuez l’une des opérations suivantes : • Cliquez sur l’option Couleur du cache, cliquez deux fois sur la case du sélecteur de couleur pour choisir une couleur, puis cliquez sur OK. • Cliquez sur Définir comme arrière-plan pour utiliser la couleur d’arrière-plan de la page HTML comme couleur de cache, puis cliquez sur OK. • Cliquez sur OK pour laisser la couleur du cache inchangée. 4 Enregistrez l’image convertie dans un sous-dossier de votre dossier du site (par exemple, un sous-dossier appelé « images »). Dans le cas contraire, le lien entre l’objet dynamique et le fichier cible est incorrect. Optimisation d’images pour le Web Pour ajouter une image à votre page Web, vous devez l’enregistrer à un format reconnu par les navigateurs Web et sa taille doit être assez réduite pour s’adapter à la bande passante dont disposent la plupart des utilisateurs Web. L’optimisation d’une image consiste à la convertir à un format compatible Web et à supprimer assez d’informations de manière à trouver le meilleur compromis entre la qualité et la taille du fichier. Le format de fichier d’image optimisée que vous sélectionnez est déterminé par les propriétés de couleur, de teinte et graphiques de l’image d’origine. En général, des images à tons continus, telles que les photographies, doivent être compressées au format JPEG ou PNG-24. Les illustrations contenant des couleurs aplaties ou des arêtes marquées et des détails précis, tels que du texte, doivent être compressées au format GIF ou PNG-8. Les graphiques vectoriels bidimensionnels ou liés à des scripts et des variables doivent être optimisées au format SVG ou SWF. Si vous préparez une image destinée à l’affichage sur un appareil sans fil, choisissez le format GIF ou WBMP. Attention : Certaines versions de navigateurs n’affichent pas correctement le format PNG. Selon le format de l’image, vous pouvez définir la qualité, l’affichage des couleurs et la méthode de téléchargement, et choisir d’appliquer une transparence ou un cache à l’arrière-plan. Remarque : GoLive prend en charge la technologie de correspondance des couleurs ColorSync™ qui garantit la restitution des couleurs sur différents périphériques de sortie. A propos du format JPEG Le format JPEG prend en charge les couleurs 24 bits en conservant la gamme étendue et les variations subtiles de luminosité et de teinte que l’on trouve dans les photographies et autres images à tons continus. Il est pris en charge par la plupart des navigateurs. Comment utiliser l'aide | Sommaire | Index Page précédente 197 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 198 Ce format comprime la taille des fichiers en supprimant des données de manière sélective. Il s’agit donc d’une méthode de compression avec perte de qualité. Cette perte est moindre lorsque vous choisissez une qualité supérieure, mais la méthode de compression JPEG peut altérer les détails nets d’une image, en particulier si cette dernière contient du texte ou des graphiques vectoriels. Remarque : Des artefacts, tels que des textures en forme d’ondes ou des effets de bande, sont ajoutés au fichier chaque fois que vous l’enregistrez au format JPEG. Il est conseillé de toujours enregistrer les fichiers JPEG à partir de l’image d’origine plutôt que d’un précédent enregistrement à ce format. Néanmoins, l’utilisation de l’image source au format JPEG à partir d’un appareil photo numérique est une exception, car elle offre généralement une grande qualité et résolution pour le Web. Vous pouvez créer un fichier JPEG progressif. Le navigateur commence le rendu d’un tel fichier dès qu’il reçoit les premières données représentatives de l’image. Au fur et à mesure de la réception du reste du fichier JPEG progressif, la résolution de l’image augmente. Le format JPEG ne prend pas en charge la transparence. Lorsque vous enregistrez une image à ce format, les pixels transparents sont remplis avec la couleur du cache. Si vous connaissez la couleur d’arrière-plan de la page Web sur laquelle vous souhaitez placer l’image, appliquez une couleur de cache correspondante à celle de l’arrière-plan afin de simuler l’effet d’un fond transparent. La boîte de dialogue Enregistrer pour le Web de GoLive vous permet de définir la couleur du cache lors de l’optimisation d’un objet dynamique. Si l’image comporte une transparence et que vous ne connaissez pas la couleur d’arrière-plan de la page Web ou si cet arrière-plan est un motif, utilisez plutôt un format prenant en charge la transparence (GIF, PNG-8 ou PNG-24). A propos du format GIF Le format GIF utilise les couleurs 8 bits et comprime fortement les zones unies de couleur tout en préservant les détails, tels que ceux que l’on trouve dans les dessins au trait, les logos et les illustrations contenant du texte. Vous pouvez également l’utiliser pour créer des images animées. Il est pris en charge par la plupart des navigateurs. Le format GIF utilise généralement une méthode de compression à qualité intégrale qui n’implique aucune suppression de données. Vous pouvez donc enregistrer un fichier GIF plusieurs fois sans perdre aucune donnée. Toutefois, étant donné que les fichiers GIF comportent des couleurs 8 bits, l’optimisation d’une image originale à 24 bits au format GIF à 8 bits entraîne généralement une dégradation de la qualité. En outre, GoLive vous permet de créer une version avec perte de qualité d’un fichier GIF. Cette dernière comprend alors de petits artefacts de compression (similaires à ceux des fichiers JPEG), mais génère des fichiers beaucoup moins volumineux. Vous pouvez réduire le nombre de couleurs d’un fichier GIF et choisir des options permettant de contrôler la manière dont ces couleurs sont simulées dans l’application ou dans un navigateur. Le format GIF prend en charge l’utilisation de transparence ou d’un cache dans l’arrière-plan, permettant de fusionner le contour d’une image avec la couleur d’arrière-plan d’une page Web. Comment utiliser l'aide | Sommaire | Index Page précédente 198 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 199 A propos du format PNG-8 Le format PNG-8 utilise des couleurs 8 bits. A l’instar du format GIF, il comprime efficacement les zones de couleur unies tout en préservant les détails, tels que ceux que l’on trouve dans les dessins au trait, les logos ou les illustrations contenant du texte. Dans la mesure où le format PNG-8 n’est pas pris en charge par tous les navigateurs, il est préférable de l’éviter si vous souhaitez que l’image soit accessible au plus large public Web possible. Pour plus de détails sur la prise en charge du format PNG par les navigateurs, consultez la documentation de ces derniers. Le format PNG-8 utilise une méthode de compression à qualité intégrale qui n’implique aucune suppression de données. Toutefois, étant donné que les fichiers PNG-8 comportent des couleurs 8 bits, l’optimisation d’une image originale à 24 bits à ce format peut entraîner une dégradation de la qualité. Les fichiers PNG-8 utilisent des méthodes de compression plus complexes que ceux du format GIF et peuvent être de 10 à 30 % moins volumineux que ces derniers pour une même image, selon les motifs de couleur de celle-ci. Remarque : Pour certaines images, en particulier celles contenant très peu de couleurs et des motifs très simples, la compression GIF peut générer un fichier plus petit que la méthode PNG-8. Visualisez les images optimisées aux formats GIF et PNG-8 afin de comparer la taille des fichiers obtenus. Comme avec le format GIF, vous pouvez réduire le nombre de couleurs de l’image et choisir des options pour contrôler le tramage des couleurs dans l’application ou le navigateur. Le format PNG-8 prend en charge l’utilisation de transparence ou d’un cache dans l’arrière-plan, permettant de fusionner le contour de l’image avec la couleur d’arrière-plan de la page Web. A propos du format PNG-24 Le format PNG-24 prend en charge les couleurs 24 bits. A l’instar du format JPEG, il préserve la gamme étendue et les variations subtiles de luminosité et de teinte présentes dans les photographies. Comme les formats GIF et PNG-8, il conserve également les détails, tels que ceux que l’on trouve dans les dessins au trait, les logos et les illustrations contenant du texte. Le format PNG-24 utilise la même méthode de compression à qualité intégrale que le format PNG-8, ce qui signifie qu’aucune donnée n’est supprimée. Par conséquent, les fichiers PNG-24 sont généralement plus volumineux que les fichiers JPEG pour une même image. La prise en charge du format PNG-24 par les navigateurs est similaire à celle du format PNG-8. A l’instar du format PNG-8, le format PNG-24 prend en charge l’utilisation de transparence ou d’un cache dans l’arrière-plan, permettant de fusionner le contour d’une image avec la couleur d’arrière-plan d’une page Web. En outre, ce format prend en charge la transparence multiniveau qui permet de préserver jusqu’à 256 niveaux de transparence, afin de fusionner le contour de l’image avec n’importe quelle couleur d’arrière-plan. Cette transparence n’est néanmoins pas prise en charge par tous les navigateurs. Comment utiliser l'aide | Sommaire | Index Page précédente 199 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 200 A propos du format SVG Le format SVG (Scalable Vector Graphics) révolutionne l’aspect et la fonction des images sur le Web. Il s’agit d’un format vectoriel, contrairement aux formats GIF, JPEG et PNG qui sont des formats d’images bitmap. Ces derniers devant comprendre chaque pixel nécessaire à l’affichage de l’image, ils ont tendance à être volumineux, limités à une seule résolution (souvent faible) et à consommer une quantité importante de bande passante sur le Web. Le format SVG permet une meilleure exploitation des images sur le Web. Etant donné que les fichiers SVG définissent les images comme des formes, des chemins, du texte et des effets de filtre, ils sont compacts et garantissent une grande qualité graphique sur le Web, à l’impression et même sur des appareils de poche aux ressources limitées. Les utilisateurs peuvent augmenter le facteur de zoom pour l’affichage d’une image SVG à l’écran sans devoir renoncer à la netteté, au niveau de détail ou à la clarté. En outre, ce format offre une meilleure prise en charge du texte et des couleurs. Il assure une totale prise en charge XML, ce qui en fait un outil très utile à la fois pour les développeurs et pour les utilisateurs. Grâce au format SVG, vous pouvez utiliser les langages XML et JavaScript pour créer des images Web qui répondent aux actions de l’utilisateur par des effets sophistiqués, tels que la mise en évidence, les info-bulles, les éléments audio et les animations. Remarque : Les utilisateurs doivent installer le programme de visualisation SVG pour pouvoir afficher ce format. A propos du format SWF Le format de fichier Macromedia® Flash™ (SWF) est un format graphique vectoriel permettant de créer des graphiques compacts et évolutifs pour le Web. Etant donné que ce format est vectoriel, l’illustration conserve sa qualité à différentes résolutions, ce qui en fait un format idéal pour la création d’images animées. Bien que le format SWF enregistre les images à l’aide de données vectorielles, il utilise également des données bitmap le cas échéant. Pour plus de détails sur le traitement par le format SWF des différents types d’images et d’effets visuels créés dans Illustrator et LiveMotion, consultez les guides de l’utilisateur de ces applications. Remarque : Les utilisateurs doivent installer le programme de visualisation SWF pour pouvoir afficher ce format. A propos de la boîte de dialogue Enregistrer pour le Web Le panneau Optimisé de la boîte de dialogue Enregistrer pour le Web permet de sélectionner le format compression de fichier et d’autres paramètres d’optimisation pour les objets dynamiques Photoshop ou Illustrator. GoLive affiche cette boîte de dialogue automatiquement lorsque vous utilisez la méthode des objets dynamiques pour ajouter une image Photoshop ou Illustrator à une page Web. Les options de vue de la boîte de dialogue Enregistrer pour le Web de GoLive vous permettent de passer facilement de la version optimisée à la version originale (non optimisée) d’une image et vice versa, et d’afficher simultanément jusqu’à quatre versions d’une même image optimisée. Comment utiliser l'aide | Sommaire | Index Page précédente 200 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 201 Pour afficher la boîte de dialogue Enregistrer pour le Web : Effectuez l’une des opérations suivantes : • Ajoutez un objet dynamique Photoshop à une mise en page Web ou un objet dynamique Illustrator dans l’éditeur de mise en page. (Voir « Ajout d’un objet dynamique Photoshop », page 188 et « Ajout d’une illustration Illustrator », page 190.) • Sélectionnez un objet dynamique Photoshop ou Illustrator sur une mise en page, puis cliquez sur le bouton Configuration dans l’inspecteur d’image dynamique. Remarque : Lorsque vous ajoutez un objet dynamique Illustrator, vous devez choisir le format d’image bitmap dans la boîte de dialogue Configuration de la conversion pour ouvrir la boîte de dialogue Enregistrer pour le Web. F G A B C D E Boîte de dialogue Enregistrer pour le Web A. Boîte à outils B. Zone de texte Zoom C. Image originale D. Image optimisée E. Menu contextuel Aperçu dans F. Sélecteur de couleur G. Paramètres d’optimisation Affichage des images Cliquez sur un onglet au-dessus de la zone d’image pour sélectionner une option d’affichage : Choisissez Original pour afficher l’image sans optimisation, Optimisé pour l’afficher avec les paramètres d’optimisation actifs, 2 vignettes pour voir deux versions de l’image côte à côte ou 4 vignettes pour voir quatre versions de l’image côte à côte. Si vous ne voyez pas l’illustration entière dans la boîte de dialogue, vous pouvez utiliser l’outil Main pour afficher une autre zone de l’image. Cliquez sur l’icône de l’outil (ou maintenez la barre d’espacement enfoncée) et faites glisser la zone affichée pour obtenir un panoramique de l’image. Vous pouvez également utiliser l’outil Zoom pour agrandir ou réduire la vue. Cliquez sur l’icône de l’outil et cliquez dans une vue pour effectuer un zoom avant ; maintenez la touche Alt (Windows) ou Option (Mac OS) enfoncée et cliquez sur la vue pour effectuer un zoom arrière. Vous pouvez également spécifier un facteur de zoom dans la zone de texte Zoom en bas de la boîte de dialogue. Comment utiliser l'aide | Sommaire | Index Page précédente 201 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 202 Sélection d’une vue Cliquez sur un autre onglet de la boîte de dialogue Enregistrer pour le Web afin de sélectionner une nouvelle vue. Si vous utiliser une vue à 2 ou 4 vignettes, vous devez sélectionner une vue avant d’appliquer les paramètres d’optimisation. La vue sélectionnée est désignée par un cadre noir. Affichage des annotations La zone d’annotation dans la boîte de dialogue Enregistrer pour le Web fournit d’importantes informations sur l’optimisation. Pour l’image originale, cette zone indique le nom et la taille du fichier. Pour l’image optimisée, elle affiche les options d’optimisation actives, la taille du fichier et le délai de téléchargement prévu pour la vitesse du modem sélectionnée. Le menu contextuel Aperçu dans vous permet de sélectionner la vitesse du modem pour laquelle vous souhaitez connaître le délai de téléchargement prévu. Pour afficher le menu contextuel d’aperçu, cliquez sur le triangle situé à droite de l’image optimisée. Utilisation de paramètres d’optimisation spécifiques Vous pouvez enregistrer des paramètres d’optimisation sous un nom spécifique pour les appliquer ensuite à d’autres images. Les paramètres que vous enregistrez s’affichent dans le menu d’optimisation du panneau Paramètres, dans la boîte de dialogue Enregistrer pour le Web. GoLive comprend également plusieurs paramètres spécifiques prédéfinis. Lorsque vous modifiez des paramètres d’optimisation de sorte qu’ils ne correspondent plus à un jeu spécifique, le menu Paramètres affiche l’intitulé « Sans nom ». Pour enregistrer des paramètres d’optimisation : 1 Après avoir sélectionné les paramètres voulus dans le panneau d’optimisation de la boîte de dialogue Enregistrer pour le Web, choisissez Enregistrer les paramètres dans le menu d’optimisation du panneau Paramètres. 2 Affectez un nom à ce jeu de paramètres et choisissez un dossier dans lequel l’enregistrer. Par défaut, il s’agit du sous-dossier Optimiser dans le dossier des données d’application utilisateur. Les paramètres sont reconnus par GoLive et affichés dans le menu d’optimisation uniquement s’ils se trouvent à cet endroit. 3 Cliquez sur Enregistrer. Pour appliquer des paramètres d’optimisation spécifiques à une image : Après avoir affiché une image optimisée, sélectionnez un jeu spécifique de paramètres d’optimisation dans le menu d’optimisation du panneau Paramètres. Pour modifier un jeu spécifique de paramètres d’optimisation : 1 Sélectionnez le jeu de paramètres spécifiques dans le menu contextuel Paramètres de la boîte de dialogue Enregistrer pour le Web. 2 Modifiez les paramètres dans le panneau d’optimisation. Le menu Paramètres affiche alors l’intitulé « Sans nom », dans la mesure où les paramètres ne correspondent plus à un jeu spécifique. 3 Choisissez Enregistrer les paramètres dans le menu d’optimisation du panneau Paramètres et enregistrez les paramètres sous le nom du jeu initial. 4 Cliquez sur Enregistrer. Comment utiliser l'aide | Sommaire | Index Page précédente 202 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 203 Pour supprimer des paramètres d’optimisation spécifiques : 1 Dans le panneau d’optimisation de la boîte de dialogue Enregistrer pour le Web, sélectionnez un jeu spécifique de paramètres d’optimisation dans le menu contextuel Paramètres. 2 Choisissez Supprimer les paramètres dans le menu d’optimisation du panneau Paramètres. Application de paramètres d’optimisation Le panneau Paramètres de la boîte de dialogue Enregistrer pour le Web vous permet de définir des options d’optimisation. Si vous utilisez la vue à 2 ou 4 vignettes, vous pouvez remplir de nouveau les vues pour générer automatiquement des versions de moindre qualité de l’image à partir des paramètres sélectionnés. Pour appliquer des paramètres d’optimisation : 1 Sélectionnez une vue dans la boîte de dialogue Enregistrer pour le Web. Si votre illustration comprend plusieurs tranches, sélectionnez-en une ou plusieurs auxquelles vous souhaitez appliquer les paramètres d’optimisation. Pour plus de détails sur l’utilisation des tranches, voir « Utilisation de tranches lors de l’optimisation », page 209. 2 Effectuez l’une des opérations suivantes : • Sélectionnez un jeu de paramètres d’optimisation spécifique dans le menu contextuel Paramètres. (Voir « Utilisation de paramètres d’optimisation spécifiques », page 202.) • Choisissez un format de fichier dans le menu contextuel des formats et définissez d’autres options d’optimisation. Si vous avez utilisé la commande d’importation Calques Photoshop en boîtes flottantes pour importer et conserver les calques d’un fichier Photoshop, vous pouvez appliquer la fonction Enregistrer tout en appuyant sur la touche Ctrl (Windows) ou Control (Mac OS) lorsque vous cliquez sur Enregistrer. Cette fonction vous permet d’appliquer les même paramètres d’optimisation sélectionnés pour le calque d’origine et tous les autres calques suivants dans le fichier importé Photoshop. (Voir « Utilisation de fichiers de calques Photoshop », page 226.) Pour appliquer des paramètres d’optimisation pour une taille de fichier : 1 Choisissez l’option Optimiser pour la taille du fichier dans le menu du panneau Paramètres. (Cliquez sur le triangle situé à droite du menu contextuel Paramètres pour afficher le menu du panneau Paramètres.) 2 Sélectionnez une option Démarrer avec : • L’option Paramètres actuels permet d’utiliser les paramètres d’optimisation actifs. • L’option Sélection automatique GIF/JPEG permet de générer automatiquement un fichier GIF ou JPEG. 3 Saisissez une valeur pour la taille du fichier, puis cliquez sur OK. Pour régénérer des paramètres d’optimisation : 1 Appliquez des paramètres d’optimisation sur une vue à 2 ou 4 vignettes. 2 Choisissez l’option Remplir de nouveau les vues dans le menu du panneau Paramètres. Comment utiliser l'aide | Sommaire | Index Page précédente 203 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 204 Cette opération n’a aucune incidence sur les vues sélectionnée et originale. Pour cette raison, l’option Remplir de nouveau les vues fonctionne avec la vue à 2 vignettes uniquement lorsque la version originale n’est pas affichée. Pour rétablir des paramètres d’optimisation : Appuyez sur la touche Alt (Windows) ou Option (Mac OS) et cliquez sur Rétablir. Options d’optimisation pour les formats GIF et PNG-8 Le format GIF est le format standard pour la compression d’images dotées de couleurs aplaties et de détails précis, telles que les dessins au trait, les logos ou les illustrations contenant du texte. Pour obtenir des images GIF moins volumineuses, vous pouvez réduire le nombre de couleurs du fichier. A l’instar du format GIF, le format PNG-8 comprime efficacement les zones de couleur unies tout en préservant les détails. Toutefois, ce format n’est pris en charge par tous les navigateurs. Les paramètres du format PNG-8 sont très similaires à ceux du format GIF. (Voir « A propos du format GIF », page 198.) Perte de qualité (GIF uniquement) Spécifiez une valeur pour permettre une compression avec perte de qualité. Ce type de compression réduit la taille du fichier en supprimant des données de manière sélective ; plus la valeur est élevée, plus la suppression est importante. En général, vous pouvez appliquer une valeur de perte de qualité comprise entre 5 et 10 (voire 50 dans certains cas) sans dégradation de l’image. L’option Perte de qualité permet souvent de réduire la taille du fichier de 5 à 40 %. Remarque : Vous ne pouvez pas utiliser l’option Perte de qualité avec l’option Entrelacé, ni avec les algorithmes Bruit ou Motif. Couleurs Choisissez une méthode pour générer une table des couleurs dans le menu contextuel du panneau Table des couleurs. (Voir « Utilisation de la palette Table des couleurs », page 207.) Spécifiez ensuite le nombre maximal de couleurs dans la zone de texte Couleurs. Si vous choisissez l’option Web dans le menu contextuel de table des couleurs, l’option Auto est activée dans le menu contextuel Couleurs. Utilisez cette dernière si vous souhaitez que GoLive détermine le nombre de couleurs de la table en fonction de leur fréquence dans l’image. Remarque : Si l’image contient moins de couleurs que le nombre spécifié, la table des couleurs affiche uniquement le nombre de couleurs de l’image. Tramage Choisissez une méthode de tramage dans le menu du même nom et spécifiez l’importance du tramage d’application. Le tramage consiste à simuler les couleurs qui ne sont pas disponibles dans le système d’affichage des couleurs de votre ordinateur. Un pourcentage élevé donne l’impression que l’image comporte davantage de couleurs et de détails, mais risque également d’augmenter la taille du fichier. Pour une compression optimale, utilisez le pourcentage de tramage le plus faible permettant d’obtenir le détail de couleur recherché. L’affichage des images essentiellement dotées de couleurs unies ou de lignes fines est souvent meilleur sans tramage. En revanche, celles qui contiennent des couleurs en dégradé peuvent nécessiter un tramage pour éviter la formation de bandes de couleur. Dans le menu contextuel de tramage, choisissez Sans tramage ou l’une des options suivantes : • L’option Diffusion permet d’appliquer un motif aléatoire qui est généralement moins visible que celui généré avec la méthode Motif. Les effets du tramage sont diffusés sur les pixels adjacents. Comment utiliser l'aide | Sommaire | Index Page précédente 204 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 205 • L’option Motif applique un motif carré en demi-teintes pour simuler toutes les nuances qui ne figurent pas dans la table des couleurs. • L’option Bruit permet d’appliquer un motif aléatoire similaire à celui obtenu avec la méthode Diffusion, mais sans le diffuser sur les pixels adjacents. Les raccords ne sont pas visibles. Transparence et Cache Utilisez l’option Transparence et le menu contextuel Cache pour spécifier la transparence des pixels optimisés dans l’image. • Cochez la case Transparence et sélectionnez une couleur de cache pour que les pixels entièrement transparents le restent et que les pixels partiellement transparent prennent la couleur définie. • Cochez la case Transparence et choisissez Sans dans le menu contextuel Cache pour transformer les pixels dont la transparence est supérieure à 50 % en pixels totalement transparents, et les pixels dont la transparence est de 50 % ou moins en pixels totalement opaques. • Désactivez la case Transparence et sélectionnez une couleur de cache, pour que les pixels totalement et partiellement transparents prennent la couleur définie. Pour sélectionner une couleur de cache, cliquez sur la case de couleur Cache et choisissez une couleur dans le sélecteur. Vous pouvez également choisir l’une des options suivantes dans le menu contextuel Cache : Couleur de la pipette (pour utiliser la couleur affichée dans la case échantillon de la pipette), Blanc, Noir ou Autre (pour utiliser le sélecteur de couleur). Entrelacé Cochez la case Entrelacé pour créer une image affichant des versions de faible résolution dans le navigateur pendant le téléchargement du fichier correspondant. Cette option indique aux internautes que le téléchargement est en cours et peut leur donner l’impression qu’il est plus court. Toutefois, elle augmente également la taille du fichier. Aligner sur le Web Spécifiez un niveau de tolérance pour que les couleurs soient remplacées par leurs équivalents les plus proches de la palette Web (et éviter la simulation des couleurs dans un navigateur). Plus cette valeur est élevée, plus le nombre de couleurs remplacées est important. Options d’optimisation pour le format JPEG Le format JPEG est le format standard pour la compression d’images à tons continus, telles que les photographies. L’optimisation d’une image au format JPEG implique une compression avec perte de qualité lors de laquelle des données sont supprimées de manière sélective. (Voir « A propos du format JPEG », page 197.) Qualité Choisissez une option dans le menu Qualité ou spécifiez une valeur dans la zone de texte correspondante. Plus cette valeur est élevée, plus le nombre de détails conservés lors de la compression est grand, mais plus le fichier est volumineux. Visualisez l’image optimisée avec plusieurs niveaux de qualité pour déterminer le meilleur compromis entre la qualité et la taille du fichier. Optimisé Cochez la case Optimisé pour créer une image JPEG améliorée en réduisant légèrement la taille du fichier. Le format optimisé JPEG est recommandé pour une compression maximale des fichiers, mais il n’est pas pris en charge par certains navigateurs relativement anciens. Comment utiliser l'aide | Sommaire | Index Page précédente 205 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 206 Progressif Cochez la case Progressif pour créer une image s’affichant graduellement dans un navigateur Web. L’image apparaît comme une série de recouvrements, ce qui permet aux internautes d’en visualiser une version de faible résolution avant son téléchargement complet. L’option Progressif requiert le format JPEG optimisé. Flou Spécifiez la quantité de flou appliqué à l’image. Cette option applique un effet identique à celui du filtre Flou gaussien pour une compression supérieure et donc un fichier moins volumineux. Il est recommandé de choisir une valeur entre 0,1 et 0,5. Profil ICC Cochez cette case pour conserver le profil ICC de l’image avec le fichier. Les profils ICC sont utilisés par certains navigateurs pour la correction des couleurs. Cette option est disponible uniquement lorsque vous avez enregistré une image avec un profil ICC ; elle n’est pas disponible pour les images non enregistrées. (Voir « Utilisation de ColorSync avec des images JPEG (Mac OS) », page 228) Cache Spécifiez une méthode d’optimisation pour les pixels transparents de l’image : • Cliquez sur la case de couleur Cache et sélectionnez une couleur dans le sélecteur, pour que les pixels totalement et partiellement transparents prennent la couleur définie. Vous pouvez également choisir l’une des options suivantes dans le menu contextuel Cache : Couleur de la pipette (pour utiliser la couleur affichée dans la case échantillon de la pipette), Blanc, Noir ou Autre (pour utiliser le sélecteur de couleur). • Choisissez Sans dans le menu contextuel Cache pour transformer les pixels dont la transparence est supérieure à 50 % en pixels totalement transparents, et les pixels dont la transparence est de 50 % ou moins en pixels totalement opaques. Options d’optimisation pour le format PNG-24 Le format PNG-24 convient à la compression d’images à tons continus, mais il génère des fichiers beaucoup plus volumineux que le format JPEG. (Voir « A propos du format PNG24 », page 199.) Grâce au format PNG-24, vous pouvez conserver jusqu’à 256 niveaux de transparence dans une image (tandis que le format JPEG enregistre les pixels avec une opacité totale). Pour enregistrer une image dotée d’une transparence à plusieurs niveaux, cochez la case Transparence. Pour plus de détails sur les options Entrelacé, Transparence et Cache, voir « Options d’optimisation pour les formats GIF et PNG-8 », page 204. Pour optimiser un fichier selon une taille spécifiée : 1 Dans le menu du panneau d’optimisation de la boîte de dialogue Enregistrer pour le Web, choisissez Optimiser pour la taille du fichier. 2 Sélectionnez une option Démarrer avec : • L’option Paramètres actuels permet d’utiliser les paramètres d’optimisation actifs. • L’option Sélection automatique GIF/JPEG permet de générer automatiquement une image GIF ou JPEG. (GoLive analyse les couleurs de l’image et sélectionne automatiquement le format GIF ou JPEG.) 3 Saisissez une valeur pour la taille du fichier. 4 Cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 206 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 207 Remarque : La taille du fichier affichée dans la boîte de dialogue Enregistrer pour le Web peut être légèrement supérieure à celle indiquée sur votre disque dur local car GoLive ajoute des paramètres d’optimisation d’objet dynamique au fichier cible. Vous pouvez supprimer ces données supplémentaires au moment du téléchargement. Pour ce faire, choisissez Edition > Préférences, puis développez l’arborescence de l’élément Site, cliquez sur Téléchargement/Synchronisation et cochez la case Eliminer les données GoLive des fichiers multimédias. Toutefois, le fichier cible perd ainsi sa fonctionnalité d’objet dynamique. Cette procédure peut également être réalisée à l’exportation (locale) et à la publication du site (Web Workgroup Server). L’utilisateur a la possibilité de modifier les paramètres lors des processus de téléchargement, d’exportation et de publication. Utilisation de la palette Table des couleurs La palette Table des couleurs dans la boîte de dialogue Enregistrer pour le Web vous permet de contrôler précisément les couleurs des images optimisées GIF et PNG-8. Dans cette palette, vous pouvez ajouter des couleurs (jusqu’à 256 au maximum) ou en supprimer, remplacer une sélection de teintes par des couleurs compatibles avec le Web et verrouiller les coloris sélectionnés pour éviter leur suppression de la palette. Utilisation du menu de la palette Table des couleurs Le menu de la palette Table des couleurs contient des options pour l’utilisation des couleurs. Pour l’afficher, cliquez sur le triangle situé dans le coin supérieur droit de la palette. Tri de la table des couleurs Vous pouvez trier les couleurs de la table par teinte (pour affecter aux couleurs neutres une teinte égale à 0 et les placer avec les rouges), luminance (la luminosité d’une couleur) ou popularité, afin de voir plus facilement la gamme de couleurs d’une image et localiser des couleurs particulières. Choisissez une option de tri dans le menu de la palette Table des couleurs. Ajout de couleurs Activez l’outil Pipette et cliquez sur une couleur dans l’image. (Vous pouvez aussi cliquer sur la case échantillon et choisir une couleur dans le sélecteur.) Cliquez ensuite sur l’icône de nouvelle couleur ou choisissez l’option Nouvelle couleur dans le menu de la palette Table des couleurs. Un petit carré blanc doté d’un centre sombre s’affiche dans le coin inférieur droit de la nouvelle couleur pour indiquer qu’elle est verrouillée. Remarque : Cette opération n’est pas possible lorsque la table contient déjà le nombre maximal de couleurs (256 ou 255 avec la transparence). Sélection de couleurs Pour sélectionner une couleur de l’image, activez l’outil Pipette et cliquez sur la couleur souhaitée dans l’image. Un cadre blanc apparaît autour de cette couleur dans la palette Table des couleurs. Dans cette palette, cliquez sur une couleur pour la sélectionner. Pour sélectionner un groupe de couleurs contiguës, appuyez sur la touche Maj et cliquez sur une autre teinte. Toutes les couleurs affichées sur les lignes situées entre votre première et votre seconde sélection sont sélectionnées. Pour sélectionner un groupe de couleurs non contiguës, appuyez sur la touche Ctrl (Windows) ou Commande (Mac OS) et cliquez successivement sur toutes les teintes voulues. Le menu de la palette Table des couleurs contient des options pour sélectionner les couleurs. Choisissez Sélectionner toutes les couleurs, Sélectionner toutes les couleurs Web sécurisées, Sélectionner toutes les couleurs Web non sécurisées ou Désélectionner toutes les couleurs. Comment utiliser l'aide | Sommaire | Index Page précédente 207 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 208 Remarque : L’option Sélectionner toutes les couleurs Web sécurisées n’est pas disponible lorsque l’image optimisée ne contient pas de telles couleurs et l’option Sélectionner toutes les couleurs Web non sécurisées n’est pas disponible lorsque l’image optimisée contient uniquement des couleurs Web sécurisées. Modification des couleurs Vous pouvez modifier une couleur sélectionnée dans la palette Table des couleurs en lui affectant une autre valeur RVB. Cliquez deux fois sur cette couleur dans la palette pour afficher le sélecteur de couleur par défaut, puis sélectionnez une couleur. Un petit signe plus (+) apparaît au centre de toute couleur modifiée. Lorsque vous régénérez l’image optimisée, toutes les occurrences de la couleur sélectionnée y sont remplacées par la nouvelle couleur. Déplacement des couleurs vers la palette Web Pour empêcher le tramage des couleurs dans le navigateur, vous pouvez les remplacer par leurs meilleures équivalences de la palette Web. Sélectionnez les couleurs à remplacer et cliquez sur le bouton de déplacement vers la palette Web dans la palette Table des couleurs. (Ou choisissez l’option Déplacement/Annulation du déplacement des couleurs sélectionnées Web dans le menu de la palette Table des couleurs.) Un petit losange blanc apparaît au centre des couleurs déplacées vers la palette Web (ainsi que de toute couleur Web sécurisée). Lorsque vous avez remplacé des couleurs, vous pouvez rétablir leurs valeurs d’origine à l’aide des options disponibles dans le menu de la palette Table des couleurs. Choisissez Déplacement/Annulation du déplacement des couleurs sélectionnées Web ou Annuler le déplacement de toutes les couleurs. Vous pouvez également sélectionner une couleur remplacée et cliquer sur le bouton de déplacement vers la palette Web pour rétablir sa valeur d’origine. Pour définir la tolérance du remplacement des couleurs, spécifiez une valeur à l’aide du curseur Aligner sur le Web du panneau Paramètres dans la boîte de dialogue Enregistrer pour le Web. Plus cette valeur est élevée, plus le nombre de couleurs remplacées est important. Suppression de couleurs Vous pouvez supprimer des couleurs sélectionnées de la table des couleurs afin de réduire la taille du fichier image. Pour ce faire, cliquez sur le bouton de corbeille ou choisissez Supprimer la couleur dans le menu de la palette Table des couleurs. Lorsque vous supprimez une couleur, les zones de l’image optimisée auxquelles elle était appliquée sont rendues avec la couleur la plus proche contenue dans la palette. Remarque : Lorsqu’une couleur est supprimée, la palette adopte le type Personnalisé afin que la couleur ne soit pas rétablie dans cette palette si vous réoptimisez l’image. Verrouillage et déverrouillage des couleurs Vous pouvez verrouiller une couleur de la table pour éviter sa suppression ou son tramage si vous réduisez le nombre de couleurs d’une image. Cliquez sur le bouton de verrouillage ou choisissez Verrouiller/ Déverrouiller les couleurs sélectionnées dans le menu de la palette Table des couleurs. Un carré blanc doté d’un centre rouge apparaît dans le coin inférieur droit de chaque couleur verrouillée. Pour déverrouiller toutes les couleurs, choisissez Déverrouiller toutes les couleurs dans le menu de la palette Table des couleurs. Comment utiliser l'aide | Sommaire | Index Page précédente 208 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 209 Enregistrement et chargement des couleurs Vous pouvez enregistrer les tables de couleurs des images optimisées afin de les utiliser avec d’autres images, et charger des tables créées dans d’autres applications. Pour enregistrer une table de couleurs, choisissez Enregistrer la table des couleurs dans le menu de la palette Table des couleurs. Le programme associe par défaut l’extension .act (Adobe Color Table) au fichier de la table. Pour charger une table de couleurs, choisissez Charger la table des couleurs dans le menu de la palette Table des couleurs. Vous pouvez charger une table à partir d’un fichier .act ou GIF (pour charger la table de couleurs incorporée). Lorsque vous chargez une nouvelle table, les couleurs de l’image optimisée sont modifiées en conséquence. Utilisation de la palette Taille de l’image La palette Taille de l’image dans la boîte de dialogue Enregistrer pour le Web vous permet de spécifier une nouvelle taille pour le fichier cible lors du processus d’optimisation des objets dynamiques. Largeur et Hauteur Ces champs vous permettent de saisir de nouvelles valeurs pour la largeur et la hauteur du fichier cible. Conserver les proportions Sélectionnez cette option, puis saisissez une valeur dans le champ Pourcentage pour spécifier une nouvelle taille de fichier. Vous pouvez également saisir une valeur de largeur ou de hauteur et la dimension correspondante sera adaptée en conséquence. Qualité Cette option vous permet de choisir la méthode de rééchantillonnage Bicubique (meilleur résultat) ou Au plus proche (plus rapide) lors du redimensionnement de l’image. Application des nouveaux paramètres de taille Pour appliquer les valeurs saisies dans la palette Taille de l’image, cliquez sur le bouton Appliquer. Enregistrement d’images optimisées Lorsque vous avez appliqué une série de paramètres permettant d’obtenir le meilleur compromis entre la qualité et la taille du fichier, vous pouvez enregistrer l’image optimisée. GoLive vous permet de modifier les paramètres d’optimisation pour les objets dynamiques Photoshop et Illustrator de votre page Web à tout moment. Pour plus de détails sur la mise à jour des objets dynamiques, voir « Options supplémentaires relatives aux images », page 186. Pour enregistrer une image optimisée : 1 Dans la boîte de dialogue Enregistrer pour le Web, sélectionnez la vue avec les paramètres d’optimisation souhaités et cliquez sur Enregistrer. 2 Spécifiez un nom de fichier et un emplacement pour le(s) fichier(s) résultant(s). 3 Cliquez sur Enregistrer. Utilisation de tranches lors de l’optimisation Si votre fichier Photoshop (PSD) ou Illustrator SVG contient plusieurs tranches, vous pouvez spécifier celles auxquelles vous souhaitez appliquer les paramètres d’optimisation. Pour partager des paramètres d’optimisation entre plusieurs tranches, vous pouvez lier ces dernières. Les tranches liées au format GIF et PNG-8 partagent une palette de couleurs et un motif de tramage afin d’éviter l’apparition de raccords entre elles. Comment utiliser l'aide | Sommaire | Index Page précédente 209 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 210 Vous pouvez aussi associer un lien URL, spécifier le cadre ouvert par l’URL et ajouter du texte de remplacement, un message d’état ainsi qu’une couleur d’arrière-plan à une tranche. Pour afficher ou masquer des tranches dans la boîte de dialogue Enregistrer pour le Web : Cliquez sur le bouton d’activation/désactivation de la visibilité de tranche . Pour sélectionner des tranches dans la boîte de dialogue Enregistrer pour le Web : 1 Activez l’outil de sélection de tranche . 2 Cliquez sur une tranche pour la sélectionner. Maintenez la touche Maj enfoncée et cliquez ou faites glisser pour sélectionner plusieurs tranches. Pour afficher les options de tranche dans la boîte de dialogue Enregistrer pour le Web : Cliquez deux fois sur une tranche à l’aide de l’outil de sélection de tranche. Pour définir des options de tranche : 1 Cliquez deux fois sur l’image tranchée à l’aide de l’outil de sélection de tranche. 2 Dans la boîte de dialogue Options de tranche, effectuez l’une des opérations suivantes, puis cliquez sur OK : • Saisissez le nom de tranche dans la zone de texte Nom. Par défaut, GoLive utilise le nom de tranche pour nommer le fichier lorsque vous enregistrez la page Web. • Spécifiez un URL pour transformer la zone de tranche en zone sensible dans votre page Web. Vous pouvez saisir un URL relatif ou complet (avec http://) ou choisir un URL déjà créé à partir du menu contextuel. • Si vous spécifiez un URL, précisez le cadre cible du lien dans la zone de texte Cible. Vous pouvez saisir le nom d’un cadre cible ou choisir une option standard dans le menu contextuel. • Dans la zone de texte Message, saisissez le texte qui doit s’afficher dans la barre d’état du navigateur lorsque le pointeur de la souris est placé sur une image. • Dans la zone Texte de remplacement, saisissez le texte qui doit remplacer les données de l’image dans les navigateurs qui n’affichent pas les images (et qui est utilisé par les logiciels de reconnaissance vocale). • Dans le menu contextuel Fond, choisissez la couleur qui sera utilisée pour la zone de tranche de votre page Web. Optimisation d’images pour des appareils sans fil GoLive 6 vous permet d’optimiser des images pour les utiliser sur des appareils sans fil, tels que les téléphones portables Nokia i-mode. Vous ajoutez des images à une mise en page à l’aide des objets dynamiques. Dans la boîte de dialogue Enregistrer pour le Web, vous pouvez choisir entre deux jeux de paramètres prédéfinis : GIF i-mode 1 bit et GIF i-mode 256. Etant donné que les images pour appareils sans fil doivent être très petites, utilisez la palette Taille de l’image pour réduire leur taille avant de les enregistrer. Pour plus de détails sur l’utilisation d’images pour l’affichage sur des appareils sans fil, voir « Ajout d’images », page 527. Comment utiliser l'aide | Sommaire | Index Page précédente 210 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 211 Ajout d’images compatibles avec le Web sans utiliser les objets dynamiques Dans GoLive, vous pouvez ajouter des images compatibles avec le Web directement dans votre page Web. Vous ne profitez pas des avantages des objets dynamiques. Néanmoins, cette méthode s’avère utile lorsque, par exemple, vous disposez déjà d’images compatibles avec le Web que vous ne souhaitez pas modifier et que vous voulez les ajouter à votre page. GoLive prend en charge les formats GIF, GIF89a, GIF i-mode 1 bit, GIF i-mode 256, JPEG, JPEG progressif, PNG et WBMP. Pour ajouter des images au format SVG ou SWF, vous devez utiliser l’icône Module externe du panneau Standard dans la palette Objets. Pour plus de détails sur l’ajout de fichiers SVG et SWF, voir « Ajout de fichiers multimédias à une page Web », page 229. Remarque : Vous devez utiliser la méthode des objets dynamiques si vous faites glisser un fichier Illustrator (AI), Photoshop (PSD) ou LiveMotion (LIV) dans l’éditeur de mise en page. (Voir « Ajout d’images à une page Web à l’aide d’objets dynamiques », page 182.) Insertion d’une image dans l’éditeur de mise en page Lorsque vous ajoutez une image compatible avec le Web dans l’éditeur de mise en page, GoLive crée une simple référence de la page HTML vers l’image. Il est recommandé de placer l’image compatible avec le Web dans la fenêtre du site avant de l’ajouter à la page Web. L’ajout d’une image à votre projet de site garantit un bon aperçu des images utilisées dans ce dernier. Pour insérer une image : 1 Effectuez l’une des opérations suivantes : • Faites glisser une image compatible avec le Web dans l’éditeur de mise en page. Si vous choisissez cette méthode, vous pouvez ignorer les instructions du point 2. • Faites glisser l’icône Image du panneau Standard de la palette Objets vers la fenêtre du document ou cliquez deux fois sur cette icône dans la palette. 2 Sélectionnez la balise d’emplacement de l’image et, dans l’inspecteur d’image, spécifiez un fichier pour l’image. Cliquez ensuite sur Ouvrir. Ajustement de la taille des images non dynamiques Vous pouvez redimensionner des images non dynamiques dans GoLive. Toutefois, à moins qu’il s’agisse d’une image au format SVG ou SWF, il est recommandé d’effectuer cette opération avec la méthode des objets dynamiques pour les raisons indiquées ci-dessous. • Si vous placez une image surdimensionnée sur la page et que vous réduisez ensuite sa taille, la page continue à référencer inutilement un fichier image volumineux, d’où une utilisation peu efficace de la bande passante et une qualité d’image limitée. • Si vous placez une image de taille réduite sur la page et que vous l’agrandissez ensuite, elle risque de subir une dégradation. Comment utiliser l'aide | Sommaire | Index Page précédente 211 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 212 Lorsque vous modifier les dimensions d’une image, GoLive affiche une icône d’avertissement de redimensionnement au-dessus de celle-ci pour vous signaler qu’elle risque de générer un fichier de taille excessive et de ne pas être affichée dans une résolution optimale. GoLive fournit également un bouton de redimensionnement dans l’inspecteur d’image permettant de rétablir les proportions d’origine de l’image. Pour ajuster la taille d’une image dans GoLive : Sélectionnez cette image, choisissez l’unité de mesure voulue dans l’inspecteur de l’image, puis saisissez de nouvelles valeurs dans les champs Hauteur et Largeur. Pour ajuster la taille d’une image et conserver les proportions : 1 Dans l’inspecteur d’image, choisissez l’option Image dans le menu contextuel Largeur ou Hauteur (mais pas les deux). 2 Choisissez l’option Pixel dans l’autre menu contextuel d’attribut de taille (Largeur ou Hauteur). 3 Saisissez une valeur dans la zone de texte Pixel et appuyez sur la touche Entrée (Windows ou Mac OS) ou Retour (Mac OS). Remarque : Il est déconseillé d’utiliser systématiquement cette méthode pour réduire la taille des images. Pour redimensionner vos images, utilisez plutôt les objets dynamiques afin d’obtenir une meilleure qualité et conserver le fichier image source d’origine. Pour plus de détails sur le redimensionnement des objets dynamiques, voir « Utilisation des objets dynamiques », page 182. Options d’image supplémentaires dans l’inspecteur d’image A l’instar de l’inspecteur d’image dynamique, l’inspecteur d’image contient des options supplémentaires dans ses panneaux Standard, Avancé et Liens qui permettent, entre autres, de définir un texte de remplacement pour une image, d’ajuster la largeur de ses bords, de la lier à une URL et de spécifier une version de faible résolution de l’image. (Voir « Création d’images source de faible résolution », page 227.) Pour plus de détails sur les autres options d’image, voir « Options supplémentaires relatives aux images », page 186. Création de boutons animés Les boutons animés répondent aux actions de la souris de l’utilisateur, ce qui ajoute une interactivité à votre page Web. L’image d’un bouton animé peut changer lorsque l’utilisateur la survole avec le pointeur de sa souris, puis de nouveau lorsqu’il clique dessus. Si aucune action « onclick » n’est appliquée au bouton animé, vous pouvez l’utiliser comme hyperlien pour afficher un texte ou une image et assigner une fonction prédéfinie GoLive à une image animée. Les boutons animés nécessitent deux ou trois images similaires qui apparaissent dans la même zone de la page. La première image (Normal) détermine l’apparence générale du bouton lorsque le pointeur de la souris ne se trouve pas dessus. La deuxième image (Survol) est une autre version (par exemple, image mise en évidence) qui s’affiche lorsque le pointeur de la souris se trouve sur le bouton. La troisième image (Clic) apparaît lorsque l’utilisateur clique sur le bouton. Comment utiliser l'aide | Sommaire | Index Page précédente 212 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 213 Généralement, les images de boutons animés sont affichées aux mêmes dimensions que l’image de base. Si l’une des images a des dimensions différentes, vous pouvez effectuer un redimensionnement dans un éditeur graphique ou, plus simplement, modifier les options de hauteur et de largeur de l’image de base (Image plutôt que Pixel) dans l’inspecteur d’image de GoLive. A propos de la création de boutons animés dans GoLive GoLive vous permet d’ajouter des boutons animés dynamiques ou simples à votre page Web. Les boutons animés dynamiques offrent l’avantage de prendre en charge les actions imbriquées. Ces boutons génèrent un code JavaScript plus important, mais GoLive vous permet d’extraire ce code pour le placer dans un fichier JavaScript externe. Vous obtenez ainsi un meilleur résultat que lorsque le code JavaScript est écrit directement dans le code source en ligne. (Voir « Définition des options de téléchargement vers le serveur », page 364.) Vous pouvez également créer des boutons animés simples. Ces boutons ne fournissent pas la prise en charge d’actions imbriquées des boutons animés dynamiques, mais leur code HTML est plus simple. Quel que soit le type de bouton animé utilisé, vous pouvez utiliser la nouvelle fonction de détection d’image de bouton animé pour lui affecter des images automatiquement. Ceci vous permet de gagner du temps et d’assurer la cohérence des images. La gestion des liens est réalisée grâce au code JavaScript, qu’il s’agisse d’un bouton animé dynamique ou simple. Si vous modifiez le nom ou l’emplacement d’un fichier référencé par un bouton animé dynamique, GoLive vous invite automatiquement à mettre à jour le lien correspondant. Vous n’avez pas besoin d’assurer le suivi des liens vous-même. Les boutons animés dynamiques prennent également en charge les actions imbriquées. Il est recommandé aux utilisateurs de Photoshop de sélectionner l’option de sortie HTML Codes GoLive inclus pour rendre les boutons animés entièrement modifiables dans GoLive. Affectation automatique des images de bouton animé L’option Détecter les images du bouton animé vous permet d’affecter automatiquement et en une seule opération des images pour les états Survol et Clic d’un bouton animé. Il vous suffit d’indiquer le nom de fichier de l’image normale (affichée la première fois que la page est ouverte) et, si vous respectez les conventions de dénomination, GoLive détecte automatiquement les images correspondant aux états Survol et Clic. Par exemple, si vous saisissez le nom myimage_Base pour l’image normale, GoLive recherche les images nommées myimage_Over et myimage_Down. Assurez-vous que les noms de vos images sont dotés de l’extension de fichier adéquate, telle que .GIF, .JPG ou .PNG. GoLive met à votre disposition trois jeux de conventions de dénomination différents. Pour plus de détails sur la modification des conventions de dénomination, voir « Modification ou affichage des conventions de dénomination des boutons animés GoLive », page 214. Remarque : Pour utiliser la fonction de détection des images d’un bouton animé, vous devez placer vos images (normale, survol et clic) dans le même dossier. Cette fonction est activée par défaut, mais vous pouvez la désactiver si vous préférez affecter les images manuellement. Comment utiliser l'aide | Sommaire | Index Page précédente 213 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 214 Pour désactiver la fonction Détecter les images du bouton animé : 1 Dans l’inspecteur de bouton animé (bouton dynamique) ou l’inspecteur d’image (bouton simple), cliquez sur l’icône en forme de triangle située dans le coin supérieur droit. Dans le menu qui s’affiche, choisissez Configuration du bouton animé pour ouvrir la boîte de dialogue du même nom. 2 Dans cette boîte de dialogue, désactivez la case à cocher Détecter les images du bouton animé et cliquez sur OK. Remarque : Vous avez toujours la possibilité de réactiver la fonction Détecter les images du bouton animé en sélectionnant l’option correspondante dans la boîte de dialogue Configuration du bouton animé ou dans le menu contextuel de l’inspecteur. Modification ou affichage des conventions de dénomination des boutons animés GoLive Vous pouvez afficher trois jeux de conventions de dénomination utilisés par la fonction Détecter les images du bouton animé. GoLive vous permet également de modifier les paramètres, si vous avez vos propres conventions de dénomination pour les images de bouton animé. Pour afficher ou modifier les conventions de dénomination par défaut : 1 Dans l’inspecteur de bouton animé (bouton dynamique) ou l’inspecteur d’image (bouton simple), cliquez sur l’icône en forme de triangle située dans le coin supérieur droit. Dans le menu qui s’affiche, choisissez Configuration du bouton animé pour ouvrir la boîte de dialogue du même nom. 2 Si nécessaire, remplacez le jeu de conventions souhaité. Si vous utilisez ImageReady, ne remplacez pas le jeu 3, car il correspond aux conventions de dénomination des boutons animés d’ImageReady. Création d’un bouton animé dynamique Par rapport au bouton animé simple, le bouton animé dynamique offre de nombreux avantages. (Voir « A propos de la création de boutons animés dans GoLive », page 213.) Pour créer un bouton animé dynamique : 1 Faites glisser l’icône Bouton animé du panneau SmartObjects votre page. de la palette Objet sur 2 Dans l’inspecteur de bouton animé, saisissez un identifiant unique dans la zone de texte Nom. Remarque : JavaScript identifie les objets sur une page grâce ce nom unique. Afin de garantir que votre bouton animé JavaScript fonctionne correctement, GoLive lui donne un nom unique. Vous pouvez toujours le renommer, mais veillez à utiliser un nom reconnu par JavaScript. 3 Sélectionnez l’icône Normal et spécifiez un fichier pour l’image de l’état normal du bouton animé. Comment utiliser l'aide | Sommaire | Index Page précédente 214 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 215 GoLive recherche automatiquement les images pour les états Survol et Clic en fonction des conventions de dénomination définies pour le bouton. Lorsqu’il détecte les images, elles sont automatiquement liées aux états Survol et Clic du bouton animé. L’inspecteur de bouton animé les affiche en outre sous la forme de vignettes. Remarque : Vous pouvez affecter les images Survol et Clic manuellement à l’aide des options de l’inspecteur de bouton animé. Si ces images sont momentanément indisponibles, vous pouvez relancer le processus de détection automatique une fois qu’elles sont disponibles. Pour relancer la détection des images Survol et Clic manuellement, choisissez l’option Détecter les images du bouton animé dans le menu du coin supérieur droit de l’inspecteur de bouton animé. 4 Dans l’inspecteur de bouton animé, spécifiez le fichier de destination du lien. 5 Il est recommander de préciser un texte de remplacement et un message (affiché en bas de la fenêtre du navigateur lorsque l’utilisateur survole le bouton avec le pointeur de la souris ou clique dessus). (Voir « Options supplémentaires relatives aux images », page 186.) 6 Vous pouvez également spécifier des valeurs pour la largeur, la hauteur, l’espace horizontal et l’espace vertical du bouton animé dynamique. Si vous utilisez des boutons animés dynamiques, il est également possible d’affecter trois images de bouton en les faisant glisser dans l’éditeur de mise en page. Faites tout d’abord glisser l’image d’état Normal de la fenêtre du site ou d’un dossier sur l’icône Bouton animé dans la fenêtre du document. Ensuite, faites glisser la deuxième image (Survol) en maintenant enfoncée la touche Alt (Windows) ou Option (Mac OS). Faites glisser la troisième image (Clic) en maintenant enfoncée la touche Maj. Il est recommandé d’utiliser des images de la même taille. Création d’un bouton animé simple Les boutons animés simples n’offrent pas tous les avantages des boutons animés dynamiques, tels que la prise en charge des actions imbriquées (y compris les actions de tiers) et de l’exportation de code JavaScript vers un fichier bibliothèque JavaScript. (Voir « A propos de la création de boutons animés dans GoLive », page 213.) Toutefois, les boutons animés simples génèrent un code simplifié et peuvent s’avérer plus pratiques si vous transmettez votre page HTML à un programmateur qui prévoit de saisir manuellement le code JavaScript (le code simple est plus facile à remplacer). Si vous ne travaillez pas avec un programmateur Web qui crée le code JavaScript manuellement, il est préférable d’utiliser les boutons animés dynamiques pour des résultats optimaux. Pour créer un bouton animé simple : 1 Faites glisser l’icône Image du panneau Standard document. de la palette Objets dans votre 2 Cliquez sur l’onglet Bouton animé dans l’inspecteur d’image. Saisissez un nom unique pour votre bouton animé dans la zone de texte Nom. 3 Dans la zone Normal du panneau Bouton animé, spécifiez un fichier pour l’image d’état Normal. Comment utiliser l'aide | Sommaire | Index Page précédente 215 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 216 GoLive recherche automatiquement les images pour les états Survol et Clic en fonction des conventions de dénomination définies pour le bouton. (Voir « Affectation automatique des images de bouton animé », page 213.) Lorsqu’il détecte les images, elles sont automatiquement liées aux états Survol et Clic du bouton animé. Remarque : Comme pour les boutons animés dynamiques, vous pouvez affecter les images d’état Survol et Clic manuellement dans le panneau Bouton animé de l’inspecteur d’image. Conversion d’un bouton animé dynamique en bouton animé simple Vous pouvez convertir des boutons animés dynamiques en boutons animés simples individuellement, pour toute une page ou pour la totalité du site Web. Veuillez noter que lors d’une telle conversion, vous perdez tous les avantages des boutons animés dynamiques. Pour convertir un bouton animé dynamique en bouton animé simple : 1 Sélectionnez le bouton animé dynamique dans l’éditeur de mise en page. 2 Dans le menu de l’inspecteur de bouton animé, choisissez Convertir en bouton animé simple, puis Sélectionné ou utilisez le menu contextuel. Remarque : Pour convertir tous les boutons animés dynamiques d’une page, choisissez Convertir en bouton animé simple, puis Tous les éléments. Vous pouvez également convertir tous les boutons animés dynamiques d’un site en boutons animés simples. Dans les préférences de GoLive, cliquez sur Modules et sélectionnez Extend Script dans le panneau droit pour activer le module Extend Script. Suivez ensuite les instructions fournies dans la documentation SDK installée avec le module. Le module Extend Script peut uniquement être installé dans le cadre d’une installation personnalisée. Remplacement des images affectées aux boutons animés Si vous disposez déjà d’un bouton animé, vous pouvez lui affecter une nouvelle image d’état Normal. Lorsque vous spécifiez celle-ci dans l’inspecteur de bouton animé (pour les boutons dynamiques) ou dans le panneau Bouton animé de l’inspecteur d’image (pour les boutons simples), GoLive lance la procédure de détection des images de bouton animé. Si de nouvelles images d’état Survol et Clic sont détectées, GoLive remplace les anciennes images. Si vous ne fournissez pas de nouvelles images d’état Survol et Clic avec la nouvelle image d’état Normal, les anciennes images (Survol et Clic) restent inchangées. Remarque : Il est également possible de réaffecter manuellement de nouvelles images d’état Survol et Clic en spécifiant un fichier de destination pour le lien dans l’inspecteur de bouton animé et dans le panneau Bouton animé de l’inspecteur d’image. Association d’actions à un bouton animé La palette Actions permet d’associer une action de script à l’image d’un bouton animé, qui modifie, par exemple, la couleur d’arrière-plan de la page. Pour plus de détails, voir « Configuration d’actions », page 250. Comment utiliser l'aide | Sommaire | Index Page précédente 216 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 217 Remarque : Pour que le script fonctionne, veuillez suivre les instructions suivantes : Assurez-vous que toutes les images d’une page sont dotées d’un nom unique (bouton1, bouton2, etc.). Evitez les noms composés de nombres (1, 2, 3, etc.) uniquement ou qui commencent par un nombre ; ils ne fonctionnent pas dans tous les navigateurs. Enfin, n’utilisez pas d’espaces ni de caractères spéciaux. Création de mappages d’images GoLive vous permet de créer des zones sensibles interactives sur votre image dynamique ou standard (non dynamique), de les modifier et les lier à des pages Web ou d’autres ressources. Vous pouvez également associer les zones sensibles d’un mappage d’image interactif à des actions de scripts. Pour créer un mappage d’image interactif : 1 Sélectionnez une image dynamique ou standard (non dynamique) sur votre page Web. 2 Dans l’inspecteur d’image dynamique ou l’inspecteur d’image, cliquez sur l’onglet Avancé et cochez la case Image interactive. Remarque : Par défaut, GoLive affecte au mappage d’image un identifiant unique qu’il affiche dans la zone de texte Nom du panneau Avancé. Toutefois, rien ne vous empêche de le remplacer par un autre nom de votre choix. 3 Pour définir une zone sensible, cliquez sur un outil de définition de zone (Sélection d’une zone , Rectangle , Cercle ou Polygone ) de la barre d’outils, puis cliquez et faites glisser dans l’image pour tracer la zone du lien. 4 Dans l’inspecteur de zone d’image interactive, spécifiez un fichier de destination pour le lien de la zone sensible sélectionnée. 5 Utilisez la zone de texte Cible pour spécifier le cadre cible dans le jeu de cadres de destination (le cas échéant). 6 Saisissez les informations supplémentaires dans la zone de texte Titre. Ces informations sont utilisées par certains navigateurs pour afficher des info-bulles ou émettre des annotations vocales. Vous pouvez également cliquer sur une image et utiliser le menu contextuel pour créer un mappage d’image interactif. Pour personnaliser l’aspect de la zone sensible : 1 Sélectionnez cette zone dans l’image. 2 Utilisez les options de la barre d’outils pour effectuer l’une des opérations suivantes : • Utilisez l’outil pointeur pour faire glisser la zone sensible afin de la déplacer ou de la redimensionner. • Cliquez sur le bouton URL pour afficher l’URL de destination du lien dans la zone sensible. Par commodité, l’URL apparaît dans l’éditeur de mise en page de GoLive ; elle n’est pas affichée sur la page Web. • Cliquez sur les boutons de cadre ou de couleur pour, respectivement, modifier ou faire pivoter le bord de la zone et activer ou désactiver les couleurs pendant l’édition. • Cliquez sur le bouton de couleur pour modifier la couleur de mise en évidence. Comment utiliser l'aide | Sommaire | Index Page précédente 217 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index • Page précédente 218 Si vous travaillez avec plusieurs zones sensibles qui se chevauchent, utilisez les boutons Premier plan et Arrière-plan de la barre d’outils pour modifier l’ordre dans lequel elles sont empilées. Remarque : Les boutons Premier plan et Arrière-plan sont également disponibles dans la palette Transformation. Pour ajouter des actions aux mappages d’images : 1 Sélectionnez une zone sensible dans un mappage d’image sur votre page Web. 2 Choisissez Fenêtre > Actions. 3 Dans la palette Actions, choisissez un événement de souris ou de clavier et cliquez sur le bouton Nouvel élément . 4 Sélectionnez l’option voulue dans le menu Actions de la palette du même nom. Création de plusieurs versions d’une image à l’aide des variables Les variables représentent un outil essentiel pour la création d’un site Web dans GoLive. Elles vous permettent de créer différentes versions d’une image dynamique avec un contrôle des variables générées dans LiveMotion, Illustrator ou Photoshop. Vous pouvez spécifier tous les paramètres dans GoLive ; vous n’avez pas besoin d’ouvrir l’application d’origine pour définir les variables. A 30 B C Création de plusieurs versions d’une image à l’aide de variables A. Fichier source avec des variables B. L’utilisateur définit les variables et un fichier cible est généré C. Plusieurs versions de l’image peuvent être créées, chacune d’elle avec différentes configurations de variables GoLive utilise les objets dynamiques pour les variables. Lorsque vous ajoutez un objet dynamique à la page, GoLive détecte les éventuelles variables du fichier. Le cas échéant, la boîte de dialogue Configuration des variables est affichée. Cette boîte de dialogue contient différents paramètres en fonction du type d’objet dynamique ajouté à la page (LiveMotion, Illustrator ou Photoshop). Comment utiliser l'aide | Sommaire | Index Page précédente 218 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 219 Une fois que vous avez défini les variables, cliquez sur OK. GoLive utilise alors la fonction Enregistrer pour le Web (pour les fichiers Illustrator ou Photoshop) ou lance LiveMotion pour générer le fichier cible avec la nouvelle configuration des variables. Comme pour tous les objets dynamiques, seul le fichier cible est affecté par la nouvelle configuration ; le fichier source reste inchangé. L’avantage des variables est que vous pouvez créer plusieurs fichiers cibles dont les images et le texte varient en fonction des différentes configurations de variables. Etant donné que vous utilisez des objets dynamiques, si vous mettez à jour ou modifiez le fichier source, toutes les versions de la page ouverte dans l’éditeur de mise en page sont automatiquement mises à jour. Pour plus de détails sur l’affectation de variables à un fichier, consultez les guides de l’utilisateur d’Adobe LiveMotion 2.0 et Adobe Illustrator 10. Pour plus de détails sur l’ajout d’un calque texte dans Photoshop, consultez le guide de l’utilisateur d’Adobe Photoshop 6.0. Remarque : GoLive reconnaît uniquement les variables d’un fichier Illustrator s’il a été enregistré au format SVG. Utilisation de variables dans un fichier LiveMotion GoLive peut détecter les balises de remplacement (variables) dans un fichier LiveMotion et gérer les objets variables de LiveMotion pour la production graphique automatisée, la conception d’animation et la mise à jour de fichier via des objets dynamiques LiveMotion. Vous pouvez changer le texte, associer ou modifier un lien incorporé, appliquer un nouveau style ou motif à l’aide des options de GoLive. GoLive lance ensuite LiveMotion qui applique les paramètres aux variables et génère un nouveau fichier cible SWF. Remarque : Vous devez avoir installé LiveMotion 2 sur votre ordinateur pour pouvoir utiliser les variables. Lorsque vous ajoutez un fichier LiveMotion (LIV) dans l’éditeur de mise en page, GoLive affiche la boîte de dialogue Configuration des variables. Cette boîte de dialogue contient les options suivantes : Définir ou modifier du texte Utilisez l’option Texte pour saisir le texte de l’objet dynamique LiveMotion. Les options Police, Corps de police, Approche (espace entre les lettres) et Interligne (espace entre les lignes de texte) vous permettent de spécifier l’aspect du texte. Afficher, associer ou modifier un lien incorporé Utilisez l’option Lien pour afficher, associer ou modifier un lien URL incorporé en spécifiant un fichier de destination pour le lien. Contrairement aux objets dynamiques Photoshop et Illustrator, les liens URL des objets dynamiques LiveMotion sont définis dans la boîte de dialogue Configuration des variables, et non dans l’inspecteur d’objet dynamique. L’option Cible vous permet de spécifier le cadre dans lequel l’URL lié doit apparaître. Définir ou modifier l’aspect d’un objet Utilisez les options Couleur, Style et Texture pour appliquer respectivement une couleur, un style ou une texture LiveMotion à une variable d’objet. Comment utiliser l'aide | Sommaire | Index Page précédente 219 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 220 Utilisation de variables dans un fichier Illustrator SVG Vous pouvez déterminer le contenu du texte et la visibilité des objets dans un fichier SVG doté de variables. Pour définir des variables dans un fichier Illustrator SVG : 1 Ajoutez un fichier Illustrator SVG avec des variables dans l’éditeur de mise en page. La boîte de dialogue Configuration des variables est affichée. 2 Dans cette boîte de dialogue, effectuez l’une des opérations suivantes : • Sélectionnez l’option Utiliser pour une variable de texte et saisissez le texte de remplacement dans la zone de texte. • Sélectionnez l’option Utiliser pour un objet, puis choisissez une option du menu pour spécifier si l’objet est visible ou invisible dans le fichier cible. • Ne sélectionnez pas l’option Utiliser pour les variables que vous souhaitez laisser inchangées. Important : Si vous sélectionnez l’option Utiliser pour une variable de texte et que vous ne saisissez aucun texte, le texte d’origine est supprimé. GoLive considère la zone de texte vide comme la nouvelle valeur de la variable de texte. 3 Cliquez sur OK. Remarque : Bien que les polices puissent être incorporées dans un fichier SVG, les polices utilisées doivent être installées sur le système afin d’obtenir des résultats optimaux lors de la substitution du texte. Utilisation d’une variable de texte dans un fichier Photoshop Lorsque vous ajoutez un fichier PSD à plusieurs calques dans l’éditeur de mise en page, GoLive détecte s’il contient un calque de texte. Le cas échéant, GoLive traite le calque de texte de premier plan comme une variable de texte et ouvre la boîte de dialogue Configuration des variables. Cette boîte de dialogue vous permet de modifier le contenu du texte. Pour définir une variable de texte dans un fichier Photoshop : 1 Ajoutez un fichier PSD contenant un calque de texte dans l’éditeur de mise en page. La boîte de dialogue Configuration des variables est affichée. 2 Effectuez l’une des opérations suivantes : • Sélectionnez l’option Utiliser pour une variable de texte et saisissez le texte de remplacement dans la zone de texte. Si vous sélectionnez l’option Utiliser pour une variable de texte et que vous ne saisissez aucun texte, le texte d’origine est supprimé. GoLive considère la zone de texte vide comme la nouvelle valeur de la variable de texte. • Ne sélectionnez l’option Utiliser pour laisser le texte d’origine inchangé. 3 Cliquez sur OK. Mise à jour d’un fichier cible Lorsque vous avez créé un fichier cible à partir d’un fichier source contenant des variables, vous pouvez le mettre à jour. Pour mettre à jour un fichier cible : 1 Sélectionnez l’objet dynamique souhaité dans l’éditeur de mise en page. Comment utiliser l'aide | Sommaire | Index Page précédente 220 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 221 2 Dans l’inspecteur d’image dynamique ou de module externe, cliquez sur le bouton Variables. 3 Dans la boîte de dialogue Configuration des variables, apportez les modifications nécessaires et cliquez sur OK. Vous trouverez des modèles pour créer des objets, tels que des boutons, des barres de navigation et des séparateurs, dans le dossier d’exemples d’objets dynamiques sur le CD-Rom de l’application GoLive. Vous pouvez créer des objets personnalisés pour votre site Web en modifiant les variables de ces fichiers source. Conversion du texte en image sur une page Web La commande Convertir le texte en bannière vous permet de transformer du texte HTML simple en animation ou image dynamique. Vous pouvez ainsi rapidement créer des bannières ou d’autres éléments visuels de page Web à partir du texte de mise en page. A la manière des variables, la commande Convertir le texte en bannière de GoLive vous permet de créer un nouveau fichier cible à partir du texte HTML et d’un fichier LiveMotion (LIV), Illustrator (SVG) ou Photoshop (PSD) contenant des variables. (Voir « Création de plusieurs versions d’une image à l’aide des variables », page 218.) La commande Convertir le texte en bannière remplace le texte HTML par un objet dynamique qu’il utilise pour créer un fichier cible contenant du texte. Si votre fichier est au format Illustrator (SVG) ou Photoshop (PSD), GoLive utilise la fonction Enregistrer pour le Web afin de créer le fichier cible. Vous n’avez pas besoin d’installer Illustrator ou Photoshop sur votre ordinateur. Toutefois, si vous utilisez un fichier au format LIV, l’application LiveMotion doit être installée sur votre ordinateur. Comment utiliser l'aide | Sommaire | Index Page précédente 221 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 222 Comme pour tous les objets dynamiques, la génération du fichier cible n’affecte pas le fichier source. L’objet dynamique conserve le lien entre les fichiers cible et source ; la mise à jour du fichier source entraîne donc automatiquement celle du fichier cible situé sur une page ouverte dans l’éditeur de mise en page. A C B Text variable Conversion du texte en bannière A. Texte HTML sélectionné dans l’éditeur de mise en page B. Utilisation d’un fichier source contenant des variables comme modèle de texte HTML par la commande Convertir le texte en bannière, puis génération du fichier cible par la fonction Enregistrer pour le Web ou l’application LiveMotion C. Remplacement du texte HTML d’origine par l’objet dynamique dans l’éditeur de mise en page Pour convertir du texte en image ou animation à l’aide d’un fichier LiveMotion (LIV) contenant des variables : 1 Sélectionnez du texte dans l’éditeur de mise en page. 2 Choisissez Spécial > Convertir le texte en bannière. GoLive insère une balise d’emplacement pour objet dynamique à l’endroit du texte. 3 Spécifiez un fichier LiveMotion contenant des variables et cliquez sur Ouvrir. GoLive lance LiveMotion pour générer un fichier cible SWF. La boîte de dialogue Configuration des variables est affichée. La case Texte est cochée et le texte HTML est affiché dans la zone de texte. 4 Le cas échéant, modifiez le texte ou les variables, puis cliquez sur OK. Pour plus de détails sur la configuration des variables, voir « Utilisation de variables dans un fichier LiveMotion », page 219. 5 Dans la boîte de dialogue Couleur du cache, effectuez l’une des opérations suivantes : • Cliquez sur l’option Couleur du cache, cliquez deux fois sur la case du sélecteur de couleur pour choisir une couleur, puis cliquez sur OK. • Cliquez sur Définir comme arrière-plan pour utiliser la couleur d’arrière-plan comme couleur de cache, puis cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 222 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index • Page précédente 223 Cliquez sur OK pour laisser la couleur du cache inchangée. 6 Cliquez sur OK. 7 Dans la boîte de dialogue Spécifier le fichier cible, indiquez le nom et l’emplacement du fichier cible et cliquez sur Enregistrer. Pour convertir du texte en image à l’aide d’un fichier Illustrator (SVG) ou Photoshop (PSD) contenant des variables : 1 Sélectionnez du texte dans l’éditeur de mise en page. 2 Choisissez Spécial > Convertir le texte en bannière. GoLive insère une balise d’emplacement pour objet dynamique à l’endroit du texte. 3 Spécifiez un fichier Illustrator (SVG) ou Photoshop (PSD) contenant des variables et cliquez sur Ouvrir. La boîte de dialogue Configuration des variables est affichée. La case Texte est cochée et le texte HTML est affiché dans la zone de texte. 4 Si nécessaire, modifiez le texte. Si l’image est au format SVG, vous pouvez également sélectionner une variable de visibilité et spécifier si l’objet doit être visible ou invisible. (Pour plus de détails sur l’utilisation des variables dans un fichier Illustrator, voir « Utilisation de variables dans un fichier Illustrator SVG », page 220.) Lorsque vous avez fini, cliquez sur OK. Remarque : Vous ne pouvez pas spécifier de variable de visibilité pour un fichier Photoshop. GoLive considère uniquement le calque de texte de premier plan du fichier PSD comme variable. Pour plus de détails sur les variables d’un fichier Photoshop, voir « Utilisation d’une variable de texte dans un fichier Photoshop », page 220. 5 Cliquez sur OK. 6 Dans la boîte de dialogue Enregistrer pour le Web, sélectionnez des paramètres d’optimisation prédéfinis dans le menu contextuel Paramètres ou personnalisez-les à l’aide des menus contextuels disponibles, puis cliquez sur Enregistrer. 7 Dans la boîte de dialogue Spécifier le fichier cible, indiquez le nom et l’emplacement du fichier cible et cliquez sur Enregistrer. Création d’une page Web à l’aide d’images de référence De nombreux concepteurs utilisent Photoshop ou Illustrator pour créer une page factice servant de base à une mise en page Web. Les images de référence de GoLive vous permettent d’utiliser une image comme modèle d’arrière-plan et vous servent de guide pour la construction de page. Les formats d’images de référence possibles sont les suivants : Illustrator, Photoshop (images à 8 bits uniquement), JPG, GIF, PNG, BMP, TARGA, EPS, PCX, PDF, PICT (Mac OS), PIXAR, SVG, TIFF et Amiga IFF. Pour utiliser des fichiers Illustrator (AI) et Photoshop (PSD) comme images de référence dans GoLive, vous n’avez pas besoin de les convertir à un format compatible avec le Web dans leurs applications d’origine. La fonction Enregistrer pour le Web vous permet d’effectuer cette conversion à partir de GoLive. Comment utiliser l'aide | Sommaire | Index Page précédente 223 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 224 L’image de référence est un outil très performant allant bien au-delà du simple modèle d’arrière-plan ou guide. Vous pouvez découper une partie de l’image de référence pour qu’elle devienne un objet de votre page Web. Vous n’avez pas besoin de quitter GoLive pour créer un objet à partir du fichier source ni de reconstruire des éléments déjà créés dans Photoshop ou Illustrator, ce qui vous fait gagner du temps. Pour ajouter une image de référence à votre page Web : 1 Choisissez Fenêtre > Image de référence. Dans la palette Image de référence, cochez la case Source et spécifiez un fichier pour l’image de référence. 2 Dans cette même palette, définissez l’opacité de l’image de référence. 3 Pour définir la position de l’image dans l’éditeur de mise en page, effectuez l’une des opérations suivantes : • Saisissez des valeurs en pixels dans les zones de texte Position. • Dans la palette Image de référence, cliquez sur l’outil de déplacement d’image et faites glisser l’image dans l’éditeur de mise en page. Lorsque vous avez terminé, cliquez de nouveau sur l’outil pour le désactiver. Remarque : Vous pouvez redimensionner rapidement la fenêtre du document à la taille de l’image de référence en choisissant Image de référence dans le menu contextuel de taille de la fenêtre situé dans le coin inférieur droit de cette fenêtre. Pour découper une zone de l’image de référence : 1 Ajoutez et positionnez une image de référence sur votre page. 2 Cliquez sur l’outil de découpe (similaire à l’outil Recadrage de Photoshop) et sélectionnez une zone rectangulaire de l’image de référence. Remarque : Vous pouvez annuler cette opération en cliquant de nouveau sur l’outil de découpe. A B Découpage d’une zone de l’image de référence A. Sélection d’une zone de l’image avec l’outil de découpe B. Génération d’un fichier cible à partir de la zone découpée par la fonction Enregistrer pour le Web Comment utiliser l'aide | Sommaire | Index Page précédente 224 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 225 3 Cliquez deux fois sur votre sélection ou sur le bouton Découper dans la palette Image de référence. 4 Dans la boîte de dialogue Enregistrer pour le Web, définissez les paramètres d’optimisation de votre choix, puis cliquez sur Enregistrer. 5 Spécifiez un emplacement pour le fichier et cliquez sur Enregistrer. La découpe apparaît sous la forme d’un calque dans une boîte flottante affichée dans la fenêtre du document. Le menu de la palette Image de référence vous permet d’effectuer plusieurs opérations sur une image de référence : • Redéfinir la position de cette image sur 0/0. • Aligner l’image de référence par rapport à une sélection dans le document. Par exemple, vous pouvez sélectionner une cellule de tableau ou une boîte flottante sur laquelle l’image de référence doit être alignée. Elle sera alors insérée à la position 0/0 par rapport à la cellule ou à la boîte flottante sélectionnée. Pour supprimer une image de référence : Désactivez la case à cocher Source dans la palette Image de référence. Comment utiliser l'aide | Sommaire | Index Page précédente 225 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 226 Utilisation de fichiers de calques Photoshop GoLive permet d’importer des images Photoshop contenant des calques de sorte que chaque calque soit converti au format compatible avec le Web de votre choix. Les calques ainsi convertis sont affichés sur la page Web dans des boîtes flottantes distinctes que vous pouvez ensuite convertir en grille de mise en page ou en tableau HTML standard, à la condition que les calques ne se chevauchent pas. (Voir « Mise en page à l’aide de boîtes flottantes », page 81.) Cette méthode d’importation d’image Photoshop diffère du placement d’un objet dynamique Photoshop sur une page Web. A moins qu’ils ne soient composés de tranches de calques, les fichiers de calques Photoshop importés en tant qu’objets dynamiques sont aplatis pour former une seule image. Remarque : Vous ne pouvez pas importer d’image Illustrator contenant des calques dans GoLive. A B C Importation de calques Photoshop en boîtes flottantes A. Importation d’un fichier de calques PSD dans GoLive à l’aide de la commande Calques Photoshop en boîtes flottantes B. Génération de fichiers cible distincts à partir de chaque calque du fichier PSD par la fonction Enregistrer pour le Web C. Affichage des fichiers cible dans l’éditeur de mise en page dans des boîtes flottantes distinctes Pour importer une image Photoshop contenant des calques : 1 Assurez-vous qu’une page est ouverte dans la fenêtre du document. 2 Choisissez Fichier > Importer > Calques Photoshop en boîtes flottantes. 3 Sélectionnez le dossier dans lequel vous souhaitez enregistrer les calques (par exemple, un sous-dossier d’images dans le dossier de votre site Web) et cliquez sur Ouvrir. Remarque : Si vous importez plusieurs images contenant des calques, vous pouvez créer un dossier de destination distinct pour chacune d’elles (par exemple un sous-dossier de votre dossier d’images) afin de ne pas mélanger les différents calques. 4 Dans la boîte de dialogue Enregistrer pour le Web, choisissez les paramètres d’optimisation voulus pour le premier calque, puis effectuez l’une des opérations suivantes : • Cliquez sur Enregistrer. GoLive ajoute le premier calque comme le calque le plus bas sur la page, puis ouvre la boîte de dialogue Enregistrer pour le Web pour chacun des calques restants. Choisissez des paramètres d’optimisation et cliquez sur Enregistrer Comment utiliser l'aide | Sommaire | Index Page précédente 226 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 227 pour chaque calque. Dans l’éditeur de mise en page, les calques sont placés dans des boîtes flottantes distinctes. • Maintenez la touche Ctrl (Windows) ou Control (Mac OS) enfoncée et cliquez sur Enregistrer. L’intitulé de cette commande devient Tout enregistrer. Elle permet d’appliquer les mêmes paramètres à l’ensemble des calques du fichier Photoshop importé. Dans l’éditeur de mise en page, les calques sont placés dans des boîtes flottantes distinctes. Pour plus de détails sur les options d’optimisation, voir « A propos de la boîte de dialogue Enregistrer pour le Web », page 200. Si vous cliquez sur Annuler, seule la définition des paramètres Web pour le calque actif est annulée. Pour annuler la définition des paramètres Web pour tous les calques restants, maintenez la touche Ctrl (Windows) ou Control (Mac OS) enfoncée et cliquez sur Annuler. Remarque : Certains navigateurs parviennent difficilement à traiter les boîtes flottantes dont les noms commencent par un chiffre. Etant donné que GoLive génère les noms de ces boîtes en utilisant ceux des calques, veillez à ne pas leurs attribuer de noms commençant par des chiffres ou constitués uniquement de chiffres dans Adobe Photoshop. Le cas échéant, vous pouvez renommer les boîtes flottantes après l’importation du fichier de calques Photoshop dans GoLive. Création d’images source de faible résolution Tout le monde ne dispose pas d’une connexion rapide à Internet et la taille de certaines images peut augmenter sensiblement le délai de téléchargement d’un fichier. Bien que les images source de faible résolution occupent le même espace sur une page Web que des images standard, elles sont téléchargées plus rapidement car la taille de leurs fichiers est limitée. Cette limitation de taille provient d’une configuration généralement en noir et blanc et d’une très faible résolution. Une fois que l’image principale est entièrement téléchargée, elle remplace la version de faible résolution sur la page Web. Vous pouvez créer votre propre image source de faible résolution ou GoLive peut la générer pour vous. Pour générer une image source de faible résolution dans GoLive : 1 Effectuez l’une des opérations suivantes : • Sélectionnez un objet dynamique Photoshop ou Illustrator dans l’éditeur de mise en page, puis cliquez sur l’onglet Avancé dans l’inspecteur d’image dynamique. • Sélectionnez une image standard (non dynamique) dans l’éditeur de mise en page, puis cliquez sur l’onglet Avancé dans l’inspecteur d’image. 2 Cochez la case Faible résolution et cliquez sur le bouton Générer ou spécifiez un fichier pour l’image souhaitée. GoLive génère une version de faible résolution de l’image sélectionnée et vous permet de placer le fichier dans votre dossier d’images. Pour définir des paramètres par défaut pour les images de faible résolution affichées lors du chargement de l’image principale : 1 Dans la boîte de dialogue des préférences générales relatives aux images, repérez la zone Stockage des images source de faible résolution. Comment utiliser l'aide | Sommaire | Index Page précédente 227 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 228 2 Effectuez l’une des opérations suivantes : • Sélectionnez l’option Même dossier que la source pour placer les images de faible résolution générées par GoLive dans le même dossier que les images source de haute résolution. • Sélectionnez l’option Dossier d’importation pour stocker temporairement les images de faible résolution avant de les placer dans le dossier du site. 3 Cochez la case Création automatique par défaut pour que GoLive génère automatiquement une copie de faible résolution de chaque image importée et qu’il l’ajoute à la page. Pour éviter tout problème dans les navigateurs Web, assurez-vous que toutes vos images sont dotées de l’extension adéquate pour le type de fichier (par exemple, .GIF, .JPG, .JPEG ou .PNG). Simulation de la configuration Gamma de Windows sous Mac OS Les images visualisées sous Windows paraissent plus sombres que sous Mac OS, en raison d’une différence de la configuration Gamma. Pour simuler la configuration Windows sous Mac OS : • Choisissez Tableau de bord > Adobe Gamma, puis sélectionnez Windows, par défaut dans le menu Courbe gamma. Utilisation de ColorSync avec des images JPEG (Mac OS) GoLive prend en charge la technologie de correspondance des couleurs ColorSync ™ d’Apple Computer. ColorSync harmonise les espaces colorimétriques des images JPEG et des moniteurs d’ordinateur, garantissant ainsi la restitution des couleurs sur différents périphériques de sortie. ColorSync permet d’afficher les images JPEG en utilisant des profils couleur ICC qui sont soit intégrés à l’image, soit inclus comme fichiers autonomes. Pour choisir des options ColorSync : 1 Pour les images, effectuez l’une des opérations suivantes : • Pour définir les options pour une seule image JPEG, sélectionnez-la dans la fenêtre du document. Dans l’inspecteur d’image, cliquez sur l’onglet Liens. • Pour définir des options pour toutes les images JPEG du document actif, cliquez sur l’icône de page , dans le coin supérieur gauche de la fenêtre du document. Dans l’inspecteur de page, cliquez sur l’onglet ColorSync. 2 Pour les profils, effectuez l’une des opérations suivantes dans l’inspecteur d’image ou de page : • Cliquez sur Par défaut afin d’utiliser un profil RVB standard inclus dans GoLive pour l’image active. • Cliquez sur Profil et spécifiez un fichier pour le profil voulu. Remarque : les références à des profils couleur externes ne sont pas vérifiées par l’analyseur syntaxique des liens intégré dans GoLive. Après avoir téléchargé votre site sur Comment utiliser l'aide | Sommaire | Index Page précédente 228 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 229 le serveur FTP de votre fournisseur d’accès Internet, vérifiez si le profil couleur ICC autonome a été inclus dans le téléchargement. • Cliquez sur Aucun afin de désactiver la prise en charge ColorSync pour une image sélectionnée. La zone de texte Incorporé affiche le nom du profil couleur incorporé dans l’image JPEG sélectionnée. La fonction d’incorporation de profils couleur dans les images JPEG est prise en charge par les versions les plus récentes des applications courantes de numérisation d’images, telles qu’Adobe Photoshop. Remarque : A l’heure actuelle, les profils couleur incorporés dans les images JPEG sont pris en charge uniquement par les versions 4.01 et ultérieures de Microsoft Internet Explorer. Pour définir les préférences ColorSync : 1 Choisissez Edition > Préférences. 2 Cliquez sur l’icône de ColorSync dans le panneau gauche de la boîte de dialogue Préférences. 3 Effectuez une sélection parmi les options suivantes : • L’option Afficher les images à l’aide de ColorSync permet d’activer la prise en charge de ColorSync dans GoLive. • L’option Utiliser le profil RVB par défaut en l’absence d’une configuration spécifique permet d’utiliser un profil couleur par défaut intégré lorsque ColorSync est activé mais qu’aucun profil n’est spécifié pour l’image. 4 Cliquez sur OK. Ajout de fichiers multimédias à une page Web GoLive prend en charge plusieurs modules externes permettant aux navigateurs de lire des fichiers multimédias sur le Web et de placer des éléments audio et vidéo sur une page Web. Vous pouvez insérer tout élément multimédia pris en charge par Netscape Navigator ou Internet Explorer, y compris les modules externes QuickTime, Real, SVG et SWF. Vous pouvez afficher un aperçu des fichiers multimédias pris en charge dans GoLive. GoLive contient une icône Module externe que vous pouvez configurer, ainsi que des modules externes prédéfinis SWF, QuickTime, Real et SVG. Si vous utilisez l’icône Module externe, vous associez le type de fichier au module externe afin de définir le type de fichier que chaque module externe doit ouvrir. Pour que tous les modules externes soient disponibles dans GoLive, vous devez d’abord faire glisser ces derniers dans le sous-dossier Modules situé dans le même dossier que l’application GoLive. Pour plus de détails sur l’association de types de fichiers aux modules externes du sous-dossier Modules, voir « Configuration des préférences de module externe », page 235. Important : Avant de télécharger des séquences QuickTime, vous devez les rendre autonomes, c’est-à-dire les convertir à un format séquentiel compatible avec le Web. Pour plus de détails sur la création de séquences QuickTime, voir « Présentation des outils et du flux de production QuickTime », page 469. Comment utiliser l'aide | Sommaire | Index Page précédente 229 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 230 Pour ajouter un fichier multimédia : 1 Effectuez l’une des opérations suivantes : • Faites glisser l’icône Module externe ou l’une des icônes de modules externes prédéfinis (SWF, QuickTime, Real ou SVG) du panneau Standard de la palette Objets jusqu’à la fenêtre du document, ou bien cliquez deux fois sur l’icône dans la palette Objets. 2 Dans le panneau Standard de l’inspecteur de module externe, spécifiez un fichier pour votre module externe. Configuration des modules externes Les modules externes (Module externe, SWF, QuickTime, Real ou SVG) sont tous configurés à l’aide de l’inspecteur de module externe. Les options disponibles dans les panneaux Standard, Avancé et Attributs sont similaires pour l’ensemble des modules externes. Toutefois, l’intitulé du dernier panneau et les options qu’il contient diffèrent en fonction du type MIME associé au module externe (QuickTime, Spécial, etc.). Pour les modules externes prédéfinis, vous n’avez généralement pas besoin de modifier les paramètres par défaut de l’inspecteur. Pour l’icône Module externe, vous devez définir l’ensemble des attributs dans l’inspecteur. Pour ce faire, il est nécessaire de déterminer les attributs qui doivent être associés aux divers modules externes pour leur permettre de fonctionner correctement avec différents navigateurs. Le panneau Attributs de l’inspecteur de module externe permet d’ajouter, de modifier et de supprimer manuellement des attributs. Vous pouvez utiliser ce panneau en combinaison avec l’icône Module externe pour modifier les attributs des extensions multimédias que GoLive ne prend pas en charge directement. Important : Bien qu’Adobe ait testé tous les modules externes de fabricants tiers et les extensions multimédias disponibles à l’heure actuelle, il est impossible de garantir, implicitement ou explicitement, que les modules externes fonctionnent correctement une fois insérés dans des pages Web. Veuillez noter que les modules externes caractérisés par un code rudimentaire risquent de bloquer votre système et d’endommager vos fichiers. Pour configurer le panneau Standard pou un module externe : 1 Pour l’icône Module externe, cochez la case MIME, puis choisissez le type MIME désiré dans le menu contextuel. Pour les modules externes SWF, QuickTime, Real et SVG, l’option et le type MIME sont automatiquement sélectionnés. Remarque : Vous n’avez généralement pas besoin de modifier les paramètres prédéfinis pour les modules externes SWF, QuickTime, Real et SVG. 2 En fonction du type MIME et de la balise HTML sélectionnés, l’option Classe est désactivée, activée ou prédéfinie. • Pour l’icône Module externe, la balise <embed> est la valeur par défaut de l’option HTML. Si vous choisissez la balise <object> ou <embed & object> pour l’option HTML, cochez la case Classe et spécifiez l’ID de classe du module externe requis ou de la commande W3CObject, ou sélectionnez l’ID de classe dans le menu contextuel. • Pour le module externe SWF, la balise <embed & object> est la valeur par défaut de l’option HTML et l’option Classe est la valeur prédéfinie dans le menu contextuel Classe. Comment utiliser l'aide | Sommaire | Index Page précédente 230 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 231 • Pour le module externe QuickTime, la balise <embed & object> est la valeur par défaut de l’option HTML et l’option Classe est la valeur prédéfinie dans le menu contextuel Classe. • Pour le module externe Real, la balise <embed> est la valeur par défaut de l’option HTML et l’option Classe est désactivée. • Pour le module externe SVG, la balise <embed> est la valeur par défaut de l’option HTML et l’option Classe est désactivée. 3 Saisissez une valeur dans la zone de texte Largeur pour la largeur de l’élément multimédia (en pixels ou en pourcentage). 4 Saisissez une valeur dans la zone de texte Hauteur pour la hauteur de l’élément multimédia (en pixels ou en pourcentage). 5 Sélectionnez l’une des options suivantes dans le menu contextuel Alignement : • L’option Par défaut permet de placer l’icône en fonction des préférences du navigateur. Si le navigateur ne spécifie aucune préférence d’alignement, l’élément multimédia est aligné à gauche. (La plupart des navigateurs ne spécifient aucune préférence d’alignement.) • L’option Gauche permet de placer l’icône dans le coin supérieur gauche. • L’option Milieu permet de placer l’icône au centre. • L’option Droite permet de placer l’icône dans le coin supérieur droit. 6 Dans le menu contextuel HTML, sélectionnez le script utilisé par les navigateurs pour détecter le module externe requis et assurer que le contenu est lu correctement dans différents navigateurs. Par exemple, pour lire le contenu d’un fichier Macromedia ® Flash™, un navigateur requiert le contrôle ActiveX® Macromedia® Flash™ ou le module externe Macromedia® Flash™. Le contrôle ActiveX est utilisé par Internet Explorer et America Online ® sous Windows 95 ou Windows NT®. Le module externe SWF est utilisé par d’autres navigateurs prenant en charge Macromedia® Flash™ et par Internet Explorer et America Online sous Windows 3.1 ou Mac OS. La balise <object> appelle le contrôle ActiveX ; la balise <embed> appelle le module externe SWF. Choisissez la balise <Object> & <Embed> dans le menu contextuel pour pouvoir utiliser le contrôle ActiveX et le module externe SWF. Pour configurer le panneau Avancé pour un module externe : 1 Cliquez sur l’onglet Avancé dans l’inspecteur. 2 Saisissez un nom unique pour l’élément multimédia dans la zone de texte Nom. 3 Cochez la case Page et spécifiez un fichier de destination pour le lien vers les instructions d’installation du module externe. Pour les modules externes SWF et QuickTime, une destination de lien est affichée par défaut. 4 Cochez la case Code pour les modules externes Real et SVG, puis spécifiez un fichier de destination pour le lien vers la base du code. La base de code Macromedia ® Flash™ , par exemple, spécifie l’emplacement du contrôle ActiveX Macromedia ® Flash™ que le navigateur peut télécharger si le contrôle n’est pas installé. La base de code est fournie par défaut lorsque vous utilisez le module externe prédéfini SWF ou QuickTime. 5 Dans le menu contextuel Palette, choisissez une option indiquant si le module externe s’affiche dans la palette Premier plan ou Arrière-plan. Sélectionnez l’option Par défaut pour placer la palette à l’arrière-plan. Comment utiliser l'aide | Sommaire | Index Page précédente 231 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 232 6 Saisissez une valeur dans la zone de texte Esp. horiz. pour définir l’espace horizontal entre l’élément multimédia et le texte autour (jusqu’aux marges gauche et droite). Saisissez une valeur dans la zone de texte Esp. vert. pour définir l’espace vertical entre l’élément multimédia et le texte autour (jusqu’aux marges supérieure et inférieure). 7 Cochez la case Masquer pour masquer le module externe de la page. Cette opération s’avère utile lorsque vous souhaitez lire un fichier audio au moment où la page est téléchargée, sans afficher les options de lecture du fichier sur cette page. Pour configurer le panneau Attributs pour un module externe : 1 Dans le panneau Attributs de l’inspecteur de module externe, cliquez sur Créer pour créer un nouvel attribut. Dans la zone de texte gauche située sous la zone de liste, saisissez le nom de l’attribut. Ce dernier s’affiche dans la colonne Attribut de la zone de liste. 2 Dans la zone de texte droite, saisissez une valeur d’attribut. Cette dernière s’affiche dans la colonne Valeur de la zone de liste. 3 Pour supprimer un attribut, sélectionnez-le dans la zone de liste et cliquez sur Supprimer . Options du module externe SWF Le panneau SWF contient les options suivantes : Lecture automatique Cochez cette case pour lire la séquence Macromedia® Flash™ dès que la page est chargée. Boucle Cochez cette case pour lire la séquence en boucle. Qualité Choisissez un paramètre de qualité d’affichage ou de vitesse de lecture dans ce menu contextuel. • L’option Par défaut permet d’utiliser les paramètres du lecteur. • L’option Haute rés. permet de rendre la qualité d’affichage prioritaire sur la vitesse de lecture. • L’option Haute rés. automatique permet de rendre la qualité d’affichage prioritaire et d’améliorer la vitesse de lecture lorsque le nombre d’images par seconde devient inférieur à celui spécifié. • L’option Faible rés. automatique permet de rendre la vitesse de lecture prioritaire et d’améliorer la qualité d’affichage, à condition que le système d’exploitation puisse traiter l’opération. • L’option Faible rés. permet de rendre la vitesse de lecture prioritaire sur la qualité d’affichage. Variable Dans le menu Variable, choisissez un paramètre indiquant la manière dont la séquence doit être placée dans la fenêtre du navigateur, lorsque les valeurs des paramètres Largeur et Hauteur du panneau Standard diffèrent de celles de la séquence. • L’option Par défaut permet de rendre la totalité de la séquence visible dans la zone spécifiée tout en conservant ses proportions d’origine. Aucune distorsion ne se produit. Des bords transparents ou de la couleur du cache risquent d’apparaître des deux côtés de la séquence. Comment utiliser l'aide | Sommaire | Index Page précédente 232 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 233 • L’option Aucun bord permet de définir la séquence de telle sorte qu’elle remplisse la zone spécifiée tout en conservant ses proportions d’origine. Certaines parties de la séquence risquent d’être écrêtées. Aucune distorsion ne se produit. • L’option Ajuster aux dimensions permet d’afficher la totalité de la séquence dans la zone spécifiée. Les proportions d’origine ne sont pas conservées. Une distorsion risque de se produire. Options du module externe QuickTime Le panneau QuickTime contient les options suivantes : Pour configurer le panneau QuickTime pour un module externe : Afficher les commandes Cochez cette case pour afficher les options de lecture. Fond Cochez cette case et spécifiez une couleur de fond en la faisant glisser de la palette de couleurs vers la case échantillon de l’inspecteur de module externe. Cache Cochez cette case pour activer la mise en cache de la séquence via le navigateur pendant la lecture. Volume Saisissez une valeur dans cette zone de texte pour définir le volume du son. La valeur doit être un entier compris entre 0 (muet) et 100 (volume maximum). Lecture automatique Cochez cette case pour lire la séquence automatiquement lorsque la page est ouverte. Boucle Cochez cette case pour lire la séquence en boucle. Palindrome Cochez cette case pour lire la séquence en boucle du début à la fin et inversement. Lire chaque image Cochez cette case pour lire toutes les images de la séquence, même si cela doit entraîner un ralentissement de la lecture. Cet attribut est utile pour la lecture d’animations simples. (Sa sélection entraîne la désactivation de toutes les pistes audio de la séquence.) Lien Cochez cette case pour définir un lien vers une autre page ou séquence qui est ouverte lorsque l’utilisateur clique sur la séquence active. Cible Si vous avez coché la case Lien et que vous laissez le champ Cible vide, le nouveau fichier sera ouvert au même emplacement que la séquence active. Utilisez ce champ pour spécifier le nom du cadre (_self, _top, _parent, _blank ou un nom explicite) qui doit être la cible du lien spécifié par l’attribut Lien. Lancer la séquence Cliquez sur ce bouton pour prévisualiser la séquence dans le programme de visualisation de séquences QuickTime. Options du module externe Real Le module externe Real vous permet d’ajouter des éléments audio et vidéo Real à votre page Web. Le panneau Real contient les options suivantes : Démarrage automatique Cochez cette case pour lire l’élément audio ou vidéo dès que le programme de visualisation ouvre la page. Aucun libellé Cochez cette case pour masquer les informations, telles que le titre, l’auteur et les droits d’auteur du clip multimédia. Comment utiliser l'aide | Sommaire | Index Page précédente 233 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 234 Commandes Choisissez les commandes à fournir avec le clip multimédia dans ce menu contextuel. Remarque : Vous devez disposer d’une icône Real pour chaque commande. Par exemple, si vous souhaitez fournir les boutons Lecture et Pause avec le clip multimédia, vous devez ajouter une icône Real et lui assigner la commande Bouton Lecture du menu contextuel Commandes, puis créer une deuxième icône et lui attribuer la commande Bouton Pause du même menu contextuel. Pour plus de détails sur la création d’éléments Real pour votre site Web, consultez le Guide de l’utilisateur d’Adobe GoLive SMIL fournit au format PDF sur le CD-Rom de l’application GoLive. • Fenêtre de l’image pour afficher un menu contextuel permettant à l’internaute de gérer la lecture dans la zone de lecture à l’aide de commandes telles que Lecture et Arrêt. Ce menu contextuel propose un ensemble de commandes pour que l’internaute gère la lecture directement dans la zone de lecture. (La commande Fenêtre de l’image est disponible uni-quement pour les éléments vidéo et les animations.) • Panneau de configuration (ou Par défaut) pour afficher le panneau de configuration par défaut de RealPlayer, contenant les boutons de lecture, de pause, d’arrêt, de recul rapide et d’avance rapide, les curseurs de position et de volume, ainsi qu’un bouton de veille apparaissant lorsque le haut-parleur est sélectionné. • Bouton Lecture/Pause pour afficher un bouton de lecture/pause. • Bouton Lecture pour afficher un bouton de lecture. • Commande Veille pour afficher un bouton de veille. • Commande Volume et veille pour afficher un bouton de veille et un curseur de volume. • Curseur de position pour afficher un curseur de position du clip. • Information sur le clip pour afficher un champ d’informations relatives au clip Real. • Commande Logo de Real pour afficher le logo Real. • Informations et volume pour afficher les informations de présentation, un curseur de volume et un bouton de veille. • Panneau des informations pour afficher le panneau d’informations de présentation. • Barre d’état pour afficher des messages d’information, la LED de surcharge du réseau, ainsi que le champ de position indiquant la durée parcourue et la durée totale du clip. • Champ d’état pour afficher la zone de message de la barre d’état. S’il n’y a pas de champ ni de barre d’état incorporé(e), les messages d’erreur s’affichent dans la barre d’état du navigateur. • Champ de position pour afficher la durée parcourue et la durée totale du clip. Console Choisissez une option dans ce menu contextuel pour regrouper les diverses commandes. Par exemple, si vous disposez de différentes commandes, telles qu’un bouton de lecture, un bouton d’avance rapide et un curseur de volume, dans des cellules de tableau HTML dispersées sur la page, vous avez la possibilité de lier ces commandes entre elles en leur attribuant le même nom de console. Vous assignez un nom d’utilisateur dans la zone de texte Console ou choisissez un nom prédéfini dans le menu contextuel Console. • Par défaut pour n’attribuer aucun nom de console. Comment utiliser l'aide | Sommaire | Index Page précédente 234 Aide d'Adobe GoLive Ajout d’images et de fichiers multimédias Comment utiliser l'aide | Sommaire | Index Page précédente 235 • _master pour lier la commande à toutes les autres commandes ou à tous les autres groupes de commandes. • _unique pour éviter la liaison de la commande à une autre commande. Les commandes pour lesquelles l’attribut Console n’est pas défini sont regroupées. Options du module externe SVG Le panneau SVG contient l’option suivante : Utiliser SVG compressé Cochez cette case pour lier indirectement le module externe au fichier compressé SVGZ via le fichier non compressé SVG. Configuration des préférences de module externe La boîte de dialogue Préférences permet d’assigner des types de fichiers multimédias aux modules externes actuellement installés dans le sous-dossier Modules du dossier GoLive. GoLive peut ainsi lire des fichiers multimédias à l’aide des ressources appropriées. Pour assigner un nouveau type de fichier multimédia à un module externe : 1 Choisissez Edition > Préférences. 2 Cliquez sur l’icône Modules externes. 3 Cliquez sur Nouvel élément . 4 Saisissez un type de fichier multimédia (type) et un type MIME correct (sous-type) dans la zone de texte Type MIME. Le type MIME (Multipurpose Internet Mail Extension) constitue un identifiant de type de fichier attribué aux fichiers envoyés par Internet. 5 Lorsqu’il possède le module externe approprié, GoLive reconnaît le type MIME et lui assigne automatiquement le module externe et l’extension de fichier correspondants. Si GoLive ne dispose pas du module externe approprié et que le type MIME n’est pas identifié, vous devez saisir l’extension du fichier. GoLive vous permet d’incorporer un fichier multimédia pour lequel il n’a pas de module externe correspondant, mais vous ne pouvez pas le lire dans la fenêtre du document. Configuration d’applets Java GoLive permet d’insérer des applets Java dans une grille de mise en page ou dans le flux de code HTML, de sorte que vous pouvez animer votre page ou lui ajouter d’autres fonctions avancées. Sous Mac OS, vous avez la possibilité de lire des applets Java en modes Mise en page et Aperçu de GoLive ; vous n’avez pas besoin de lancer un navigateur pour les prévisualiser. Sous Windows, vous ne pouvez lire les applets Java qu’en mode Aperçu. Pour configurer un applet Java : 1 Faites glisser l’icône Applet Java du panneau Standard de la palette Objets jusqu’à l’éditeur de mise en page, ou cliquez deux fois sur cette icône dans la palette Objets. 2 Dans le panneau Standard de l’inspecteur d’applet Java, spécifiez un fichier applet de destination pour le lien. Comment utiliser l'aide | Sommaire | Index Page précédente 235 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 236 Le nom du fichier .class (c’est-à-dire le fichier contenant le code de l’applet) apparaît dans la zone de texte Code. Le nom de l’applet s’affiche à l’intérieur de l’icône dans la fenêtre du document. Remarque : Certains programmes de création d’applets Java n’ajoutent pas correctement l’extension .class à l’attribut CODE. Les applets concernés fonctionnent dans le navigateur, mais ne s’affichent pas dans GoLive. 3 Saisissez un nom unique pour l’applet dans la zone de texte Nom. Ce nom ne doit pas être utilisé par un autre objet de votre page. 4 Redimensionnez l’applet en faisant glisser les poignées de redimensionnement ou saisissez des valeurs de largeur et de hauteur dans l’inspecteur d’applet Java. (Ces valeurs peuvent être en pixels ou en pourcentage.) 5 Pour aligner un applet avec le texte autour sans utiliser de grille de mise en page, saisissez des valeurs dans les zones de texte Esp. horiz. et Esp. vert. et servez-vous du menu contextuel Alignement. Utilisation d’applets Java comme conteneurs HTML GoLive permet de saisir du texte de remplacement ou des objets HTML dans l’icône Applet Java. Le navigateur affiche le texte de remplacement lorsque l’élément d’applet est reconnu, mais que son chargement est désactivé ; l’objet HTML est utilisé lorsque le code Java n’est pas pris en charge. En ajoutant des images ou d’autres objets HTML, vous pouvez modifier ou enrichir le texte ou le contenu HTML de l’applet Java. Pour afficher un texte de remplacement ou un objet HTML dans l’icône Applet Java : 1 Sélectionnez l’icône Applet Java, puis cliquez sur l’onglet Alternatif de l’inspecteur d’applet Java. 2 Effectuez l’une des opérations suivantes : • Dans la zone de texte Texte de remplacement, saisissez le texte à afficher à la place de l’applet Java. • Cochez la case Afficher HTML alternatif. Dans la fenêtre du document, saisissez directement le code HTML dans l’icône d’applet ou faites glisser une icône du panneau Standard ou Formulaire de la palette Objets sur l’icône d’applet. A B Icônes disponibles dans la palette Objets A. Applet Java B. Objet Utilisation des commandes W3CObject GoLive permet d’insérer et de configurer des commandes W3Cobject qui peuvent être téléchargées et exécutées dans un navigateur Web. Sous Windows, les commandes W3CObject prennent en charge les contrôles ActiveX. Sous Mac OS, vous pouvez uniquement modifier les propriétés de base d’un contrôle ActiveX. Comment utiliser l'aide | Sommaire | Index Page précédente 236 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Ajout d’images et de fichiers multimédias Page précédente 237 Pour configurer une commande W3Cobject : 1 Faites glisser l’icône Objet du panneau Standard de la palette Objets jusqu’à l’éditeur de mise en page, ou cliquez deux fois sur cette icône dans la palette Objets. 2 Sous Windows, cliquez sur le bouton Sélectionner pour ouvrir la liste des objets ActiveX installés. Sélectionnez l’objet à installer et cliquez sur OK. L’objet s’affiche dans le rectangle W3CObject. Pour visualiser le composant W3CObject durant le redimensionnement, maintenez la touche Ctrl enfoncée et faites glisser une poignée de coin. Modification des attributs de commande W3CObject Le panneau Propriétés de l’inspecteur d’objet vous permet de saisir et de modifier les propriétés de la commande W3CObject. Si vous avez sélectionné un contrôle ActiveX Windows, les propriétés de ce dernier sont affichées et peuvent être modifiées, mais non supprimées. Pour ajouter une propriété, cliquez sur le bouton Nouvel élément et saisissez son nom et sa valeur. Pour supprimer une propriété, sélectionnez-la et cliquez sur le bouton de suppression. De nombreux contrôles ActiveX Windows disposent de boîtes de dialogue qui vous permettent de modifier les propriétés. Cliquez sur le bouton Propriétés de l’inspecteur ou cliquez deux fois sur le contrôle ActiveX Windows pour ouvrir la boîte de dialogue correspondante. Comment utiliser l'aide | Sommaire | Index Page précédente 237 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Création de formulaires Page précédente 238 Création de formulaires A propos des formulaires Un formulaire permet aux internautes de vous transmettre des informations. Vous pouvez concevoir des formulaires afin que les internautes puissent s’abonner à un bulletin, faire des achats et remplir un questionnaire. Le formulaire peut contenir des champs de texte, des boutons, des listes et des images. Vous créez le formulaire dans GoLive, mais le serveur Web traite en réalité les informations à l’aide d’un script CGI. L’ensemble des éléments de formulaire GoLive prennent totalement en charge les normes HTML 4.0, y compris les libellés, l’ordre de tabulation et les codes d’accès, et sont compatibles de manière rétroactive avec les spécifications du format HTML 3.2. Vous pouvez également ajouter des actions et des événements à un formulaire. L’apparence du formulaire peut varier d’une plate-forme et d’un navigateur Web à l’autre. GoLive permet d’anticiper les résultats en plaçant les éléments de formulaire dans des tableaux HTML plutôt que sur des grilles de mise en page ou directement sur une page. A propos de la conception de formulaires Vous concevez un formulaire sur une page HTML en faisant glisser des éléments de formulaire à partir de la palette Objets sur la page, puis en définissant les options des éléments dans l’inspecteur du formulaire. Pour concevoir un formulaire, procédez comme suit : • Planifiez votre formulaire sur papier. Il est essentiel de définir l’objectif, le type d’informations que vous devez recevoir des internautes, ainsi que l’apparence du formulaire. Faites plusieurs brouillons de mise en page, testez la logique du flux et la facilité d’utilisation. • Faites glisser l’icône Formulaire vers une page GoLive. L’élément de formulaire indique au navigateur que la page est un formulaire et précise l’emplacement du script traitant les données de l’internaute. Il contient l’ensemble des éléments de votre conception. • Ajoutez un tableau à la page pour définir la structure du formulaire. Les tableaux permettent d’organiser les champs de formulaire et donnent des résultats plus prévisibles d’un navigateur et d’un système d’exploitation à l’autre. Vous pouvez les définir à l’aide de l’inspecteur du tableau. • Ajoutez des éléments de formulaire en les faisant glisser vers des cellules de tableau. Ils correspondent aux champs utilisés par les internautes pour saisir et envoyer des informations. L’inspecteur permet de personnaliser les champs et de gérer les données recueillies. • Ajoutez un bouton d’envoi afin que les internautes puissent envoyer leurs données au serveur. Comment utiliser l'aide | Sommaire | Index Page précédente 238 Aide d'Adobe GoLive Création de formulaires Comment utiliser l'aide | Sommaire | Index Page précédente 239 • Créez une chaîne de tabulation pour que les internautes puissent parcourir le formulaire à l’aide de la touche de tabulation. Vous pouvez définir l’ordre de sélection des champs. • Affichez un aperçu du formulaire dans un navigateur et testez sa fonctionnalité. A B C Configuration d’un formulaire A. L’icône Formulaire contient l’ensemble des éléments d’un formulaire à remplir B. Icône Formulaire C. Eléments de formulaire individuels placés dans des cellules de tableau Configuration de l’élément de formulaire L’icône Formulaire représente tout ou partie de la page Web active sous la forme d’un formulaire et indique au navigateur l’emplacement et le mode de retour des données du formulaire en vue de leur traitement. Le contenu du formulaire doit figurer dans la zone entourant l’icône Formulaire dans la fenêtre du document. Si vous utilisez un tableau HTML pour la conception du formulaire, veillez à placer l’icône Tableau à l’intérieur de cette zone dans la fenêtre du document. L’icône Formulaire doit précéder tout autre élément de formulaire. Pour configurer un élément de formulaire : 1 Faites glisser l’icône Formulaire du panneau Formulaire de la palette Objets ou cliquez deux fois sur cette icône. 2 Dans l’inspecteur du formulaire, saisissez un nom de formulaire unique dans la zone de texte Nom. Cela est tout particulièrement important si la page contient plusieurs formulaires ou si vous utilisez un script CGI. 3 Dans la zone de texte Action, sélectionnez ou saisissez les répertoire et fichier de script CGI destinés à recevoir les données transmises lorsqu’un internaute clique sur le bouton Envoyer. Remarque : Contactez votre fournisseur de services Internet afin d’obtenir des informations relatives aux scripts CGI disponibles ainsi que leur emplacement sur le serveur. Evitez d’inclure un lien « mailto » dans l’action de formulaire, car il est possible que le navigateur des internautes ne soit pas correctement configuré pour l’envoi des données vers le serveur. 4 Si vous utilisez des cadres, dans le menu contextuel Cible, sélectionnez un emplacement cible dans l’URL de destination. La page du jeu de cadres doit être ouverte pour que le menu Cible soit actif. Comment utiliser l'aide | Sommaire | Index Page précédente 239 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Création de formulaires Page précédente 240 Lorsque le formulaire est incorporé à un jeu de cadres et que vous souhaitez indiquer l’emplacement de stockage de la page HTML renvoyée par le serveur Web, sélectionnez un emplacement cible dans le menu contextuel Cible. Outre le nom attribué à chacun des cadres d’un jeu, vous pouvez définir les options suivantes : • _top permet de charger la page dans l’intégralité de la fenêtre du navigateur, en remplaçant tous les jeux de cadres actifs. • _parent permet de charger la page dans le jeu de cadres parent du formulaire. • _self permet de charger la page dans la fenêtre ou dans le cadre qui contenait auparavant le formulaire. • _blank permet de charger la page dans une nouvelle fenêtre de navigateur sans nom. 5 Sélectionnez une méthode d’encodage dans le menu contextuel Encoder. • Les méthodes Par défaut et application/x-www-form-url-encoded sont identiques. Elles utilisent le jeu de caractères ASCII. • La méthode multipart/form-data indique au serveur le début et la fin des fichiers. 6 Dans le menu contextuel Méthode, choisissez le mode de transmission des données relatives au formulaire : • Post permet de renvoyer les données saisies par un internaute dans une page distincte de la page Web. • Get envoie les informations saisies par l’internaute ajoutées à l’URL dans la zone de texte Action. • Par défaut permet d’ignorer l’attribut Méthode. Remarque : Il est recommandé d’utiliser l’option Post. La longueur maximale d’un URL risque en effet d’être dépassée lors de l’utilisation de l’option Get pour ajouter des données à un fichier cible et d’entraîner d’éventuelles pertes de données. Ajout d’éléments de formulaire Le panneau Formulaire de la palette Objets comporte une gamme complète d’éléments de formulaire, tels que boutons, cases à cocher, zones de texte, zones de liste, menus contextuels, éléments spéciaux et éléments conformes à la norme HTML 4.0. Remarque : Les icônes du panneau Formulaire de la palette Objets doivent être ajoutées à l’intérieur de la zone de formulaire dans la fenêtre du document, sinon elles seront exclues du formulaire. Création de boutons et de cases à cocher Vous pouvez configurer plusieurs types de boutons et de cases à cocher dans le formulaire d’une page Web. • Le bouton Envoyer permet de transmettre les données saisies dans le formulaire au script CGI en vue de leur traitement. • Le bouton Réinitialiser permet d’effacer les données actives et de restaurer les valeurs par défaut du formulaire. Comment utiliser l'aide | Sommaire | Index Page précédente 240 Aide d'Adobe GoLive Création de formulaires Comment utiliser l'aide | Sommaire | Index Page précédente 241 • Les boutons radio permettent aux internautes de sélectionner un élément dans une liste. Pour vérifier le bon fonctionnement du système de sélection, créez des groupes logiques de boutons radio complémentaires dans l’inspecteur du bouton radio de formulaire. • Un bouton radio se comporte tel un bouton Réinitialiser, Envoyer ou normal standard, à la différence près que vous pouvez personnaliser son apparence. Vous pouvez y insérer du texte formaté ou non, une image ou tout autre élément permettant de rendre l’interface utilisateur du formulaire plus intuitive. • La case à cocher permet aux internautes de sélectionner plusieurs éléments dans une liste d’options. A B C D E Icônes des boutons de formulaire et des cases à cocher A. Icône Bouton Envoyer B. Icône Bouton Réinitialiser C. Icône du bouton personnalisé D. Icône Bouton radio E. Icône Case à cocher Pour créer un bouton Envoyer, Réinitialiser ou personnalisé : 1 Faites glisser l’icône de bouton appropriée du panneau Formulaire de la palette Objets vers le formulaire. Vous pouvez modifier ce bouton dans l’inspecteur du bouton de formulaire. 2 Pour personnaliser un bouton, définissez l’option Bouton sur Normal dans l’inspecteur du bouton de formulaire. Ne sélectionnez pas Envoyer ni Réinitialiser, car ces noms sont réservés. 3 Dans la zone de texte Nom de l’inspecteur, saisissez une description (Poster, par exemple) ou insérez une balise d’emplacement d’image de formulaire et liez-la à un graphique. 4 Dans la zone de texte Valeur, indiquez une action ou une valeur à transmettre au script CGI, le cas échéant. 5 Dans la zone de texte située sur la face du bouton, saisissez le libellé de votre choix. Utilisez les commandes de menu Texte ou Style pour mettre en forme ce libellé. Pour créer un bouton radio : 1 Faites glisser l’icône Bouton radio vers le formulaire et définissez les options dans l’inspecteur du bouton radio de formulaire : • Dans la zone de texte Groupe, saisissez un nom de groupe ou sélectionnez un nom de groupe existant dans le menu contextuel. • Dans la zone Valeur, saisissez une valeur ou un nom descriptif qualifiant le bouton radio et permettant de l’identifier dans le groupe. Lorsqu’un internaute clique sur le bouton Envoyer d’un formulaire, cette valeur est transmise au script CGI si l’internaute sélectionne le bouton radio. • Sous Configuration, cochez la case Sélectionné pour que le bouton radio soit sélectionné par défaut. Comment utiliser l'aide | Sommaire | Index Page précédente 241 Aide d'Adobe GoLive Création de formulaires Comment utiliser l'aide | Sommaire | Index Page précédente 242 2 Si nécessaire, faites glisser une icône Libellé du panneau Formulaire de la palette Objets à côté de chaque bouton et saisissez votre texte. Reprenez cette procédure pour chacun des boutons du groupe. Pour créer une case à cocher : 1 Faites glisser l’icône Case à cocher vers le formulaire et définissez les options dans l’inspecteur de la case à cocher de formulaire : • Dans la zone de texte Nom, saisissez un nom unique pour cette case à cocher. • Dans la zone de texte Valeur, saisissez une valeur pour cette case à cocher. Lorsqu’un internaute clique sur le bouton Envoyer d’un formulaire, cette valeur est transmise au script CGI si l’internaute sélectionne la case à cocher. • Sous Configuration, cochez la case Sélectionné pour que la case à cocher soit sélectionnée par défaut. Création de champs de texte Vous pouvez créer des champs de texte, des champs de mot de passe et des zones de texte sur un formulaire de page Web. Les champs de texte et de mot de passe permettent aux internautes de saisir une ligne de texte unique ou un mot de passe requis. Le champ de zone de texte permet aux internautes de saisir plusieurs lignes de texte. Lorsqu’un internaute clique sur le bouton Envoyer, le formulaire transmet le texte au script CGI. Pour créer un champ de texte ou de mot de passe : 1 Faites glisser l’icône Champ de texte ou de mot de passe du panneau Formulaire de la palette Objets vers le formulaire et définissez les options dans l’inspecteur. A B C Icônes de texte A. Icône Champ de texte B. Icône Mot de passe C. Icône Zone de texte 2 Dans la zone de texte Nom, saisissez un nom unique pour ce champ de texte ou de mot de passe. 3 Dans la zone de texte Valeur ou Contenu (zone de texte de formulaire), saisissez le texte par défaut que les internautes pourront remplacer ou ne la renseignez pas. 4 Dans la zone de texte Visible, saisissez le nombre de caractères devant figurer dans la zone de texte. 5 Dans la zone de texte Maximum, saisissez le nombre maximum de caractères pouvant figurer dans la zone de texte avant troncation. Cette zone est vide par défaut. Dans ce cas, le seuil est déterminé par le navigateur Web utilisé pour visualiser le formulaire. 6 Cochez la case Afficher le mot de passe sous forme de puces lorsque la zone de texte est réservée à un mot de passe. Lorsque cette option est sélectionnée, GoLive remplace le texte par des puces lors de la saisie d’un mot de passe par un internaute. Comment utiliser l'aide | Sommaire | Index Page précédente 242 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Création de formulaires Page précédente 243 Remarque : La protection par mot de passe des pages Web constitue une fonction interactive nécessitant le traitement des saisies des internautes via un script CGI sur le serveur Web. Les éléments que vous insérez dans GoLive représentent visuellement le dispositif de protection par mot de passe. Pour créer une zone de texte : 1 Faites glisser l’icône Zone de texte du panneau Formulaire de la palette Objets vers le formulaire et définissez les options dans l’inspecteur de la zone de texte de formulaire. • Dans la zone de texte Nom, saisissez un nom unique pour cette zone de texte. • Dans la zone de texte Lignes, saisissez le nombre maximum de lignes pouvant figurer dans la zone de texte. • Dans la zone de texte Colonnes, saisissez le nombre de caractères devant figurer en largeur dans la zone de texte. 2 Pour contrôler les sauts de ligne, sélectionnez l’option appropriée dans le menu contextuel Retour à la ligne : • Standard utilise les paramètres par défaut du navigateur. • Désactivé indique au navigateur d’ignorer le seuil défini sous Colonnes et empêche tout retour à la ligne dans le texte saisi. • Logique insère des retours à ligne dans le texte affiché, mais pas lorsque les données sont en cours de traitement. • Physique insère des retours à ligne dans le texte affiché et lorsque les données sont en cours de traitement. 3 Vous pouvez, si nécessaire, saisir dans la zone de texte Contenu un texte par défaut pouvant être remplacé par l’internaute. Configuration de zones de liste et de menus contextuels L’icône Zone de liste permet d’insérer une zone de liste proposant plusieurs options. L’icône Menu déroulant permet d’insérer un menu contextuel contenant plusieurs options. A B Icônes de liste A. Icône Zone de liste B. Icône Menu déroulant Pour configurer une zone de liste ou un menu contextuel : 1 Faites glisser l’icône Zone de liste ou Menu déroulant du panneau Formulaire de la palette Objets vers le tableau et définissez les options dans l’inspecteur. • Dans la zone de texte Nom, saisissez un nom unique pour cette zone de liste ou pour ce menu contextuel. • Dans la zone de texte Lignes, saisissez le nombre de lignes pouvant y figurer. Dans le cas d’un menu contextuel, il s’agit du nombre de lignes qui s’affichent lorsqu’un internaute parcourt le menu. Comment utiliser l'aide | Sommaire | Index Page précédente 243 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Création de formulaires Page précédente 244 Cochez la case Sélection multiple pour que les internautes puissent choisir une ou plusieurs options. 2 Sélectionnez une option dans la zone de liste Libellé/Valeur, puis cochez la case à gauche des zones de texte figurant au bas de l’inspecteur pour que le navigateur affiche cette option par défaut. 3 Modifiez les libellés et les valeurs : • Sélectionnez un élément, puis saisissez un nouveau libellé et une valeur appropriée. • Cliquez sur le bouton Dupliquer les éléments sélectionnés pour dupliquer et modifier l’option sélectionnée. • Cliquez sur le bouton Nouvel élément pour ajouter une nouvelle option, si nécessaire. Ajout de libellés L’icône Libellé permet d’insérer un libellé visuel permet-tant d’identifier l’objet des éléments du formulaire. Lorsque vous cliquez sur un libellé, l’objet qui lui est associé est alors activé ou désactivé (une case à cocher, par exemple). Pour insérer un libellé : 1 Faites glisser l’icône Libellé du panneau Formulaire de la palette Objets vers le formulaire, puis sélectionnez le texte situé sur la face du libellé. Saisissez le texte du libellé. 2 Vous pouvez, si vous le souhaitez, cliquer deux fois sur le nom saisi pour affecter un style au libellé (gras, par exemple). 3 Pour lier le libellé à l’élément de formulaire, sélectionnez-le et effectuez l’une des opérations suivantes : • Dans l’inspecteur du libellé de formulaire, faites glisser la souris du bouton d’affectation vers l’élément de formulaire auquel vous souhaitez affecter un libellé. • Cliquez sur le bord du libellé en maintenant la touche Alt (Windows) ou Commande (Mac OS) enfoncée et faites-le glisser vers l’élément de formulaire auquel vous souhaitez l’affecter. L’identifiant contrôlant l’association entre la case à cocher et son libellé est indiqué dans la zone de texte Référence de l’inspecteur du libellé de formulaire. Comment utiliser l'aide | Sommaire | Index Page précédente 244 Aide d'Adobe GoLive Création de formulaires Comment utiliser l'aide | Sommaire | Index Page précédente 245 Regroupement d’éléments de formulaire L’icône Zone de groupe permet d’insérer un rectangle encadrant les éléments de formulaire. Vous pouvez insérer une légende pour indiquer aux internautes l’objet des options regroupées dans une zone de groupe. A B Icônes de zone de groupe A. Marqueur Zone de groupe et Légende B. Icône Zone de groupe Remarque : Il est possible que cette opération ne donne pas les résultats escomptés dans certaines versions de navigateur. Testez le formulaire en affichant un aperçu en mode navigateur, et ce en ligne, avant de publier le formulaire. Pour insérer une zone de groupe et une légende : 1 Faites glisser l’icône Zone de groupe du panneau Formulaire de la palette Objets vers le formulaire. 2 Dans l’inspecteur de la zone de groupe de formulaire, cochez la case Utiliser une légende pour afficher une légende en bordure de la zone de groupe. 3 Sélectionnez l’option d’alignement de la légende dans le menu contextuel Alignement : • Par défaut permet de positionner la légende en fonction des préférences du navigateur. Si le navigateur ne spécifie aucune préférence d’alignement, la légende est alignée sur la gauche. • Gauche permet de positionner la légende dans le coin supérieur gauche de la zone de groupe. • Centre permet de positionner la légende dans la partie supérieure médiane de la zone de groupe. • Droite permet de positionner la légende dans le coin supérieur droit de la zone de groupe. 4 Cliquez deux fois sur la légende dans la zone de groupe, puis saisissez un nom. Navigation dans un formulaire Vous pouvez utiliser des raccourcis clavier afin de faciliter la navigation dans les formulaires. La section Configuration des divers inspecteurs permet de définir l’ordre de tabulation des champs. Chacun des éléments d’un formulaire HTML doit être sélectionné par un internaute pour être activé et remplir son rôle. Outre le fait de cliquer sur un champ spécifique, il existe deux autres manières permettant de parcourir un formulaire à l’aide du clavier : • Vous pouvez définir une chaîne de tabulation, puis saisir du texte ou appuyer sur la touche Entrée pour déclencher une action propre au formulaire. Comment utiliser l'aide | Sommaire | Index Page précédente 245 Aide d'Adobe GoLive Création de formulaires Comment utiliser l'aide | Sommaire | Index • Page précédente 246 Vous pouvez définir une combinaison de codes d’accès spécifique à une plate-forme, puis saisir du texte ou appuyer sur la touche Entrée pour déclencher une action propre au formulaire. Remarque : Toutes les versions de navigateur ne prennent pas en charge les touches de commande de navigation dans les formulaires. Configuration de chaînes de tabulation Une chaîne de tabulation permet de définir l’ordre dans lequel les éléments de formulaire sont sélectionnés lorsqu’un internaute appuie à plusieurs reprises sur la touche de tabulation. Vous pouvez affecter une valeur d’indexation par tabulation à chaque élément. La navigation s’effectue de l’élément possédant la valeur d’indexation la plus faible vers celui possédant la valeur la plus élevée. Ces valeurs ne doivent pas forcément se suivre ni commencer par une valeur spécifique. Si vous affectez à deux éléments une même valeur d’indexation, l’ordre de tabulation est déterminé par la séquence des codes HTML. Les libellés, les champs de texte, les champs de mot de passe, les zones de texte, les boutons Envoyer et Réinitialiser, les cases à cocher, les boutons radio, les menus contextuels et les zones de liste prennent en charge l’indexation par tabulation. Pour affecter ou modifier des valeurs d’indexation par tabulation : 1 Dans la vue Mise en page, choisissez Spécial > Lancer l’indexation par tabulation. Vous pouvez également sélectionner le premier élément, puis cliquer sur le bouton qui permet de lancer ou d’arrêter l’indexation par tabulation dans l’inspecteur. De petites cases jaunes s’affichent dans la partie supérieure ou à l’intérieur des éléments indexables du formulaire, et un signe dièse est affiché à côté du pointeur . 2 Cliquez successivement sur chacun des éléments dans l’ordre de tabulation choisi. Un numéro d’indexation par tabulation s’inscrit dans chacune des cases et dans la zone de texte Tabulation de l’inspecteur. 3 Une fois la chaîne de tabulation définie, choisissez Spécial > Arrêter l’indexation par tabulation ou cliquez sur le bouton qui permet de lancer ou d’arrêter l’indexation par tabulation dans l’inspecteur. 4 Procédez à des tests dans un navigateur prenant en charge la navigation par tabulation, tel que Microsoft Internet Explorer 4.0 ou une version ultérieure. Vous pouvez également sélectionner les éléments de formulaire les uns après les autres dans l’ordre de tabulation voulu, puis saisir un numéro dans la zone de texte Tabulation de l’inspecteur. Vous pouvez modifier l’ordre d’indexation par tabulation à tout moment. GoLive attribue le numéro 1 au premier élément, le numéro 2 au deuxième élément, et ainsi de suite. A B C Affectation de valeurs d’indexation par tabulation A. Zones de texte dans un formulaire B. Cases jaunes signalant les éléments indexables C. Ordre de tabulation défini en cliquant sur les éléments les uns après les autres Comment utiliser l'aide | Sommaire | Index Page précédente 246 Aide d'Adobe GoLive Création de formulaires Comment utiliser l'aide | Sommaire | Index Page précédente 247 Définition de codes d’accès Vous pouvez définir un code d’accès unique pour tout élément de formulaire d’une page. Le code d’accès permet aux internautes de sélectionner un élément en appuyant simultanément sur une touche de modification et sur une touche alphanumérique spécifique (Alt + S, par exemple, pour activer le bouton Envoyer dans un navigateur exécuté sous Microsoft Windows). Les légendes, les libellés, les champs de texte, les champs de mot de passe, les zones de texte, les boutons Envoyer, les boutons Réinitialiser, les cases à cocher et les boutons radio prennent en charge les codes d’accès. Pour définir un code d’accès : 1 Sélectionnez l’élément auquel vous souhaitez affecter une combinaison de touches. 2 Saisissez un caractère alphanumérique dans la zone de texte Touche de l’inspecteur. 3 Signalez le code d’accès en ajoutant, par exemple, un libellé ou du texte indiquant la combinaison de touches. 4 Reprenez les instructions des points 1 à 3 pour l’élément de formulaire suivant. N’affectez pas le même code d’accès à deux éléments de formulaire différents. 5 Procédez à des tests dans un navigateur prenant en charge la navigation par codes d’accès, tel que Microsoft Internet Explorer 4.0 ou une version ultérieure. Configuration d’éléments HTML spéciaux Vous pouvez, grâce aux éléments HTML spéciaux, ajouter des images aux boutons d’un formulaire, insérer des données masquées, inclure des clés cryptographiques et intégrer des sélecteurs de fichier interactifs. A B C D Icônes d’éléments HTML spéciaux A. Icône Image B. Icône Elément masqué C. Icône Générateur de clé D. Icône Sélecteur de fichier • L’icône Image permet d’utiliser une image, telle qu’un bouton Envoyer. L’insertion de graphiques peut faciliter la navigation des internautes dans les pages. • L’icône Elément masqué permet d’insérer une balise HTML qui ne s’affiche pas dans le navigateur, mais dont la valeur est transmise avec le formulaire. • L’icône Générateur de clé permet aux internautes d’accéder à un algorithme de cryptage pour protéger les transactions effectuées sur votre site Web. Pour plus de détails sur le cryptage d’un formulaire, contactez votre fournisseur de services Internet ou l’administrateur de votre site Web. • L’icône Sélecteur de fichier insère une boîte de dialogue de sélection de fichiers, qui s’avère être rarement utilisée. Comment utiliser l'aide | Sommaire | Index Page précédente 247 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Création de formulaires Page précédente 248 Pour insérer une balise d’emplacement d’image : 1 Faites glisser l’icône Image du panneau Formulaire de la palette Objets vers le formulaire. 2 Liez la balise d’emplacement de l’image à un graphique à l’aide du bouton d’affectation ou du bouton Parcourir de l’inspecteur de l’image. (Voir « Liaison des fichiers », page 55.) 3 Configurez l’image dans le panneau Avancé de l’inspecteur de l’image de formulaire. Deux éléments revêtent une importance particulière concernant les images : • Cochez la case Formulaire si vous projetez d’utiliser l’image en tant que bouton interactif. Cette option est sélectionnée par défaut. • Veillez à attribuer un nom unique à l’image dans la zone de texte Nom. Cette opération s’avère particulièrement importante lorsque vous utilisez plusieurs boutons d’envoi graphiques au sein d’un même formulaire. Le texte saisi dans la zone de texte Nom est ajouté aux coordonnées x et y transmises au script CGI pour indiquer qu’un internaute a cliqué sur une image spécifique de la page, et déclencher une action propre à ce bouton. Pour configurer une balise masquée, un générateur de clé ou un sélecteur de fichier : 1 Faites glisser l’icône Elément masqué, de générateur de clé ou de sélecteur de fichier du panneau Formulaire de la palette Objets vers le tableau. 2 Sélectionnez l’icône dans la fenêtre du document. Dans l’inspecteur, saisissez un nom unique dans la zone de texte Nom. 3 Définissez l’une des valeurs suivantes : • Pour une balise d’élément masqué, saisissez une valeur par défaut dans la zone de texte Valeur. • Pour une balise de générateur de clé, saisissez le niveau de sécurité dans la zone de texte Sécurité. • Pour une balise de sélecteur de fichier, saisissez une valeur de largeur de fenêtre de navigateur dans la zone de texte Visible. Configuration d’éléments de formulaire en lecture seule Vous pouvez mettre des éléments de formulaire HTML individuels en lecture seule. Ceci peut s’avérer utile pour protéger, par exemple, du texte devant faire partie du formulaire. Les champs de texte, les champs de mot de passe et les zones de texte peuvent être mis en lecture seule. Pour mettre un élément en lecture seule : Sélectionnez l’élément souhaité et cochez la case Lecture seule dans l’inspecteur. Comment utiliser l'aide | Sommaire | Index Page précédente 248 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Création de formulaires Page précédente 249 Configuration d’éléments de formulaire inactifs Vous pouvez permettre aux internautes d’accéder à certains éléments de formulaire uniquement dans des cas précis en élaborant des formulaires HTML comportant des éléments grisés pouvant être activés par un script lorsque des conditions spécifiques sont réunies. Au niveau HTML, vous ajoutez un attribut « grisé » à chacun des éléments de formulaire ne devant pas être accessible lors du téléchargement du formulaire par un internaute. Le script CGI du formulaire surveille les éléments d’un autre formulaire pour un événement spécifique et active l’élément une fois l’événement en question survenu. Vous pouvez, par exemple, griser le bouton Envoyer d’un formulaire jusqu’à ce que l’internaute saisisse les données requises. Les légendes, les libellés, les champs de texte et de mot de passe, les zones de texte, les boutons Envoyer et Réinitialiser, les cases à cocher et les boutons radio prennent en charge le statut inactif. Pour désactiver un élément : 1 Dans la fenêtre du document, sélectionnez l’élément que vous souhaitez désactiver. 2 Cochez la case Désactivé dans l’inspecteur. 3 Rédigez un script visant à mettre en oeuvre une logique d’activation dynamique de l’élément et liez ce script à la page en question ou à un autre bouton. Utilisation de l’inventaire de formulaire Lorsque l’internaute clique sur le bouton Envoyer d’un formulaire, le navigateur envoie le contenu du formulaire en question à un serveur et un script définis en vue du traitement des données. La méthode la plus courante consiste à transmettre les informations à un script CGI. Vous devrez pour cela développer des scripts personnalisés et les mettre en oeuvre avec l’aide de votre administrateur système. La boîte de dialogue Inventaire de formulaire permet d’afficher un aperçu des données renvoyées par le formulaire. Cela est tout particulièrement utile dans les cas où différents individus accomplissent les tâches de création de formulaire graphique et d’intégration de serveur Web (un créateur Web et un administrateur système, par exemple). La boîte de dialogue Inventaire de formulaire contient deux panneaux. Le panneau supérieur répertorie les éléments de formulaire utilisés, à savoir l’inventaire du formulaire. Le panneau inférieur de prévisualisation des résultats du formulaire affiche le code tel qu’il sera transmis au script sur le serveur. Vous pouvez enregistrer le contenu de ces deux panneaux dans un fichier texte distinct. Pour créer des fichiers texte Inventaire de formulaire : 1 Cliquez sur la poignée de l’élément de formulaire dans la fenêtre du document. 2 Cliquez sur le bouton Inventaire de l’inspecteur du formulaire. 3 Cliquez sur Exporter dans les deux panneaux de la boîte de dialogue, puis nommez et enregistrez les fichiers texte. Comment utiliser l'aide | Sommaire | Index Page précédente 249 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 250 Utilisation d’actions Configuration d’actions Dans Adobe GoLive, les actions sont provoquées à l’aide d’événements déclenchés par le navigateur (par exemple, lorsqu’il charge une page), par l’utilisateur (par exemple, lorsqu’il déplace le pointeur de la souris sur une image) ou à un moment précis défini dans une séquence de montage. Les versions des navigateurs prenant en charge chaque action sont indiquées en regard du nom de l’action dans l’inspecteur de l’action ou dans la palette Actions. Les navigateurs compatibles avec l’action sélectionnée sont indiqués entre parenthèses Il est recommandé de toujours prévisualiser les actions dans différents navigateurs Web et sur différentes plates-formes afin de détecter les éventuelles différences ou incompatibilités des navigateurs. Par exemple, la version Mac OS de GoLive ne fournit aucune fonction d’aperçu en mode natif pour certains éléments JavaScript, DHTML ou autres. Vous avez la possibilité de lancer les différents navigateurs à partir de l’application GoLive. Pour ce faire, il vous suffit de les ajouter au préalable dans le menu Afficher dans le navigateur. (Voir « Prévisualisation des fichiers », page 63.) Création d’un filtre d’action Si vous souhaitez vous assurer que les actions que vous insérez à vos pages sont prises en charge par des versions spécifiques d’Internet Explorer et de Netscape Navigator, vous avez la possibilité de définir un filtre d’action à partir de la palette Actions. La présence d’un tel filtre permet de désactiver toute action non reconnue par une version spécifique de navigateur. Si une action n’est pas prise en charge par le navigateur sélectionné dans le filtre, elle sera grisée à l’intérieur du menu Action. Pour définir un filtre d’action : 1 Dans le menu de la palette Actions, choisissez Définir le filtre de l’action. 2 Sélectionnez la version la plus ancienne de Netscape Navigator et d’Internet Explorer à prendre en charge. Comment utiliser l'aide | Sommaire | Index Page précédente 250 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 251 Configuration d’actions déclenchées par le navigateur Les actions navigateur sont exécutées automatiquement par une action spécifique du navigateur ou lorsque l’action est « appelée » (déclenchée) par une autre action. Par exemple, vous pouvez choisir de déclencher une action à l’aide des événements suivants : pendant ou après le chargement de la page, lorsque le navigateur charge une ligne de code spécifique située dans la section d’en-tête ou de corps de la page, ou encore lorsqu’une action est exécutée. A B Icônes Action d’en-tête et Action de corps A. Action d’en-tête B. Action de corps Pour configurer une action d’en-tête : 1 Faites glisser l’icône Action d’en-tête du panneau SmartObjects de la palette Objets vers la page ou choisissez Insérer un objet > SmartObjects > Action d’en-tête dans le menu contextuel de la section d’en-tête de la page. 2 Dans le menu Exéc. de l’inspecteur de l’action d’en-tête, choisissez une option de déclenchement pour l’action d’en-tête : • L’option OnLoad permet de déclencher l’action après le chargement de la page par le navigateur. • L’option OnUnload permet de déclencher l’action lorsque le navigateur quitte la page. • L’option OnParse permet de déclencher l’action lorsque le navigateur lit une section spécifique du code source, avant même toute interaction avec l’utilisateur. • L’option OnCall permet d’appeler l’action au cours de la session de navigation à l’aide de l’action Appeler une action. (Voir « Appeler une action », page 278) Lorsque vous définissez une action OnCall, GoLive peut lui attribuer un nom par défaut (par exemple : B289B5EE0) affiché dans la zone de texte Nom. Il est possible de modifier ce nom en saisissant à la place un nom alphanumérique unique. 3 Choisissez une action dans le menu contextuel Action, puis définissez les propriétés de l’action. Pour plus de détails sur la définition des propriétés des actions individuelles, voir « Utilisation d’actions GoLive », page 254. Pour configurer une action de corps : 1 Faites glisser l’icône Action de corps du panneau SmartObjects de la palette Objets vers la fenêtre du document ou choisissez Insérer un objet > SmartObjects > Action de corps dans le menu contextuel de la section de corps de la page. Il n’est pas nécessaire de définir d’option de déclenchement. L’action est déclenchée automatiquement lorsque le navigateur charge la section de la page qui contient l’action de corps. 2 Choisissez une action dans le menu contextuel Action de l’inspecteur de l’action de corps, puis définissez les propriétés de l’action. Comment utiliser l'aide | Sommaire | Index Page précédente 251 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 252 Pour plus de détails sur la définition des propriétés des actions individuelles, voir « Utilisation d’actions GoLive », page 254 Configuration d’actions déclenchées par l’utilisateur Les actions utilisateur se produisent lorsque l’utilisateur interagit avec un élément sur la page, tel qu’une image, un bouton animé, du texte ou un élément de formulaire. Pour associer une action à du texte, à des images simples (non dotées de propriétés de bouton animé), et à des objets (autres que des éléments de formulaires et des boutons animés), insérez un lien pointant vers le texte ou l’objet voulu et affectez-lui un événement de souris ou de touche destiné à déclencher l’action. Les éléments de formulaires, les boutons animés et les images auxquelles sont associés des états de bouton animé ne nécessitent pas la création de liens. Pour configurer une action utilisateur : 1 Dans le panneau Mise en page, sélectionnez du texte ou un objet sur la page. 2 Si la sélection n’est pas encore dotée d’un lien de navigation, cliquez sur le bouton Nouveau lien dans la barre d’outils. (Cette étape est superflue pour les éléments de formulaires, les boutons animés ou les images auxquelles sont associés des états de bouton animé.) Remarque : Si vous ne précisez aucun URL de destination pour le lien de navigation, GoLive insère automatiquement un signe numérique (#) dans la zone de texte. Ceci permet d’éviter les erreurs de navigateurs générées par la présence de références de liens vides. 3 Dans la palette Actions, sélectionnez une option de déclenchement dans la liste Evénements : • L’événement Souris cliquée déclenche l’action par un simple clic de la souris sur un élément lié. Remarque : Si vous appliquez une telle action à un objet Bouton animé, le lien associé au bouton animé (indiqué dans le champ URL de l’inspecteur du bouton animé) est désactivé. Après avoir configuré une action déclenchée à l’aide d’un événement Souris cliquée, affectez-lui une action Atteindre le lien afin de définir le lien du bouton animé. (Voir « Atteindre le lien », page 259) • L’événement Souris entrée déclenche l’action lorsque le pointeur de la souris est déplacé au-dessus de l’élément lié. • L’événement Souris sortie déclenche l’action lorsque le pointeur de la souris est éloigné de l’élément lié. • L’événement Double-clic déclenche l’action lorsque l’internaute clique deux fois sur l’élément lié. • L’événement Souris enfoncée déclenche l’action lorsque l’internaute enfonce le bouton de la souris alors que le pointeur se trouve au-dessus de l’élément lié. • L’événement Souris relâchée déclenche l’action lorsque l’internaute relâche le bouton de la souris alors que le pointeur se trouve au-dessus de l’élément lié. • Les événements Touche enfoncée et Touche appuyée déclenchent l’action lorsque l’internaute appuie sur une touche. Comment utiliser l'aide | Sommaire | Index Page précédente 252 Aide d'Adobe GoLive Utilisation d’actions Comment utiliser l'aide | Sommaire | Index Page précédente 253 • L’événement Touche relâchée déclenche l’action lorsque l’internaute relâche une touche. • L’événement Champ actif déclenche l’action lorsque le champ est activé, en y plaçant le point d’insertion ou par tabulation. Cette option ne fonctionne qu’avec des champs de formulaires. • L’événement Texte modifié déclenche l’action lorsque l’internaute saisit du texte à l’intérieur du champ et sélectionne un autre champ. Cette option ne fonctionne qu’avec des champs de formulaires. • L’événement Champ inactif déclenche l’action lorsque l’internaute quitte le champ par tabulation. Cette option ne fonctionne qu’avec des champs de formulaires. 4 Cliquez sur le bouton Nouvel élément . 5 Choisissez une action dans le menu contextuel Action, puis définissez les propriétés de l’action. Pour plus de détails sur la définition des propriétés des actions individuelles, voir « Utilisation d’actions GoLive », page 254. A B C Les actions utilisateur sont configurées dans la palette Actions. A. Sélectionnez un événement de souris ou de touche déclenchant l’action. B. Cliquez sur le bouton Nouvel élément. C. Choisissez une action dans le menu contextuel Action. Pour supprimer toutes les actions utilisateur d’un déclencheur : Sélectionnez le déclencheur voulu (texte, objet ou élément de formulaire lié) sur la page et choisissez Supprimer toutes les actions dans le menu de la palette Actions. Comment utiliser l'aide | Sommaire | Index Page précédente 253 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 254 Configuration d’actions déclenchées par le montage Les actions de montage sont déclenchées au moment précis où elles sont référencées dans l’éditeur de montage DHTML. De cette manière, vous pouvez lancer des actions temporelles ou des actions liées à une scène donnée. Les actions de montage sont configurées dans l’éditeur de montage DHTML. Pour configurer une action de montage : 1 Maintenez la touche Ctrl (Windows) ou Commande (Mac OS) enfoncée et cliquez sur la piste d’action de l’éditeur de montage DHTML afin d’insérer une balise d’emplacement d’action. 2 Choisissez une action dans le menu contextuel de l’inspecteur de l’action, puis définissez les propriétés de l’action. Pour plus de détails sur la définition des propriétés des actions individuelles, voir « Utilisation d’actions GoLive », page 254. Pour mettre en évidence les actions dans les éditeurs de la fenêtre du document : Choisissez Mettre en évidence les actions du document dans le menu de la palette Actions. Les actions utilisateur sont alors mises en évidence dans les éditeurs de mise en page, de code source et de structure, ainsi que dans la barre d’arborescence des balises. Les actions navigateur et de montage sont mises en évidence dans la section de corps de la page. Utilisation d’actions GoLive GoLive est fourni avec un jeu d’actions de scripts prêtes à l’emploi. La plupart de ces actions sont entièrement compatibles avec les versions 4.0 et ultérieures de Netscape Navigator et de Microsoft Internet Explorer. Certaines d’entre elles fonctionnent avec les navigateurs 3.0 alors que d’autres requièrent au moins la version 5 ou 6. Les versions des navigateurs les plus anciennes qui prennent en charge chaque action sont indiquées en regard du nom de l’action sélectionnée dans l’inspecteur de l’action ou la palette Actions. Vous pouvez créer un filtre d’action afin de garantir que seules les actions prises en charge par une version spécifique du navigateur sont utilisées. (Voir « Création d’un filtre d’action », page 250.) Comment utiliser l'aide | Sommaire | Index Page précédente 254 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 255 Lecture Le menu Lecture comporte des actions fonctionnant avec des formulaires de pages Web et des boîtes flottantes. Vérificateur de champ L’action Vérificateur de champ permet de valider une entrée textuelle ou un champ de mot de passe de formulaire. Lorsqu’elle est appliquée à un champ de texte, cette action est déclenchée au moment où l’internaute quitte le champ par tabulation ou saisit du texte à l’intérieur du champ et sélectionne un champ différent. Elle dispose de sept critères de validation prédéfinis. Sélectionnez du texte, une zone de texte ou un champ de mot de passe à l’intérieur d’un formulaire. Dans la palette Actions, sélectionnez une option de déclenchement : choisissez l’événement Champ inactif si vous souhaitez que les entrées soient validées lorsque l’internaute quitte le champ ou l’événement Texte modifié si vous souhaitez que les entrées soient validées lorsque l’internaute saisit du texte et sélectionne un autre champ. Choisissez Action > Lecture > Vérificateur de champ. Saisissez le nom du formulaire contenant le champ de texte, puis le nom du champ en question. Sélectionnez un critère de validation dans le menu Condition de vérification du champ. Si vous choisissez l’option Correspond au nombre de caractères, spécifiez une valeur numérique dans la zone de texte Nbre de caractères. Si vous optez pour l’option Correspond exactement à la chaîne de texte, spécifiez dans la zone de texte Chaîne de texte le texte que l’internaute doit saisir dans le champ. Vous pouvez définir un message d’avertissement à afficher en cas de saisie incorrecte. Remarque : Si des actions Vérificateur de champ sont appliquées à des champs adjacents et associées à des événements Champ inactif, vous devez séparer les champs en question d’un champ non doté de cet événement. Vous avez également la possibilité de séparer les champs d’un libellé, puis de leur affecter un ordre de tabulation spécifique. (Un libellé doit comporter au moins un caractère. Si vous souhaitez définir un libellé vierge, saisissez un espace.) Lire position boîte flottante L’action Lire position boîte flottante lit l’emplacement actif d’une boîte flottante. Vous pouvez utiliser ces informations à l’aide, par exemple, d’une action Attendre et déclencher qui déplace une autre boîte flottante vers la position de la première. Cela donnera l’impression que le second objet suit le premier. Vous pouvez déclencher ce type d’action à l’aide du navigateur en lui associant un événement OnCall dans la section d’en-tête de la page. Dans l’inspecteur de l’action d’entête, choisissez Action > Lecture > Lire position boîte flottante. Choisissez OnCall dans le menu Exéc. et spécifiez un nom alphanumérique unique pour l’action. Comment utiliser l'aide | Sommaire | Index Page précédente 255 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 256 Vous pouvez également configurer l’action Lire position boîte flottante comme action de montage pour extraire les coordonnées de la boîte flottante ou utiliser les actions Déplacer sur l’axe et Déplacer comme action. Vous pouvez utiliser ces actions de manière autonome ou les combiner aux actions Détecter et déclencher ou Attendre et déclencher. Lorsque vous configurez l’une de ces deux actions, cliquez deux fois sur l’icône rouge « C » jusqu’à ce qu’elle se transforme en point d’interrogation vert , puis choisissez le nom de l’action Lire position boîte flottante dans le menu. (Pour plus de détails sur la configuration de ces actions, voir « Déplacer sur l’axe », page 270, « Déplacer comme action », page 270, « Détecter et déclencher », page 279 ou « Attendre et déclencher », page 279.) Lire élément formulaire L’action Lire élément formulaire lit le contenu d’une zone de texte ou d’un champ de mot de passe à l’intérieur d’un formulaire sur la page active. Cette action varie en fonction de ce que saisit l’internaute dans le champ de texte du formulaire. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnUnload (ou OnCall si vous l’ancrez à une image de formulaire servant de bouton d’envoi). Dans l’inspecteur de l’action d’en-tête, choisissez Action > Lecture > Lire élément formulaire. Saisissez le nom du formulaire dans la zone de texte Formulaire et le nom du champ de texte dans la zone de texte Elément. Si le formulaire comporte d’autres champs que vous souhaitez lire, insérez d’autres actions Lire élément formulaire et configurez-les selon vos besoins. Configurez des actions associées chargées de traiter le résultat. Vous pouvez, par exemple, définir une action de type Cookie qui stockera les informations extraites à l’aide de diverses actions Lire élément formulaire sur le disque dur de l’internaute. Voir « Ecrire un cookie », page 285. Image Le menu Image comporte des actions permettant de précharger des images, de configurer une image à subir des changements automatiques selon certains critères, et à créer des boutons animés. Afficher l’image du jour L’action Afficher l’image du jour permet d’afficher une image différente chaque jour de la semaine, en fonction de la date réglée sur l’ordinateur de l’internaute. Vous pouvez, par exemple, créer une bannière qui change tous les jours lors du chargement de la page ou définir une image sur laquelle les internautes peuvent cliquer afin de la remplacer par l’image du jour. Sélectionnez sur la page l’image à remplacer en fonction du jour de la semaine et saisissez un nom alphanumérique unique dans la zone de texte Nom située sur le panneau Avancé de l’inspecteur de l’image. Généralement, toutes les images sont affichées aux dimensions de la balise d’emplacement d’image. Pour changer les dimensions d’une image, modifiez les options de hauteur et de largeur de la balise d’emplacement (Image plutôt que Pixel) dans l’inspecteur de l’image. Comment utiliser l'aide | Sommaire | Index Page précédente 256 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 257 Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad ou utilisateur. Choisissez Action > Image > Afficher l’image du jour. Choisissez le nom de la balise d’emplacement d’image dans le menu Image. Il s’agit de l’image qui sera remplacée par d’autres images en fonction du jour de la semaine. Associez-lui une image de remplacement pour chaque jour de la semaine. Précharger des images L’action Précharger des images force le navigateur à placer en mémoire cache certaines images avant l’affichage de la page. Ceci s’avère particulièrement utile lorsque l’affichage des images de la page est régit par l’interaction de l’internaute avec la page (telles que des images de bouton animé) ou à un moment précis dans le temps. Bien que le chargement de la page risque de prendre plus de temps au départ, les images préchargées sont disponibles sur-le-champ lorsque le chargement est terminé. Cette méthode présente l’avantage d’accélérer l’affichage des images de boutons animés lorsque l’internaute interagit avec elles. De plus, les actions et animations DHTML sont en mesure de renouveler les images instantanément. Remarque : Les images liées aux boutons animés de GoLive étant automatiquement préchargées, il est inutile de leur associer une action Précharger des images. Les images auxquelles sont associés des états de bouton animé sont dotées de l’option Précharger de l’inspecteur de l’image. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad. Dans l’inspecteur de l’action d’en-tête, choisissez Action > Image > Précharger des images et spécifiez le fichier image à précharger. Si vous souhaitez précharger plusieurs images, plutôt que d’insérer une action d’entête pour chaque image, configurez une action d’en-tête Grouper des actions et affectez-lui une action Précharger des images. (Voir « Grouper des actions », page 278.) Afficher au hasard L’action Afficher au hasard change le contenu d’une balise d’emplacement d’image chaque fois que la page est téléchargée, en utilisant de manière aléatoire l’une des trois images spécifiées. Sélectionnez sur la page l’image que vous souhaitez remplacer et saisissez un nom alphanumérique unique dans la zone de texte Nom située sur le panneau Avancé de l’inspecteur de l’image. Généralement, toutes les images sont affichées aux dimensions de la balise d’emplacement de l’image. Pour changer les dimensions d’une image, modifiez les options de hauteur et de largeur de la balise d’emplacement (Image plutôt que Pixel) dans l’inspecteur de l’image. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad ou utilisateur. Choisissez Action >Image > Afficher au hasard et spécifiez l’image de base à remplacer dans le menu Image de base. Sélectionnez ensuite les fichiers image de remplacement voulus. Important : Vous devez spécifier trois images pour le remplacement de la balise d’emplacement d’image. Si vous ne le faites pas, une référence vide sera affichée au hasard à la place de l’image. Comment utiliser l'aide | Sommaire | Index Page précédente 257 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 258 Permuter des images L’action Permuter des images permet de créer des boutons animés principaux et secondaires qui changent le contenu d’une balise d’emplacement d’image lorsque l’internaute interagit avec un autre contenu sur la page. Vous pouvez également utiliser cette action plusieurs fois, dans une séquence de montage, afin de créer un diaporama. Sélectionnez sur la page la balise d’emplacement de l’image que vous souhaitez remplacer et saisissez un nom alphanumérique unique dans la zone de texte Nom située sur le panneau Avancé de l’inspecteur de l’image. Généralement, toutes les images sont affichées aux dimensions de la balise d’emplacement de l’image. Pour changer les dimensions d’une image, modifiez les options de hauteur et de largeur de la balise d’emplacement (Image plutôt que Pixel) dans l’inspecteur de l’image. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Image > Permuter des images, spécifiez l’image de base à remplacer dans le menu Image et associez-lui une image de remplacement. Pour restaurer l’image de base initiale, définissez un autre événement de souris (tel que Souris sortie), un événement de touche ou de montage, puis configurez, pour cette même balise d’emplacement d’image, une action Permuter des images pointant vers l’image de base initiale. Lien Le menu Lien comporte une large gamme d’actions permettant de créer des liens vers de nouvelles pages ou fichiers, de rediriger le navigateur en fonction de certains critères ou de travailler à l’intérieur d’un jeu de cadres spécifique. Rediriger CSS L’action Rediriger CSS permet d’appliquer une feuille de style en cascade externe à la page Web lorsqu’elle détecte une plate-forme et un navigateur spécifiques. Vous pouvez déclencher ce type d’action à l’aide du navigateur en lui associant un événement OnParse dans la section d’en-tête de la page. Dans l’inspecteur de l’action d’en-tête, choisissez Action > Lien > Rediriger CSS. Sélectionnez une plate-forme et un navigateur dans les menus contextuels et spécifiez la feuille de style externe à utiliser si la plate-forme et le navigateur sélectionnés sont détectés. Ajoutez autant d’actions d’en-tête que nécessaire et recommencez cette procédure pour chaque feuille de style en cascade que vous souhaitez associer à des plates-formes et navigateurs spécifiques. Fermer la fenêtre L’action Fermer la fenêtre ferme la fenêtre active. Certains navigateurs invitent l’utilisateur à confirmer ou à annuler la fermeture de la fenêtre. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Lien > Fermer la fenêtre. Confirmer le lien L’action Confirmer le lien permet d’afficher une boîte de dialogue de confirmation avant le chargement de la page liée. Ceci permet à l’internaute de confirmer s’il souhaite suivre le lien ou rester sur la page active. Comment utiliser l'aide | Sommaire | Index Page précédente 258 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 259 Vous pouvez déclencher cette action à l’aide d’un événement utilisateur. Dans la palette Actions, choisissez Action > Lien > Confirmer le lien et saisissez le message de confirmation dans la zone de texte Message. (Pour insérer un saut de ligne, tapez \n.) Spécifiez la page de destination dans la zone de texte URL à atteindre après validation. Si la page active est un jeu de cadres, saisissez dans la zone de texte Nom du cadre cible le nom du cadre dans lequel afficher la page liée. Si vous préférez que la page remplace le jeu de cadres entier, ne saisissez aucun nom dans cette zone. Afficher la page du jour L’action Afficher la page du jour permet d’afficher une page Web différente chaque jour de la semaine, en fonction de la date de l’ordinateur de l’internaute. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Il est également possible de la déclencher lorsque l’internaute quitte la page en configurant un événement OnUnload. Choisissez Action >Lien > Afficher la page du jour et spécifiez pour chaque jour de la semaine une page de votre site ou un URL externe à afficher. Inclure dans un jeu L’action Inclure dans un jeu permet d’empêcher l’affichage des pages d’un jeu de cadres en dehors de celui-ci. Prenons un exemple : il se peut qu’un moteur de recherche renvoie directement à une page Web destinée à apparaître à l’intérieur de l’un des cadres d’un jeu de cadres. Grâce à l’action Inclure dans un jeu, un navigateur chargeant le lien renvoyant à la page trouvée par le moteur de recherche charge le jeu de cadres complet et non juste la page isolée. Cette action s’avère particulièrement utile dans le cas où les autres cadres de la page contiennent des éléments tels que des logos de bannière permettant d’identifier votre site ou des boutons de navigation. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad. Le déclencheur peut s’appliquer à toutes les pages faisant partie du jeu de cadres et non au document du jeu de cadres. Dans l’inspecteur de l’action d’en-tête, choisissez Action > Lien > Inclure dans un jeu et spécifiez le jeu de cadres dans lequel vous souhaitez insérer la page active ou le cadre dans lequel vous souhaitez afficher la page de contenu. Revenir URL précédent L’action Revenir URL précédent amène le navigateur à la dernière page consultée. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Il est également possible de la déclencher lorsque l’internaute quitte la page active en associant à une action d’en-tête un événement OnUnload. Choisissez Action >Lien > Revenir URL précédent. Atteindre le lien L’action Atteindre le lien permet de définir un lien à une page de votre site ou à un URL externe. Lorsqu’elle est appliquée à une action de montage, l’action Atteindre le lien permet d’ouvrir une nouvelle page à un moment précis dans le temps. Lorsqu’elle est appliquée à une action navigateur déclenchée par un événement OnCall, cette action permet de maintenir les liens renvoyant vers le même URL. Par exemple, appliquez une action Appeler une action aux liens pour déclencher l’action Atteindre le lien. (Voir « Appeler une action », page 278.) Comment utiliser l'aide | Sommaire | Index Page précédente 259 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 260 Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnCall, d’un événement utilisateur ou de montage. Il est également possible de la déclencher lorsque l’internaute quitte la page active en configurant un événement OnUnload. Choisissez Action > Lien > Atteindre le lien et spécifiez une page ou un URL dans la zone de texte Lien. Si la page active se trouve dans un jeu de cadres, saisissez dans la zone de texte Cible le nom du cadre à utiliser comme cible ou laissez cette zone vierge si vous préférez que le lien remplace le cadre actif. Pour extraire l’URL cible d’une variable, cliquez sur la petite icône « C » rouge située en regard du bouton d’affectation. Lorsqu’elle prend la forme d’un cercle bleu , choisissez une variable dans le menu contextuel. Pour définir le lien vers un URL extrait d’une action navigateur déclenchée par un événement d’en-tête OnCall, cliquez une nouvelle fois sur cette icône. Lorsqu’elle prend la forme d’un point d’interrogation , sélectionnez une action dans le menu contextuel. Touche enfoncée L’action Touche enfoncée permet de déclencher une autre action lorsque l’internaute enfonce une touche spécifique. Vous pouvez affecter jusqu’à quatre touches à différentes actions. Avant d’ajouter une action Touche enfoncée, vous devez créer jusqu’à quatre actions navigateur déclenchées par un événement de touche et configurées pour une exécution OnCall. Saisissez un nom alphanumérique pour chaque action dans la zone de texte Nom de l’inspecteur de l’action d’en-tête. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad. Choisissez Action > Lien > Touche enfoncée. Saisissez un nombre unique ou une lettre minuscule dans la zone de texte Touche, puis choisissez un nom d’action dans le menu contextuel. Remarque : Vous ne pouvez définir qu’une seule action Touche enfoncée par page. Si vous en ajoutez une seconde, la première action Touche enfoncée cesse de fonctionner. Exclure d’un jeu L’action Exclure d’un jeu permet d’empêcher que des pages ne soient chargées dans l’un des cadres d’un jeu de cadres. Vous pouvez utiliser cette action pour empêcher un site Web d’afficher votre page dans un cadre et un logo ou une publicité dans un autre cadre de la page Web. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad. Choisissez Action > Lien > Exclure d’un jeu. Naviguer dans historique L’action Naviguer dans historique permet de faire reculer ou avancer le navigateur d’un nombre de pages spécifiques à l’aide de l’historique des liens du navigateur. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action >Lien >Naviguer dans historique. Pour remonter l’historique des liens, saisissez un nombre entier négatif dans la zone de texte Destination. Pour avancer, saisissez un nombre entier positif. Comment utiliser l'aide | Sommaire | Index Page précédente 260 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 261 Ouvrir une fenêtre L’action Ouvrir une fenêtre permet d’ouvrir un lien dans une nouvelle fenêtre du navigateur au-dessus de la fenêtre active. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad ou utilisateur. Il est également possible de la déclencher lorsque l’internaute quitte la page active en configurant un événement OnUnload. Choisissez Action > Lien > Ouvrir une fenêtre et spécifiez une page ou un URL externe de destination. Si vous envisagez de configurer de multiples actions Ouvrir une fenêtre sur la page active et souhaitez ouvrir chaque lien dans une nouvelle fenêtre (plutôt que d’ouvrir tous les liens dans une unique nouvelle fenêtre), ne spécifiez aucune destination dans la zone de texte Cible de l’inspecteur de chaque action. Pour ouvrir tous les liens appelés par l’action Ouvrir une fenêtre dans une même fenêtre, spécifiez dans la zone de texte Cible de l’inspecteur de chaque action le même nom alphanumérique. Saisissez la largeur (en pixels) de la nouvelle fenêtre dans la première zone de texte Taille et la hauteur (en pixels) dans la seconde zone de texte Taille. Sélectionnez les options restantes pour définir les propriétés de la nouvelle fenêtre. Les options Redimensionner et Défiler permettent à l’internaute de redimensionner la fenêtre du navigateur et, si nécessaire, de la faire défiler. Les autres options permettent d’afficher ou de masquer les caractéristiques du navigateur. Définir une fenêtre L’action Définir une fenêtre invite l’internaute à spécifier les largeur et hauteur (en pixels) de la fenêtre, puis ouvre la page active dans une nouvelle fenêtre dotée des dimensions spécifiées. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Choisissez Action > Lien > Définir une fenêtre. Sélectionnez les options voulues pour définir les propriétés de la nouvelle fenêtre. Les options Redimensionner et Défiler permettent à l’internaute de redimensionner la fenêtre du navigateur et, si nécessaire, de la faire défiler. Les autres options permettent d’afficher ou de masquer les caractéristiques du navigateur. Rediriger PDF L’action Rediriger PDF vérifie si le module externe Adobe PDF (Portable Document Format) est installé et redirige le navigateur vers un fichier PDF ou une page Web spécifique si tel est le cas. Si le module n’est pas installé, le navigateur affiche la page renfermant l’action Rediriger PDF. Lorsque vous configurez une action Rediriger PDF, concevez une page spéciale pour les navigateurs qui ne disposent pas du module externe PDF. Par exemple, vous insérerez dans cette page le contenu PDF au format HTML ou un lien renvoyant vers une autre page Web sur laquelle les internautes peuvent télécharger le module externe. Configurez dans la section d’en-tête de cette page une action navigateur associée à un événement OnParse. Choisissez Action > Lien > Rediriger PDF et spécifiez dans la zone de texte Page PDF le fichier PDF ou la page à afficher si le navigateur de l’internaute dispose du module externe. Comment utiliser l'aide | Sommaire | Index Page précédente 261 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 262 Liens aléatoires L’action Liens aléatoires redirige le navigateur de manière aléatoire vers six liens et masque les barres d’outils et d’adresse de la fenêtre du navigateur. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Il est également possible de la déclencher lorsque l’internaute quitte la page active en associant à une action d’en-tête un événement OnUnload. Effectuez l’une des opérations suivantes : • Pour remplacer la page ou le cadre actifs avec le lien, laissez la zone de texte Cible vide ou saisissez _self. • Pour ouvrir le lien dans une nouvelle fenêtre chaque fois que l’action est déclenchée, saisissez _blank. • Pour ouvrir le lien et les déclencheurs d’actions suivants dans une même nouvelle fenêtre, saisissez un nom alphanumérique unique. • Pour ouvrir le lien dans un cadre, saisissez le nom du cadre. La page doit se trouver dans un jeu de cadre pour renvoyer vers un cadre. Demander la redirection L’action Demander la redirection permet de poser à l’internaute jusqu’à cinq questions et de le rediriger vers une page spécifique en fonction des réponses choisies. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage.Choisissez Action > Lien > Demander la redirection. Dans la zone de texte Question, saisissez une question pour laquelle l’internaute peut fournir de une à cinq réponses. Si vous le souhaitez, précisez dans la zone de texte Réponses possibles un message indiquant les éventuelles réponses. (Ce message est affiché par défaut dans la fenêtre dans laquelle l’internaute saisit ses réponses.) Dans la zone de texte Avertissement en cas de réponse incorrecte, saisissez un message à afficher lorsque l’internaute saisit une réponse incorrecte. Important : Si votre texte renferme des apostrophes, précédez-les d’une barre oblique inverse afin d’éviter qu’elles ne provoquent des erreurs JavaScript dans le navigateur. Par exemple, pour afficher le message « Quel est votre nom d’utilisateur ? », saisissez « Quel est votre nom d\’utilisateur ? » dans la zone de texte Question. Si vous souhaitez rediriger l’internaute vers la même page chaque fois qu’il visite la page active, sélectionnez l’option Mémoriser la sélection et rediriger automatiquement à la prochaine visite. (Si la configuration du navigateur prévoit la désactivation des cookies, cette option ne fonctionne pas.) Saisissez un nom pour le cookie. Précisez jusqu’à cinq réponses dans les zones de texte Réponse. Associez à chaque réponse un document différent de votre site ou externe. Important : Les réponses sont sensibles à la casse. Pour cette raison, assurez-vous que les choix de réponses proposés correspondent exactement aux réponses que vous avez spécifiées dans les zones de texte. N’oubliez pas de précéder toute apostrophe d’une barre oblique inverse. Comment utiliser l'aide | Sommaire | Index Page précédente 262 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 263 Rediriger SVG L’action Rediriger SVG vérifie si le module externe Adobe SVG (Scalable Vector Graphics) est installé et redirige le navigateur vers une page dotée d’un contenu SVG si tel est le cas. Si le module n’est pas installé, le navigateur affiche la page renfermant l’action Rediriger SVG. Lorsque vous configurez une action Rediriger SVG, concevez une page spéciale pour les navigateurs qui ne disposent pas du module externe SVG. Par exemple, vous insérerez dans cette page le contenu SVG dans un format différent ou un lien renvoyant vers une autre page Web sur laquelle les internautes peuvent télécharger le module externe. Configurez dans la section d’en-tête de cette page une action navigateur associée à un événement OnParse. Dans l’inspecteur de l’action d’en-tête, choisissez Action > Lien > Rediriger SVG. Spécifiez dans la zone de texte Page SVG la page Web dotée du contenu SVG à afficher si le navigateur de l’internaute dispose du module externe. Si vous souhaitez afficher un message personnalisé pour les internautes ne disposant pas du module externe, sélectionnez l’option Avertir si le module externe est introuvable et précisez un message dans la zone de texte Avertissement. Important : Si votre message renferme des apostrophes, précédez-les d’une barre oblique inverse afin d’éviter qu’elles ne provoquent des erreurs JavaScript dans le navigateur. Rediriger SWF L’action Rediriger SWF vérifie si le module externe SWF (Macromedia ® Flash™) est installé et redirige le navigateur vers une page dotée d’un contenu SWF si tel est le cas. Si le module n’est pas installé, le navigateur affiche la page renfermant l’action Rediriger SWF. Lorsque vous configurez une action Rediriger SWF, concevez une page spéciale pour les navigateurs qui ne disposent pas du module externe SWF. Par exemple, vous insérerez dans cette page le contenu SWF dans un format différent ou un lien renvoyant vers une autre page Web sur laquelle les internautes peuvent télécharger le module externe. Vous pouvez déclencher ce type d’action à l’aide du navigateur en lui associant un événement OnParse dans la section d’en-tête de la page. Dans l’inspecteur de l’action d’en-tête, choisissez Action > Lien > Rediriger SWF. Spécifiez dans la zone de texte Page SWF la page Web dotée du contenu SWF à afficher si le navigateur de l’internaute dispose du module externe. Si vous souhaitez afficher un message personnalisé pour les internautes ne disposant pas du module externe, sélectionnez l’option Avertir si le module externe est introuvable et précisez un message dans la zone de texte Avertissement. Important : Si votre message renferme des apostrophes, précédez-les d’une barre oblique inverse afin d’éviter qu’elles ne provoquent des erreurs JavaScript dans le navigateur. Glisser nouvelle fenêtre L’action Glisser nouvelle fenêtre ouvre une nouvelle fenêtre de navigateur et la fait glisser vers le centre de l’écran. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Choisissez Action > Lien > Glisser nouvelle fenêtre et spécifiez le document à ouvrir dans la nouvelle fenêtre. Dans la zone de texte Nom de la fenêtre, saisissez un nom alphanumérique unique sans espace. (Si vous ne spécifiez aucun nom dans cette zone de texte, certains navigateurs afficheront une nouvelle fenêtre chaque fois que la page renfermant l’action est visitée.) Comment utiliser l'aide | Sommaire | Index Page précédente 263 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 264 Saisissez la largeur (en pixels) de la nouvelle fenêtre dans la première zone de texte Taille et la hauteur (en pixels) dans la seconde zone de texte Taille. Sélectionnez les options restantes pour définir les propriétés de la nouvelle fenêtre. Les options Redimensionner et Défiler permettent à l’internaute de redimensionner la fenêtre du navigateur et, si nécessaire, de la faire défiler. Les autres options permettent d’afficher ou de masquer les caractéristiques du navigateur. Lier à deux cadres L’action Lier à deux cadres permet de lier deux cadres d’un jeu de cadres à deux pages Web différentes à partir d’un lien unique. Vous pouvez déclencher cette action en insérant un événement utilisateur à l’intérieur d’un cadre ou d’un jeu de cadres. Choisissez Action > Lien > Lier à deux cadres. Dans la zone Cadre 1, indiquez le nom du cadre dans lequel le premier lien doit s’afficher lorsque l’action est déclenchée. Spécifiez dans la zone de texte Lien la destination du lien ou saisissez un URL externe. Dans la zone Cadre 2, indiquez le nom du cadre dans lequel le deuxième lien doit s’afficher lorsque l’action est déclenchée. Spécifiez dans la zone de texte Lien la destination du lien ou saisissez un URL externe. Lier à tiers L’action Lier à tiers ouvre un lien dans une fenêtre déjà ouverte. Cette action est appliquée à l’intérieur d’une page ouverte depuis une autre page à l’aide de l’action Ouvrir une fenêtre. Par exemple, elle permet de configurer un petit menu hyperlien en dehors de la fenêtre principale du navigateur. Ainsi, lorsque l’internaute clique sur un élément dans la fenêtre du menu, l’URL cible s’ouvre dans la fenêtre principale du navigateur. Configurez une action Ouvrir une fenêtre dans une page afin d’ouvrir une autre page dans une nouvelle fenêtre. (Voir « Ouvrir une fenêtre », page 261.) Important : Si les fenêtres distantes sont redimensionnées dans Netscape Navigator, elles ne sont pas en mesure de cibler la fenêtre initiale. Pour cette raison, il est déconseillé d’utiliser l’option Redimensionner avec l’action Ouvrir une fenêtre. Sur la page ouverte à l’aide de l’action Ouvrir une fenêtre, associez à l’action Lier à tiers un déclencheur utilisateur. Dans la palette Actions, choisissez Action > Lien > Lier à tiers et spécifiez la page ou l’URL externe à charger dans la fenêtre initiale lorsque le lien est cliqué. Si la fenêtre initiale renferme un jeu de cadres et que vous souhaitez que la page s’ouvre dans l’un de ses cadres, saisissez son nom dans la zone de texte Nom du cadre cible (facultatif ). Ajoutez sur la page autant d’événements utilisateur que nécessaire et recommencez la procédure. Changer le texte L’action Changer le texte (ID) permet de remplacer le texte d’une page ou le contenu d’une boîte flottante ou d’une cellule de tableau par un nouveau texte. Tout le contenu de la boîte flottante ou de la cellule de tableau sera remplacé par le nouveau texte. Si l’élément à remplacer est du texte ou le contenu d’une cellule de tableau, il doit faire appel à un style ID. (Voir « Création de styles ID », page 142 et « Application de styles », page 153.) Le nouveau texte peut être affiché quelques secondes avant que le contenu d’origine soit restitué ou disparaître sans que le contenu d’origine ne réapparaisse. Important : Cette action fonctionne avec les navigateurs Internet Explorer 5 (et versions ultérieures) et Netscape 6 (et versions ultérieures). Comment utiliser l'aide | Sommaire | Index Page précédente 264 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 265 Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Lien > Changer le texte (ID). Si le contenu à remplacer est situé à l’intérieur d’une boîte flottante, choisissez dans le menu Calque le nom de cette boîte flottante. S’il s’agit de texte ou du contenu d’une cellule de tableau, saisissez le nom du style ID utilisé (sans inclure le symbole #) dans la zone de texte ID de l’élément. Précisez le nouveau texte. Spécifiez le nombre de secondes pendant lesquelles le texte de remplacement sera affiché avant que le contenu d’origine ne soit restauré ou qu’il ne disparaisse. Si vous préférez que le texte ou contenu initial réapparaisse sur la page lorsque le nouveau texte disparaît, sélectionnez l’option Texte disparaît au lieu d’être restauré. Pour personnaliser le formatage du nouveau texte, saisissez dans la zone de texte <open> une balise ouvrante HTML dotée des attributs voulus et la balise fermante correspondante dans la zone de texte </close>. Par exemple, pour afficher le texte dans une police verte d’un corps de 5, saisissez <font color="#00FF00" size="5"> dans la zone de texte <open> et </font> dans la zone de texte </close>. Planifier l’affichage L’action Planifier l’affichage permet d’afficher une page Web différente selon l’heure réglée sur l’ordinateur de l’internaute. Lorsque l’internaute charge la page ou clique sur un élément, le navigateur est redirigé vers une page donnée si l’heure spécifiée a été atteinte ou vers une autre page si tel n’est pas le cas. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou navigateur. Choisissez Action > Lien > Planifier l’affichage et spécifiez dans la zone de texte Heure l’heure à utiliser comme référence pour la redirection. (Vous devez saisir un nombre entier compris entre 1 et 12.) Sélectionnez PM pour définir l’heure entre midi et minuit ; n’activez pas cette option si vous souhaitez définir l’heure entre minuit et midi. Sélectionnez l’option Avant et spécifiez la page ou l’URL à afficher avant l’heure pivot ; pour que la redirection ne se produise pas avant l’heure indiquée, n’activez pas cette option. Sélectionnez l’option Après, puis créez un lien renvoyant à la page ou à l’URL externe à afficher à l’heure ou après l’heure fixée ; pour que la redirection ne se produise pas à l’heure ou après l’heure indiquée, n’activez pas cette option. Message Le menu Message comporte des actions permettant d’écrire du texte sur une page, d’afficher la date à laquelle la page a été téléchargée sur le serveur, d’ouvrir un message d’avertissement, d’inviter l’internaute à saisir un mot de passe et d’afficher du texte dans la barre d’état de la fenêtre du navigateur. Insérer du HTML L’action Insérer du HTML est une action de corps déclenchée par le navigateur. Lorsque le navigateur atteint le code de l’action sur la page, l’action Insérer du HTML remplace l’action de corps par le texte ou le code de votre choix, la valeur active extraite par une action ou la valeur d’une variable. Comment utiliser l'aide | Sommaire | Index Page précédente 265 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 266 Vous pouvez déclencher ce type d’action à l’aide du navigateur en insérant une action de corps à un emplacement pratique de la page. Choisissez Action > Message > Insérer du HTML et saisissez le texte ou code que vous souhaitez insérer. Pour extraire le texte à insérer d’une variable, cliquez sur la petite icône « C » rouge située en regard de la zone de texte HTML. Lorsqu’elle prend la forme d’un cercle bleu , choisissez une variable dans le menu contextuel. Pour extraire le texte d’une action navigateur déclenchée par un événement d’en-tête OnCall, cliquez une nouvelle fois sur cette icône. Lorsqu’elle prend la forme d’un point d’interrogation , sélectionnez une action dans le menu contextuel. Date de modification (ID) L’action Date de modification (ID) affiche la date à laquelle la page a été téléchargée pour la dernière fois sur le serveur. La date peut remplacer une balise d’emplacement située sur la page ou être affichée dans une boîte flottante ou dans une cellule de tableau. Tout le contenu de la boîte flottante ou de la cellule de tableau sera remplacé par la date de la dernière modification. Si l’action est appliquée à du texte ou au contenu d’une cellule de tableau, il doit faire appel à un style ID. (Voir « Création de styles ID », page 142 et « Application de styles », page 153.) Important : Cette action fonctionne avec les navigateurs Internet Explorer 5 (et versions ultérieures) et Netscape 6 (et versions ultérieures). Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad ou utilisateur. Choisissez Action > Message > Date de modification (ID). Si vous souhaitez que la date apparaisse à l’intérieur d’une boîte flottante, choisissez dans le menu Calque le nom de cette boîte flottante. Si vous préférez qu’elle remplace du texte ou le contenu d’une cellule de tableau, saisissez le nom du style ID utilisé (sans inclure le symbole #) dans la zone de texte ID de l’élément. Choisissez un format de date numérique dans le menu. Pour afficher le jour de la semaine avant la date numérique, sélectionnez l’option Inclure le jour de la semaine. Dans la zone de texte Texte avant, saisissez le texte que vous souhaitez placer avant la date. (N’oubliez pas de précéder toute apostrophe d’une barre oblique inverse afin d’éviter que des erreurs JavaScript ne se produisent.) Pour personnaliser le formatage du texte de la date, saisissez dans la zone de texte <open> une balise ouvrante HTML dotée des attributs voulus et la balise fermante correspondante dans la zone de texte </close>. Par exemple, pour afficher le texte dans une police verte d’un corps de 5, saisissez <font color="#00FF00" size="5"> dans la zone de texte <open> et </font> dans la zone de texte </close>. Date de modification (formulaire) L’action Date de modification (formulaire) affiche la date à laquelle la page a été téléchargée pour la dernière fois sur le serveur. La date est affichée dans un champ de formulaire ; vous pouvez également choisir de l’afficher dans un message d’avertissement du navigateur. Comment utiliser l'aide | Sommaire | Index Page précédente 266 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 267 Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad. Choisissez Action > Message > Date de modification (formulaire) et saisissez le nom du formulaire dans la zone de texte Formulaire. (Les navigateurs Internet Explorer ne reconnaissent pas les formulaires intitulés « form ».) Précisez le nom du champ de texte dans la zone de texte Champ. Choisissez un format de date numérique dans le menu. Pour afficher le jour de la semaine avant la date numérique, sélectionnez l’option Inclure le jour de la semaine. Un message d’avertissement apparaît, affichant la date par défaut. Sélectionnez l’option Désactiver les messages d’avertissement pour ne plus afficher cet avertissement. Afficher un avertissement L’action Afficher un avertissement permet d’ouvrir une boîte de dialogue contenant un message personnalisé. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Choisissez Action > Message > Afficher un avertissement et saisissez le message à afficher dans la boîte de dialogue d’avertissement. Pour extraire le texte d’une variable, cliquez sur la petite icône « C » rouge située en regard de la zone de texte Message. Lorsqu’elle prend la forme d’un cercle bleu , choisissez une variable dans le menu contextuel. Pour extraire le texte d’une action navigateur déclenchée par un événement d’en-tête OnCall, cliquez une nouvelle fois sur cette icône. Lorsqu’elle prend la forme d’un point d’interrogation , sélectionnez une action dans le menu contextuel. Saisir un mot de passe L’action Saisir un mot de passe permet de protéger des pages par mot de passe selon un niveau de sécurité raisonnable sans script serveur. Contrairement à d’autres scripts JavaScript de protection par mot de passe, cette action utilise un mot de passe chiffré et ne peut être contournée en désactivant la fonction JavaScript dans le navigateur ou en modifiant le code source. La création d’une action Saisir un mot de passe consiste en la procédure suivante : vous générez un mot de passe chiffré en utilisant un fichier HTML fourni avec le produit, nommez de manière appropriée la page protégée par mot de passe, puis appliquez une action Saisir un mot de passe sur la page renvoyant à la page protégée par mot de passe. Bien que l’action Saisir un mot de passe fournisse un niveau de sécurité raisonnable, il est toujours possible que le mot de passe soit contourné. Elle est donc déconseillée pour les sites nécessitant un niveau de sécurité très élevé. Par ailleurs, le fichier protégé par mot de passe doit impérativement être placé dans un répertoire contenant une page racine par défaut telle qu’index.html (cette page varie en fonction de votre fournisseur d’accès) afin d’empêcher que le contenu du répertoire ne puisse être visualisé en saisissant simplement son emplacement dans le navigateur. Ouvrez dans votre navigateur le fichier intitulé Créer un mot de passe.html situé à l’emplacement suivant : GoLive 6.0/Modules/JScript/Actions/Message. (Les mots de passe respectent la casse des caractères et ne doivent pas contenir d’espace.) Cliquez sur le lien de la page Créer un mot de passe.html, saisissez dans la boîte de dialogue qui s’affiche le mot de passe que vous souhaitez utiliser et cliquez sur OK. Prenez note de la version chiffrée du mot de passe indiquée dans le message d’avertissement qui s’affiche. Comment utiliser l'aide | Sommaire | Index Page précédente 267 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 268 Attribuez un nom à la page que vous souhaitez protéger par mot de passe en utilisant la version non chiffrée de votre mot de passe suivie de l’extension .html. Par exemple, si votre mot de passe est « Hiver », la page protégée doit être intitulée Hiver.html. Vous pouvez déclencher cette action en insérant un événement utilisateur sur une page autre que la page protégée par mot de passe. (Le déclencheur ne doit comporter aucun lien, ni vers la page protégée, ni vers une autre page.) Choisissez Action > Message > Saisir un mot de passe et saisissez dans la zone de texte Mot de passe chiffré le mot de passe dont vous avez pris note. Dans la zone Message de confirmation de la connexion, saisissez le message que vous souhaitez afficher lorsque les internautes entrent le bon mot de passe non chiffré. Assurez-vous que la page protégée par mot de passe et celle qui lui est liée sont situées dans le même répertoire. Personnaliser la barre L’action Personnaliser la barre permet d’afficher un message de texte personnalisé sur la barre d’état située au bas de la fenêtre du navigateur. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Choisissez Action > Message > Personnaliser la barre et saisissez le message dans la zone de texte. (N’oubliez pas de précéder toute apostrophe d’une barre oblique inverse afin d’éviter que des erreurs JavaScript ne se produisent.) Multimedia Le menu Multimedia comporte des actions permettant d’interagir avec des boîtes flottantes, des sons ou des images sur une page. Déplacer boîte flottante L’action Déplacer boîte flottante permet aux internautes de faire glisser une boîte flottante sur la page dans la fenêtre de leur navigateur. Avant de créer une telle action, assurez-vous que la page contient une boîte flottante visible et dotée d’un contenu. (Voir « Insertion d’une boîte flottante ») Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad. Choisissez Action > Multimedia > Déplacer boîte flottante et sélectionnez dans le menu contextuel Boîte flottante la boîte que vous souhaitez faire glisser. Déplacer et replacer Lorsqu’elle est déclenchée pour la première fois, l’action Déplacer et replacer déplace une boîte flottante vers un nouvel emplacement défini par l’utilisateur. La seconde fois, elle déplace la boîte flottante vers un autre emplacement (le point de départ de la boîte flottante ou un nouvel emplacement défini). Vous pouvez, par exemple, associer cette action à un bouton afin de permettre à l’internaute d’afficher puis de masquer à nouveau un objet situé hors du cadre de la fenêtre du navigateur à l’ouverture. Comment utiliser l'aide | Sommaire | Index Page précédente 268 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 269 Avant de créer une telle action, assurez-vous que la page contient une boîte flottante visible et dotée d’un contenu. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Multimedia > Déplacer et replacer et sélectionnez dans le menu contextuel Boîte flottante la boîte que vous souhaitez déplacer. Les zones de texte Pos. 1 représentent l’emplacement vers lequel la boîte flottante sera déplacée lorsque l’action est déclenchée pour la première fois. Saisissez dans ces zones de texte les valeurs de gauche et du haut ou déplacez la boîte flottante vers l’emplacement de votre choix. Ensuite, cliquez sur Get pour extraire les coordonnées correspondantes. Les zones de texte Pos. 2 correspondent à l’emplacement vers lequel la boîte flottante sera déplacée lorsque l’action est déclenchée pour la deuxième fois. Saisissez les valeurs ou déplacez la boîte flottante vers l’emplacement voulu et cliquez sur Get. Pour faire glisser la boîte flottante d’un emplacement à l’autre, sélectionnez l’option Animation et saisissez un nombre entier positif dans la zone de texte /60 pour définir la vitesse de l’animation. La fraction en question équivaut à 1/60 de seconde. Plus le nombre de graduations est élevé, plus le déplacement s’effectue lentement. Lorsque l’option Animation n’est pas activée, la boîte flottante apparaît instantanément à chaque emplacement défini lorsque l’action est déclenchée. Calque flottant L’action Calque flottant permet de verrouiller la position relative d’une boîte flottante par rapport à la fenêtre du navigateur lorsque l’internaute fait défiler la page. Avant de créer une telle action, assurez-vous que la page contient une boîte flottante visible et dotée d’un contenu. (Voir « Insertion de boîtes flottantes dans la page », page 82 et « Ajout de contenu à une boîte flottante », page 83.) Important : Les versions 4.5 et antérieures d’Internet Explorer ne seront pas en mesure de détecter la boîte flottante à l’emplacement spécifié, à moins que vous n’ayez configuré une action Déplacer comme action pour la boîte flottante avant l’action Calque flottant. (Voir « Déplacer comme action », page 270.) L’action Calque flottant fonctionne avec les autres navigateurs, que la page contienne une action Déplacer comme action ou non. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Choisissez Action > Multimedia > Calque flottant et sélectionnez nom de la boîte flottante dans le menu contextuel. Spécifiez dans les zones de texte Position sur la page l’emplacement auquel vous souhaitez verrouiller la boîte flottante (les valeurs définies sont exprimées en pixels). Suivre la souris L’action Suivre la souris permet d’attacher la boîte flottante au pointeur de la souris de l’internaute à l’intérieur de la fenêtre du navigateur. (La boîte flottante apparaît au bas à droite du pointeur.) Si le pointeur sort de la fenêtre, la boîte flottante demeure au dernier emplacement du pointeur à l’intérieur de la fenêtre. Avant de créer une telle action, assurez-vous que la page contient une boîte flottante visible et dotée d’un contenu. (Voir « Insertion de boîtes flottantes dans la page », page 82 et « Ajout de contenu à une boîte flottante », page 83.) Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Choisissez Action > Multimedia > Suivre la souris et sélectionnez la boîte flottante dans le menu contextuel Boîte flottante. Comment utiliser l'aide | Sommaire | Index Page précédente 269 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 270 Déplacer sur l’axe L’action Déplacer sur l’axe permet de déplacer une boîte flottante sur l’axe horizontal, vertical ou selon une distance définie par l’utilisateur. Avant de créer une telle action, assurez-vous que la page contient une boîte flottante visible et dotée d’un contenu. (Voir « Insertion de boîtes flottantes dans la page », page 82 et « Ajout de contenu à une boîte flottante », page 83.) Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Multimedia > Déplacer sur l’axe et sélectionnez dans le menu contextuel Boîte flottante la boîte que vous souhaitez déplacer. Saisissez des valeurs dans les zones de texte Delta X et Delta Y. (Delta X représente la distance en pixels sur laquelle la boîte flottante est déplacée vers la droite et Delta Y correspond à la distance du déplacement vers le bas.) Pour extraire les valeurs d’une variable, cliquez sur la petite icône « C » rouge située en regard de la zone de texte Message. Lorsqu’elle prend la forme d’un cercle bleu , choisissez une variable dans le menu contextuel. Pour extraire le texte d’une action navigateur déclenchée par un événement d’en-tête OnCall, cliquez une nouvelle fois sur cette icône. Lorsqu’elle prend la forme d’un point d’interrogation , sélectionnez une action dans le menu contextuel. Déplacer comme action L’action Déplacer comme action permet de modifier la position d’une boîte flottante sur la page. Avant de créer une telle action, assurez-vous que la page contient une boîte flottante visible et dotée d’un contenu. (Voir « Insertion de boîtes flottantes dans la page », page 82 et « Ajout de contenu à une boîte flottante », page 83.) Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Multimedia > Déplacer comme action et sélectionnez dans le menu contextuel Boîte flottante la boîte que vous souhaitez déplacer. Saisissez des valeurs dans les zones de texte Pos. (correspondant respectivement à la distance en pixels du déplacement de la boîte flottante vers la droite et vers le bas) ou positionnez la boîte flottante à l’emplacement voulu et cliquez sur Get. Pour extraire les valeurs d’une variable, cliquez sur la petite icône « C » rouge située en regard de la zone de texte Message. Lorsqu’elle prend la forme d’un cercle bleu , choisissez une variable dans le menu contextuel. Pour extraire le texte d’une action navigateur déclenchée par un événement d’en-tête OnCall, cliquez une nouvelle fois sur cette icône. Lorsqu’elle prend la forme d’un point d’interrogation , sélectionnez une action dans le menu contextuel. Pour faire glisser la boîte flottante vers le nouvel emplacement, sélectionnez l’option Animation et saisissez un nombre entier positif dans la zone de texte /60 pour définir la vitesse de l’animation. La fraction en question équivaut à 1/60 de seconde. Plus le nombre de graduations est élevé, plus le déplacement s’effectue lentement. Lorsque l’option Animation n’est pas activée, la boîte flottante apparaît instantanément au nouvel emplacement défini lorsque l’action est déclenchée. Comment utiliser l'aide | Sommaire | Index Page précédente 270 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 271 Lire une scène et Arrêter une scène Les actions Lire une scène et Arrêter une scène permettent de gérer la lecture d’animations à scène unique ou à plusieurs scènes créées à l’aide de l’éditeur de montage DHTML. Vous pouvez contrôler les animations à plusieurs scènes de manière dynamique. Pour ce faire, insérez des actions de montage Lire une scène et Arrêter une scène. Une autre solution consiste à laisser à l’internaute le soin de définir la lecture des scènes en cliquant sur des boutons de la page. Assurez-vous que la page contient une ou plusieurs scènes avant de configurer une action Lire une scène ou Arrêter une scène. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Multimedia > Lire une scène ou Arrêter une scène. Il est recommandé d’insérer une action Arrêter une scène préalablement à l’insertion d’une action Lire une scène ; elle permet d’arrêter la lecture de toute autre animation lorsque l’internaute clique sur le bouton de lecture.) Pour configurer une action Arrêter une scène ou Lire une scène, choisissez dans le menu contextuel Scène la scène que vous souhaitez lire ou arrêter via le navigateur. Lire une séquence sonore et Arrêter séquence sonore Les actions Lire une séquence sonore et Arrêter séquence sonore permettent de gérer la lecture d’un module externe audio sur une page. Vous pouvez contrôler les sons de manière dynamique. Pour ce faire, insérez des actions de montage Lire une séquence sonore et Arrêter séquence sonore. Une autre solution consiste à laisser à l’internaute le soin de définir la lecture des sons en cliquant sur des boutons de la page. Remarque : L’action Lire une séquence sonore suppose que vous disposiez d’un module externe audio multiplate-forme, compatible avec différents navigateurs et pouvant être contrôlé par un script JavaScript, tel que LiveAudio. Assurez-vous que la page dispose d’un module externe audio et que celui-ci est nommé sur le panneau Avancé de l’inspecteur. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Multimedia > Lire une séquence sonore ou Arrêter séquence sonore. Il est recommandé d’insérer une action Arrêter séquence sonore préalablement à l’insertion d’une action Lire une séquence sonore ; elle permet d’arrêter la lecture de toute piste sonore lorsque l’internaute clique sur le bouton de lecture.) Pour configurer une action Lire une séquence sonore ou Arrêter séquence sonore, choisissez dans le menu contextuel Nom le son que vous souhaitez lire ou arrêter. Afficher/Masquer L’action Afficher/Masquer permet d’afficher ou de masquer le contenu d’une boîte flottante dans la page. Par exemple, vous pouvez utiliser cette action pour créer des menus contextuels qui apparaissent lorsque l’internaute clique sur un élément de menu et disparaissent lorsque le pointeur de la souris est éloigné de l’élément. Vous pouvez également afficher ou masquer des objets de manière dynamique en insérant deux images-clés dans l’éditeur de montage DHTML, puis en ajoutant des actions Afficher/ Masquer à la piste temporelle de la boîte flottante. Comment utiliser l'aide | Sommaire | Index Page précédente 271 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 272 Avant de créer une telle action, assurez-vous que la page contient une boîte flottante visible et dotée d’un contenu. Si vous souhaitez que la boîte flottante n’apparaisse que lorsqu’elle est appelée par une action Afficher/Masquer, désactivez l’option Visible dans l’inspecteur de la boîte flottante. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Multimedia > Afficher/Masquer et sélectionnez une boîte flottante dans le menu Boîte flottante. Dans le menu Mode, spécifiez l’opération à appliquer à la boîte flottante : • L’option Masquer masque la boîte flottante jusqu’à ce qu’une action d’affichage soit exécutée. • L’option Afficher affiche la boîte flottante jusqu’à ce qu’une action de masquage soit exécutée. • L’option Afficher/Masquer affiche ou masque la boîte flottante, selon l’état d’affichage actif. Projeter un diaporama et Projeter diaporama auto Les actions Projeter un diaporama et Projeter diaporama auto permettent de gérer la lecture d’une série d’images. L’action Projeter un diaporama permet aux internautes de passer en revue une série d’images en cliquant sur un lien. Chaque clic affiche l’image suivante. L’action Projeter diaporama auto affiche automatiquement une série d’images en respectant un intervalle de temps spécifique entre les images (à l’instar d’un fichier GIF animé). Les règles suivantes s’appliquent aux images utilisées pour des actions Projeter un diaporama et Projeter diaporama auto : • Les images doivent se trouver dans le même dossier que la première image placée sur la page. • Il peut s’agir indifféremment d’images GIF ou JPEG, à condition que les images d’un diaporama soient toutes du même format (GIF ou JPEG). • Les images doivent être nommées de manière consécutive, en se terminant par 01 et par l’extension .gif ou .jpg. Par exemple, si l’image GIF de base est intitulée poster01.gif, les suivantes seront nommées poster02.gif, poster03.gif, et ainsi de suite. Une autre méthode consiste à nommer simplement les images 01.gif, 02.gif, 03.gif, et ainsi de suite. • Vous ne pouvez pas configurer plusieurs actions Projeter un diaporama et Projeter diaporama auto sur la même page. Insérez sur la page la première image du diaporama, puis saisissez un nom alphanumérique unique dans le panneau Avancé de l’inspecteur de l’image. Vous pouvez déclencher l’action Projeter un diaporama à l’aide d’un événement utilisateur ou de montage ou l’action Projeter diaporama auto à l’aide d’un événement utilisateur, de montage ou d’un événement navigateur OnLoad. Choisissez Action > Multimedia > Projeter un diaporama ou Projeter diaporama auto. Choisissez la première image dans le menu Image de base et spécifiez le nombre total d’images du diaporama dans la zone prévue à cet effet. Comment utiliser l'aide | Sommaire | Index Page précédente 272 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 273 Si vous configurez une action Projeter un diaporama, effectuez une sélection parmi les options de lecture suivantes : • L’option Boucle permet de recommencer le diaporama aussitôt que la dernière image est apparue. • L’option Arrière permet d’afficher les images dans l’ordre inverse. Elle vous donne la possibilité de créer des liens vers l’avant et vers l’arrière du diaporama. • L’option Palindrome permet de lire le diaporama en avant, puis en arrière, de façon continue. Cette option n’est disponible que si vous activez l’option Boucle en même temps. Si vous ne sélectionnez aucune de ces trois options, le diaporama est lu une seule fois. Si vous configurez une action Projeter diaporama auto, effectuez une sélection parmi les options de lecture suivantes : • Dans la zone Intervalle (en secondes), indiquez le nombre de secondes devant s’écouler entre les images. • Cochez la case Arrêter à la fin du diaporama afin de lire le diaporama une seule fois, et éviter qu’il ne défile en continu. Généralement, toutes les images sont affichées aux dimensions de l’image de base. Pour changer les dimensions d’une image, modifiez les options de hauteur et de largeur de l’image de base (Image plutôt que Pixel) dans l’inspecteur de l’image. Arrêter diaporama auto L’action Arrêter diaporama auto est complémentaire à l’action Projeter diaporama auto. Elle permet aux internautes d’interrompre ou de poursuivre la visualisation d’un diaporama automatique. Par exemple, pour créer un bouton « pause », il vous suffit d’appliquer cette action à un bouton situé sur la même page que le diaporama automatique. Vous pouvez uniquement utiliser cette action sur une page à laquelle l’action Projeter diaporama auto est également appliquée. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur. Choisissez Action > Multimedia > Arrêter diaporama auto Arrêter tout L’action Arrêter tout permet d’arrêter toute animation en cours dans la fenêtre du navigateur. Par égard pour les internautes disposant de connexions lentes, pensez à inclure un bouton d’arrêt de l’animation dans les pages animées que vous créez. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur. Choisissez Action > Multimedia > Arrêter tout. Créer un fondu L’action Créer un fondu permet de révéler ou de masquer progressivement le contenu d’une boîte flottante en appliquant un effet de fondu. Comment utiliser l'aide | Sommaire | Index Page précédente 273 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 274 Avant de créer une telle action, assurez-vous que la page contient une boîte flottante visible et dotée d’un contenu. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Multimedia > Créer un fondu et sélectionnez une boîte flottante dans le menu Boîte flottante. Choisissez une option dans le menu Transition afin de déterminer le type d’apparition/de disparition de la boîte flottante. Saisissez un nombre entier positif dans la zone de texte Progression afin de déterminer la vitesse de la transition. Plus le nombre est élevé, plus la transition est progressive. Divers Le menu Divers comporte des actions permettant d’afficher des horloges, de définir les propriétés de la fenêtre du navigateur, d’imprimer une page, de définir la couleur de fond de la page, d’afficher les résultats de recherches menées par un moteur de recherche, ou de résoudre des problèmes de feuilles de style dans Netscape ou relatifs aux boîtes flottantes. Afficher date courante (ID) L’action Afficher date courante (ID) permet d’afficher une horloge textuelle dynamique indiquant la date locale, l’heure locale ou les deux. Cette horloge fait appel à l’horloge système de l’internaute afin de déterminer l’heure et la date locale. L’horloge peut remplacer une balise d’emplacement située sur la page ou être affichée dans une boîte flottante ou dans une cellule de tableau. Si l’action est appliquée à du texte ou au contenu d’une cellule de tableau, il doit faire appel à un style ID. (Voir « Création de styles ID », page 142 et « Application de styles », page 153.) Important : Cette action fonctionne avec les navigateurs Internet Explorer 5 (et versions ultérieures) et Netscape 6 (et versions ultérieures). Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad. Choisissez Action > Divers > Afficher date courante (ID). Si vous souhaitez que l’horloge apparaisse à l’intérieur d’une boîte flottante, choisissez dans le menu Calque le nom de cette boîte flottante. (Tout le contenu de la boîte flottante sera remplacé par l’horloge.) Si vous préférez qu’elle remplace du texte ou le contenu d’une cellule de tableau, saisissez le nom du style ID utilisé (sans inclure le symbole #) dans la zone de texte ID de l’élément. Sélectionnez Afficher heure locale si vous souhaitez afficher l’heure. Sélectionnez l’option Utiliser le format horaire en 24 heures ou non, selon que vous souhaitez afficher l’heure en 24 ou 12 heures (où AM et PM correspondent respectivement aux heures du matin et de l'après-midi). Pour afficher la date locale, sélectionnez Afficher la date et choisissez un format de date numérique dans le menu contextuel. Pour afficher le jour de la semaine avant la date numérique, sélectionnez l’option Inclure le jour de la semaine. Dans la zone de texte Texte avant, saisissez le texte que vous souhaitez placer avant la date. (N’oubliez pas de précéder toute apostrophe d’une barre oblique inverse afin d’éviter que des erreurs JavaScript ne se produisent.) Pour personnaliser le formatage du texte de la date, saisissez dans la zone de texte <open> une balise ouvrante HTML dotée des attributs voulus et la balise fermante HTML correspondante dans la zone de texte </close>. Par exemple, pour afficher le texte dans une police verte d’un corps de 5, saisissez Comment utiliser l'aide | Sommaire | Index Page précédente 274 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 275 <font color="green" size="5"> dans la zone de texte <open> et </font> dans la zone de texte </close>. Afficher l’heure actuelle L’action Afficher l’heure actuelle permet d’afficher une horloge dynamique indiquant l’heure locale à l’aide d’images que vous spécifiez. Cette horloge fait appel à l’horloge système de l’internaute afin de déterminer l’heure locale. Créez dix images différentes destinées à représenter les chiffres 0 à 9, puis placez-les dans un même dossier. Ces images doivent toutes être au format GIF ou JPEG (il est impossible de combiner les formats) et nommées 0.gif, 1.gif, 2.gif, etc. ou 0.jpg, 1.jpg, 2.jpg, etc. Insérez sur votre page quatre images à utiliser comme balises d’emplacement pour les chiffres de l’horloge. Dans le panneau Avancé de l’inspecteur de l’image, saisissez un nom unique pour chaque balise d’emplacement d’image. Généralement, toutes les images sont affichées aux dimensions de l’image de base. Pour changer les dimensions d’une image, modifiez les options de hauteur et de largeur de l’image de base (Image plutôt que Pixel) dans l’inspecteur de l’image. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad. Choisissez Action > Divers > Afficher l’heure actuelle et sélectionnez un nom d’image dans chaque menu Chiffre afin d’associer une image à chaque chiffre de l’horloge. Sélectionnez l’option Utiliser le format horaire en 24 heures ou non, selon que vous souhaitez afficher l’heure en 24 ou 12 heures (où AM et PM correspondent respectivement aux heures du matin et de l’après-midi). Pour identifier le répertoire d’images de l’horloge, référencez l’une des dix images associées aux chiffres de l’horloge. Conserver Netscape CSS L’action Conserver Netscape CSS permet de résoudre un type d’erreur d’application survenant dans Netscape Navigator et causant la perte d’informations CSS contenues dans les pages Web lorsque l’internaute redimensionne la fenêtre de son navigateur. Vous pouvez insérer cette action sur toute page dotée de boîtes flottantes, ces dernières étant constituées à l’aide de feuilles de style en cascade. Vous pouvez déclencher ce type d’action à l’aide du navigateur en lui associant un événement OnLoad dans la section d’en-tête de la page. Choisissez Action > Divers > Conserver Netscape CSS. Testez vos animations ou vos actions dans Netscape Navigator 4.0. Remarque : Dans le cas de jeux de cadres, veillez à insérer l’action dans la section d’entête de la page apparaissant à l’intérieur du cadre et non dans le jeu de cadres. Imprimer le document L’action Imprimer le document permet d’afficher la boîte de dialogue d’impression afin d’imprimer la page Web ou le cadre actifs. Cette action doit être insérée à l’intérieur de la page ou du cadre à imprimer et ne peut cibler une page ou un cadre différent. Comment utiliser l'aide | Sommaire | Index Page précédente 275 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 276 Vous pouvez déclencher cette action en insérant un événement utilisateur ou navigateur dans la page que vous souhaitez imprimer. Si la page fait partie d’un jeu de cadres, précisez le nom du cadre qui la contient. Remarque : Cette action fonctionne avec les navigateurs Netscape Navigator 4 (et versions ultérieures) et Internet Explorer 5 (et versions ultérieures). Redimensionner fenêtre L’action Redimensionner fenêtre permet de redimensionner la fenêtre du navigateur. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Divers > Redimensionner fenêtre et spécifiez les largeur et hauteur en pixels dans les zones de texte correspondantes. Défiler vers la gauche, Défiler vers le haut, Défiler vers la droite et Défiler vers le bas Les actions Défiler vers la gauche, Défiler vers le haut, Défiler vers la droite et Défiler vers le bas permettent de faire défiler la fenêtre du navigateur de manière dynamique. Vous pouvez, par exemple, utiliser ce type d’action pour permettre à l’internaute de suivre la trajectoire d’une boîte flottante qui se déplace en dehors des limites de la fenêtre. Vous pouvez déclencher ces actions à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Divers > Défiler vers le bas, Défiler vers la gauche, Défiler vers la droite ou Défiler vers le haut, puis saisissez une valeur dans la zone Distance (pixels) afin de spécifier la distance selon laquelle la fenêtre devra défiler. Saisissez une valeur (en pixels) dans la zone de texte Vitesse pour définir la vitesse de défilement de la fenêtre. (Plus cette valeur est élevée, plus le défilement est rapide.) Etat du défilement L’action Etat du défilement permet de faire défiler horizontalement un message de texte sur la barre d’état située au bas de la fenêtre du navigateur. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Choisissez Action > Divers > Etat du défilement et saisissez le message dans le champ prévu à cet effet. (N’oubliez pas de précéder toute apostrophe d’une barre oblique inverse afin d’éviter que des erreurs JavaScript ne se produisent.) Saisissez une valeur comprise entre 1 et 1 000 pour définir la vitesse du défilement (où 1 correspond à la vitesse maximale et 1 000 à la vitesse minimale). Sélectionnez l’option Inverser le défilement (de gauche à droite) pour faire défiler le texte en continu de la gauche vers la droite. Lorsque le texte atteint le bord droit de la fenêtre, le défilement reprend à partir du bord gauche. Désactivez cette option si vous souhaitez faire défiler le texte de la droite vers la gauche en une boucle sans fin. Moteur de recherche L’action Moteur de recherche utilise une chaîne de texte de recherche prédéfinie ou le texte saisi par un utilisateur dans un formulaire, puis ouvre une nouvelle fenêtre de navigateur contenant les résultats de la recherche. Comment utiliser l'aide | Sommaire | Index Page précédente 276 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 277 Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Les événements utilisateur peuvent être associés à des objets de formulaires, boutons d’envoi ou événements de formulaires. (Si votre action prévoit d’extraire une saisie utilisateur d’un formulaire, vous devez tout d’abord créer le formulaire, le nommer, puis choisir un déclencheur.) Si elle est associée à un champ de texte, utilisez le déclencheur Champ inactif ; si elle est associée à une zone de texte, optez pour le déclencheur Texte modifié. Choisissez Action > Divers > Moteur de recherche, puis effectuez l’une des opérations suivantes : • Pour utiliser une chaîne de recherche prédéfinie, laissez les champs Nom du formulaire et Nom du champ vides. Sélectionnez l’option Définir votre propre chaîne de recherche et saisissez une chaîne de texte en insérant un signe (+) entre chaque mot. • Pour extraire une saisie utilisateur d’un formulaire, saisissez le nom du formulaire, puis le nom du champ contenant la chaîne de recherche. Assurez-vous que l’option Définir votre propre chaîne de recherche n’est pas sélectionnée. Choisissez un moteur de recherche dans le menu Utiliser ce moteur de recherche. Si vous souhaitez afficher les résultats de la recherche à l’intérieur d’une fenêtre ou d’un cadre existants, saisissez le nom de la fenêtre ou du cadre voulus. Pour afficher les résultats issus de multiples moteurs de recherches, ajoutez autant d’actions Moteur de recherche que vous le souhaitez. Si votre première action Moteur de recherche utilise un déclencheur utilisateur, associez aux suivantes le même déclencheur. Définir couleur de fond L’action Définir couleur de fond permet de changer la couleur de fond de la fenêtre du navigateur. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Divers > Définir couleur de fond, cliquez dans le champ Couleur de fond et sélectionnez une couleur dans la palette de couleurs. Afficher heure locale L’action Afficher heure locale permet d’afficher une horloge dynamique indiquant l’heure pour un fuseau horaire donné. Vous pouvez choisir d’afficher l’horloge dans la barre d’état du navigateur ou dans un champ de formulaire sur la page (ou les deux). Important : Pour que votre soit horloge précise, il est indispensable que l’heure indiquée pour le fuseau horaire sur votre système local soit correcte. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad ou utilisateur. Choisissez Action > Divers > Afficher heure locale. Si vous souhaitez afficher un message à gauche de l’horloge, saisissez-le dans la zone de texte Message de l’horloge. (N’oubliez pas de précéder toute apostrophe d’une barre oblique inverse afin d’éviter que des erreurs JavaScript ne se produisent.) Sélectionnez l’option Utiliser le format horaire en 24 heures ou non, selon que vous souhaitez afficher l’heure en 24 ou 12 heures (où AM et PM correspondent respectivement aux heures du matin et de l’après-midi). Comment utiliser l'aide | Sommaire | Index Page précédente 277 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 278 Dans la zone Décalage GMT, saisissez une valeur comprise entre -12 et +12 pour préciser le nombre d’heures de décalage séparant l’heure du lieu choisi et l’heure GMT (Greenwich Mean Time). Cliquez sur l’icône de globe située en regard du champ de texte Décalage GMT pour consulter les valeurs de décalage de villes spécifiques. Lorsque vous cliquez sur ce bouton, le navigateur défini par défaut s’ouvre à l’adresse suivante pour afficher une présentation des différents fuseaux horaires : http://www.timeanddate.com/worldclock/. Cliquez sur une ville pour consulter la valeur du décalage GMT correspondante. GMT correspond à la valeur pivot nulle : toutes les zones situées à l’ouest de GMT sont dotées d’une valeur de décalage négative et celles situées à l’est d’une valeur positive. Par exemple, l’heure d’hiver des Etats-Unis (EST), qui est située à cinq fuseaux horaires à l’ouest de GMT, est dotée d’une valeur de décalage GMT de -5 ; celle d’Europe centrale (CET), située à un fuseau horaire à l’est de GMT, est dotée d’une valeur de décalage GMT de +1. Sélectionnez l’option Heure d’été si la zone sélectionnée respecte les changements d’heure. Activez l’option Barre d’état pour afficher l’horloge dans la barre d’état du navigateur et l’option Champ de formulaire pour l’afficher dans un formulaire existant sur la page. Si vous optez pour cette deuxième option, vous devez spécifier le nom du formulaire et le nom du champ de texte destiné à recevoir l’horloge. Spécial Le menu Spécial comporte des actions permettant de gérer ou d’interagir avec d’autre actions dans une page, ou encore d’extraire des valeurs d’une autre page. Grouper des actions L’action Grouper des actions permet de rassembler des actions et de les exécuter ensemble. Cette action s’avère extrêmement pratique dans le cas de la piste des actions de l’éditeur de montage. Cela dit, vous pouvez également l’utiliser avec des boutons ou des liens de texte si vous préférez laisser l’internaute choisir d’exécuter ou non la séquence d’actions. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Dans l’inspecteur de l’action, choisissez Action > Spécial > Grouper des actions. Cliquez sur le bouton Nouvel élément , choisissez une action dans le menu contextuel Action, puis définissez ses options. Vous pouvez continuer à ajouter des actions à la liste d’actions jusqu’à ce que vous ayez ajouté toutes les actions voulues au groupe d’actions. Appeler une action L’action Appeler une action déclenche une autre action située sur la page. Pour que cette action fonctionne, l’action associée doit être dotée du déclencheur OnCall (voir « Configuration d’actions déclenchées par le navigateur », page 251). Grâce à elle, votre utilisation d’actions est plus flexible et leur gestion plus simple. Par exemple, si votre page comporte un bouton et un lien de texte renvoyant au même URL, vous pouvez définir une action Atteindre le lien, l’associer à un déclencheur OnCall dans la section d’en-tête, puis la déclencher à l’aide d’une action Appeler une action appliquée à la fois au bouton et au lien. Si, par la suite, vous décidez de modifier l’URL auquel renvoient les deux options, il vous suffira pour ce faire de modifier l’action Atteindre le lien. Comment utiliser l'aide | Sommaire | Index Page précédente 278 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 279 Assurez-vous de définir au moins une action OnCall sur la page. Vous pouvez déclencher cette action à l’aide d’un événement utilisateur ou de montage. Choisissez Action > Spécial > Appeler une action et sélectionnez une action dans le menu contextuel. Appeler une fonction L’action Appeler une fonction appelle une fonction insérée dans la section d’en-tête de la page. Assurez-vous de définir au moins une fonction dans la section d’en-tête de la page. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad. Choisissez Action > Spécial > Appeler une fonction, sélectionnez une fonction dans le menu contextuel Fonction et saisissez une liste d’arguments de fonctions séparés par des virgules dans la zone de texte Arguments. Remarque : Les appels JavaScript reposant sur des actions facilitent la création de nouvelles actions pour les développeurs de scripts JavaScript. Détecter et déclencher L’action Détecter et déclencher contrôle la fenêtre du navigateur afin de détecter l’occurrence ou l’absence d’occurrence d’un événement. De plus, elle déclenche une action différente selon que la condition spécifiée est vraie (true) ou fausse (false). Vous pouvez choisir parmi les quatre conditions suivantes : Détecter l’intersection, Associer à une touche, Programmer modification et Tester la variable (Voir « Détecter l’intersection », page 280, « Associer à une touche », page 280, « Programmer modification », page 281 et « Tester la variable », page 284.) Pour contrôler plusieurs occurrences d’un événement au cours d’une session, configurez une action Attendre et déclencher. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad ou utilisateur. Choisissez Action > Spécial > Détecter et déclencher et sélectionnez l’une des quatre conditions proposées dans le menu Action > Spécial ou Action > Variables du panneau Condition de l’inspecteur de l’action. Spécifiez dans le panneau TRUE l’action à exécuter lorsque la condition indiquée est vraie (true) et dans le panneau False celle exécutée lorsque la condition s’avère fausse (false). Prenons un exemple : si votre page contient une image, vous pouvez utiliser l’action Permuter des images (voir « Permuter des images », page 258) pour changer le contenu de l’image en fonction du résultat de cette action. Attendre et déclencher L’action Attendre et déclencher insère un script permettant de gérer la fenêtre du navigateur et de répondre à une condition spécifique. Elle déclenche également d’autres actions, suivant l’état de la condition (vraie ou fausse). Vous pouvez choisir parmi les quatre conditions suivantes : Détecter l’intersection, Associer à une touche, Programmer modification et Tester la variable. (Voir « Détecter l’intersection », page 280, « Associer à une touche », page 280, « Programmer modification », page 281 et « Tester la variable », page 284.) En pratique, ces actions sont conçues pour la section d’en-tête d’une page, étant donné que les conditions sont contrôlées automatiquement. Comment utiliser l'aide | Sommaire | Index Page précédente 279 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 280 Détecter l’intersection Cette action est conçue pour fonctionner avec l’action Attendre et déclencher ou Détecter et déclencher, lesquelles doivent être insérées dans la section d’en-tête et déclenchées à l’aide d’événements navigateur. La condition Détecter l’intersection contrôle la fenêtre du navigateur afin de repérer l’intersection physique de deux boîtes flottantes. Elle est définie comme vraie (true) lorsque les boîtes flottantes se chevauchent dans la fenêtre du navigateur et comme fausse (false) dans le cas contraire. Le résultat de cette action peut très bien servir à déclencher deux actions supplémentaires. Cette action complète l’action Déplacer boîte flottante (voir « Déplacer boîte flottante », page 268). Une intersection se produit lorsque les trajectoires de deux boîtes flottantes se coupent. Vous avez la possibilité de relier l’action Détecter l’intersection à une action Définir couleur de fond, par exemple. Vous pouvez déclencher une telle action à l’aide d’un événement navigateur OnLoad. Choisissez Action > Spécial > Attendre et déclencher ou Détecter et déclencher, puis Action > Spécial > Détecter l’intersection dans le panneau Condition de l’inspecteur de l’action. S’il s’agit d’une action Attendre et déclencher et que celle-ci doit prendre fin la première fois que la condition (Détecter l’intersection ou Programmer modification) est vraie (true), sélectionnez l’option Quitter le mode attente si la condition est vraie. Lorsque cette option est activée, le script contrôle la fenêtre du navigateur afin de détecter un événement unique. Sélectionnez les boîtes flottantes dont vous souhaitez contrôler les intersections à partir des deux menus contextuels Boîte flottante. Dans le panneau TRUE, sélectionnez l’action à déclencher lors de la détection d’une intersection. Dans le panneau FALSE, sélectionnez celle à exécuter lorsque les boîtes flottantes ne se chevauchent pas. Associer à une touche L’action Associer à une touche lance une action dès que l’internaute appuie sur une touche donnée. Cette action est conçue pour fonctionner avec l’action Attendre et déclencher, laquelle doit être insérée dans la section d’en-tête de la page et déclenchée à l’aide d’un événement navigateur. Vous pouvez l’utiliser, par exemple, pour simuler des touches d’accès de type Windows afin d’accéder à des objets contenus dans votre page. Vous pouvez déclencher une telle action à l’aide d’un événement navigateur OnLoad. Choisissez Action > Spécial > Attendre et déclencher, puis Action > Spécial > Associer à une touche dans le panneau Condition de l’inspecteur de l’action. Saisissez le code de caractères ASCII correspondant à la touche voulue dans la zone de texte Code ASCII du caractère. Dans le panneau TRUE, sélectionnez l’action que la touche doit déclencher. Revenez à la page et ajoutez une indication visuelle destinée à l’internaute (une instruction telle que « Appuyez sur la touche K », par exemple). Important : Ne spécifiez pas d’action dans le panneau FALSE. En effet, si vous spécifiez une action dans ce panneau, celle-ci sera déclenchée avant que l’utilisateur ait le temps d’enfoncer une touche pour déclencher la condition vraie (true). Comment utiliser l'aide | Sommaire | Index Page précédente 280 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 281 Programmer modification L’action Programmer modification est une combinaison de changement d’état et de délai. Elle vous permet de spécifier un intervalle de temps après lequel le navigateur doit changer d’état. Cette action est conçue pour fonctionner avec l’action Attendre et déclencher, laquelle doit être insérée dans la section d’en-tête de la page et déclenchée à l’aide d’un événement navigateur. La condition qu’elle contrôle est définie comme fausse (false) pendant la durée de l’intervalle et comme vraie (true) à la fin du délai. Chaque état dispose de sa propre action. Ce type d’action permet d’intégrer un changement d’état défini de manière temporelle dans la fenêtre du navigateur (en vue de modifier le contenu d’une image de bannière, par exemple). Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad. Dans l’inspecteur de l’action d’en-tête, choisissez Action > Spécial > Attendre et déclencher, puis Action > Spécial > Programmer modification dans le panneau Condition de l’inspecteur de l’action. Pour que l’action s’arrête la première fois que la condition de délai (Programmer modification) est vraie (true), sélectionnez l’option Quitter le mode attende si la condition est vraie. En effet, lorsque cette option est activée, le navigateur change d’état une seule fois. Précisez un intervalle en secondes dans la zone de texte Délai (s). Dans le panneau TRUE, choisissez l’action à déclencher lorsque le délai d’attente est écoulé. Par exemple, l’action Programmer modification peut déclencher une action Permuter des images (voir « Permuter des images »), qui indique au navigateur de changer le contenu d’une image. Dans le panneau FALSE, choisissez l’action à exécuter pendant le délai d’attente. Dans l’exemple ci-avant, il faudrait faire appel à une deuxième action Permuter des images qui fournirait l’image de remplacement. Variables GoLive comprend un jeu d’actions permettant de faire appel à des variables. Les variables peuvent servir de données d’entrée pour d’autres actions de scripts, remplaçant des paramètres que vous configureriez dans l’inspecteur. Il existe deux cas de figure dans lesquels vous voudrez affecter en cours d’exécution des valeurs à des variables que vous définissez à l’aide de l’action Définir une variable : • Vous souhaitez utiliser des variables comme pseudo-constantes afin de spécifier une valeur fixe pour une autre action. • Vous souhaitez stocker de manière dynamique des propriétés d’objets dans des variables et définir un cookie à enregistrer sur le disque dur de l’internaute. Vous pouvez utiliser cette méthode pour stocker les propriétés de la fenêtre du navigateur, telles que la couleur de fond par exemple. Pour utiliser une variable dans une page, vous devez tout d’abord déclarer cette variable à l’aide de l’action Déclarer la variable. Ensuite, il est conseillé de l’initialiser à l’aide de l’action Initialiser une variable. Déclarer la variable Pour utiliser une variable dans une page, vous devez tout d’abord déclarer cette variable à l’aide de l’action Déclarer la variable. Comment utiliser l'aide | Sommaire | Index Page précédente 281 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 282 Vous pouvez déclencher ce type d’action à l’aide du navigateur en lui associant un événement OnParse dans la section d’en-tête de la page. Choisissez Action > Variables > Déclarer la variable. Saisissez un nom unique dans la zone de texte Nom. Choisissez un type de données approprié dans le menu Type : Variable booléenne Permet de définir tout état actif/inactif. Entier Permet de définir toute valeur entière. Virgule flottante Permet de définir toute valeur de virgule flottante. Chaîne Permet de définir toute valeur de type chaîne. Calque Permet de définir toute boîte flottante contenue dans la page active. Position du calque Permet de définir l’emplacement d’une boîte flottante dans la page active. Image Permet de définir toute image contenue dans la page active. URL Permet de définir tout URL contenu dans la page active. Couleur Permet de définir toute couleur contenue dans la page active. Scène Permet de définir toute scène contenue dans la page active. Action OnCall Permet de définir toute action contenue dans la section d’en-tête de la page dont le déclencheur est OnCall. Fonction Permet de définir toute fonction déclarée dans la section d’en-tête de la page. La zone de texte Cookie permet de saisir le nom du cookie dans lequel vous souhaitez stocker la valeur de la variable sur le disque dur de l’internaute. Les actions Ecrire un cookie et Lire un cookie vous permettent ensuite respectivement de définir le cookie et de lire son contenu. Supprimer le cookie L’action Supprimer le cookie est associée à l’action Créer cookie d’accueil. Elle permet de supprimer un cookie existant en saisissant simplement son nom. Cette option s’avère pratique pour tester l’action Créer cookie d’accueil. Vous pouvez ainsi atteindre une certaine page la première fois que vous testez l’action Créer cookie d’accueil, puis une page différente lors des visites suivantes. En utilisant l’action Supprimer le cookie, vous pouvez changer la page initiale tout en conservant la possibilité de la consulter à nouveau. Vous pouvez déclencher ce type d’action à l’aide d’un événement navigateur OnLoad inséré dans la section d’en-tête de la page ou d’un événement utilisateur. Choisissez Action > Variables > Supprimer le cookie et spécifiez le nom du cookie à supprimer dans la zone Nom du cookie. Initialiser une variable Après avoir déclaré une variable, il est conseillé de l’initialiser à l’aide de l’action Initialiser une variable. Vous pouvez déclencher ce type d’action à l’aide du navigateur en lui associant un événement OnParse dans la section d’en-tête de la page. Choisissez Action > Variables > Initialiser une variable et sélectionnez la variable que vous souhaitez initialiser dans le menu Variables. (La variable doit être déclarée au préalable pour que son nom figure dans le menu contextuel.) Comment utiliser l'aide | Sommaire | Index Page précédente 282 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 283 L’élément Valeur change automatiquement en fonction du type de variable sélectionné. Utilisez l’option appropriée pour fournir une valeur initiale : Variable booléenne Case à cocher (activée correspond à « true » et désactivée à « false ») Entier Zone de texte acceptant uniquement les nombres entiers Virgule flottante Zone de texte acceptant les valeurs décimales Chaîne Zone de texte acceptant toute chaîne de texte Calque Menu contextuel affichant toutes les boîtes flottantes de la page. Position du calque Deux zones de texte x et y conçues pour la position d’une boîte flottante et un bouton Get lisant la position actuelle. Image Menu contextuel répertoriant les images nommées dans la page active. URL Combinaison standard de zone de texte, bouton Parcourir et bouton d’affectation permettant de spécifier des URL. Couleur Champ de couleur permettant d’afficher la palette de couleurs lorsque l’internaute clique dessus. Scènes Menu contextuel répertoriant toutes les scènes contenues dans la page active. Action OnCall Menu contextuel répertoriant toutes les actions de la section d’en-tête dont le déclencheur est OnCall. Fonctions Menu contextuel répertoriant toutes les déclarations de fonctions de la section d’en-tête de la page active. Lire un cookie L’action Lire un cookie récupère des informations stockées dans un cookie pendant l’exécution et écrit la valeur du cookie dans toutes les variables qui lui sont associées. Le cookie peut être lu lors du chargement de la page ou lorsque l’internaute clique sur un élément de la page. Pour configurer le navigateur de manière qu’il lise le cookie lors du chargement de la page, insérez dans la section d’en-tête de cette page une action navigateur associée à un événement OnLoad. Pour configurer le navigateur de manière qu’il lise le cookie lorsque l’internaute clique sur un élément spécifique de la page, déclenchez l’action à l’aide d’un événement utilisateur. Choisissez Action > Variables > Lire le cookie. Dans la zone de texte Nom, saisissez le nom du cookie spécifié dans l’action Ecrire un cookie. Définir une variable Il se peut que vous souhaitiez attribuer une valeur à une variable en cours d’exécution. Vous pouvez déclencher ce type d’action à l’aide d’un événement navigateur OnLoad inséré dans la section d’en-tête de la page ou d’un événement utilisateur. Choisissez Action > Variables > Définir une variable et saisissez un nom unique pour l’action Définir une variable dans la zone de texte Nom. Choisissez la variable par rapport à laquelle vous souhaitez comparer votre variable dans le menu contextuel Variables. L’élément Valeur change automatiquement en fonction du type de variable sélectionné. Utilisez l’option appropriée pour définir la valeur initiale, comme décrit dans la section traitant de l’initialisation des variables. (Voir « Initialiser une variable », page 282.) Comment utiliser l'aide | Sommaire | Index Page précédente 283 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 284 Tester la variable L’action Tester la variable est une extension de l’action Attendre et déclencher qui vous permet de lire la valeur d’une variable en cours d’exécution et de la comparer à une autre valeur (que vous indiquez). Cette comparaison est définie comme vraie ou fausse (« true » ou « false ») et le résultat peut vous servir à déclencher deux types d’actions différents. Vous pouvez déclencher ce type d’action à l’aide du navigateur en lui associant un événement OnLoad dans la section d’en-tête de la page. Dans l’inspecteur de l’action d’en-tête, choisissez Action > Spécial > Attendre et déclencher, puis Action > Variables > Tester la variable dans le panneau Condition de l’inspecteur de l’action. Choisissez la variable par rapport à laquelle vous souhaitez comparer votre variable dans le menu Variables. L’élément Valeur change automatiquement en fonction du type de variable sélectionné. Utilisez l’option appropriée pour définir la valeur par rapport à laquelle la variable doit être testée. Pour ce faire, consultez la section traitant de l’initialisation des variables. (Voir « Initialiser une variable », page 282.) Choisissez un type de comparaison dans le menu Opération. Remarque : Tous les opérateurs de comparaison ne fonctionnent pas avec tous les types de variables. Par exemple, l’utilisation conjointe de l’opérateur de supériorité « Sup. à » et d’une variable de type chaîne entraîne une erreur JavaScript dans le navigateur, car ce dernier attend une valeur numérique avec ce type d’opérateur. Compter les visites L’action Compter les visites permet d’afficher des messages personnalisés en fonction du nombre de visites de l’internaute. (Cette action utilise des cookies. Elle ne fonctionnera pas si la configuration du navigateur prévoit la désactivation des cookies.) Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad, d’un événement utilisateur ou de montage. Choisissez Action > Variables > Compter les visites et saisissez un message dans la zone de texte Message à afficher lors de la première visite. Pour afficher un message différent chaque fois que l’internaute revient sur cette page, sélectionnez l’option Afficher le message + nbre total de visites et rédigez votre message. (Le nombre de visites de l’internaute est indiqué en regard du message dans la fenêtre d’avertissement du navigateur.) Pour afficher un message supplémentaire après un nombre spécifique de visites, sélectionnez l’option Message facultatif, rédigez le message, puis précisez le nombre de visites. Saisissez un nom pour le cookie. Important : Si votre message renferme des apostrophes, précédez-les d’une barre oblique inverse. Si vous prévisualisez plusieurs fois une action dans un navigateur, il vous suffit de renommer le cookie avant de prévisualiser la page pour simuler le comportement du navigateur lors de la première visite de l’internaute. Comment utiliser l'aide | Sommaire | Index Page précédente 284 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 285 Créer cookie d’accueil L’action Créer cookie d’accueil permet de créer une page personnalisée destinée aux internautes qui consultent le site pour la première fois. La première fois qu’un internaute visite la page ou exécute un événement de souris particulier, cette action crée un cookie. Ce cookie est stocké sur l’ordinateur de l’internaute si le navigateur de ce dernier n’est pas configuré de manière à refuser les cookies. Lors des visites ou événements de souris suivants, l’internaute est redirigé vers une autre page. Vous pourriez très bien souhaiter que les nouveaux visiteurs de votre site atteignent une page spéciale contenant le message « Bienvenue », mais qu’ils tombent sur la page principale standard lors de leurs visites ultérieures. Vous pouvez déclencher cette action à l’aide d’un événement navigateur OnLoad ou utilisateur. Choisissez Action > Variables > Créer cookie d’accueil et saisissez un nom dans la zone de texte Nom du cookie. Dans la zone Après la première visite, rediriger vers, spécifiez la page à afficher la prochaine fois que l’internaute déclenche l’action. Ecrire un cookie L’action Ecrire un cookie permet de stocker temporairement la valeur d’une variable sur le disque dur de l’internaute. Grâce à cette fonction, vous avez la possibilité de créer des pages personnalisables, car l’utilisateur peut modifier les propriétés de la fenêtre de son navigateur et recharger une version personnalisée de la page par la suite. Vous pouvez déclencher ce type d’action à l’aide du navigateur en lui associant un événement OnLoad dans la section d’en-tête de la page. Choisissez Action > Spécial > Ecrire un cookie et saisissez le nom du cookie dans la zone de texte Nom. Ce nom sera utilisé lorsque l’action Ecrire un cookie définira le cookie au cours de l’exécution. Dans la zone de texte Expiration dans, saisissez une date d’expiration (exprimée en heures) afin de déterminer la durée du cookie à compter du moment de sa définition. Définissez les attributs facultatifs : • L’option Chemin permet de spécifier le sous-ensemble d’URL d’un domaine auquel s’applique un cookie. Si un cookie passe le test des domaines, alors le composant nom de chemin de l’URL est comparé à l’attribut de chemin. S’il existe une correspondance, le cookie est considéré comme valable et est envoyé avec la requête d’URL. • L’option Domaine permet de spécifier un nom de domaine Internet valable. Lorsqu’il parcourt la liste de cookies à la recherche de cookies valables, l’attribut spécifié pour le cookie actif est comparé au nom de domaine Internet de l’hôte à partir duquel l’URL sera récupéré. Si la fin des deux noms de domaines est identique, le cookie suit la procédure de correspondance des chemins afin de déterminer s’il sera ou non envoyé. • L’option Protection permet de garantir que le cookie sera transmis uniquement si le canal de communication avec l’hôte est sécurisé. Si l’option de sécurité n’est pas sélectionnée, un cookie est considéré comme pouvant être envoyé de manière fiable via des canaux non sécurisés. Comment utiliser l'aide | Sommaire | Index Page précédente 285 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 286 Exportation de code vers une bibliothèque externe GoLive permet de créer automatiquement un fichier bibliothèque JavaScript externe dans lequel vous pouvez stocker du code partagé provenant d’actions JavaScript, de boutons animés, de composants dynamiques et de scènes animées créées dans l’éditeur de montage DHTML. Ce code partagé est supprimé de vos pages pour être remplacé par des références au fichier bibliothèque et seules les déclarations et paramètres spécifiques aux pages sont conservés. La bibliothèque est ensuite téléchargée sur le serveur Web et, de ce fait, devient accessible pour chaque page du site faisant appel au script. Avantages des bibliothèques JavaScript externes Outre le fait que ce type de bibliothèque réduit le code contenu dans les pages, il présente deux atouts : • Tout d’abord, il permet de résoudre les problèmes associés à la structure de composants dynamiques de GoLive : GoLive place invariablement du code commun pour les éléments DHTML et les actions insérées dans la section d’en-tête d’une page. Bien que cette structure fonctionne correctement avec les pages standard, des problèmes ont pu survenir dans les versions antérieures lorsqu’un composant dynamique comportait des éléments DHTML et des actions de scripts. Etant donné que le navigateur charge uniquement la section de corps d’un composant dynamique, il ne prend en compte aucun code de script situé dans la section d’en-tête. Pour résoudre ce problème, vous devez utiliser la bibliothèque JavaScript externe de façon à faire fonctionner le code JavaScript contenu dans les composants dynamiques comme prévu. • Le navigateur place en mémoire cache le fichier bibliothèque JavaScript, ce qui permet de réduire la quantité de code rédigée sur chaque page et d’accélérer le chargement des pages. Utilisation de la bibliothèque JavaScript Vous pouvez choisir d’utiliser la fonction de bibliothèque JavaScript par page, par site ou au niveau de l’application en définissant une préférence générale. Si vous choisissez de définir une préférence au niveau de l’application ou du site, celle-ci sera appliquée à toute page nouvellement créée ainsi qu’aux pages existantes encore exemptes de code JavaScript. Les pages disposant déjà d’actions et autres composants JavaScript conservent leurs paramètres initiaux. Pour modifier les paramètres de ces pages, vous devez passer par le panneau HTML de l’inspecteur de la page. Pour définir les préférences de la fonction de bibliothèque JavaScript : 1 Effectuez l’une des opérations suivantes : • Pour appliquer la préférence à l’ensemble des nouvelles pages, définissez-la au niveau de l’application. Choisissez Edition > Préférences, puis sélectionnez Bibliothèque de scripts dans le panneau gauche. • Pour appliquer la préférence à l’ensemble des nouvelles pages d’une fenêtre de site, définissez-la au niveau de la configuration du site. Cliquez sur le bouton Configurer le site dans la barre d’outils, sélectionnez Bibliothèque de scripts dans le panneau gauche, puis cochez la case Paramètres spécifiques au site dans le panneau droite. • Pour appliquer la préférence à une seule page, utilisez le panneau HTML de l’inspecteur de la page. Comment utiliser l'aide | Sommaire | Index Page précédente 286 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 287 2 Choisissez l’une des options JavaScript suivantes : • L’option Ecrire le code dans la page permet d’indiquer à GoLive qu’il doit rédiger tout code JavaScript requis dans les pages. • L’option Importer la bibliothèque de scripts GoLive permet de déplacer tout code JavaScript partagé vers un fichier JavaScript externe. Ce fichier est enregistré par défaut dans un dossier spécial nommé GeneratedItems. Si vous sélectionnez l’option d’importation, GoLive réagit différemment si un document de site est ouvert ou non : • Si un document de site est ouvert, GoLive crée un fichier bibliothèque dans un nouveau dossier spécial pour les éléments générés (nommé GeneratedItems), à la racine du dossier de site actif lors de l’enregistrement de la page. • Si aucun document de site n’est ouvert lorsque vous enregistrez la page, GoLiveécrit le code dans un fichier bibliothèque par défaut situé dans le sous-dossier Modules/ JScripts/GlobalScripts du dossier de l’application GoLive. Remarque : La sélection de l’option Importer la bibliothèque de scripts GoLive dans la boîte de dialogue des préférences de bibliothèque de scripts ou de configuration du site n’a aucune incidence sur les paramètres de bibliothèques de scripts des pages déjà dotées de composants JavaScript. Pour déplacer le code de ces pages vers la bibliothèque, activez pour chaque page l’option d’importation dans le panneau HTML de l’inspecteur de la page. 3 Si la bibliothèque JavaScript est endommagée, vous pouvez la restaurer en cliquant sur Reconstituer dans la boîte de dialogue des préférences JavaScript de l’application ou de configuration du site. 4 Saisissez un nom de dossier pour la bibliothèque JavaScript et nommez la bibliothèque en lui affectant l’extension .js. Optimisation de la bibliothèque de scripts Le fichier bibliothèque JavaScript externe renferme l’ensemble de la bibliothèque JavaScript de GoLive et ce, même si vos pages n’en utilisent pas toutes les fonctions. Vous avez la possibilité d’optimiser ce fichier en supprimant tout code JavaScript inutilisé. Ceci permet de réduire la taille du fichier bibliothèque et par là-même son temps de téléchargement. Pour ce faire, différentes possibilités s’offrent à vous : vous pouvez choisir d’optimiser manuellement le fichier bibliothèque d’un site spécifique ou de définir des préférences de téléchargement et d’exportation prévoyant l’optimisation automatique du fichier (pour un site spécifique ou pour tous les sites). Pour optimiser manuellement la bibliothèque JavaScript d’un site : Ouvrez une fenêtre de site et choisissez Site > Optimiser la bibliothèque de scripts. Pour optimiser automatiquement la bibliothèque JavaScript lors du téléchargement d’un site : 1 Dans la boîte de dialogue de configuration du site, sélectionnez Téléchargement/ Synchr. 2 Cochez la case Paramètres spécifiques au site. 3 Sélectionnez l’option Optimiser la bibliothèque de scripts et cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 287 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Utilisation d’actions Page précédente 288 Pour optimiser automatiquement la bibliothèque JavaScript lors de l’exportation d’un site : 1 Dans la boîte de dialogue de configuration du site, cliquez sur Exporter dans le panneau gauche. 2 Cochez la case Paramètres spécifiques au site dans le panneau droit. 3 Sélectionnez l’option Optimiser la bibliothèque de scripts dans la section Eliminer les codes HTML suivants. Pour optimiser automatiquement la bibliothèque JavaScript lors du téléchargement de tous les sites : 1 Choisissez Edition > Préférences. 2 Développez l’arborescence de la liste Site, puis cliquez sur Téléchargement/Synchr. 3 Sélectionnez l’option Optimiser la bibliothèque de scripts et cliquez sur OK. Pour optimiser automatiquement la bibliothèque JavaScript lors de l’exportation de tous les sites : 1 Choisissez Edition > Préférences. 2 Développez l’arborescence de la liste Site dans le panneau gauche, puis cliquez sur Exporter. 3 Sélectionnez l’option Optimiser la bibliothèque de scripts dans la section Eliminer les codes HTML suivants. Comment utiliser l'aide | Sommaire | Index Page précédente 288 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 289 Gestion et affichage de sites Web Gestion d’un site Vous concevez un site Web à partir d’un ensemble de fichiers liés. Ces fichiers peuvent contenir des objets, tels que des balises HTML, des images et des éléments multimédias, ainsi que des scripts. Dans le cadre de la gestion d’un site, il est primordial de gérer correctement les fichiers liés et de les organiser en une hiérarchie logique. GoLive propose plusieurs outils de gestion et d’affichage de sites. Fenêtre de site Pour que vous puissiez afficher et manipuler les fichiers et dossiers de votre site, GoLive propose une fenêtre de site à partir de laquelle vous pouvez accéder à l’ensemble des fichiers et éléments de construction du site. (Pour plus de détails, voir « Utilisation de la fenêtre de site », page 290 et « A propos des éléments de construction de site », page 337.) Il est recommandé de gérer l’ensemble des fichiers source, des données, des fichiers HTML, des scripts et des éléments multimédias dans la fenêtre de site. Cette fenêtre permet non seulement d’éviter toute rupture de liens et création de fichiers orphelins, mais aussi d’accéder facilement aux fichiers du site afin de résoudre les erreurs éventuelles. Vues graphiques GoLive propose également des vues de site graphiques permettant d’afficher la hiérarchie du site sous différentes représentations. (Pour plus de détails, voir « A propos des vues graphiques du site », page 305.) Les vues graphiques du site sont particulièrement utiles pour étudier la navigation du site, passer les fichiers en revue, établir or rectifier des liens, ou bien encore générer un rapport sur le site afin d’obtenir des informations d’état. Palette Liens entrants et sortants La palette Liens entrants et sortants est un puissant outil de gestion des liens qui permet de modifier les liens et les références de fichiers. Si vous utilisez une application autre que GoLive pour modifier le nom d’un fichier image, par exemple, vous pouvez utiliser la palette Liens entrants et sortants pour remplacer toutes les références du site par le nouveau nom de fichier. (Pour plus de détails, voir « Utilisation de la palette Liens entrants et sortants », page 320.) Définition des préférences et paramètres de site Web Lors de la gestion d’un site Web, il est important de définir plusieurs préférences et paramètres spécifiques au site en question. Les préférences Site définissent la manière dont vous gérez un site et comprennent les paramètres de gestion des fichiers et des dossiers standard, les paramètres Contraintes, Etat, Nettoyer le site, Exporter, Téléchargement/Synchr., Couleurs de la conception, et Type de lien. Comment utiliser l'aide | Sommaire | Index Page précédente 289 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 290 Outre les préférences Site, vous pouvez également définir des paramètres spécifiques au site pour les Serveurs FTP et WebDAV, ainsi que les paramètres Gestion des URL, Mappage des URL, Contenu dynamique, Couleurs de la conception et Web Workgroup Server. Les paramètres spécifiques au site ont priorité sur les préférences Site. Pour plus de détails sur la configuration de serveurs FTP et WebDAV, voir « Configuration de l’accès FTP », page 360 ou le Guide de l’utilisateur d’Adobe Web Workgroup Server. Deux autres catégories de préférences spécifiques à l’application affectent également la gestion des sites, à savoir les préférences Bibliothèque de scripts et les préférences Réseau. Les préférences Bibliothèque de scripts incluent les paramètres déterminant la manière dont GoLive gère les scripts Java, et les préférences Réseau les paramètres de connectivité et d’état du réseau. Pour configurer les préférences affectant l’ensemble des sites : 1 Choisissez Edition > Préférences. 2 Dans le panneau gauche de la boîte de dialogue Préférences, effectuez l’une des opérations suivantes : • Cliquez sur l’icône des préférences Site ou développez-la catégorie de site. , puis sélectionnez une • Cliquez sur l’icône des préférences Bibliothèque de scripts ou développez-la sélectionnez une catégorie de bibliothèque de scripts. • Cliquez sur l’icône des préférences Réseau ou développez-la catégorie de réseau. , puis , puis sélectionnez une 3 Dans le panneau droit, configurez les préférences que vous souhaitez appliquer à l’ensemble des sites. 4 Cliquez sur OK. Pour définir des paramètres spécifiques à un site : 1 Ouvrez un site. 2 Cliquez sur le bouton Configurer le site Configuration. de la barre d’outils ou choisissez Site > 3 Dans la boîte de dialogue de configuration du site, cliquez sur une catégorie dans le panneau gauche, puis sélectionnez des options dans le panneau droit. 4 Si l’option Paramètres spécifiques au site est disponible pour une catégorie, choisissezla afin que les paramètres spécifiques au site aient priorité sur les préférences Site. 5 Cliquez sur OK. Utilisation de la fenêtre de site La fenêtre de site est un outil indispensable à la conception et la gestion d’un site Web et doit contenir l’ensemble des fichiers liés utilisés par le site ainsi que toute référence à des URL externes. GoLive organise un site en six panneaux correspondant à différents aspects de la gestion d’un site : Fichiers contient les fichiers HTML, XHTML, XML, les éléments multimédias et autres fichiers, ainsi que les dossiers dans lesquels ces fichiers sont organisés. Comment utiliser l'aide | Sommaire | Index Page précédente 290 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 291 Externe affiche les URL externes et les adresses électroniques référencées par les fichiers du site. Diagrammes contient les diagrammes de conception ainsi qu’une vue graphique des implémentations de site possibles. (Pour plus de détails, voir « A propos des diagrammes de conception », page 406.) Couleurs contient l’attribut général Couleur que vous pouvez appliquer au texte, aux tableaux et autres éléments du site. Jeux de polices contient un ensemble de jeux de polices fréquemment utilisés dans le site. Les jeux de polices sont des listes de polices de remplacement que vous pouvez choisir d’utiliser afin d’écraser les paramètres de polices d’affichage par défaut du navigateur. Bibliothèque contient un ensemble d’objets de bibliothèque fréquemment utilisés dans le site. Les objets de bibliothèque peuvent être du texte, des images, des objets ou des extraits de code. Vous pouvez faire glisser ou copier des éléments dans le panneau Bibliothèque afin de les insérer ultérieurement dans un document. (Pour plus de détails, voir « Utilisation des objets de bibliothèque », page 347.) Les objets de bibliothèque sont également répertoriés dans le dossier Bibliothèque du panneau Divers. Vous pouvez également afficher et masquer le panneau droit de la fenêtre de site contenant les panneaux supplémentaires suivants : Divers contient l’ensemble des fichiers et dossiers du dossier de données du site, y compris les quatre types de fichiers que vous avez créés et stockés pour les utiliser ultérieurement. Ces objets réutilisables sont les composants, les pages de gabarits, les extraits de code et les modèles de page. Le panneau Divers contient également les diagrammes, objets dynamiques et fichiers déplacés vers la Corbeille du site. (Pour plus de détails, voir « A propos des éléments de construction de site », page 337.) Erreurs contient les fichiers manquants, les fichiers orphelins et les fichiers ayant un nom ne correspondant pas aux conventions de dénomination définies. Un fichier orphelin est référencé dans un lien, mais GoLive n’arrive pas à localiser le fichier de référence ou celuici est stocké dans un dossier qui n’est pas à la racine. La gestion des fichiers à partir de la fenêtre de site permet d’éviter la création de fichiers orphelins. Cliquez sur un fichier dans le panneau Erreurs pour ouvrir l’inspecteur de l’erreur. Pour plus de détails sur la localisation et la résolution des liens vers des fichiers manquants, voir « Recherche de fichiers manquants ou orphelins sur le site », page 329. FTP affiche le site sur un serveur distant lorsque GoLive est connecté à un serveur FTP. Comment utiliser l'aide | Sommaire | Index Page précédente 291 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 292 WebDAV affiche le site sur un serveur distant lorsque GoLive est connecté via WebDAV. A B Panneaux Fichiers et Divers de la fenêtre de site A. Etat actif des fichiers B. Cliquez ici pour afficher ou masquer le panneau droit de la fenêtre de site. La colonne d’état de la fenêtre de site contient des icônes indiquant l’état de chaque fichier. L’icône de marque de sélection affichée en regard d’un fichier signale que celuici ne comporte aucune erreur (c’est-à-dire que tous les fichiers qu’il référence sont localisés). Pour plus de détails sur la signification des autres icônes d’état, voir « Correction des erreurs de site », page 328. Pour ouvrir un fichier projet de site (*.site) dans la fenêtre de site : Effectuez l’une des opérations suivantes : • Choisissez Fichier > Ouvrir, naviguez vers le fichier projet de site (*.site) qui vous intéresse, sélectionnez-le, puis cliquez sur Ouvrir. • Cliquez deux fois sur le fichier projet de site sur le bureau de votre système. Remarque : L’ouverture d’un fichier projet de site entraîne automatiquement la création d’une copie de celui-ci. GoLive supprime cette copie de sauvegarde une fois le fichier projet de site enregistré et fermé. Vous pouvez toutefois désactiver cette fonction pour tous les sites dans les préférences Site. Si, suite à une panne d’ordinateur, vous devez rouvrir le site, ouvrez le fichier de site standard et non la copie de sauvegarde. GoLive vous informe lorsque l’utilisation de la copie de sauvegarde est nécessaire. Pour afficher ou masquer le panneau droit de la fenêtre de site : Cliquez sur l’icône d’affichage/masquage du panneau droit défilement située au bas de la fenêtre. dans la barre de Pour afficher le contenu d’un panneau dans la fenêtre de site : Effectuez l’une des opérations suivantes : • Cliquez sur l’onglet de votre choix pour afficher le panneau correspondant au premier plan. • Choisissez une option dans le menu de la fenêtre de site. • Choisissez Site > Afficher, puis sélectionnez une option de panneau dans le sous-menu. Pour rétablir la configuration initiale de la fenêtre de site : Choisissez Configuration par défaut dans le menu de l’un des deux panneaux de la fenêtre de site. Comment utiliser l'aide | Sommaire | Index Page précédente 292 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 293 Pour personnaliser l’affichage des panneaux de la fenêtre de site : Effectuez l’une des opérations suivantes : • Pour modifier l’ordre de tri des colonnes d’un panneau, cliquez sur l’en-tête de la colonne sur laquelle effectuer le tri. Sous Mac OS, vous pouvez également cliquer sur l’icône d’ordre de tri située au-dessus de la barre de défilement. • Pour trier le panneau sur une autre colonne, cliquez sur l’en-tête de celle-ci. • Pour afficher et masquer des colonnes, sélectionnez le nom des colonnes appropriées dans le menu Afficher les colonnes de la palette Affichage. • Pour redimensionner une colonne dans un panneau, faites glisser le bord droit de son en-tête vers la gauche ou vers la droite. • Pour modifier la position d’une colonne dans un panneau, faites glisser son en-tête vers la gauche ou vers la droite tout en appuyant sur la touche Ctrl (Windows) ou Commande (Mac OS). Il n’est pas possible de déplacer la colonne située à l’extrémité gauche d’un panneau. • Pour afficher le niveau supérieur de l’arborescence du dossier ou du groupe dont le contenu est affiché dans le panneau, cliquez sur le bouton de niveau supérieur (Windows) ou (Mac OS) situé dans la partie supérieure de ce panneau. • Pour afficher ou masquer les ancres d’une page, cliquez sur l’icône située à gauche de la page pour développer ou réduire cette dernière. A propos des fichiers et des dossiers de site Dans GoLive, un site désigne un ensemble de fichiers situés sur un lecteur local ou un serveur de groupe de travail utilisés comme ressources dans le cadre de l’élaboration et de la gestion d’un site Web sur un serveur Web. Les internautes utilisant le site Web ont uniquement accès aux fichiers que vous téléchargez vers le serveur Web. (Pour plus de détails, voir « Téléchargement et mise à jour d’un site sur le serveur », page 363 ou le Guide de l’utilisateur d’Adobe Web Workgroup Server.) Ces fichiers incluent la page d’accueil (généralement appelée index.html), les pages qui lui sont liées, directement ou indirectement, ainsi que les fichiers multimédias référencés par ces pages. Les internautes n’ont pas accès au reste des fichiers généralement stockés dans les dossiers de données et de paramètres, et le contenu de ces dossiers n’est normalement pas téléchargé vers le serveur. Les fichiers qui composent un site GoLive comprennent le fichier projet de site et le contenu des trois dossiers suivants : le dossier racine, le dossier des données et le dossier des paramètres du site. • Le contenu du fichier projet de site est affiché dans les divers panneaux de la fenêtre de site. • Le contenu du dossier racine est répertorié dans le panneau Fichiers de la fenêtre de site. • Le contenu du dossier des données du site est répertorié dans le panneau Divers de la fenêtre de site. • Le dossier des paramètres contient les fichiers XML des paramètres spécifiques au site, ainsi que les paramètres des panneaux Couleurs, Externe et Jeux de polices. Comment utiliser l'aide | Sommaire | Index Page précédente 293 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 294 Vérification des propriétés de fichier L’inspecteur de tout fichier sélectionné contient un panneau Fichier affichant des informations de fichier de base, un panneau Nom indiquant si le nom de fichier correspond aux conventions de dénomination ou les enfreint (voir « Attribution d’un nom aux fichiers et aux dossiers », page 302), ainsi qu’un panneau Contenu affichant une vignette de l’objet. Dans le cas des fichiers HTML et XHTML, l’inspecteur du fichier inclut un panneau Page supplémentaire affichant le titre de la page et des informations relatives à l’encodage. (Pour plus de détails, voir « Modification du titre de la page », page 45.) L’inspecteur du dossier inclut des informations de dossier de base ainsi qu’un panneau Nom affichant l’état du nom de fichier. Vous pouvez également utiliser l’inspecteur du fichier et l’inspecteur du dossier pour renommer les fichiers et les dossiers ou modifier leur état de publication ainsi que leur libellé d’état. (Pour plus de détails, voir « Indication d’informations sur l’état des fichiers », page 334.) Pour visualiser les informations relatives à un fichier ou un dossier dans l’inspecteur : 1 Affichez l’inspecteur. 2 Sélectionnez le fichier ou le dossier dans la fenêtre de site. 3 Si vous avez sélectionné un fichier, cliquez sur l’onglet qui vous intéresse dans l’inspecteur du fichier : Fichier, Nom, Page ou Contenu. Si vous avez sélectionné un dossier, cliquez sur l’onglet approprié dans l’inspecteur du dossier : Dossier ou Nom. Pour afficher les informations relatives au fichier dans l’Explorateur (Windows) ou le Finder (Mac OS) : Pour afficher les informations de fichiers provenant de votre système d’exploitation, cliquez sur le bouton Afficher les propriétés (Windows) ou Afficher les informations dans le Finder (Mac OS) sur la barre d’outils. Utilisation des fichiers et des dossiers Dans la fenêtre de site, organisez vos fichiers dans des dossiers. Par exemple, créez des dossiers distincts pour le stockage des pages, des images et des animations dans le panneau Fichiers de la fenêtre de site. Important : GoLive vous permet de référencer des fichiers situés dans n’importe quel dossier du système. Toutefois, lorsque vous déplacez, renommez ou supprimez des fichiers de site à l’aide d’un outil système tel que l’Explorateur (Windows) ou le Finder (Mac OS), GoLive ne met pas à jour les informations de liens et de références. C’est pourquoi il est vivement conseillé de déplacer, renommer ou supprimer tout fichier dans la fenêtre de site. Si vous choisissez d’effectuer ces opérations à l’aide d’un outil système, rafraîchissez l’affichage des fichiers dans la fenêtre de site. (Pour plus de détails, voir « Rafraîchissement de la fenêtre de site », page 298.) Comment utiliser l'aide | Sommaire | Index Page précédente 294 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 295 De même, vous pouvez utiliser la fenêtre de site pour organiser dans des groupes les éléments autres que des fichiers. GoLive traite et affiche un groupe dans la fenêtre de site en tant que type de dossier, mais tous les groupes sont placés dans le dossier des paramètres plutôt que dans des dossiers ordinaires sur votre disque dur. Les éléments des panneaux Fichiers et Bibliothèque sont placés dans des dossiers ordinaires. Tous les éléments autres que des fichiers qui figurent dans les panneaux Externe, Couleurs et Jeux de polices sont placés dans des groupes. Pour créer un dossier (groupe ou dossier ordinaire) : 1 Cliquez sur l’onglet dans lequel vous souhaitez créer le dossier. 2 Pour subordonner le dossier créé à un dossier existant du panneau, sélectionnez ce dernier. 3 Effectuez l’une des opérations suivantes : • Cliquez sur le bouton Nouveau dossier de la barre d’outils. • Choisissez Site > Créer > Dossier. • Pour ajouter un dossier au panneau Fichiers, Divers ou Bibliothèque, faites glisser l’icône Dossier du panneau Site de la palette Objets vers la fenêtre de site. • Pour ajouter un groupe au panneau Externe, faites glisser l’icône Groupe d’URLs ou Groupe d’adresses du panneau Site de la palette Objets vers la fenêtre de site. GoLive affecte un nom de « dossier » générique à tout nouveau dossier dans les panneaux Fichiers et Bibliothèque, ou un nom de groupe « sans titre » à tout nouveau groupe dans les panneaux Couleurs, Externe et Jeux de polices. 4 Saisissez un nouveau nom de dossier ou de groupe. (Pour plus de détails, voir « A propos des noms de fichiers », page 302.) 5 Placez dans le dossier les éléments souhaités. Vous pouvez également importer des fichiers et autres éléments vers un site. (Pour plus de détails, voir « Ajout de fichiers existants », page 43.) Pour déplacer un fichier ou un objet vers un dossier (groupe ou dossier ordinaire) : 1 Effectuez l’une des opérations suivantes : • Faites glisser le fichier ou l’objet d’un dossier du Finder (Mac OS) ou de l’Explorateur (Windows) vers un dossier ou panneau de la fenêtre de site. Comment utiliser l'aide | Sommaire | Index Page précédente 295 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Gestion et affichage de sites Web Page précédente 296 Faites glisser un objet vers un groupe. Déplacement d’un fichier d’un dossier du bureau vers un dossier de la fenêtre de site Si vous souhaitez ouvrir le dossier cible afin d’afficher son contenu, survolez l’icône de ce dossier avant de relâcher le bouton de la souris. Pour cibler un dossier parent du dossier actif dans le panneau à l’intérieur duquel vous effectuez le déplacement, faites glisser le fichier ou l’objet vers le bouton de niveau supérieur (Windows) ou (Mac OS) situé dans la partie supérieure du panneau. 2 Lorsque vous déplacez un fichier comportant des liens ou des références à des fichiers, cliquez sur OK dans la boîte de dialogue Déplacer les fichiers pour les mettre à jour. Important : Tout fichier non mis à jour peut donner lieu à des liens rompus et à des références de fichiers incorrectes. Pour ouvrir le dossier de bureau comportant un fichier ou un dossier dans la fenêtre de site : 1 Sélectionnez le fichier ou le dossier dans la fenêtre de site. Vous ne pouvez sélectionner que des fichiers et des dossiers ordinaires, et non des groupes ni des objets figurant dans des groupes. 2 Effectuez l’une des opérations suivantes : • Cliquez sur le bouton Localiser dans l’Explorateur (Windows) ou Localiser dans le Finder (Mac OS) de la barre d’outils. • Choisissez Site > Explorateur > Localiser l’objet (Windows) ou Site > Finder > Localiser l’objet (Mac OS). Suivi des manipulations effectuées sur les fichiers de site La palette Flux de production permet d’établir un suivi de l’état des fichiers du site, que vous travailliez seul ou en groupe. Lorsque vous sélectionnez un fichier dans la fenêtre de site, la palette Flux de production indique le nom de l’utilisateur qui modifie un fichier ainsi que l’état du fichier. Ces informations sont affichées dans deux colonnes supplémentaires du panneau Fichiers de la fenêtre de site, à savoir les colonnes A modifier par et Terminé. Pour afficher l’état d’un fichier ou d’un dossier : 1 Choisissez Fenêtre > Flux de production pour afficher la palette correspondante. Remarque : Si la commande Flux de production n’est pas disponible dans le menu Fenêtre, choisissez Edition > Préférences, puis cliquez sur Modules. Veillez à ce que l’option Comment utiliser l'aide | Sommaire | Index Page précédente 296 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 297 Workflow, située en bas de liste sous Extend Scripts, soit sélectionnée dans le panneau droit. 2 Sélectionnez un fichier ou un dossier dans la fenêtre de site. 3 Dans la palette Flux de production, saisissez un nom dans la zone de texte A modifier par, puis sélectionnez un pourcentage dans le menu Terminé. Suppression de fichiers Lorsque vous supprimez un fichier ou un dossier du site, vous l’envoyez dans le dossier Corbeille du site ou dans la Corbeille du système. La destination par défaut est le dossier Corbeille du site, mais vous pouvez sélectionner comme destination la Corbeille système dans les préférences Site. Vous pouvez restaurer des fichiers placés dans la Corbeille du site ou les déplacer vers la Corbeille système. Les objets et les groupes que vous supprimez de la Corbeille système sont définitivement supprimés du système. Pour divers motifs, il est préférable de mettre à jour le panneau Fichiers ou Divers ou encore de supprimer les objets inutiles du panneau Externe, Couleurs ou Jeux de polices plutôt que de supprimer un fichier ou un objet. (Voir « Rafraîchissement de la fenêtre de site », page 298 et « Suppression des éléments inutilisés de la fenêtre de site », page 299.) Pour supprimer un fichier, un dossier ordinaire, un objet ou un groupe : 1 Sélectionnez l’élément. 2 Effectuez l’une des opérations suivantes : • Cliquez sur le bouton Supprimer de la barre d’outils. • Appuyez sur la touche Suppr (Windows) ou sur les touches Commande + Delete (Mac OS). • Choisissez Edition > Supprimer (Windows) ou Edition > Effacer (Mac OS). 3 Si nécessaire, cliquez sur Oui pour confirmer la suppression. Pour restaurer un fichier de la Corbeille du site : 1 Si nécessaire, affichez le panneau droit en cliquant sur l’icône d’affichage/masquage du panneau droit dans la barre de défilement située au bas de la fenêtre de site. 2 Cliquez sur l’onglet Divers. 3 Ouvrez le dossier Corbeille du site, puis sélectionnez le fichier que vous souhaitez restaurer. 4 Effectuez l’une des opérations suivantes : • Si vous n’avez effectué aucune action depuis la suppression du fichier, choisissez Edition > Annuler Placer dans la corbeille. • Faites glisser le fichier vers son ancien emplacement (ou tout autre dossier) dans le panneau Fichiers. Pour déplacer des fichiers vers la Corbeille système : Dans le panneau Divers, effectuez l’une des opérations suivantes : • Pour déplacer l’ensemble des fichiers de la Corbeille du site vers la Corbeille système, sélectionnez l’icône Corbeille du site, puis choisissez Corbeille vide dans le menu contextuel. Comment utiliser l'aide | Sommaire | Index Page précédente 297 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index • Page précédente 298 Pour déplacer un fichier individuel de la Corbeille du site vers la Corbeille système, sélectionnez le fichier, puis appuyez sur la touche Suppr (Windows) ou les touches Commande + Delete (Mac OS). Vous pouvez également choisir Edition > Supprimer (Windows) ou Edition > Effacer (Mac OS). Pour changer la destination d’un fichier ou d’un dossier supprimé : 1 Choisissez Edition > Préférences, puis cliquez sur Site. 2 Sélectionnez une option de corbeille, puis cliquez sur OK. Rafraîchissement de la fenêtre de site Vous pouvez rafraîchir la liste des éléments des panneaux Fichiers, Diagrammes, Bibliothèque et Divers de la fenêtre de site de sorte à afficher le site actif, c’est-à-dire le contenu du dossier racine (panneau Fichiers), du dossier des données de site (panneau Divers) ou de ses sous-dossiers Diagrammes ou Bibliothèque (panneau Diagrammes ou Bibliothèque). Le rafraîchissement de la fenêtre de site peut entraîner l’ajout et/ou la suppression de fichiers dans cette fenêtre. Il est vivement conseillé de rafraîchir la fenêtre si vous avez manipulé des fichiers d’un de ces dossiers en dehors de l’application GoLive ; par exemple, si vous avez utilisé le Finder (Mac OS) ou l’Explorateur (Windows) au lieu de GoLive pour déplacer, renommer ou supprimer des fichiers de la fenêtre de site. Si vous êtes connecté à un serveur FTP ou WebDAV, vous pouvez rafraîchir, selon le même principe, les panneaux FTP ou WebDAV, de sorte que le contenu du répertoire actif corresponde à la réalité sur le serveur. Si vous utilisez un serveur de groupe de travail, vous pouvez également rafraîchir la liste des éléments autres que des fichiers dans les panneaux Externe, Couleurs ou Jeux de polices. Si vous manipulez un site pour utilisateur unique, vous ne pouvez toutefois pas rafraîchir ces panneaux. Lorsque vous importez un site, les panneaux Fichiers, Externe, Couleurs et Jeux de polices de la fenêtre de site sont automatiquement rafraîchis. Les ressources nécessaires à l’élaboration ultérieure du site sont ainsi disponibles. Au fur et à mesure que vous élaborez le site importé, il est recommandé de rafraîchir ces panneaux pour refléter les modifications apportées. Pour rafraîchir le panneau Fichiers, Diagrammes, Bibliothèque ou Divers : 1 Effectuez l’une des opérations suivantes : • Cliquez sur l’onglet Fichiers, Diagrammes, Bibliothèque ou Divers. • Cliquez sur l’onglet Fichiers, puis ouvrez le dossier approprié. 2 Cliquez sur le bouton Rafraîchir la vue Rafraîchir la vue. de la barre d’outils ou choisissez Site > Pour rafraîchir l’affichage du panneau FTP ou WebDAV : 1 Connectez-vous à un serveur FTP ou WebDAV. 2 Ouvrez le répertoire du serveur que vous souhaitez rafraîchir. 3 Choisissez Site > Mettre à jour. Comment utiliser l'aide | Sommaire | Index Page précédente 298 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 299 Pour rafraîchir le panneau Externe, Couleurs ou Jeux de polices (serveur de groupe de travail uniquement) : 1 Si vous utilisez un serveur de groupe de travail, cliquez sur l’onglet Externe, Couleurs ou Jeux de polices. 2 Cliquez sur le bouton Rafraîchir la vue Rafraîchir la vue. de la barre d’outils ou choisissez Site > Ajout d’éléments utilisés à la fenêtre de site Vous pouvez configurer GoLive afin de rechercher sur l’ensemble des pages du site la présence d’éléments autres que des fichiers utilisés sur une page, mais non répertoriés dans les panneaux Externe, Couleurs ou Jeux de polices. GoLive ajoute alors ces éléments aux panneaux appropriés de la fenêtre de site. GoLive ajoute, par exemple, une couleur au panneau Couleurs si cette couleur est utilisée sur une page sans être répertoriée dans ce panneau. Les éléments déjà répertoriés qui ne sont pas utilisés restent affichés dans les panneaux. Pour plus de détails sur la suppression d’éléments inutilisés, voir « Suppression des éléments inutilisés de la fenêtre de site », page 299. Si GoLive trouve de nouvelles références ou adresses devant être répertoriées dans le panneau Externe, l’application crée un groupe de nouvelles références ou de nouvelles adresses dans ce panneau. Selon le même principe, un groupe Nouvelles couleurs ou Nouveaux jeux de polices est créé dans le panneau Couleurs ou Jeux de polices en cas de détection de nouvelles couleurs ou de nouveaux jeux de polices. Pour ajouter des éléments utilisés à la fenêtre de site : 1 Cliquez sur l’onglet Externe, Couleurs ou Jeux de polices. 2 En fonction du panneau sélectionné, effectuez l’une des opérations suivantes : • Pour le panneau Externe, choisissez Site > Extraire les références. • Pour le panneau Couleurs, choisissez Site > Extraire les couleurs. • Pour le panneau Jeux de polices, choisissez Site > Extraire les jeux de polices. Suppression des éléments inutilisés de la fenêtre de site Vous pouvez supprimer les références, les couleurs ou les jeux de polices n’étant pas utilisés dans le site à partir des panneaux Externe, Couleurs et Jeux de polices. Pour supprimer des éléments inutilisés de la fenêtre de site : 1 Cliquez sur l’onglet Externe, Couleurs ou Jeux de polices. 2 En fonction du panneau sélectionné, effectuez l’une des opérations suivantes : • Pour le panneau Externe, choisissez Site > Supprimer les références inutilisées. • Pour le panneau Couleurs, choisissez Site > Supprimer les couleurs inutilisées. • Pour le panneau Jeux de polices, choisissez Site > Supprimer les jeux de polices inutilisés. Comment utiliser l'aide | Sommaire | Index Page précédente 299 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 300 Pour annuler la suppression de références, couleurs et jeux de polices : En fonction du panneau dans lequel vous avez procédé à la suppression, effectuez l’une des opérations suivantes : • Pour le panneau Externe, choisissez Edition > Annuler Supprimer les références inutilisées. • Pour le panneau Couleurs, choisissez Edition > Annuler Supprimer les couleurs inutilisées. • Pour le panneau Jeux de polices, choisissez Edition > Annuler Supprimer les jeux de polices inutilisés. Nettoyage d’un site La commande Nettoyer le site est essentielle à la gestion de votre site et à sa préparation en vue de sa publication (téléchargement vers un serveur Web afin que le site soit disponible au public). Le nettoyage de site permet de supprimer tous les liens, couleurs, adresses électroniques et jeux de polices inutilisés qui encombrent la version active du site stocké localement. Vous pouvez également utiliser cette commande pour copier vers le dossier racine tout fichier ou objet référencé dans le site, mais qui est stocké à un autre emplacement que ce dossier. Lors du nettoyage d’un site, vous pouvez effectuer toute combinaison des opérations suivantes : • Rafraîchissez l’affichage des éléments répertoriés dans la fenêtre de site. • Copiez des fichiers utilisés dans le site vers le dossier racine. Le terme utilisé signifie « référencé sur une page quelconque dans le dossier racine ». • Supprimez des fichiers inutilisés. Le terme inutilisé signifie « non référencé sur une page quelconque dans le dossier racine ». • Ajoutez des références, des couleurs et des jeux de polices utilisés dans le site, mais qui ne sont pas répertoriés dans les panneaux Externe, Couleurs ou Jeux de polices. • Supprimez des références, couleurs et jeux de polices inutilisés. Pour définir les options de nettoyage de site : 1 Effectuez l’une des opérations suivantes : • Pour définir les options de nettoyage du site actif uniquement, cliquez sur le bouton Configurer le site de la barre d’outils ou choisissez Site > Configuration. Cliquez ensuite sur Nettoyer le site dans le panneau gauche, puis cochez la case Paramètres spécifiques au site. • Pour définir les options de nettoyage de l’ensemble des sites, choisissez Edition > Préférences, puis développez l’icône Site dans le panneau gauche. Cliquez ensuite sur Nettoyer le site. 2 Sélectionnez l’une des options suivantes : • Cochez la case Rafraîchir la vue pour rafraîchir la vue des éléments répertoriés dans la fenêtre de site. (Pour plus de détails, voir « Rafraîchissement de la fenêtre de site », page 298.) • Cochez la case Fichiers dans la zone Ajout des éléments utilisés pour copier des fichiers utilisés dans le site vers le dossier racine si ceux-ci sont stockés à un autre empla- Comment utiliser l'aide | Sommaire | Index Page précédente 300 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 301 cement. Pour afficher une boîte de dialogue permettant de sélectionner les fichiers à copier, cochez la case Afficher la liste des fichiers à copier. • Pour ajouter des éléments autres que des fichiers utilisés dans le site sans être répertoriés dans le panneau Externe, Couleurs ou Jeux de polices de la fenêtre de site, dans la zone Ajout des éléments utilisés, cochez la case Références externes, Couleurs ou Jeux de polices. (Pour plus de détails, voir « Ajout d’éléments utilisés à la fenêtre de site », page 299.) • Pour déplacer des fichiers non utilisés dans le site vers la Corbeille du site, cochez la case Fichiers non liés dans la zone Supprimer. • Pour supprimer des éléments autres que des fichiers inutilisés dans le site mais répertoriés dans le panneau Externe, Couleurs ou Jeux de polices de la fenêtre de site, dans la zone Supprimer, cochez la case Références externes inutilisées, Couleurs inutilisées ou Jeux de polices inutilisés. (Pour plus de détails, voir « Suppression des éléments inutilisés de la fenêtre de site », page 299.) • Pour afficher la boîte de dialogue Options de nettoyage du site à chaque fois que vous choisissez Site > Nettoyer le site, cochez la case Afficher la boîte de dialogue des options. Lorsque vous cochez cette case, GoLive désactive la case Ne plus afficher cette boîte de dialogue de la boîte de dialogue Options de nettoyage du site. • Cliquez sur Couleurs par défaut afin d’utiliser les paramètres par défaut pour l’ensemble des options. 3 Cliquez sur OK. Pour nettoyer un site : 1 Choisissez Site > Nettoyer le site. 2 Si la boîte de dialogue Options de nettoyage du site s’affiche, sélectionnez les options requises, puis cliquez sur OK. 3 Si la boîte de dialogue Copier les fichiers s’affiche, sélectionnez les fichiers que vous souhaitez copier vers le dossier racine, puis cliquez sur OK. Cliquez sur OK dans la boîte de dialogue Mettre à jour des fichiers. Pour annuler le nettoyage d’un site : Choisissez Edition > Annuler Nettoyer le site. Attribution de noms et de chemins à des fichiers Lors de la conception d’un site Web, vous devez nommer les fichiers du site afin de pouvoir y faire référence correctement. Le rapport entre un lien et un fichier ou objet auquel il fait référence peut être défini comme un chemin décrivant la hiérarchie du dossier. GoLive permet de personnaliser l’attribution de noms de fichiers ainsi que la création de chemins. Vous pouvez choisir parmi un large éventail de règles relatives aux noms de fichiers et indiquer si un chemin est relatif ou absolu. (Pour plus de détails, voir « A propos des chemins de liens absolus », page 304.) Comment utiliser l'aide | Sommaire | Index Page précédente 301 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 302 A propos des noms de fichiers Vous devez nommer correctement les fichiers et dossiers afin de les télécharger sans problème vers la plate-forme du serveur que vous utilisez, qu’il s’agisse de Mac OS, UNIX, DOS, Windows ou d’un autre système d’exploitation. GoLive comporte une série de règles relatives aux noms de fichiers qui permet de garantir leur compatibilité entre platesformes. Lorsqu’un nom de fichier n’est pas conforme à l’une de ces règles, le panneau Erreurs de la fenêtre de site et l’inspecteur du fichier signalent le problème. L’inspecteur du fichier répertorie également la règle elle-même. Vous pouvez consulter, modifier, supprimer et ajouter des règles relatives aux noms de fichiers. (Pour plus de détails, voir « Modification des conventions de dénomination », page 303.) Lors de l’attribution d’un nom à un fichier ou dossier, utilisez les minuscules afin d’éviter tout problème de casse et n’incluez aucun espace dans le nom. Les espaces contenus dans les noms de fichiers et de dossiers sont automatiquement convertis en code d’échappement URL « %20 » lors du processus FTP. Certains liens et références de fichiers peuvent ainsi devenir incorrects. Attribution d’un nom aux fichiers et aux dossiers Lorsque vous créez un nouveau fichier vide dans GoLive, un nom lui est automatiquement attribué. Cependant, si vous savez quel sera le contenu de ce fichier, vous souhaiterez sans doute le renommer. Lorsque vous renommez un fichier référencé par d’autres, vous avez la possibilité de mettre ces derniers à jour simultanément. Pour plus de détails sur la mise à jour d’un site entier pour un URL auquel font référence d’autres fichiers, voir « Modification de liens et d’URL dans l’intégralité du site », page 321. Si vous utilisez un nom de fichier ou de dossier contenant des caractères qui ne respectent pas la convention de dénomination active du site (ou de l’ensemble des sites), GoLive affiche des avertissements dans le panneau Erreurs de la fenêtre de site, le panneau Nom de l’inspecteur du fichier ou du dossier et dans la colonne Etat du panneau Fichiers. Pour renommer un fichier : 1 Effectuez l’une des opérations suivantes : • Sélectionnez le fichier dans le panneau Fichiers de la fenêtre de site, puis saisissez le nouveau nom dans le panneau Fichier de l’inspecteur du fichier. • Sélectionnez le fichier dans le panneau Fichiers de la fenêtre de site, marquez une pause, cliquez sur le nom du fichier dans la fenêtre de site, puis saisissez le nouveau nom. 2 S’il existe des fichiers faisant référence au fichier que vous venez de renommer, la boîte de dialogue Renommer un fichier s’affiche alors. Maintenez les fichiers sélectionnés, puis cliquez sur OK pour que GoLive mette automatiquement à jour les références au nouveau nom de fichier. Pour vérifier si un nom de fichier est conforme aux conventions de dénomination : Effectuez l’une des opérations suivantes : • Sélectionnez le fichier, puis cliquez sur l’onglet Nom de l’inspecteur du fichier pour afficher toute violation. Comment utiliser l'aide | Sommaire | Index Page précédente 302 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 303 • Recherchez le groupe d’avertissements sur les noms de fichiers dans le panneau Erreurs de la fenêtre de site. Si ce groupe est affiché, il répertorie tous les fichiers dont le nom est incorrect. • Recherchez une violation dans la colonne Etat du fichier/dossier du panneau Fichiers de la fenêtre de site. Cette colonne est différente de la colonne Etat. Si la colonne Etat du fichier n’est pas affichée, choisissez Etat du fichier dans le menu Afficher les colonnes de la palette Affichage. Pour renommer un dossier : • Sélectionnez le dossier dans le panneau Fichiers de la fenêtre de site, puis saisissez le nouveau nom dans le panneau Dossier de l’inspecteur du dossier. • Sélectionnez le dossier dans le panneau Fichiers de la fenêtre de site, marquez une pause, cliquez sur le nom du dossier dans la fenêtre de site, puis saisissez le nouveau nom. Modification des conventions de dénomination GoLive vous avertit en cas d’utilisation d’un nom de fichier non conforme aux conventions de dénomination définies. GoLive fournit plusieurs jeux de contraintes, mais vous pouvez également créer vos propres jeux. Le jeu par défaut « Conventions standard de GoLive » est compatible avec Mac OS, UNIX et Windows 98/NT/2000/XP. Les autres jeux disponibles sont Conventions strictes de GoLive, Conventions minuscules de GoLive, Mac OS, Mac OS X, UNIX, Windows (s’applique à Windows 98/NT/2000/XP) et DOS/Windows 3.1. Vous pouvez également sélectionner le jeu Système de fichiers par défaut afin que votre système d’exploitation impose les conventions de dénomination au lieu de GoLive. Pour modifier les conventions de dénomination : 1 Effectuez l’une des opérations suivantes : • Pour modifier les conventions appliquées au site actif uniquement, cliquez sur le bouton Configurer le site de la barre d’outils ou choisissez Site > Configuration. Cliquez ensuite sur Contraintes relatives aux noms de fichiers dans le panneau gauche, puis cochez la case Paramètres spécifiques au site. • Pour modifier les conventions appliquées à tous les sites, choisissez Edition > Préférences, développez l’icône Site dans le panneau gauche, puis cliquez sur Contraintes. 2 Sélectionnez les conventions souhaitées dans le menu Contraintes sélectionnées. 3 Cliquez sur OK. Pour personnaliser les conventions de dénomination : 1 Effectuez l’une des opérations suivantes : • Pour appliquer de nouvelles conventions au site actif uniquement, cliquez sur le bouton Configurer le site de la barre d’outils ou choisissez Site > Configuration. Cliquez ensuite sur Contraintes relatives aux noms de fichiers dans le panneau gauche, puis cochez la case Paramètres spécifiques au site. • Pour appliquer de nouvelles contraintes à tous les sites, choisissez Edition > Préférences, développez l’icône Site dans le panneau gauche, puis cliquez sur Contraintes. 2 Dans le menu Contraintes sélectionnées, choisissez le jeu de contraintes qui correspond le mieux aux contraintes que vous souhaitez appliquer. Comment utiliser l'aide | Sommaire | Index Page précédente 303 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 304 3 Cliquez sur Dupliquer. Le jeu sélectionné est dupliqué. Vous pouvez modifier et supprimer un jeu dupliqué sans pouvoir toutefois supprimer le jeu original. 4 Saisissez un nom pour ce nouveau jeu dans la zone de texte Contraintes sélectionnées. 5 Personnalisez-le à votre convenance dans les autres zones de texte. 6 Cliquez sur OK. A propos des chemins de liens absolus Les pages d’un site comprennent des chemins menant à de nombreux fichiers qui y sont liés, tels que les autres pages du site, les images figurant dans une page, les éléments multimédias incorporés à une page, etc. GoLive utilise automatiquement les chemins relatifs pour les destinations de liens. L’utilisation des chemins relatifs est appropriée dans la plupart des cas. Si nécessaire, vous pouvez toutefois modifier de manière sélective ces chemins et les transformer en chemins absolus, ou définir une préférence afin que GoLive transforme par défaut tous les nouveaux chemins créés en chemins absolus. Lorsqu’un chemin est défini comme étant absolu, cela signifie que l’intégralité du chemin, du dossier racine au fichier lié, est indiquée. Dans le cas contraire, seul un chemin relatif est fourni. Par exemple : Une page /racine/pages/info/page.html (où racine correspond au nom du dossier racine) comprend l’image /racine/images/image.gif. Le chemin absolu vers ce fichier image est /racine/images/image.gif, tandis que son chemin relatif est ../../images/image.gif. Les chemins absolus s’avèrent particulièrement utiles dans les cas suivants : • Lorsqu’un formulaire fait référence à un script CGI au niveau de la racine du répertoire d’un site (ou de tout autre sous-répertoire), toutes les références à ce fichier sont généralement indiquées de manière absolue. • Lorsqu’une barre de navigation commune est utilisée sur plusieurs pages situées à différents niveaux hiérarchiques, vous pouvez référencer ses fichiers image à l’aide d’un chemin absolu et permettre le copier-coller d’un même extrait de code dans toutes les pages. L’utilisation de chemins absolus est toutefois réservée aux sites situés sur un serveur Web fournissant des informations sur l’emplacement de leur dossier racine. Les chemins absolus ne vous permettent pas, par conséquent, d’afficher un aperçu des pages dans un navigateur Web sur l’ordinateur local, ce navigateur n’étant pas en mesure d’en localiser le dossier racine. Remarque : Dans GoLive, un chemin absolu ne désigne pas un chemin intégral avec pour point de départ la racine du système de fichiers, ni un URL complet. Configuration de chemins de liens absolus Vous pouvez indiquer des chemins absolus pour tous les nouveaux liens ou pour des liens spécifiques. Pour plus de détails sur la création de liens, voir « Liaison des fichiers », page 55. Pour rendre le chemin d’un lien absolu : 1 Sélectionnez le lien. 2 Effectuez l’une des opérations suivantes : • Choisissez Relatif dans le menu contextuel d’URL de l’inspecteur, si cette case est cochée. (Si tel n’est pas le cas, le lien est absolu.) Comment utiliser l'aide | Sommaire | Index Page précédente 304 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index • Page précédente 305 Choisissez Modifier dans le menu contextuel d’URL de l’inspecteur. Dans la boîte de dialogue Modifier l’URL qui s’affiche, cliquez sur Chemin absolu, puis sur OK. Cette boîte de dialogue permet également d’ajouter des paramètres à l’URL et de faire en sorte que les valeurs de ces paramètres proviennent de sources de données de contenu dynamique. (Pour plus de détails, voir « Transmission des paramètres entre pages », page 589.) Pour configurer une préférence permettant de rendre tous les nouveaux liens absolus : 1 Choisissez Edition > Préférences. 2 Développez l’icône Général, puis choisissez Gestion des URL. 3 Cliquez sur la case Créer uniquement des liens absolus dans le panneau droit, puis cliquez sur OK. Pour définir un paramètre de site permettant de rendre tout nouveau lien absolu dans le site actif uniquement : 1 Ouvrez un site. 2 Cliquez sur le bouton Configurer le site Configuration. de la barre d’outils ou choisissez Site > 3 Choisissez Gestion des URL dans le panneau gauche. 4 Cliquez sur la case Créer uniquement des liens absolus dans le panneau droit, puis cliquez sur OK. A propos des vues graphiques du site GoLive fournit des vues de site qui sont des représentations graphiques des pages d’un site et des liens qui les unissent. Vous pouvez utiliser conjointement les vues graphiques du site et la fenêtre de site pour afficher et modifier le contenu et la structure du site Web, ainsi que vérifier les liens et les relations entre les pages. • La vue de navigation affiche une arborescence des pages (en commençant par la page d’accueil) sous-jacentes au réseau de liens du site. Vous pouvez ajouter des pages à la structure, en déplacer ou en ouvrir dans la vue de navigation. (Pour plus de détails, voir « A propos de la vue de navigation », page 306.) • La vue des liens affiche un réseau des liens entrants et sortants de chaque page vers d’autres pages, images ou fichiers multimédias du site, ainsi que vers des URL externes ou des adresses électroniques. Vous pouvez développer ou réduire les différents niveaux de liens pour afficher la structure globale des liens du site ou les liens d’une seule page. (Pour plus de détails, voir « A propos de la vue des liens », page 307.) Les pages affichées dans chaque vue graphique du site sont également répertoriées dans le panneau Fichiers de la fenêtre de site. Lorsque vous sélectionnez une page d’une vue, vous pouvez sélectionner cette même page dans le panneau Fichiers en cliquant sur le bouton Localiser dans le site de la barre d’outils. Les options de la palette Affichage permettent de développer les vues de site dans des panneaux supplémentaires affichant un panorama du site, les pages de références utilisées par une page sélectionnée du site ou des pages de travail qui ne sont liées à aucune page du site. Comment utiliser l'aide | Sommaire | Index Page précédente 305 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 306 GoLive propose également d’autres outils graphiques pour la gestion et l’affichage de sites Web. Vous pouvez générer un rapport sur le site afin d’afficher une vue de navigation ou une vue structurelle d’un site. (Pour plus de détails, voir « Affichage des rapports sur le site », page 333.) La palette Liens entrants et sortants permet d’afficher les liens entrants et sortants pour les différents fichiers ainsi que de modifier les liens et les références à des fichiers pour l’ensemble d’un site. (Pour plus de détails, voir « Utilisation de la palette Liens entrants et sortants », page 320.) Vous pouvez également afficher la hiérarchie des pages et les connexions entre les éléments de construction de site à l’aide de diagrammes de conception. (Pour plus de détails, voir « A propos des diagrammes de conception », page 406.) Affichage d’une vue graphique du site Vous pouvez afficher une vue de navigation ou une vue des liens d’un site. Pour afficher une vue graphique du site : 1 Ouvrez le fichier projet du site approprié. 2 Effectuez l’une des opérations suivantes : • Pour afficher la vue de navigation, cliquez sur le bouton Vue de la navigation de la barre d’outils ou choisissez Site > Afficher > Navigation. Vous pouvez également choisir Diagramme > Navigation. • Pour afficher la vue des liens, choisissez Site > Afficher> Liens. Vous pouvez également activer la vue de navigation, puis cliquez sur l’onglet Liens. A propos de la vue de navigation Dans le cas d’un nouveau site importé, la vue de navigation présente la structure de celuici sous la forme d’une arborescence partant de la page d’accueil. Dans le cas d’un nouveau site vierge, elle affiche seulement une page d’accueil, à laquelle vous pouvez ajouter des pages vierges en utilisant le même type de hiérarchie pour créer la structure du site. Cette méthode permet également d’ajouter des pages et des sous-structures dans un site importé. (Pour plus de détails, voir « Ajout de pages vierges et de liens en attente à une hiérarchie », page 322.) Dans les deux cas, la hiérarchie est constituée de relations logiques entre des couples de pages, dans lesquels une page particulière peut jouer le rôle d’enfant, de parent, de frère précédent ou de frère suivant. La relation parent-enfant type est celle existant entre une page d’accueil et les pages liées à celle-ci. A B Vue de la navigation A. Page d’accueil B. Enfants de la page d’accueil Comment utiliser l'aide | Sommaire | Index Page précédente 306 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 307 La relation frère-frère type est celle existant entre la première (précédente) et la deuxième (suivante) page d’une séquence de pages similaire à un livre. Une fois la structure du site établie, vous pouvez insérer un contenu dans les pages vierges et créer des liens entre elles de manière à refléter cette structure. Une autre solution consiste à reconstituer la hiérarchie avec d’autres paramètres afin de créer une structure différente avant de définir les liens correspondants. (Pour plus de détails, voir « Résolution d’une hiérarchie », page 327.) A propos de la vue des liens Lorsque vous ouvrez la vue des liens d’un site particulier, elle affiche le fichier de la page d’accueil de ce site (souvent appelée index.html). Si le site en question contient des pages reliées à la page d’accueil par des liens, des pages associées à celles-ci via des liens, etc., vous pouvez les visualiser en développant la vue, tout d’abord à partir de la page d’accueil, puis à partir des autres pages répertoriées. Chaque développement de la vue affiche les fichiers liés à celui que vous avez développé. Les développements dans une direction affichent les liens entrants, c’est-à-dire ceux qui ont pour destination le fichier développé et pour origine d’autres fichiers. Les développements dans la direction opposée affichent les liens sortants, c’est-à-dire ceux qui ont pour origine le fichier développé et pour destination d’autres fichiers. Un même fichier peut apparaître plusieurs fois dans la vue, par exemple en tant que lien entrant à gauche d’un fichier développé et en tant que lien sortant à droite de celui-ci. A B C D Vue des liens A. Lien entrant B. Page d’accueil C. Lien sortant D. Fichier non développé Vous pouvez choisir d’afficher uniquement les liens entrants, les liens sortants, le chemin du lien que vous explorez actuellement, ou encore de ne visualiser aucun lien. (Pour plus de détails, voir « Définition de l’affichage des liens », page 317.) Pour modifier ou corriger des liens, sélectionnez d’abord les fichiers dans la vue des liens, puis effectuez les modifications requises dans la palette Liens entrants et sortants. (Pour plus de détails, voir « Utilisation de la palette Liens entrants et sortants », page 320.) Comment utiliser l'aide | Sommaire | Index Page précédente 307 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 308 Modification des vues de site Vous pouvez déplacer les vues de navigation et des liens de site afin de les agencer selon plusieurs configurations de fenêtres et varier les vues affichées dans celles-ci pour faciliter la visualisation du site. Développement et réduction des vues Le développement ou la réduction de l’arborescence d’un fichier dans une vue de site revient à afficher ou à masquer les fichiers liés à celui-ci. Cette fonction est très similaire au développement ou à la réduction de l’arborescence des dossiers dans l’Explorateur Windows ou dans le Finder Mac OS. Lorsque vous développez un fichier, il reste dans cet état jusqu’à ce que vous décidiez de le réduire. Par exemple, si vous réduisez un fichier à l’origine d’une longue arborescence, celle-ci disparaît complètement. Si vous développez à nouveau ce fichier, toute l’arborescence réapparaît, et non pas uniquement les fichiers directement liés à celui-ci. Le développement de l’arborescence des fichiers à partir de la page d’accueil permet de visualiser un site dans sa totalité. Comme la plupart des sites contiennent trop de fichiers pour que vous puissiez tous les afficher en même temps et comme le défilement de la vue peut se révéler malaisé, vous êtes parfois amené à réduire l’arborescence pour visualiser une autre partie du site. Néanmoins, plusieurs techniques plus précises permettent de déplacer et de réduire une vue. (Pour plus de détails, voir « Agrandissement et réduction de la vue », page 313 et « Centrage des vues et affichage d’arborescences partielles », page 313.) Pour développer complètement la vue d’un site ou une arborescence de ce site : 1 Effectuez l’une des opérations suivantes dans la vue de navigation ou des liens : • Pour développer complètement la vue d’un site, sélectionnez la page d’accueil (index.html). • Pour développer complètement la vue d’une arborescence du site (une page sélectionnée et l’ensemble des pages qui en dépendent), sélectionnez la page située au premier niveau de la hiérarchie. 2 Cliquez sur le bouton Tout développer de la barre d’outils. Pour développer progressivement la vue d’un site : 1 Effectuez l’une des opérations suivantes : • Dans la vue de navigation, cliquez sur le bouton de développement de la page qui vous intéresse pour visualiser son ou ses enfants. affiché en regard • Dans la vue des liens, cliquez sur le bouton de développement affiché en regard de la page qui vous intéresse pour visualiser ses liens entrants ou sortants. L’emplacement du bouton de développement par rapport à cette page détermine si les liens sont entrants ou sortants. (Pour plus de détails, voir « Modification de l’orientation d’une vue », page 309.) 2 Continuez à cliquer sur les boutons de développement jusqu’à ce que la vue soit développée comme vous le souhaitez. Comment utiliser l'aide | Sommaire | Index Page précédente 308 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 309 Pour réduire progressivement la vue d’un site : 1 Effectuez l’une des opérations suivantes : • Dans la vue de navigation, cliquez sur le bouton de réduction page qui vous intéresse pour masquer son ou ses enfants. affiché en regard de la • Dans la vue des liens, cliquez sur le bouton de réduction affiché en regard de la page qui vous intéresse pour masquer ses liens entrants ou sortants. 2 Continuez à cliquer sur les boutons de réduction jusqu’à ce que la vue soit réduite comme vous le souhaitez. Pour afficher des informations détaillées sur un développement (Windows uniquement) : Si vous exécutez GoLive sous Windows, survolez le bouton de développement avec le pointeur avant de cliquer dessus. Une info-bulle indique le nombre d’enfants et de liens entrants ou sortants affichés lors du développement. Modification de l’orientation d’une vue La première fois que vous visualisez un site, sa vue de navigation est présentée dans l’orientation paysage et sa vue des liens dans l’orientation portrait. La vue de navigation et la vue des liens peuvent toutes deux être affichées dans une orientation portrait ou paysage. A B Comparaison des orientations paysage et portrait d’une vue de navigation A. Orientation paysage B. Orientation portrait Ces deux vues utilisent quatre directions pour indiquer les différents types de liens. Par exemple, une vue de navigation affichée en mode paysage affiche le parent d’une page au-dessus de celle-ci. Comment utiliser l'aide | Sommaire | Index Page précédente 309 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 310 Dans l’orientation paysage, une vue de navigation utilise les quatre directions comme suit : la page parent est affichée au-dessus, la page enfant au-dessous, la page précédente à gauche et la page suivante à droite. Dans l’orientation portrait, la page parent est située à gauche et la page précédente au-dessus. Dans l’orientation portrait, une vue des liens utilise deux directions comme suit : elle affiche à gauche le lien entrant et à droite le lien sortant. Dans l’orientation paysage, le lien entrant est situé au-dessus. Pour modifier l’orientation d’une vue : Effectuez l’une des opérations suivantes : • Cliquez sur le bouton Alterner entre Portrait et Paysage de la barre d’outils. • Choisissez Portrait ou Très grande dans le panneau Navigation ou Liens de la palette Affichage. Utilisation des panneaux périphériques des vues de site La vue de navigation et la vue des liens de site contiennent généralement un panneau unique, mais vous pouvez également afficher jusqu’à trois panneaux spéciaux supplémentaires autour du panneau principal d’une vue. Panneau panoramique Ce panneau offre une vue d’ensemble du site. La vue comporte un rectangle de visualisation rouge correspondant à la vue active du panneau principal. Vous pouvez faire défiler la vue du site affiché dans le panneau principal en déplaçant le rectangle de visualisation rouge dans le panneau panoramique. Toutes les opérations que vous effectuez dans le panneau principal sont également réalisables dans le panneau panoramique : vous pouvez sélectionner une page, faire glisser une page vers une autre dans la vue de navigation pour qu’elle devienne l’enfant ou le parent de la page en question, etc. Le panneau panoramique est disponible dans la vue de navigation et la vue des liens. Panneau de travail Ce panneau affiche deux types de fichiers placés dans le dossier racine du site et répertoriés dans le panneau Fichiers de la fenêtre de site : les pages HTML qui ne font pas partie de la hiérarchie de navigation du site et les fichiers multimédias qui ne sont pas référencés sur une page HTML répertoriée dans le panneau Fichiers. Le panneau de travail est uniquement disponible dans la vue de navigation. Vous pouvez faire glisser des pages HTML du panneau de travail de la vue de navigation vers le panneau principal de celle-ci. L’utilisation du panneau de travail d’une vue de navigation est identique à celle du panneau principal. Vous pouvez faire glisser une page vers une page cible dans le panneau principal et la positionner de sorte qu’elle devienne le parent, l’enfant ou le frère de la page cible. Si vous le souhaitez, élaborez sur le même principe des arborescences partielles dans le panneau de travail et faites-les glisser vers des pages cibles. (Pour plus de détails, voir « Ajout de pages vierges et de liens en attente à une hiérarchie », page 322 et « Réorganisation des éléments d’une hiérarchie », page 324.) Panneau de référence Ce panneau affiche les objets multimédias incorporés à une ou plusieurs pages sélectionnées dans le panneau principal ou panoramique. Vous pouvez facilement parcourir les objets incorporés en sélectionnant différentes pages dans le panneau principal. Le panneau de référence n’affiche pas les fichiers multimédias liés à la page HTML, tel qu’un fichier image volumineux lié à la vignette d’une image incorporée à la page. Le panneau de référence est disponible dans la vue de navigation et la vue des liens. Comment utiliser l'aide | Sommaire | Index Page précédente 310 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 311 Dans la pratique, vous n’ouvrez généralement qu’un ou deux panneaux à la fois, en fonction de vos besoins immédiats. A B C D Panneaux périphériques d’une vue de navigation en orientation paysage A. Panneau panoramique B. Panneau de référence C. Panneau principal D. Panneau de travail La vue de navigation est représentée dans une orientation paysage. Lorsque l’orientation de la vue de navigation est de type portrait, le panneau panoramique se trouve à gauche, le panneau de travail à droite et le panneau de référence au-dessus. (Pour plus de détails, voir « Modification de l’orientation d’une vue », page 309.) Affichage et redimensionnement des panneaux périphériques Vous pouvez afficher ou masquer les panneaux périphériques et modifier leur taille par rapport à celle du panneau principal. Lorsque vous affichez et redimensionnez un panneau périphérique, ce panneau fait partie, dans les proportions de sa taille active, de la vue par défaut jusqu’à ce que vous le masquiez. Pour afficher ou masquer un panneau périphérique : 1 Effectuez l’une des opérations suivantes : • Pour afficher ou masquer le panneau périphérique de la vue de navigation, affichez cette dernière. • Pour afficher ou masquer le panneau périphérique de la vue des liens, affichez cette dernière. 2 Pour afficher ou masquer le panneau périphérique, effectuez l’une des opérations suivantes : • Choisissez le panneau périphérique dans le menu de la fenêtre de site. Les panneaux affichés sont signalés par une coche. Choisissez un panneau portant une coche pour le masquer. • Dans le panneau Navigation de la palette Affichage, cochez la case Panorama, Travail ou Référence pour afficher le panneau approprié. Pour masquer les panneaux, désactivez ces options sous Affichage du panneau. Comment utiliser l'aide | Sommaire | Index Page précédente 311 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index • Page précédente 312 Dans le panneau Liens de la palette Affichage, cochez la case Panorama ou Référence. Pour masquer les panneaux, désactivez ces options sous Affichage du panneau. Pour redimensionner un panneau périphérique : 1 Affichez le panneau que vous souhaitez redimensionner. 2 Faites glisser la barre le séparant du panneau principal dans la direction voulue. Pour simplifier la conception d’un site, utilisez le panneau de travail afin d’élaborer des modules de site (arborescences partielles) et le panneau principal pour les assembler. Défilement de la vue dans le panneau principal Vous pouvez utiliser une vue miniature d’un site entier pour faire défiler plus facilement la vue du site affichée dans le panneau principal et vous concentrer sur une sous-arborescence particulière. Vous pouvez utiliser le panneau panoramique ou la palette Navigateur du site pour afficher des sections distantes du site en faisant défiler le panneau principal. Les barres de défilement du panneau principal suffisent généralement pour les déplacements réduits. Le panneau panoramique et la palette Navigateur du site affichent tous les deux une vue miniature du site entier, dont la partie active dans le panneau principal est délimitée par un rectangle de visualisation rouge qu’il suffit de faire glisser pour faire défiler la vue du panneau principal. Lorsque vous redimensionnez le panneau principal ou modifiez le pourcentage d’agrandissement pour effectuer un zoom avant ou arrière, la taille du rectangle rouge change en conséquence dans la vue miniature. Il existe une différence majeure entre la palette Navigateur du site et le panneau panoramique. Bien que la palette Navigateur du site soit une représentation du site, le panneau panoramique en est une vue réelle, de sorte que vous pouvez manipuler des objets dans ce panneau même s’ils ne sont pas visibles dans le panneau principal. Par exemple, vous pouvez faire glisser une page du panneau panoramique située à l’extérieur du panneau principal vers l’intérieur de celui-ci. Pour afficher une autre section du site en faisant défiler la vue du panneau principal : 1 Effectuez l’une des opérations suivantes : • Affichez le panneau panoramique. • Choisissez Fenêtre > Navigateur du site. 2 Effectuez l’une des opérations suivantes : • Dans le panneau panoramique ou la palette Navigateur du site, faites glisser le rectangle de visualisation rouge vers une autre section du site. La vue du panneau principal défile en même temps que le rectangle de visualisation. • Sélectionnez un fichier situé à l’extérieur du rectangle de visualisation. La vue du panneau principal défile et affiche le fichier en question. • Maintenez la barre d’espacement enfoncée et faites glisser la vue. Comment utiliser l'aide | Sommaire | Index Page précédente 312 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 313 Agrandissement et réduction de la vue Vous pouvez sélectionner divers pourcentages d’agrandissement dans un menu ou effectuer un zoom avant sur une zone donnée. Quoi qu’il en soit, vous travaillez séparément dans le panneau principal, de travail ou de référence. Vous pouvez également utiliser un curseur dans la palette Navigateur du site pour redimensionner avec précision la vue dans le panneau principal. Pour agrandir ou réduire la vue du panneau principal à l’aide d’un menu Zoom : Cliquez sur le bouton de zoom situé dans le coin inférieur gauche du panneau principal, puis sélectionnez un facteur de zoom dans le menu contextuel qui s’affiche. Pour effectuer un zoom avant sur une zone donnée : 1 Maintenez la touche Maj (Windows) ou Option (Mac OS) enfoncée. Si le pointeur se trouve dans un panneau sur lequel vous n’avez pas encore effectué de zoom avant, il se transforme alors en outil Zoom avant . Dans le cas contraire, il se transforme en outil Zoom arrière . 2 Effectuez l’une des opérations suivantes dans le panneau principal, de travail ou de référence : • Placez le pointeur dans la zone souhaitée et cliquez. Le facteur d’agrandissement passe à 200 % au premier clic, puis à 100 % au deuxième. • Tracez un rectangle autour de la zone voulue et relâchez le bouton de la souris. La zone s’agrandit jusqu’à remplir le panneau. Vous pouvez répéter cette opération jusqu’à ce que l’affichage atteigne 500 %. Vous pouvez utiliser la palette Navigateur du site pour agrandir la vue sur une zone donnée. Cette opération équivaut à effectuer un zoom avant. Pour agrandir ou réduire la vue du panneau principal à l’aide de la palette Navigateur du site : 1 Choisissez Fenêtre > Navigateur du site. 2 Effectuez l’une des opérations suivantes : • Cliquez sur le bouton de zoom avant ou de zoom arrière . • Faites glisser le curseur de zoom. • Saisissez le pourcentage d’agrandissement ou de réduction requis dans la zone de texte située dans le coin inférieur gauche de la palette Navigateur du site. Centrage des vues et affichage d’arborescences partielles La commande Placer au centre permet de limiter à une page la vue des liens et ses liens entrants et sortants. La commande Arborescence partielle permet, quant à elle, de limiter la vue de navigation à une arborescence partielle, c’est-à-dire à une ou plusieurs pages sélectionnée(s) ainsi qu’à ses/leurs descendants logiques (enfants, petits-enfants, etc.). La méthode la plus simple pour délimiter une vue consiste à la développer ou à la réduire. (Pour plus de détails, voir « Développement et réduction des vues », page 308.) Une autre méthode, plus subtile, consiste à utiliser la palette Affichage. (Pour plus de détails, voir « Définition de l’affichage des liens », page 317 et « Filtrage du contenu de la vue », page 319.) Comment utiliser l'aide | Sommaire | Index Page précédente 313 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 314 Pour limiter la vue à une page et ses liens entrants et sortants : 1 Sélectionnez une page dans le panneau principal de la vue des liens. 2 Choisissez Placer au centre dans le menu contextuel. La vue est centrée sur le fichier sélectionné et sur ses liens entrants et sortants. 3 Si vous souhaitez centrer la vue sur un autre fichier, sélectionnez ce dernier et appuyez sur la touche Echap ou choisissez à nouveau Placer au centre dans le menu contextuel. Pour n’afficher que des arborescences partielles : 1 Sélectionnez une ou plusieurs pages dans le panneau principal d’une vue de navigation. 2 Choisissez Arborescence partielle dans le menu contextuel. La vue est limitée à la/aux page(s) sélectionnée(s) et à ses/leurs descendants logiques (sous-arborescences). 3 Pour afficher la totalité de l’arborescence, appuyez sur la touche Echap ou choisissez à nouveau Arborescence partielle dans le menu contextuel. Création et utilisation de collections Une collection est un jeu personnalisé composé d’un ou plusieurs fichiers de pages sélectionnés. Une fois une collection créée, vous pouvez effectuer plusieurs tâches de gestion sur les fichiers de cette collection, telles que la suppression ou la duplication. Ces tâches sont d’autant plus rapides que vous pouvez sélectionner l’ensemble des fichiers en choisissant le nom de la collection dans un menu. Vous devez attribuer un nom unique à chaque collection et pouvez utiliser différentes couleurs d’éclairage pour chacune d’entre elles. Pour afficher les fichiers d’un ensemble, éclairez la collection dans la vue de navigation et la palette Navigateur du site. (Pour plus de détails, voir « Eclairage de groupes de pages et de collections dans une vue de navigation », page 316.) Vous pouvez commencer avec une collection vide et y ajouter des pages ou encore rassembler des pages à l’intérieur d’une collection en une seule opération. Il est également possible de créer une collection à partir d’un rapport sur le site. (Pour plus de détails, voir « Exportation des rapports sur le site », page 333.) A B Utilisation d’éclairages dans une collection de pages A. Eclairage B. Collection de pages Comment utiliser l'aide | Sommaire | Index Page précédente 314 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 315 Pour créer une collection vide : 1 Choisissez Diagramme > Créer une collection. 2 Saisissez le nom de la collection dans la zone de texte prévue à cet effet. 3 Pour sélectionner la couleur d’éclairage de la collection, cliquez sur la case échantillon située en regard du nom, sélectionnez une couleur dans la boîte de dialogue Couleur, puis cliquez sur OK. 4 Vérifiez que la case Ajouter la sélection n’est pas cochée, puis cliquez sur OK. Pour créer une collection sur la base d’une sélection de pages : 1 Sélectionnez une ou plusieurs pages dans la vue de navigation ou des liens. 2 Choisissez Diagramme > Créer une collection. 3 Saisissez le nom de la collection dans la zone de texte prévue à cet effet. 4 Pour ajouter les pages sélectionnées à la collection, veillez à ce que la case Ajouter la sélection soit cochée. 5 Cochez la case Eclairer la collection pour éclairer la collection. Pour sélectionner la couleur d’éclairage de la collection, cliquez sur la case échantillon, sélectionnez une couleur dans la boîte de dialogue Couleur, puis cliquez sur OK. 6 Cliquez sur OK. Pour ajouter des pages à une collection ou en supprimer d’une collection : 1 Sélectionnez une ou plusieurs pages dans la vue de navigation ou des liens. 2 Choisissez Activer/Désactiver la collection dans le menu contextuel. 3 Effectuez l’une des opérations suivantes : • Pour ajouter la ou les page(s) à une collection, choisissez une collection ne portant pas de coche dans le sous-menu Activer/Désactiver la collection. • Pour supprimer la ou les page(s) d’une collection, choisissez une collection portant une coche. Pour sélectionner les pages d’une collection : 1 Choisissez Diagramme > Resélectionner la sélection. 2 Sélectionnez une collection dans le sous-menu qui s’affiche. Pour modifier ou supprimer une collection : 1 Choisissez Diagramme > Modifier les collections. 2 Sélectionnez la collection. 3 Effectuez l’une des opérations suivantes : • Pour renommer la collection, saisissez le nouveau nom dans la zone de texte. • Pour modifier la couleur d’éclairage de la collection, cliquez sur la case échantillon située en regard d’un nom, sélectionnez une couleur dans la boîte de dialogue Couleur, puis cliquez sur OK. • Pour supprimer la collection, cliquez sur Supprimer. 4 Cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 315 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 316 Pour appliquer une commande à une collection : 1 Choisissez Diagramme > Resélectionner la sélection. 2 Sélectionnez une collection dans le sous-menu qui s’affiche. 3 Appliquez la commande à la sélection. Eclairage de groupes de pages et de collections dans une vue de navigation L’éclairage d’une vue de navigation constitue une autre méthode de centrage. Celle-ci vous permet de vous concentrer sur des pages spécifiques sans supprimer les autres pages de la vue. Vous pouvez également éclairer des collections dans les vues de navigation pour lesquelles les informations d’état sur les fichiers s’avèrent utiles. GoLive utilise également l’éclairage sur les pages qui font l’objet d’une requête dans un rapport sur le site. (Pour plus de détails, voir « Affichage des rapports sur le site », page 333.) Vous pouvez éclairer les types de groupes de pages suivants : • Famille éclaire la page sélectionnée ainsi que son parent et ses enfants. • Liens entrants éclaire la page d’origine d’un lien pointant vers la page sélectionnée. • Sortant éclaire la page de destination d’un lien partant de la page sélectionnée. • Attente éclaire tous les liens du site en attente. (Pour plus de détails, voir « Recherche et résolution des liens en attente », page 325.) • Collection éclaire toutes les pages du site à l’intérieur d’une collection de pages sélectionnée. (Pour plus de détails, voir « Création et utilisation de collections », page 314.) A B Les liens en attente sont affichés sous forme de flèches rouges (couleur par défaut). A. Liens en attente B. Structure hiérarchique Pour éclairer des pages dans une vue de navigation : 1 Développez, au besoin, la vue de navigation pour afficher les pages que vous souhaitez éclairer. 2 Sélectionnez la ou les pages(s) que vous souhaitez éclairer. (Cette étape est inutile si vous souhaitez éclairer les liens en attente.) 3 Effectuez l’une des opérations suivantes : • Choisissez Eclairer la famille, Eclairer les liens entrants, Eclairer les liens sortants ou Eclairer les liens en attente dans le menu de la vue de navigation. • Dans le panneau Navigation de la palette Affichage, choisissez Famille, Liens entrants, Sortant ou Attente. Comment utiliser l'aide | Sommaire | Index Page précédente 316 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 317 4 Effectuez l’une des opérations suivantes : • Sélectionnez un autre fichier pour déplacer l’éclairage. • Choisissez une autre commande d’éclairage pour changer de type d’éclairage. Pour éclairer une collection dans une vue de navigation : 1 Développez, au besoin, la vue de navigation pour afficher les pages que vous souhaitez éclairer. 2 Dans le panneau Navigation de la palette Affichage, choisissez une collection dans le menu Collection. Le bouton radio situé à gauche du menu est activé automatiquement. Définition de l’affichage des liens Vous pouvez simplifier une vue de liens en n’affichant que les liens entrants ou sortants. Vous pouvez également concentrer la vue sur un chemin unique que vous explorez en développant la liste des liens. Le développement de la liste des liens réduit automatiquement les autres chemins de liens. Pour définir l’affichage des types et des chemins de liens : 1 Affichez une vue des liens. 2 Dans le panneau Liens de la palette Affichage, cochez (pour afficher) ou désactivez (pour masquer) les cases Liens entrants et Liens sortants. 3 Choisissez Chemins de liens multiples ou Chemin de liens unique. Modification de l’affichage d’une vue Vous pouvez modifier les paramètres d’affichage de la vue de navigation ou des liens pour afficher les éléments sous forme de vignettes, par exemple. Lorsque la vue affiche le panneau de travail ou de référence en plus du panneau principal, les modifications apportées aux paramètres d’affichage s’appliquent uniquement au panneau actif. Les modifications apportées au panneau principal s’appliquent également au panneau panoramique. Vous pouvez modifier un paramètre d’affichage dans les vues de site en passant de la vue graphique par défaut à la vue Structure. La vue Structure affiche de manière hiérarchique les dossiers, les sous-dossiers et les fichiers, tel le panneau Fichiers de la fenêtre de site. Cette vue affiche une représentation plus détaillée et plus compacte des fichiers du panneau principal. Pour modifier l’affichage d’une vue de site : 1 Affichez la vue de navigation ou des liens. 2 Cliquez sur le panneau que vous souhaitez modifier (principal, de travail ou de référence). 3 Cliquez sur l’onglet Affichage de la palette Affichage. 4 Effectuez l’une des opérations suivantes : • Choisissez Graphique ou Structure pour afficher la vue de site dans le mode requis. Lorsque vous sélectionnez Structure, vous pouvez afficher et masquer les colonnes de la structure en sélectionnant les colonnes appropriées dans le menu Afficher les colonnes. Si vous choisissez d’afficher le panneau principal en mode Structure, le panneau panoramique se referme. Comment utiliser l'aide | Sommaire | Index Page précédente 317 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 318 • Pour définir l’affichage des éléments dans la vue, choisissez Icônes, Vignettes, Cadres ou Ellipses. Les ellipses ne sont réellement elliptiques que lorsque la taille du cadre est définie sur Très grande. Sinon, elles sont circulaires. • Pour définir l’affichage des libellés d’éléments, choisissez Nom du fichier ou Titre de la page. • Pour modifier la distance entre les différents éléments d’un panneau, saisissez une largeur et une hauteur dans la zone Taille des cellules. • Pour modifier la taille de chaque élément d’un panneau, sélectionnez une taille de cadre. • Pour modifier la couleur des éléments d’un panneau, cliquez sur la case échantillon Couleur des éléments. Réglez la luminosité en faisant glisser le curseur correspondant, puis cliquez sur une couleur dans la palette de couleurs. La couleur que vous choisissez est appliquée aux cadres des éléments et une teinte plus claire à leur fond. Aucune couleur n’est appliquée si les éléments sont affichés sous la forme d’icônes. Affichage et mise à jour de vignettes Lorsque vous modifiez et enregistrez un fichier HTML ou XHTML, sa vignette est stockée dans le fichier projet de site. Vous pouvez afficher la vignette dans le panneau Contenu de l’inspecteur du fichier, ou encore des pages et des fichiers sous la forme de vignettes dans une vue de navigation ou de liens. Vous avez également la possibilité de générer des vignettes pour l’ensemble des pages d’un site en une seule opération. Ce mode de mise à jour des vignettes s’avère très utile lorsque vous importez un site élaboré et que vous souhaitez disposer de vignettes pour l’ensemble de ses pages dans la vue de navigation du site, préalablement à toute modification. Pour mettre à jour des vignettes dans une vue : 1 Affichez une vue de navigation ou une vue des liens contenant les pages que vous souhaitez afficher sous la forme de vignettes. 2 Vérifiez que les éléments de la vue sont définis pour être affichés sous la forme de vignettes. Cliquez, si nécessaire, sur l’onglet Affichage de la palette Affichage, puis sélectionnez Vignettes sous Apparence des éléments. 3 Effectuez l’une des opérations suivantes : • Développez les pages de la vue que vous souhaitez mettre à jour. • Réduisez les pages que vous ne souhaitez pas mettre à jour. 4 Choisissez Diagramme > Mettre à jour les vignettes. Le temps requis pour la mise à jour dépend du nombre de pages à traiter. Pour mettre à jour une vignette dans l’inspecteur du fichier : 1 Sélectionnez le fichier de la fenêtre de site que vous souhaitez mettre à jour. 2 Dans le panneau Contenu de l’inspecteur du fichier, cliquez sur l’icône Mettre à jour la vignette . Comment utiliser l'aide | Sommaire | Index Page précédente 318 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 319 Filtrage du contenu de la vue Le filtrage d’une vue permet d’en éliminer certains types d’objets, tels que des fichiers multimédias ou liens cycliques. Vous pouvez filtrer une vue de navigation ou une vue des liens. Si la vue affiche des panneaux périphériques en plus du panneau principal, le filtrage n’est appliqué qu’au panneau actif. Le filtrage s’avère particulièrement utile dans le panneau principal d’une vue des liens, car il permet de simplifier la vue des sites complexes. Pour filtrer une vue : 1 Affichez la vue de navigation ou des liens. 2 Cliquez sur le panneau que vous souhaitez modifier (principal, de travail ou de référence). 3 Cliquez sur l’onglet Filtre de la palette Affichage. 4 Sélectionnez toute combinaison d’éléments à afficher. Les éléments non sélectionnés sont masqués. 5 Sélectionnez ou désélectionnez (affichez ou masquez) toute combinaison d’éléments dans la vue. Personnalisation des couleurs d’une vue Toute modification des paramètres de la palette Affichage pour une vue de navigation ou des liens d’un site subsiste lorsque vous affichez à nouveau ce même site. Par exemple, lorsque vous fermez et rouvrez le site, GoLive utilise les paramètres de la palette Affichage pour les panneaux affichés dans la vue de navigation du site. Vous pouvez utiliser cette fonction pour personnaliser les vues de chaque site. Vous pouvez également utiliser la boîte de dialogue de configuration du site pour définir les couleurs des différentes sections des vues de site, telles que les couleurs de fond des panneaux individuels ou les couleurs des éléments et des liens. Pour modifier les paramètres de couleur des vues de site : 1 Effectuez l’une des opérations suivantes : • Pour modifier les couleurs de tous les nouveaux sites, choisissez Edition > Préférences, développez l’icône Site dans le panneau gauche, puis cliquez sur Couleurs de la conception dans le panneau gauche. • Pour modifier les couleurs du site actif uniquement, cliquez sur le bouton Configurer le site de la barre d’outils ou choisissez Site > Configuration. Cliquez sur Couleurs de la conception dans le panneau gauche de la boîte de dialogue de configuration du site, puis cochez la case Paramètres spécifiques au site pour que ces couleurs aient priorité sur les paramètres de la boîte de dialogue Préférences. Remarque : Si vous souhaitez appliquer les couleurs de la boîte de dialogue Préférences à un site existant, ouvrez ce site et assurez-vous que l’option Paramètres spécifiques au site de la boîte de dialogue de configuration du site est désactivée. 2 Cliquez sur la case échantillon associée à l’élément que vous souhaitez modifier. 3 Dans la boîte de dialogue Couleur, choisissez une couleur et cliquez sur OK. 4 Cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 319 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 320 Utilisation de la palette Liens entrants et sortants La palette Liens entrants et sortants est un puissant outil de gestion des liens qui affiche graphiquement les liens ou les références à des fichiers menant à ou provenant d’un fichier ou élément sélectionné dans la fenêtre de site. Vous pouvez modifier les liens ou les références à des fichiers en faisant glisser la souris du bouton d’affectation de la palette Liens entrants et sortants vers un autre fichier ou un autre type d’élément (tel qu’un URL) dans la fenêtre de site. (Pour plus de détails, voir « Modification de liens et d’URL dans l’intégralité du site », page 321.) Le menu de la palette Liens entrants et sortants permet également de définir les types de liens affichés. Cette palette est particulièrement utile pour corriger les erreurs de liens répertoriées dans le panneau Erreurs de la fenêtre de site et pour afficher l’ensemble des pages liées à un fichier manquant. Vous pouvez également imprimer le contenu de la palette Liens entrants et sortants afin d’obtenir une vue du site. Vous pouvez utiliser la palette Liens entrants et sortants avec tout fichier ou autre type d’élément du dossier racine répertorié dans le panneau Fichiers, Externe, Couleurs, Jeux de polices, Bibliothèque, Divers ou Erreurs de la fenêtre de site. Vous pouvez, par exemple, utiliser la palette Liens entrants et sortants pour afficher les fichiers qui utilisent une couleur répertoriée dans le panneau Couleurs ou un jeu de polices répertorié dans le panneau Jeux de polices. Si vous le souhaitez, utilisez cette palette avec un fichier dans la vue de navigation ou des liens, ou encore avec un diagramme dans le panneau Conception de la fenêtre de diagramme. Pour utiliser la palette Liens entrants et sortants afin d’afficher les liens et les références à des fichiers : 1 Cliquez sur le bouton Ouvrir la palette des liens entrants et sortants d’outils ou choisissez Fenêtre > Liens entrants et sortants. de la barre 2 Effectuez l’une des opérations suivantes : • Sélectionnez un fichier ou un autre type d’élément dans la fenêtre de site. • Sélectionnez un fichier dans la vue de navigation ou des liens, ou encore un diagramme dans le panneau Conception de la fenêtre de diagramme. • Ouvrez le fichier dans une fenêtre de document. Les liens entrants sont affichés à gauche de la palette Liens entrants et sortants tandis que les liens sortants ou les références à des fichiers sont affichés à droite. Les fichiers qui font référence à un élément autre qu’un fichier ou qui l’utilisent sont affichés à gauche. Pour limiter les types des liens affichés dans la palette Liens entrants et sortants : 1 Choisissez Options de la palette dans le menu de la palette Liens entrants et sortants. 2 Sélectionnez les éléments que vous souhaitez afficher. Les éléments non sélectionnés sont masqués. 3 Cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 320 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 321 Modification de liens et d’URL dans l’intégralité du site Un site peut contenir plusieurs liens vers une page Web et de nombreux URL faisant référence à des fichiers multimédias, des URL externes ou des adresses électroniques. Si vous le souhaitez, vous pouvez modifier le fichier cible et tous les liens et URL de référence en une seule opération, sans ouvrir les pages qui les contiennent. Par exemple, il se peut que vous deviez modifier tous les URL faisant référence à une image de fond répétée. Important : Utilisez cette fonction avec précaution, car la modification de liens sur l’ensemble d’un site ne peut pas être annulée. Ne remplacez pas, par exemple, une image référencée sans vous être préalablement assuré que les proportions (largeur et hauteur) de la nouvelle image sont identiques à celles que vous souhaitez remplacer. Pour remplacer tous les liens ou URL par un élément cible : 1 Affichez le panneau (Fichiers, Externe ou Divers) de la fenêtre de site dans lequel l’élément cible que vous souhaitez remplacer est répertorié, une image de fond répétée, par exemple. 2 Sélectionnez l’élément. 3 Effectuez l’une des opérations suivantes : • Si le nouvel élément cible à utiliser est visible dans la fenêtre de site, cliquez sur le bouton Ouvrir la palette des liens entrants et sortants de la barre d’outils ou choisissez Fenêtre > Liens entrants et sortants. • Si le nouvel élément cible à utiliser n’est pas visible dans la fenêtre de site, cliquez sur le bouton Modifier les références de la barre d’outils ou choisissez Site > Modifier les références. 4 Effectuez l’une des opérations suivantes : • Si l’élément de remplacement est visible dans la fenêtre de site, faites glisser le pointeur du bouton d’affectation correspondant à l’ancien élément dans la palette Liens entrants et sortants vers l’élément de remplacement dans la fenêtre de site. Modifiez toutes les références au fichier oldlogo.jpg en faisant glisser le pointeur du bouton d’affectation du lien entrant vers le fichier newlogo.jpg dans la fenêtre de site. • Si l’élément de remplacement n’est pas visible dans la fenêtre de site, saisissez son URL dans la zone de texte inférieure (ou naviguez jusqu’à l’élément) de la boîte de dialogue Modifier les références. Cliquez ensuite sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 321 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 322 5 Dans la boîte de dialogue Modifier les références, sélectionnez les fichiers qui contiennent les liens ou URL que vous souhaitez modifier (tous les fichiers sont sélectionnés par défaut), puis cliquez sur OK. Optimisation de la vue du site à l’aide de vues graphiques Si vous partez d’un site vierge, il vaut mieux commencer à le créer dans une vue de navigation. Dans un premier temps, vous allez concevoir sa structure et agencer les pages vierges selon une hiérarchie de liens en attente non résolus, en commençant par définir ceux qui sont en provenance et à destination de la page d’accueil. Ensuite, lorsque les pages auront un contenu, vous pourrez résoudre ces liens en attente en créant les liens correspondants. (Pour plus de détails, voir « Recherche et résolution des liens en attente », page 325.) Cette approche structurelle permet également d’ajouter de nouveaux groupes de pages aux sites déjà développés. Pour ce faire, il suffit d’ancrer la structure des pages vierges à une page du site qui n’est pas la page d’accueil. Ajout de pages vierges et de liens en attente à une hiérarchie Les pages génériques que vous ajoutez à une vue de navigation sont des pages HTML vierges. Elles apparaissent dans la vue sous la forme d’une icône d’avertissement de page vierge . Ces pages portent généralement le nom de fichier sans titre ou sans titren. Pour plus de détails sur l’attribution d’un nouveau nom à ces pages, voir « Attribution d’un nom aux fichiers et aux dossiers », page 302. Remarque : Bien qu’elles soient vierges, les pages génériques contiennent les balises HTML standard nécessaires à la création d’une page HTML. Les pages que vous ajoutez sont soit des pages comportant des liens en attente non résolus, soit des pages de travail qui ne contiennent aucune sorte de lien en attente. Vous insérerez des pages de travail dans une hiérarchie de navigation uniquement pour faciliter leur rattachement ultérieur à celle-ci. (Pour plus de détails, voir « Réorganisation des éléments d’une hiérarchie », page 324.) Pour ajouter une page vierge comportant des liens en attente : 1 Ouvrez une vue de navigation du site. 2 Sélectionnez une page dans cette vue. 3 Effectuez l’une des opérations suivantes : • Cliquez sur le bouton Nouvelle page parent de la barre d’outils ou choisissez Diagramme > Créer > Page parent pour insérer une page entre celle qui est sélectionnée et son parent. La nouvelle page est à la fois l’enfant de l’ancien parent de la page sélectionnée et le parent de celle-ci. Ces trois pages sont reliées par des liens de type « parent à enfant et vice versa », c’est-à-dire par des liens en attente des parents aux enfants, et inversement. • Cliquez sur le bouton Nouvelle page enfant de la barre d’outils ou choisissez Diagramme > Créer > Page enfant pour insérer un enfant doté de liens de type « parent à enfant et vice versa » à partir de la page sélectionnée. Comment utiliser l'aide | Sommaire | Index Page précédente 322 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 323 • Cliquez sur le bouton Nouvelle page suivante de la barre d’outils ou choisissez Diagramme > Créer > Page suivante pour insérer un frère suivant avec des liens de type « aux frères adjacents » à partir de la page sélectionnée, c’est-à-dire un lien en attente de cette page au nouveau frère et un autre lien dans le sens inverse. • Cliquez sur le bouton Nouvelle page précédente de la barre d’outils ou choisissez Diagramme > Créer > Page précédente pour insérer un frère précédent avec des liens de type « aux frères adjacents » à partir de la page sélectionnée, c’est-à-dire un lien en attente de cette page au nouveau frère et un autre lien dans le sens inverse. Remarque : Si vous avez sélectionné la page d’accueil, vous pouvez uniquement choisir le bouton Nouvelle page enfant ou l’option Diagramme > Créer > Page enfant. Pour ajouter un groupe de pages enfant comportant des liens en attente : 1 Ouvrez une vue de navigation du site. 2 Sélectionnez une page dans cette vue. 3 Choisissez Diagramme > Nouvelles pages. 4 Saisissez le nombre de pages à créer dans la zone de texte prévue à cet effet. 5 Effectuez l’une des opérations suivantes, le cas échéant : • Pour attribuer aux pages un nom autre que sans titren, saisissez un nom dans la zone de texte Noms de fichier. • Pour enregistrer les pages dans un dossier autre que celui de la page sélectionnée, saisissez le nom du dossier dans la zone de texte Dossier ou cliquez sur l’icône de dossier, puis naviguez jusqu’au dossier approprié. • Pour utiliser une page de gabarit, cochez la case Gabarit, puis sélectionnez la page de gabarit requise dans le menu. (Pour plus de détails, voir « Utilisation de gabarits », page 346.) • Pour utiliser un modèle de page, cochez la case Modèle, puis sélectionnez le modèle de page requis dans le menu. (Pour plus de détails, voir « Utilisation de modèles de page », page 338.) 6 Choisissez l’une des options suivantes dans le menu Parent pour créer des liens en attente : • « et chaque enfant » permet d’établir des liens en attente de la page parent vers chacun des enfants que vous créez. • « et chaque enfant et vice versa » permet d’établir des liens en attente à double sens entre le parent et chaque page enfant que vous créez. • « et le premier enfant uniquement » permet d’établir un lien en attente du parent uniquement vers la première page enfant que vous créez. • Aucun permet de ne pas établir de lien en attente vers les pages enfant que vous créez. 7 Choisissez l’une des options suivantes dans le menu Frère pour créer des liens en attente : • « et le frère suivant » permet d’établir des liens en attente de type « précédent à suivant » entre les pages enfant que vous créez. (Un lien de ce type est également généré entre le premier frère que vous créez et le dernier de ses frères existants.) Comment utiliser l'aide | Sommaire | Index Page précédente 323 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 324 • « et les frères adjacents » permet d’établir des liens en attente à double sens entre les pages enfant que vous créez. (Un lien de ce type est également généré entre le premier frère que vous créez et le dernier de ses frères existants.) • « et tous les frères » permet d’établir des liens en attente à double sens entre toutes les pages enfant que vous créez. • Aucun permet de ne pas générer de lien en attente (dans un sens ou dans l’autre) à partir des pages enfant que vous créez. 8 Cliquez sur Créer. GoLive génère les nouvelles pages et les liens en attente non résolus. Pour résoudre un lien en attente entre deux pages, ajoutez un lien de la page source vers la page cible. (Pour plus de détails, voir « Recherche et résolution des liens en attente », page 325.) Pour ajouter une page de travail vierge : Sélectionnez un dossier dans le panneau Fichiers, puis choisissez Site > Créer > Page. GoLive affiche les pages de travail dans le panneau de travail de la vue de navigation du site. (Pour plus de détails, voir « Utilisation des panneaux périphériques des vues de site », page 310.) Pour ajouter un lien en attente entre deux pages : 1 Dans la vue de navigation, pointez la souris sur la page choisie pour être la page source. 2 Appuyez sur les touches Ctrl + Maj (Windows) ou Commande (Mac OS). Le pointeur affiche une icône d’affectation . 3 Faites-la glisser vers la page cible. Un nouveau lien en attente est créé. Les pages source et cible peuvent être définies indifféremment : il n’est pas nécessaire qu’elles soient liées par une relation de famille. Pour supprimer une page d’une vue de navigation : 1 Sélectionnez la page en question. Si cette page a des descendants, ils seront déplacés vers le panneau de travail une fois que vous l’aurez supprimée. (Pour plus de détails, voir « Utilisation des panneaux périphériques des vues de site », page 310.) 2 Effectuez l’une des opérations suivantes : • Pour placer la page sur le panneau de travail sans la supprimer, choisissez Diagramme > Déplacer vers le panneau. • Pour supprimer la page, cliquez sur le bouton Supprimer de la barre d’outils, choisissez Edition > Supprimer ou appuyez sur la touche Suppr. Réorganisation des éléments d’une hiérarchie Il est très facile de modifier la position d’une page dans la vue de navigation. En effet, il suffit de la faire glisser vers une autre page (sa page cible) et de la placer de sorte qu’elle devienne le parent, l’enfant ou le frère de celle-ci. Si la page que vous déplacez a des enfants ou des descendants, ils sont automatiquement déplacés en même temps qu’elle et sa position au sein de la famille (c’est-à-dire ses liens en attente vers son parent et ses frères) est modifiée en conséquence. Vous pouvez apporter des modifications majeures à la structure d’un site simplement en déplaçant quelques pages. Vous avez également la possibilité de faire glisser des pages du panneau de travail vers la hiérarchie, et inversement. Comment utiliser l'aide | Sommaire | Index Page précédente 324 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 325 Pour modifier la position d’une page et de ses descendants dans le site : Dans la vue de navigation, faites glisser la page vers la page cible comme suit : • Dans l’orientation paysage, faites-la glisser au-dessus, au-dessous, à gauche ou à droite de la page cible, selon que vous souhaitez en faire le parent, l’enfant, le frère précédent ou le frère suivant de celle-ci. Une ligne s’affiche, selon le cas, au-dessus, au-dessous, à droite ou à gauche de la page cible pour indiquer où déposer la page sélectionnée. • Dans l’orientation portrait, faites glisser la page sélectionnée à gauche, à droite, audessous ou au-dessus de la page cible, selon que vous souhaitez en faire le parent, l’enfant, le frère suivant ou le frère précédent de celle-ci. Une ligne s’affiche, selon le cas, à gauche, à droite, au-dessous ou au-dessus de la page cible pour indiquer où déposer la page sélectionnée. A B Déplacement d’une page dans une vue de navigation A. Page déplacée vers un nouveau parent B. Nouvelle position de la page près de ses nouveaux frères Pour modifier la position d’une page de travail dans la hiérarchie : 1 Ouvrez le panneau de travail dans la vue de navigation. (Pour plus de détails, voir « Utilisation des panneaux périphériques des vues de site », page 310.) 2 Faites glisser une page du panneau de travail vers la position appropriée dans le panneau principal. Recherche et résolution des liens en attente Si vous avez effectué la mise en page du site dans une vue de navigation avant d’ajouter un contenu à ses différentes pages et de créer des liens entre celles-ci, il se peut que certains liens en attente ne soient pas encore résolus. Comment utiliser l'aide | Sommaire | Index Page précédente 325 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 326 Les liens en attente vous rappellent que vous devez créer des liens entre certains couples de pages généralement associées par un lien logique. A l’instar des liens réels, les liens en attente ont une direction. Ainsi, un lien en attente parent-enfant peut être défini dans le sens « parent à enfant » ou « parent à enfant et vice versa ». Une fois que vous avez créé un lien réel entre des pages pour définir un lien en attente, ce dernier est résolu. Les liens en attente non résolus sont ceux qui n’ont pas de lien réel équivalent. Dans les vues de navigation, les pages cibles de liens en attente non résolus à partir de la page sélectionnée dans le panneau principal sont affichées dans la palette Liens en attente. Il convient donc de vérifier s’il subsiste des liens non résolus et, le cas échéant, de les résoudre. Pour rechercher des liens en attente non résolus : 1 Ouvrez une vue de navigation du site. 2 Choisissez Fenêtre > Liens en attente. 3 Effectuez l’une des opérations suivantes : • Pour rechercher des liens en attente dans un fichier, sélectionnez ce fichier dans la vue de navigation. Si le fichier contient un ou plusieurs liens en attente, une flèche pointant vers chaque fichier cible s’affiche dans la colonne Attente de la palette Liens en attente. Les flèches de liens en attente pointent vers les fichiers cibles. • Pour afficher les liens en attente de l’ensemble des fichiers, choisissez Eclairer les liens en attente dans le menu de la vue de navigation afin d’éclairer les liens en attente non résolus avec des flèches. La flèche pointe dans la direction opposée des fichiers source contenant des liens en attente, c’est-à-dire les fichiers ne contenant aucun lien réel. Si une ligne entre deux fichiers présente deux flèches, ces deux fichiers contiennent un lien en attente. Pour résoudre un lien en attente non résolu : 1 Choisissez Fenêtre > Liens en attente. 2 Sélectionnez la page dans la fenêtre de site ou la vue de navigation qui est la source du lien en attente non résolu. La palette Liens en attente répertorie les pages cibles faisant l’objet de liens en attente non résolus dans la page source. Un lien en attente est indiqué par une flèche pointant vers le fichier cible dans la colonne Attente. Comment utiliser l'aide | Sommaire | Index Page précédente 326 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 327 3 Ouvrez la page source dans l’éditeur de mise en page. 4 Effectuez l’une des opérations suivantes : • Faites glisser une page cible de la palette Liens en attente vers la page source dans l’éditeur de mise en page. GoLive crée, au point d’insertion, un lien vers la page cible. • Créez un lien dans la page source vers une page cible répertoriée dans la palette Liens en attente. (Pour plus de détails, voir « Liaison des fichiers », page 55.) Une fois le lien créé, GoLive supprime la flèche pointant vers le fichier cible dans la palette Liens en attente. Résolution d’une hiérarchie Lors de l’importation d’un site, GoLive analyse automatiquement les liens figurant dans les pages et examine la structure des fichiers afin de créer une structure hiérarchique du site. Ce processus est appelé « résolution d’une hiérarchie ». La structure initiale est basée à la fois sur le réseau de liens présents sur les pages du site et sur la hiérarchie des sousdossiers du dossier racine. Cette structure contient également des liens en attente et des liens réels, c’est-à-dire un enregistrement de toutes les relations de type parent-enfant ou frère-frère possibles compte tenu de la hiérarchie existante. Vous devez résoudre une hiérarchie si vous avez modifié le site dans un programme autre que GoLive ou si vous souhaitez fonder la structure de navigation du site sur des principes différents. Par exemple, si la hiérarchie des sous-dossiers du dossier racine est sans rapport avec la logique de navigation du site, vous pouvez choisir de baser sa structure entièrement sur les liens. Pour résoudre la hiérarchie d’un site : 1 Affichez le site dans la vue de navigation. 2 Choisissez Diagramme > Résoudre l’arborescence. 3 Effectuez une sélection parmi ces options : • Liens permet d’extrapoler la hiérarchie à partir du réseau de liens définis dans les pages du site. • Arborescence des dossiers permet de fonder la hiérarchie sur celle des sous-dossiers du dossier racine. Utilisez l’option Arborescence des dossiers si vous avez conçu la hiérarchie réelle des dossiers de sorte à refléter celle des pages du site. 4 Cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 327 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 328 Correction des erreurs de site L’utilisation systématique de GoLive pour la gestion d’un site permet de réduire considérablement les erreurs de site. GoLive maintient le site intact en effectuant un suivi de toutes les opérations de déplacement, d’attribution d’un nouveau nom ou de suppression de fichiers dans la fenêtre de site. En outre, le programme vous invite immédiatement à mettre à jour l’ensemble des liens et références à des fichiers. La plupart des erreurs de site résultent de l’utilisation du Finder (Mac OS) ou de l’Explorateur (Windows) au lieu de GoLive pour déplacer, renommer ou supprimer des fichiers. Lorsque vous rafraîchissez la fenêtre de site, GoLive répertorie ces fichiers en tant que fichiers manquants ou orphelins et l’ensemble des liens vers ces fichiers deviennent alors des erreurs de site. GoLive répertorie et établit un suivi des erreurs de liens à l’aide des panneaux Erreurs et Externe de la fenêtre de site ainsi que de la palette Liens entrants et sortants. Lorsqu’un fichier du dossier racine du site contient une erreur ou une erreur potentielle, la colonne Etat du panneau Fichiers de la fenêtre de site affiche une des icônes d’erreur au lieu de l’icône de marque de sélection . (Les icônes d’erreur n’apparaissent pas en regard des dossiers dans un site de groupe de travail.) Cette icône apparaît également en regard du fichier dans les vues de navigation et les vues de liens. Les différentes icônes d’erreur sont les suivantes : • L’icône d’insecte signale qu’il existe des liens rompus dans un fichier de page Web. • L’icône d’avertissement • L’icône de stop signale qu’un fichier est manquant. (Pour plus de détails, voir « Recherche de fichiers manquants ou orphelins sur le site », page 329.) indique qu’une page est vierge. Lorsqu’une icône d’erreur est affichée en regard d’un dossier dans la colonne Etat, cela signifie qu’un ou plusieurs de ses fichiers contiennent l’erreur correspondante. Important : Avant de rechercher la présence d’erreurs sur le site, veillez à rafraîchir la fenêtre de site afin d’afficher les informations d’état mises à jour. (Pour plus de détails, voir « Rafraîchissement de la fenêtre de site », page 298.) Pour corriger un lien rompu sur une page signalée par une icône d’insecte : 1 Vérifiez que l’inspecteur est affiché. 2 Cliquez deux fois sur la page contenant le lien rompu dans le panneau Fichiers de la fenêtre de site. 3 Pour afficher les avertissements relatifs aux liens de la page, effectuez l’une des opérations suivantes : • Cliquez sur le bouton Avertissements de lien de la barre d’outils ou de la palette Mise en évidence. (Pour plus de détails, voir « Utilisation de la palette Mettre en évidence », page 434.) • Choisissez Afficher > Afficher les avertissements de lien. 4 Le cas échéant, effectuez l’une des opérations suivantes pour afficher des informations susceptibles de vous aider à localiser le lien rompu : • Recherchez les objets manquants sur la page (objets encadrés de rouge). Il peut s’agir, par exemple, d’une balise d’emplacement d’image indiquant où une image doit être affichée. Comment utiliser l'aide | Sommaire | Index Page précédente 328 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Gestion et affichage de sites Web Page précédente 329 Recherchez les avertissements associés aux liens, c’est-à-dire les objets ou le texte encadrés de rouge. 5 Sélectionnez l’objet ou le texte sur la page contenant le lien rompu. 6 Vérifiez le lien dans la zone de texte URL de l’inspecteur, puis rétablissez ce lien. (Pour plus de détails, voir « Liaison des fichiers », page 55.) Recherche de fichiers manquants ou orphelins sur le site Il peut arriver qu’un fichier référencé sur une page soit manquant ou orphelin. L’icône de fichier manquant indique que GoLive ne peut localiser un fichier, peut-être parce que vous avez utilisé le Finder (Mac OS) ou l’Explorateur (Windows) au lieu de GoLive pour déplacer, renommer ou supprimer celui-ci. L’ icône de fichier orphelin (Windows) ou (Mac OS) indique que GoLive peut trouver le fichier localement, mais que ce dernier se trouve en dehors du dossier racine. Le panneau Erreurs de la fenêtre de site répertorie les fichiers manquants et orphelins référencés dans les fichiers qui seront téléchargés vers un serveur. Un fichier image stocké en dehors du dossier racine est répertorié, par exemple, dans le panneau Erreurs en tant que fichier orphelin s’il est référencé dans une page dont le nom figure dans le panneau Fichiers de la fenêtre de site. Ce même fichier image n’est pas répertorié dans le panneau Erreurs s’il est référencé dans un modèle, car les modèles ne sont pas téléchargés vers le serveur. L’ensemble des fichiers du panneau Divers (tels que les modèles et gabarits) ne sont pas téléchargés vers le serveur. Pour rechercher un fichier manquant et recréer le lien vers celui-ci : 1 Rafraîchissez la fenêtre de site de sorte à afficher les informations d’état mises à jour. (Pour plus de détails, voir « Rafraîchissement de la fenêtre de site », page 298.) 2 Sélectionnez le fichier en question dans la liste Fichiers manquants du panneau Erreurs de la fenêtre de site. Pour plus de détails sur l’affichage du panneau Erreurs, voir « Utilisation de la fenêtre de site », page 290. 3 Effectuez l’une des opérations suivantes pour afficher des informations susceptibles de vous aider à localiser le fichier et recréer le lien vers celui-ci : • Pour vérifier si le fichier porte un nouveau nom, recherchez-le dans le panneau Fichiers et, le cas échéant, modifiez le lien de sorte qu’il fasse référence au nouveau nom. • Pour afficher les pages liées au fichier à l’aide de la palette Liens entrants et sortants, cliquez sur le bouton Ouvrir la palette des liens entrants et sortants de la barre d’outils. Corrigez ensuite le lien à l’aide du bouton d’affectation de cette palette. (Pour plus de détails, voir « Utilisation de la palette Liens entrants et sortants », page 320.) • Pour vérifier et corriger l’URL du fichier à l’aide de l’inspecteur, ouvrez ce dernier et choisissez Modifier dans le menu situé à droite de la zone de texte d’URL. A partir de la boîte de dialogue Modifier l’URL, modifiez l’URL dans la zone de texte Chemin, puis cliquez sur OK. Sélectionnez les fichiers que vous souhaitez mettre à jour avec le nouvel URL, puis cliquez sur OK. • Utilisez la fenêtre de recherche pour rechercher le fichier. (Pour plus de détails, voir « Recherche de fichiers », page 330.) Comment utiliser l'aide | Sommaire | Index Page précédente 329 Aide d'Adobe GoLive Gestion et affichage de sites Web Comment utiliser l'aide | Sommaire | Index • Page précédente 330 Pour restaurer un fichier supprimé, faites glisser ce dernier de la Corbeille du site située dans le panneau Divers de la fenêtre de site vers son emplacement d’origine dans le panneau Fichiers de la fenêtre de site. Pour copier l’ensemble des fichiers orphelins dans le dossier racine : Lorsque vous nettoyez le site, vous pouvez configurer GoLive pour que l’application copie l’ensemble des fichiers orphelins dans le dossier racine et supprime les entrées correspondantes de la liste des fichiers orphelins du panneau Erreurs. (Pour plus de détails, voir « Nettoyage d’un site », page 300.) Vérification des URL externes et des adresses électroniques du site Un URL externe fait référence à une page ne faisant pas partie de votre système de fichiers, c’est-à-dire une page ayant une adresse commençant par http://, ftp://, etc. et devant contenir un signe deux points (:). L’adresse http://www.adobe.com en est un exemple. Lorsque vous spécifiez une adresse électronique, n’oubliez pas d’inclure un signe @. Vous pouvez vérifier la validité des URL externes répertoriés dans le panneau Externe de la fenêtre de site. Pour plus de détails sur l’ajout d’URL externes et d’adresses électroniques à un site, voir « Utilisation d’URL et d’adresses électroniques dans un site », page 352. Pour vérifier la validité des URL externes à un site : 1 Assurez-vous que vous disposez d’une connexion active à Internet. 2 Ouvrez le site en question. 3 Cliquez sur l’onglet Externe. 4 Choisissez Site > Extraire les références pour mettre à jour le site. 5 Choisissez Site > Vérifier les liens externes. La colonne Etat du panneau Externe affiche une icône d’insecte en regard de tous les liens externes incorrects. Recherche de fichiers Vous pouvez rechercher des fichiers ou des objets donnés (tels que des couleurs et des adresses électroniques) dans le site. Cette fonction est particulièrement utile pour les sites tentaculaires composés de dizaines, voire de centaines de pages. Au lieu de parcourir de longues listes de fichiers dans la fenêtre de site, vous pouvez saisir un nom de fichier ou un URL complet ou partiel. Pour rechercher des fichiers dans un site : 1 Ouvrez un fichier projet de site ou ramenez une fenêtre de site ouverte au premier plan. 2 Cliquez sur l’onglet répertoriant le type d’élément à rechercher. Par exemple, cliquez sur l’onglet Couleurs si vous souhaitez rechercher une couleur. 3 Effectuez l’une des opérations suivantes : • Cliquez sur le bouton Rechercher des fichiers • Choisissez Edition > Rechercher et cliquez sur l’onglet Site. Comment utiliser l'aide | Sommaire | Index de la barre d’outils. Page précédente 330 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 331 4 Choisissez une option dans les menus contextuels en regard de Elément dont : • Choisissez Nom dans le menu contextuel le plus à gauche pour rechercher un nom dans le site, par exemple pour rechercher un fichier, une référence externe, une adresse électronique, une couleur ou une police géré(e) dans le site. Choisissez URL pour rechercher l’URL d’un fichier, d’une référence externe ou d’une adresse électronique. (Vous pouvez uniquement rechercher des couleurs et des polices sur la base d’un nom.) • Choisissez « contient », « est », « commence par » ou « finit par » dans le menu contextuel le plus à droite. 5 Dans la zone de texte, saisissez le nom complet ou partiel du fichier ou de l’URL que vous recherchez. 6 Cliquez sur Rechercher. GoLive affiche le premier élément trouvé dans le panneau actif de la fenêtre de site. 7 Pour poursuivre la recherche, cliquez sur Suivant. Pour rechercher à nouveau rapidement un élément déjà saisi dans la zone de texte, sélectionnez cet élément dans le menu contextuel en regard la zone de texte. Génération de rapports sur les sites Le panneau Rapports sur le site de la fenêtre de recherche permet de rechercher des fichiers à l’aide d’un large éventail de critères et d’afficher les résultats dans un rapport sur le site. Vous pouvez afficher les rapports sur les sites comme s’il s’agissait de sites. Ils peuvent constituer un jeu de vues filtrées complémentaire qui vient s’ajouter aux vues disponibles lorsque vous cliquez sur l’onglet Filtre de la palette Affichage. (Pour plus de détails, voir « Filtrage du contenu de la vue », page 319.) Définition de requêtes de site Vous définissez une requête dans un ou plusieurs des sous-panneaux du panneau Rapports sur le site. Une requête peut être simple ou complexe. Les requêtes complexes peuvent contenir des critères multiples répartis sur un ou plusieurs sous-panneaux. Pour définir une requête : 1 Un fichier projet de site étant ouvert, effectuez l’une des opérations suivantes : • Choisissez Site > Rapport sur le site. • Choisissez Edition > Rechercher et cliquez sur l’onglet Rapports sur le site. 2 Spécifiez une recherche de type « Or » ou « And » en sélectionnant l’une des options suivantes : • Tous les critères sélectionnés ci-dessous spécifie une recherche de type « And » dans laquelle tous les critères doivent être satisfaits. Par exemple, si vous sélectionnez cette option et définissez une requête afin de rechercher les fichiers créés plus de deux semaines auparavant et contenant des liens externes, le rapport sur le site affiche uniquement les fichiers de plus de deux semaines qui comportent des liens externes. Comment utiliser l'aide | Sommaire | Index Page précédente 331 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Gestion et affichage de sites Web Page précédente 332 Un des critères sélectionnés ci-dessous spécifie une recherche de type « Or » dans laquelle un critère au moins doit être satisfait. Par exemple, si vous sélectionnez cette option et définissez une requête afin de rechercher les fichiers créés plus de deux semaines auparavant et contenant des liens externes, le rapport sur le site affiche les fichiers de plus de deux semaines qui comportent ou non des liens externes, ainsi que les fichiers contenant des liens externes, quelle que soit leur date de création. 3 Spécifiez un ou plusieurs critères dans un ou plusieurs sous-panneaux du panneau Rapports sur le site. • Le sous-panneau Fichiers affiche les fichiers en fonction de leur taille en octets, de leur durée de téléchargement ainsi que de leur date de création et de modification. Pour les fichiers HTML, l’option Le téléchargement dure du panneau Fichiers indique tous les éléments constitutifs de la page (tels que les images ou les séquences QuickTime) intervenant dans le calcul de cette durée. • Le sous-panneau Erreurs indique les pages comportant des attributs d’image incomplets, des titres à problèmes, des balises HTML incorrectes et des indicateurs d’avertissement. Vous définissez la liste des navigateurs qui s’affiche dans les catégories d’avertissements et d’erreurs HTML à partir des préférences Jeux de navigateurs (Pour plus de détails, voir « Définition des préférences relatives à la source », page 432). Si vous souhaitez afficher une autre liste de navigateurs dans la boîte de dialogue Rapports sur le site, modifiez la liste des jeux de navigateurs dans les préférences de l’application. • Le sous-panneau Objets du site affiche les pages d’un site qui utilisent des composants, des adresses, des polices, des jeux de polices et des couleurs spécifiques. Les éléments affichés dans le sous-panneau Objets du site sont identiques aux éléments de la fenêtre de site. Si vous avez ajouté des éléments à des pages ou en avez supprimés, nettoyez le site afin de mettre à jour les éléments dans la fenêtre de site et le sous-panneau Objets du site. (Pour plus de détails, voir « Nettoyage d’un site », page 300.) • Le sous-panneau Liens affiche les pages comportant des liens externes, des liens à des fichiers portant des extensions spécifiques et des liens associés à un ou plusieurs protocoles (ftp: ou mailto:, par exemple). • Le sous-panneau Accessibilité affiche les pages conformes à un certain nombre de recommandations visant à rendre les documents Web accessibles aux personnes handicapées et aux personnes utilisant d’autres technologies de navigation. Bien que ces rapports sur les sites ne proposent pas de solution complète, ils permettent toutefois de déterminer si le site Web est accessible ou pas. • Le sous-panneau Divers affiche les pages qui se trouvent à un certain nombre de clics d’une page donnée. 4 Effectuez au besoin les opérations suivantes : • Pour enregistrer la requête en vue d’une utilisation ultérieure, cliquez sur Enregistrer la requête, puis saisissez un nom. L’extension .glsq est automatiquement assignée au fichier. Cliquez sur Enregistrer. • Pour générer et afficher un rapport sur le site basé sur la requête, cliquez sur Rechercher. GoLive affiche le rapport dans la fenêtre Résultats du rapport. Comment utiliser l'aide | Sommaire | Index Page précédente 332 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 333 Affichage des rapports sur le site Vous pouvez afficher un rapport dans les trois panneaux de la fenêtre Résultats du rapport : Fichiers, Navigation et Structure. Pour afficher un rapport sur le site : 1 Un fichier projet de site étant ouvert, effectuez l’une des opérations suivantes : • Choisissez Site > Rapport sur le site. • Choisissez Edition > Rechercher, puis cliquez sur l’onglet Rapports sur le site. 2 Effectuez l’une des opérations suivantes : • Définissez une nouvelle requête de site. (Pour plus de détails, voir « Définition de requêtes de site », page 331.) • Cliquez sur Charger la requête pour utiliser une requête de site existante. Sélectionnez une requête et cliquez sur Ouvrir. 3 Cliquez sur Rechercher. 4 Affichez le rapport en consultant l’un ou plusieurs des panneaux suivants de la fenêtre Résultats du rapport : • Fichiers affiche un tableau des fichiers répondant aux critères de la requête, en les disposant un par ligne. Les colonnes sont semblables à celles du panneau Fichiers de la fenêtre de site (nom, état, taille, etc.) • Navigation est similaire à la vue de navigation du site, mais les fichiers répondant aux critères de la requête sont éclairés. Vous pouvez élaguer davantage le rapport sur le site en l’affichant dans le panneau Navigation et en filtrant la vue dans la palette Affichage. • Structure affiche les fichiers du site sous forme d’arborescence. Seuls ceux répondant aux critères de la requête sont affichés. Les dossiers contenant ces fichiers ainsi que tous les dossiers situés plus haut dans l’arborescence sont également affichés. Le dossier racine du site constitue la racine de l’arborescence. La partie supérieure de la fenêtre Résultats du rapport contient également un bref résumé qui indique le nombre de fichiers correspondant aux critères de la recherche ainsi que les critères définis pour la création de ce rapport. Pour modifier une page affichée dans un rapport : Cliquez deux fois sur la page dans l’un des panneaux du rapport. Exportation des rapports sur le site Un rapport étant affiché dans le panneau Fichiers de la fenêtre Résultats du rapport, vous pouvez l’exporter vers un fichier HTML ou un fichier texte délimité par tabulation ou bien créer une collection à partir des résultats. Les fichiers HTML et texte contiennent les mêmes informations que celles affichées dans le panneau Fichiers, mais le fichier HTML contient également les liens vers les pages du rapport. Le fichier texte délimité par tabulation est utile si vous souhaitez importer le rapport dans une feuille de calcul ou une application de base de données. Vous pouvez créer une collection à partir des résultats du rapport et afficher celle-ci dans la vue de navigation ou des liens. Comment utiliser l'aide | Sommaire | Index Page précédente 333 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 334 Pour exporter un rapport sur le site : 1 Définissez une requête et générez un rapport sur le site. (Pour plus de détails, voir « Définition de requêtes de site », page 331.) 2 Le panneau Fichiers de la fenêtre Résultats du rapport étant ouvert, affichez les colonnes requises dans le rapport exporté en les sélectionnant dans le menu Afficher les colonnes de la palette Affichage. 3 Choisissez l’une des options suivantes dans le menu de la fenêtre Résultats du rapport : • Exporter les résultats au format HTML crée un fichier HTML qui comprend le contenu du panneau Fichiers. Saisissez un nom pour ce fichier HTML, puis cliquez sur Enregistrer. • Exporter les résultats comme texte délimité par tabulation crée un fichier texte délimité par tabulation qui comprend le contenu du panneau Fichiers. Saisissez un nom pour ce fichier texte, puis cliquez sur Enregistrer. • Créer une collection à partir des résultats crée une collection qui comprend le contenu du panneau Fichiers. Saisissez un nom pour cette collection, puis cliquez sur OK. Pour afficher la collection, ouvrez la vue de navigation ou des liens du site, puis sélectionnez la collection dans le panneau Navigation de la palette Affichage. (Pour plus de détails, voir « Création et utilisation de collections », page 314.) Indication d’informations sur l’état des fichiers Lors de la conception et de la mise à jour d’un site Web, il peut s’avérer utile de fournir des informations d’état afin que vous, ou toute personne chargée de passer le site en revue, puissiez déterminer l’état d’un fichier ou dossier spécifique. Vous pouvez fournir des informations d’état relatives à un fichier ou dossier individuel en lui affectant un état de publication ou un libellé d’état dans l’inspecteur du fichier. L’état de publication permet d’indiquer si vous souhaitez publier un fichier ou un dossier sur un serveur Web. Un libellé d’état peut fournir une ou plusieurs descriptions par fichier, telles que Essentiel. Vous pouvez également fournir des informations d’état relatives à un groupe de fichiers en créant une collection portant un nom significatif tel que « Révisés ». (Pour plus de détails, voir « Création et utilisation de collections », page 314.) Affectation d’états de publication à des fichiers et dossiers Vous pouvez affecter trois états de publication différents aux fichiers ou dossiers d’un site, à savoir Jamais, Toujours et Si référencé. Vous pouvez ensuite choisir l’option Respecter l’état de « publication » des dans les préférences Téléchargement/Synchr. du site ou des paramètres spécifiques au site afin d’utiliser l’état de publication pour déterminer les fichiers ou les dossiers du site à télécharger vers un serveur Web. (Pour plus de détails, voir « Définition des options de téléchargement vers le serveur », page 364 ou « Publication d’un site collaboratif », page 400.) Pour affecter un état de publication à un fichier ou un dossier : 1 Effectuez l’une des opérations suivantes : • Sélectionnez le fichier ou le dossier dans le panneau Fichiers ou Divers de la fenêtre de site. • Sélectionnez le fichier dans la vue de navigation ou des liens. Comment utiliser l'aide | Sommaire | Index Page précédente 334 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index Gestion et affichage de sites Web Page précédente 335 2 Dans le panneau Fichier de l’inspecteur, sélectionnez un état de publication du fichier ou du dossier dans le menu Publier. Affectation de libellés d’état GoLive propose par défaut les mêmes libellés d’état par codage couleur de fichiers (Essentiel, Important, Opération en cours, Budget, Personnel, Projet 1 et Projet 2) que le Finder de Mac OS. Les fichiers codés par couleur s’affichent dans la vue de navigation et des liens lorsque l’affichage des vues est défini sur le mode Vignettes, Cadres ou Ellipses. (Pour plus de détails, voir « Modification de l’affichage d’une vue », page 317.) Sous Windows, vous pouvez supprimer, renommer ou modifier la couleur de ces libellés. Vous pouvez également ajouter un nouveau libellé sous Windows comme sous Mac OS et affecter l’état de votre choix à tout fichier. Remarque : GoLive emploie également le terme « état » pour indiquer l’état des liens et des références d’un site (dans la colonne Etat du panneau Fichiers de la fenêtre de site, par exemple). (Pour plus de détails, voir « Correction des erreurs de site », page 328.) Veillez à ne pas confondre ces deux types d’états de fichiers. Des fichiers individuels peuvent parfois avoir simultanément plusieurs états (Opération en cours et Personnel, par exemple). Si vous devez appliquer plusieurs libellés aux fichiers, utilisez plutôt des collections que des libellés d’état. Pour ajouter ou modifier un état de fichier : 1 Effectuez l’une des opérations suivantes : • Pour ajouter (Windows ou Mac OS) ou modifier (Windows uniquement) l’état de tous les sites, choisissez Edition > Préférences, développez l’icône Site dans le panneau gauche, puis cliquez sur Etat. • Pour ajouter (Windows ou Mac OS) ou modifier (Windows uniquement) l’état du site actif uniquement, cliquez sur le bouton Configurer le site de la barre d’outils ou choisissez Site > Configuration. Cliquez sur Etat dans le panneau gauche de la boîte de dialogue de configuration du site, puis cochez la case Paramètres spécifiques au site pour que ces paramètres aient priorité sur ceux de la boîte de dialogue Préférences. Remarque : Si vous souhaitez appliquer l’état de la boîte de dialogue Préférences à un site existant, ouvrez ce site et assurez-vous que l’option Paramètres spécifiques au site de la boîte de dialogue de configuration du site est désactivée. 2 Effectuez l’une des opérations suivantes : • Pour ajouter un nouveau libellé, cliquez sur le bouton Nouvel élément . Un nouveau libellé blanc portant le nom « Nouvel état » s’affiche en bas de la boîte de dialogue de configuration du site. • Pour modifier un libellé existant (Windows uniquement), sélectionnez-le. Sous Mac OS, vous pouvez modifier les libellés par défaut dans les préférences du Finder. 3 Effectuez l’une des opérations suivantes : • Saisissez le nom du libellé dans la zone de texte prévue à cet effet. • Cliquez sur la case échantillon pour changer la couleur du libellé. Dans la boîte de dialogue Couleur, choisissez une couleur et cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 335 Aide d'Adobe GoLive Comment utiliser l'aide | Sommaire | Index • Gestion et affichage de sites Web Page précédente Cliquez sur le bouton Supprimer les éléments sélectionnés libellé. 336 pour supprimer le 4 Cliquez sur OK. Pour affecter un état à un fichier ou un dossier : 1 Effectuez l’une des opérations suivantes : • Sélectionnez le fichier ou le dossier dans le panneau Fichiers ou Divers de la fenêtre de site. • Sélectionnez le fichier dans la vue de navigation ou des liens. 2 Effectuez l’une des opérations suivantes : • Dans le panneau Fichier de l’inspecteur, sélectionnez un état pour le fichier dans le menu Etat. • (Mac OS uniquement) Choisissez Ouvrir > Afficher les propriétés dans le menu contextuel. Choisissez ensuite un état dans le menu Libellé. (Voir « Utilisation des menus contextuels », page 34.) Comment utiliser l'aide | Sommaire | Index Page précédente 336 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 337 Utilisation des éléments de construction de site A propos des éléments de construction de site Les éléments de construction de site incluent des modèles pour vos pages et vos sites, ainsi que des jeux personnalisés de texte, d’objets, de couleurs, de polices et d’URL que vous pouvez rassembler et utiliser sur les pages de votre site. Ces éléments sont particulièrement utiles lorsque plusieurs personnes créent un site. Vous rassemblez et stockez les éléments de construction dans la fenêtre du site, dans le dossier de données de votre site, et en tant qu’objets dans la palette Objets. Modèles de page Les modèles de page empêchent d’autres utilisateurs de modifier certaines parties de la mise en forme de nouvelles pages. Les zones qui ne sont pas modifiables sont automatiquement verrouillées lorsque vous créez des pages à partir d’un modèle. Ces pages restent liées au modèle. Par conséquent, si vous modifiez ce dernier, GoLive met les pages à jour sans toucher au contenu ajouté. Composants Les composants sont des fichiers source HTML que vous pouvez ajouter à une page en tant qu’objet unique, tel qu’une barre de navigation et des liens hypertexte. Vous pouvez utiliser les composants pour stocker un texte, des objets et des attributs que vous souhaitez réutiliser dans plusieurs pages de votre site. Les composants d’une page restent liés aux fichiers source. Cliquez deux fois dessus pour ouvrir les fichiers source correspondants. Lorsque vous modifiez le fichier source d’un composant, toutes les pages contenant ce dernier sont automatiquement mises à jour. Gabarit Les fichiers de gabarit ressemblent aux modèles de page, à la différence près que les nouvelles pages ne restent pas liées aux fichiers. Par conséquent, les modifications effectuées dans le fichier de gabarit ne sont pas répercutées dans les nouvelles pages. Faites appel au gabarit lorsque vous souhaitez définir les premiers éléments d’une page (couleur de fond, marges, feuille de style en cascade externe, par exemple), puis configurez GoLive de sorte qu’il utilise la page de gabarit à chaque fois qu’il crée une nouvelle page sans titre. (Voir « Définition des préférences d’ouverture des pages », page 66.) Modèles de site Les modèles de site sont des groupes de fichiers et de dossiers utilisés par GoLive pour créer de nouveaux sites. Vous pouvez les utiliser pour définir une présentation et des fonctionnalités standard dans les pages de différents sites, par exemple, lorsque vous devez afficher des éléments standard sur les sites Web des différents services de votre société. Les modèles de site figurent dans un dossier qui se trouve dans le dossier GoLive 6.0. Comment utiliser l'aide | Sommaire | Index Page précédente 337 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 338 Objets de bibliothèque Vous pouvez enregistrer des extraits de code source, du texte, des images et tout autre objet dans une bibliothèque, et les ajouter aux pages en tant qu’objets uniques. Les objets de bibliothèque ressemblent aux composants, à la différence près qu’ils ne restent pas liés aux fichiers source lorsque vous les ajoutez à une page. Vous pouvez enregistrer des objets de bibliothèque pour un site quelconque ou spécifique. Couleurs et jeux de polices Les couleurs et les jeux de polices sont des attributs que vous pouvez enregistrer et réutiliser dans les pages d’un site. Vous rassemblez et nommez les couleurs du site et les jeux de polices dans les panneaux Couleurs et Jeux de polices de la fenêtre du site. Vous pouvez ensuite choisir des couleurs de site et des jeux de polices personnalisés dans la palette de couleurs ou dans le menu Texte > Police. Les couleurs du site et les jeux de polices restent liés aux pages dans lesquels ils sont utilisés. Par conséquent, lorsque vous modifiez une couleur du site ou un jeu de polices, GoLive met à jour toutes les pages qui les contiennent. URL et adresses électroniques Les URL et les adresses électroniques sont des attributs Href que vous pouvez rassembler dans le panneau Externe de la fenêtre du site afin de les réutiliser dans les liens de votre site. Lorsque vous modifiez la valeur d’un URL du site, les liens qui figurent sur la page faisant référence à l’URL sont automatiquement mis à jour. Utilisation de modèles de page Vous pouvez enregistrer vos pages dans un modèle de page qui sert à contrôler la mise en page et l’aspect des autres pages du site. Les sections du modèle de page qui ne sont pas modifiables sont automatiquement verrouillées pour empêcher toute personne travaillant sur le même projet de site de les modifier lorsqu’elle crée des pages à partir d’un modèle. Utilisez des couleurs pour mettre en évidence les différences entre les zones verrouillées et les zones modifiables. Les nouvelles pages basées sur un modèle sont automatiquement mises à jour lorsque vous modifiez le modèle (le contenu des zones modifiables n’est pas affecté). Utilisez des images dynamiques dans vos modèles de page. Si vous redimensionnez une image dynamique dans un modèle, GoLive redimensionne et optimise automatiquement son image Web sur chaque page liée au modèle. Création d’un modèle de page Utilisez la palette Zone modèles pour marquer les zones modifiables de la page. Vous pouvez créer trois types de zones modifiables : des paragraphes, des sélections en ligne au sein d’un paragraphe et des objets, tels que des boîtes flottantes, des images ou des tableaux. Lorsqu’une zone est marquée comme style de texte en ligne, vous ne pouvez pas y insérer de paragraphes. Par conséquent, vous pouvez saisir du texte dans cette zone, mais vous ne pouvez pas appuyer sur la touche Entrée pour commencer un nouveau paragraphe. Comment utiliser l'aide | Sommaire | Index Page précédente 338 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 339 Vous pouvez verrouiller ou déverrouiller tous les éléments du modèle qui ne sont pas modifiables et utiliser la palette de mise en évidence pour définir les couleurs de mise en évidence des zones verrouillées et des zones modifiables. Les zones non modifiables sont automatiquement verrouillées dans toutes les pages créées à partir d’un modèle, que vous les verrouilliez ou non dans le modèle. A B C Symboles indiquant le type de zone modifiable A. Zone de texte en ligne B. Zone de paragraphe C. Zone d’objet Pour créer un modèle de page : 1 Sélectionnez une section de la page que vous souhaitez marquer comme zone modifiable. Pour sélectionner la totalité du paragraphe, cliquez dedans, puis cliquez sur la balise <p> dans la barre d’arborescence des balises qui se trouve en bas de la fenêtre du document. 2 Dans la palette Zones modèles, cliquez sur le bouton Nouvelle zone modifiable bas de la palette. en Par défaut, les noms des nouvelles zones incluent les premiers caractères de la sélection de texte ou de son type d’objet. Pour nommer les nouvelles zones Zone, Zone2, Zone3, etc., désélectionnez l’option Définir la sélection comme nom de zone dans le menu de la palette Zones modèles. 3 Sélectionnez la nouvelle zone dans la palette et saisissez un nouveau nom. Les espaces et les traits de soulignement ne sont pas autorisés. 4 Reprenez les instructions des points 1 à 3 pour chacune des zones que vous souhaitez définir comme zone modifiable. Vous pouvez également marquer la sélection comme zone modifiable en choisissant Spécial > Modèle > Nouvelle zone modifiable ou Modèle > Nouvelle zone modifiable dans le menu contextuel de la sélection. Comment utiliser l'aide | Sommaire | Index Page précédente 339 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 340 5 Sélectionnez des options de zone modifiable dans le menu de la palette Zones modèles : • Sélection automatique sélectionne l’ensemble du contenu de la zone modifiable lorsque vous cliquez dedans. • Tabulations permet d’utiliser la touche de tabulation pour passer en revue les zones modifiables de la page. 6 Ouvrez la fenêtre du site et effectuez l’une des opérations suivantes pour enregistrer la page comme modèle : • Choisissez Fichier > Enregistrer sous, nommez le modèle, choisissez Modèle(s) dans le menu Dossier de site, puis cliquez sur Enregistrer. • Choisissez Enregistrer sous > Enregistrer comme modèle dans le menu de la fenêtre du document, puis cliquez sur Enregistrer. • Dans la fenêtre du site, faites glisser la page du panneau Fichiers vers le dossier Modèles du panneau Divers. Les modèles de page sont stockés dans le dossier Modèles qui se trouve dans le dossier de données du site. Ils sont affichés dans le panneau Divers de la fenêtre du site et de la palette Objets. Pour définir les couleurs de mise en évidence des zones modifiables et verrouillées : Dans la palette de mise en évidence, cliquez sur l’onglet Couleurs et effectuez l’une des opérations suivantes : • Cliquez sur la case échantillon en regard des options Zones verrouillées ou Zones modifiables, puis sélectionnez une nouvelle couleur dans la palette de couleurs. • Faites glisser le curseur de couleur pour régler l’opacité de la couleur des zones verrouillées et modifiables. • Cliquez sur le bouton à droite du curseur de couleur correspondant aux options Zones verrouillées et Zone modifiables pour mettre en évidence les bords ou le fond de ces zones à l’aide de couleurs. Comment utiliser l'aide | Sommaire | Index Page précédente 340 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 341 Pour afficher les couleurs de mise en évidence appliquées aux zones verrouillées dans le modèle, choisissez Spécial > Modèle > Verrouiller la page, ou choisissez Verrouiller la page dans le menu de la palette Zones modèles. Vous pouvez également cliquer dans la page avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS), puis choisissez Modèle > Verrouiller la page dans le menu contextuel. A B Cliquez sur le bouton pour activer ou désactiver l’affichage des bords ou du fond. A. Met en évidence le fond des zones verrouillées. B. Met en évidence les bords des zones verrouillées. Utilisation d’un modèle de page pour créer de nouvelles pages Vous pouvez faire appel à diverses méthodes pour créer des pages à partir d’un modèle. Selon la méthode choisie, GoLive ouvre la nouvelle page dans une fenêtre de document sans_titre.html ou nomme le fichier en fonction du nom du modèle (Nouveau pour le Modèle1.html, par exemple). Les modèles de page comportant des zones verrouillées et modifiables peuvent être utilisés avec Macromedia Dreamweaver pour créer des pages dans Dreamweaver ou dans GoLive. Pour créer une page à l’aide d’un modèle de page : Effectuez l’une des opérations suivantes : • Choisissez Fichier > Nouveau document spécial > Page basée sur un modèle. • Dans le panneau Divers de la palette Objets, choisissez Modèle(s) dans le menu contextuel affiché dans la partie inférieure. Faites glisser l’icône de modèle de la palette Objets vers une fenêtre de document vide, vers le panneau Fichiers de la fenêtre du site ou vers une page dans la vue de navigation. Dans ce dernier cas, placez l’icône de modèle sur la page pour voir apparaître une barre au-dessus, au-dessous ou sur le côté de la page, puis relâchez le bouton de la souris. Comment utiliser l'aide | Sommaire | Index Page précédente 341 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 342 • Cliquez deux fois sur l’icône du modèle dans le panneau Divers de la palette Objets ou sur le fichier de modèle dans le panneau Divers de la fenêtre du site, puis cliquez sur Créer. • Faites glisser le fichier de modèle du panneau Divers vers le panneau Fichiers de la fenêtre du site, puis cliquez sur Créer. • Cliquez dans une fenêtre de document vide et choisissez Modèle > Appliquer un modèle dans le menu contextuel. Dans la boîte de dialogue Sélectionner un modèle, sélectionnez le modèle de page et cliquez sur Ouvrir. • Indiquez que vous souhaitez utiliser le modèle pour toutes les nouvelles pages par défaut, puis choisissez Fichier > Nouvelle page ou Site > Nouveau > Page. (Voir « Définition des préférences d’ouverture des pages », page 66.) Application d’un modèle de page à des pages existantes Vous pouvez appliquer un modèle de page aux pages qui ne sont pas vides. Lorsque vous appliquez un modèle de page, GoLive recherche des noms identiques de zones modifiables marquées dans le contenu. S’il en trouve, GoLive déplace automatiquement le contenu vers les zones. Sinon, il affiche une liste des zones dans le modèle pour que vous puissiez en choisir une. Vous pouvez également choisir d’écraser le contenu si vous ne sélectionnez pas de zone spécifique. La palette Zones modèles vous permet de préparer rapidement le contenu d’un modèle en marquant les nouvelles zones modifiables de même type (paragraphe, en ligne ou objet) et en renommant automatiquement celles qui portent des noms identiques dans le modèle. Pour préparer le contenu d’une page dont les noms de zone sont identiques : 1 Affichez le modèle et la page côte à côte. 2 Sélectionnez le contenu de la page, puis cliquez sur le bouton Nouvelle zone modifiable qui figure en bas de la palette Zones modèles. Comment utiliser l'aide | Sommaire | Index Page précédente 342 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 343 3 Cliquez sur la nouvelle zone dans la palette en maintenant la touche Alt (Windows) ou Commande (Mac OS) enfoncée et faites-la glisser vers la zone du modèle portant le nom que vous souhaitez utiliser. GoLive attribue le nom de la zone du modèle à la nouvelle zone. Cliquez sur la nouvelle zone en maintenant la touche Alt ou Commande enfoncée pour lui attribuer le nom de zone « Month » du modèle. Pour appliquer un modèle de page à une page existante : 1 Effectuez l’une des opérations suivantes : • Dans le panneau Divers de la palette Objets, choisissez Modèle(s) dans le menu contextuel affiché en bas de la palette, puis faites glisser l’icône de modèle vers la page. • Choisissez Spécial > Modèle > Appliquer un modèle. Sélectionnez le modèle et cliquez sur Ouvrir. Si tous les noms des zones modifiables de la page correspondent aux noms de zone du modèle, GoLive place le contenu de la page dans les zones définies dans le modèle. Un avertissement s’affiche si le contenu de la page n’est pas marqué ou s’il est marqué avec un nom de zone différent. 2 Dans ce cas, cliquez sur OK. Dans la boîte de dialogue Sélectionner une zone modifiable, effectuez l’une des opérations suivantes : • Dans le modèle, sélectionnez une zone dans laquelle vous souhaitez placer le contenu, puis cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 343 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index • Page précédente 344 Sélectionnez « aucun » pour écraser le contenu de la page, puis cliquez sur OK. Si vous souhaitez appliquer plusieurs modèles dont les noms de zone correspondent à une ou plusieurs pages existantes, ouvrez la palette des liens entrants et sortants pour basculer entre les modèles. Appliquez le premier modèle aux pages. Ensuite, sélectionnez le modèle dans le panneau Divers de la fenêtre du site et ouvrez la palette des liens entrants et sortants. Choisissez Options de la palette dans le menu de la palette, cochez la case « les liens vers le fichier », puis cliquez sur OK pour afficher toutes les pages liées au modèle. Faites glisser le pointeur du bouton d’affectation de la palette des liens entrants et sortants vers le deuxième modèle du panneau Divers dans la fenêtre du site, puis cliquez sur OK pour modifier la référence. (Voir « Utilisation de la palette Liens entrants et sortants », page 320.) Mise à jour ou dissociation d’un modèle de page Les pages créées à partir d’un modèle de page restent liées à ce dernier. Par conséquent, les pages sont automatiquement mises à jour lorsque vous modifiez le modèle. Vous pouvez dissocier le modèle des pages pour supprimer le lien qui les unit. Pour mettre à jour un modèle de page : 1 Ouvrez le modèle de page en effectuant l’une des opérations suivantes : • Cliquez deux fois sur le fichier de modèle dans le panneau Divers de la fenêtre du site et cliquez sur Modifier. • Dans le panneau Divers de la palette Objets, choisissez Modèle(s) dans le menu contextuel, cliquez deux fois sur l’icône de modèle, puis cliquez sur Modifier. • Cliquez dans une page créée à partir du modèle et choisissez Modèle > Ouvrir le modèle joint dans le menu contextuel. 2 Modifiez la mise en page du modèle, puis effectuez l’une des opérations suivantes dans la palette Zones modèles : • Cliquez sur le bouton Nouvelle zone modifiable modifiable à une sélection dans la mise en page. pour appliquer une zone • Sélectionnez un nom de zone et saisissez un nouveau nom. • Sélectionnez une zone et cliquez sur le bouton Annuler la définition des zones modifiables . Remarque : Vous devez annuler la définition d’une zone modifiable avant de supprimer son contenu dans la fenêtre du document. 3 Choisissez Fichier > Enregistrer. 4 Dans la boîte de dialogue Mise à jour du modèle, sélectionnez les pages que vous souhaitez mettre à jour en fonction du modèle modifié, puis cliquez sur OK. Pour dissocier une page d’un modèle de page : Cliquez dans la page et choisissez Modèle > Dissocier du modèle dans le menu contextuel. Comment utiliser l'aide | Sommaire | Index Page précédente 344 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 345 Utilisation de composants Utilisez les composants GoLive dans vos pages pour référencer un ou plusieurs éléments stockés dans un fichier source. Ces composants s’avèrent particulièrement utiles pour les boutons, les logos, les en-têtes, les grands titres ou autres éléments de navigation courants que vous souhaitez utiliser dans l’intégralité du site. Les modifications apportées aux éléments dans le fichier source d’un composant font l’objet d’une mise à jour dynamique dans les pages dans lesquelles figure le composant. Le composant que vous ajoutez à une page reste lié à son fichier source jusqu’à ce que vous l’en dissociez. Vous pouvez cliquer deux fois sur les composants de la page pour ouvrir leurs fichiers source et les modifier. Remarque : Les composants ne peuvent pas contenir d’objets provenant du panneau Entête de la palette Objets. En outre, utilisez le même codage de caractères dans le fichier source d’un composant que celui des pages qui le contiennent. (Voir « Ajout d’éléments ou de scripts dans la section d’en-tête », page 51.) Pour créer un fichier source de composant : 1 Dans une nouvelle fenêtre de document, ajoutez le contenu voulu, une grille de mise en page avec le logo de votre entreprise et un titre, par exemple, puis cliquez sur l’icône de page dans le coin supérieur gauche de la fenêtre. 2 Dans l’inspecteur de la page, cliquez sur l’onglet HTML, puis sur Composant pour configurer la page active comme composant dynamique. Le composant peut dès lors être facilement modifié dans l’éditeur de mise en page. L’option Importer la bibliothèque de scripts GoLive doit également être sélectionnée si le composant utilise des actions GoLive. 3 Ouvrez la fenêtre du site et effectuez l’une des opérations suivantes pour enregistrer la page comme composant : • Choisissez Fichier > Enregistrer sous, nommez le composant, choisissez Composants dans le menu Dossier de site, puis cliquez sur Enregistrer. • Choisissez Enregistrer sous > Enregistrer comme composant dans le menu de la fenêtre du document, nommez le composant, puis cliquez sur Enregistrer. • Dans la fenêtre du site, faites glisser la page du panneau Fichiers vers le dossier Composants du panneau Divers. Les composants sont stockés dans le dossier Composants qui se trouve dans le dossier de données du site. Ils sont affichés dans le panneau Divers de la fenêtre du site et de la palette Objets. Pour utiliser un composant : Effectuez l’une des opérations suivantes : • Dans le panneau Divers de la palette Objets, choisissez Composants dans le menu contextuel affiché en bas de la palette, puis faites glisser l’icône du composant vers la page. • Dans le panneau SmartObjects de la palette Objets, faites glisser l’icône Composant vers la page. Dans l’inspecteur du composant, spécifiez la destination du lien en faisant glisser le pointeur du bouton d’affectation vers le fichier source du composant dans le panneau Divers de la fenêtre du site. Comment utiliser l'aide | Sommaire | Index Page précédente 345 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 346 Pour modifier le fichier source d’un composant : 1 Cliquez deux fois sur le composant de la page pour ouvrir le fichier source. 2 Procédez aux modifications souhaitées et enregistrez le fichier source. 3 Cliquez sur OK pour mettre à jour l’ensemble des pages utilisant le composant. Remarque : Les composants sont uniquement mis à jour lorsque vous travaillez sur votre disque dur local. Si vous modifiez un fichier source, vous devez le télécharger sur le serveur Web avec les pages qui utilisent le composant pour mettre votre site à jour. Pour dissocier un composant de son fichier source : Sélectionnez le composant sur la page et choisissez Spécial > Dissocier un composant ou Composants > Dissocier les composants sélectionnés dans le menu contextuel du composant, puis cliquez sur OK. Le composant dissocié appartient désormais à la page et ne dépend plus du fichier source. Par conséquent, les modifications apportées au fichier source n’ont plus d’incidence sur le composant dissocié. Utilisation de gabarits Les pages stockées dans le dossier Gabarit du dossier de données de votre site peuvent servir de modèles pour créer de nouvelles pages. Comme pour les modèles de page, vous pouvez marquer les zones modifiables dans la mise en page d’un gabarit et verrouiller le reste du contenu. Contrairement aux modèles de page, les gabarits ne sont pas liés dynamiquement aux pages qu’ils ont permis de créer. Les modifications apportées au fichier de gabarit n’ont aucune incidence sur les pages créées à partir de ce fichier. Pour créer un fichier de gabarit : 1 Préparez le contenu et la mise en page du gabarit dans l’éditeur de mise en page de la fenêtre du document. Vous pouvez utiliser la palette Zones modèles pour marquer les zones verrouillées et modifiables dans la mise en page. (Voir « Création d’un modèle de page », page 338.) 2 Ouvrez la fenêtre du site et effectuez l’une des opérations suivantes pour enregistrer la page comme gabarit : • Choisissez Fichier > Enregistrer sous, nommez le gabarit, choisissez Gabarit dans le menu Dossier de site, puis cliquez sur Enregistrer. • Choisissez Enregistrer sous > Enregistrer comme gabarit dans le menu de la fenêtre du document, nommez le gabarit, puis cliquez sur Enregistrer. • Dans la fenêtre du site, faites glisser la page du panneau Fichiers vers le dossier Gabarit du panneau Divers. Les fichiers de gabarit sont stockés dans le dossier Gabarit qui se trouve dans le dossier de données du site. Ils sont affichés dans le panneau Divers de la fenêtre du site et de la palette Objets. Comment utiliser l'aide | Sommaire | Index Page précédente 346 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 347 Pour créer une page à partir d’un gabarit : 1 Effectuez l’une des opérations suivantes : • Choisissez Fichier > Nouveau document spécial > Page basée sur un gabarit. • Cliquez deux fois sur l’icône de gabarit dans le panneau Divers de la palette Objets ou sur le fichier de gabarit dans le panneau Divers de la fenêtre du site, puis cliquez sur Créer. • Dans la fenêtre du site, faites glisser le fichier de gabarit du panneau Divers au panneau Fichiers, puis cliquez sur Créer. • Dans le panneau Divers de la palette Objets, choisissez Gabarit dans le menu contextuel affiché au bas de la palette. Faites glisser l’icône de gabarit de la palette Objets vers le panneau Fichiers de la fenêtre du site ou vers une page dans la vue de navigation. Dans ce dernier cas, placez l’icône de gabarit sur la page pour voir apparaître une barre audessus, au-dessous ou sur le côté de la page, puis relâchez le bouton de la souris. • Indiquez que vous souhaitez utiliser le fichier de gabarit pour toutes les nouvelles pages par défaut, puis choisissez Fichier > Nouvelle page ou Site > Nouveau > Page. (Voir « Définition des préférences d’ouverture des pages », page 66.) GoLive crée une nouvelle page sans titre à partir du modèle du gabarit. Si vous avez utilisé l’arborescence de la navigation, la nouvelle page est alors stockée dans le dossier Nouveaux fichiers du site. 2 Utilisez les panneaux Fichier et Page de l’inspecteur du fichier pour modifier le nom du fichier et le titre de la nouvelle page. Utilisation des objets de bibliothèque Vous pouvez copier du texte, des objets et des extraits de code source à partir de pages GoLive ou de documents ouverts dans d’autres applications, puis les enregistrer comme objets de bibliothèque. Les objets de bibliothèque, tels les composants, sont des fichiers source que vous pouvez ajouter à une page en tant qu’objets. Contrairement aux composants, les objets de bibliothèque ne restent pas liés à leurs fichiers source lorsque vous les ajoutez à une page. Rassemblement et organisation d’objets de bibliothèque Vous pouvez rassembler des objets de bibliothèque dans le panneau Bibliothèque de la fenêtre du site pour les utiliser dans les pages d’un site spécifique ou dans le panneau Bibliothèque de la palette Objets pour les utiliser dans un site quelconque. Lorsque vous enregistrez un objet de bibliothèque dans la fenêtre du site, GoLive ajoute un fichier source correspondant dans le dossier de données du site et l’affiche dans le panneau Divers de la fenêtre du site et de la palette Objets. Les objets de bibliothèque ne se limitent pas aux fichiers HTML. En effet, vous pouvez faire glisser des fichiers d’extrait de code SSI du site vers le panneau Bibliothèque. Rassemblez les objets de bibliothèque dans la fenêtre du site si vous comptez utiliser le site sur un serveur de groupe de travail ou sur plusieurs ordinateurs (Windows et Mac OS, par exemple). Ainsi, les objets de bibliothèque seront inclus dans le fichier projet du site utilisé sur plusieurs ordinateurs. Comment utiliser l'aide | Sommaire | Index Page précédente 347 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 348 Pour créer un objet de bibliothèque et l’utiliser dans un site spécifique : 1 Sélectionnez le texte, les objets ou le code source dans GoLive ou dans une autre application. Vous pouvez également sélectionner un objet de bibliothèque sur un autre site. Remarque : Pour sélectionner le formatage de paragraphe dans l’éditeur de mise en page, sélectionnez le paragraphe ou l’en-tête dans la barre d’arborescence des balises qui figure en bas de la fenêtre du document. 2 Effectuez l’une des opérations suivantes : • Copiez la sélection dans le presse-papiers. Cliquez sur l’onglet Bibliothèque dans la fenêtre du site et choisissez Edition > Coller. • Faites glisser la sélection de la fenêtre du document ou d’un autre site vers le panneau Bibliothèque de la fenêtre du site. • Dans le panneau Divers de la palette Objets, choisissez Bibliothèque dans le menu contextuel et faites glisser la sélection de la fenêtre du document vers la palette. 3 Choisissez Fichier > Enregistrer. Pour créer un objet de bibliothèque et l’utiliser dans un site quelconque : Effectuez l’une des opérations suivantes : • Faites glisser l’objet de bibliothèque du panneau Bibliothèque de la fenêtre du site vers le panneau Bibliothèque de la palette Objets. • Faites glisser la sélection de la fenêtre du document vers le panneau Bibliothèque de la palette Objets. Pour nommer un objet de bibliothèque : Effectuez l’une des opérations suivantes : • Sélectionnez l’objet de bibliothèque dans le panneau Bibliothèque de la fenêtre du site et saisissez un nouveau nom, ou spécifiez un nom dans la zone de texte Nom de l’inspecteur du fichier. • Cliquez deux fois sur l’icône de l’objet de bibliothèque dans le panneau Divers ou Bibliothèque de la palette Objets, saisissez un nouveau nom dans la zone de texte Nom de l’élément, puis cliquez sur OK. Utilisation d’objets de bibliothèque dans vos pages La procédure permettant d’ajouter directement des objets de bibliothèque de la fenêtre du site dans l’éditeur de mise en page ou l’éditeur de code source est identique à celle que vous utilisez pour ajouter d’autres objets de la palette Objets. Contrairement aux composants, les objets de bibliothèque ajoutés à la page ne sont pas liés à leurs fichiers source. Par conséquent, les modifications que vous apportez au fichier source d’un objet de bibliothèque ne sont pas répercutées sur les objets de bibliothèque affichés dans les pages. (Voir « Utilisation de composants », page 345.) Comment utiliser l'aide | Sommaire | Index Page précédente 348 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 349 Les objets de bibliothèque qui contiennent des balises d’emplacement pour d’autres fichiers (fichiers image, par exemple) sont affichés dans la palette des liens entrants et sortants avec les liens de ressource aux fichiers. Si vous déplacez le fichier source, une boîte de dialogue permettant de mettre le lien à jour s’affiche. (Voir « Utilisation de la palette Liens entrants et sortants », page 320.) Cet objet de bibliothèque (appelé extrait_de_code.html par défaut) contient un lien de ressource à un fichier image. Pour ajouter un objet de bibliothèque à une page : Effectuez l’une des opérations suivantes : • Choisissez Bibliothèque dans le menu contextuel du panneau Divers dans la palette Objets, puis faites glisser l’icône de l’objet de la palette vers l’éditeur de mise en page ou l’éditeur de code source. • Faites glisser l’objet de bibliothèque du panneau Bibliothèque de la fenêtre du site vers l’éditeur de mise en page ou l’éditeur de code source. • Sélectionnez l’objet de bibliothèque dans le panneau Bibliothèque de la fenêtre du site, copiez-le, placez le point d’insertion à l’emplacement voulu dans la mise en page ou le code source et collez-le. Remarque : Si vous faites glisser le fichier source de l’objet de bibliothèque du panneau Divers dans la fenêtre du site vers l’éditeur de mise en page, vous créez un lien hypertexte qui fait référence au fichier source comme destination du lien. Modification des fichiers source de l’objet de bibliothèque La modification du fichier source d’un objet de bibliothèque n’a pas d’incidence sur les pages qui utilisent cet objet. Pour modifier le fichier source d’un objet de bibliothèque : Cliquez deux fois sur le fichier dans le panneau ou le dossier Bibliothèque du panneau Divers dans la fenêtre du site, modifiez son contenu à l’aide de l’éditeur de mise en page ou de l’éditeur de code source, puis choisissez Fichier > Enregistrer. Comment utiliser l'aide | Sommaire | Index Page précédente 349 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 350 Utilisation de couleurs dans un site Vous pouvez rassembler et organiser les couleurs d’un site et les appliquer au texte et aux objets des pages du site. Les couleurs du site restent liées aux pages dans lesquelles elles apparaissent. Par conséquent, vous pouvez modifier une couleur de site et mettre à jour les pages qui l’utilisent. Le panneau Couleurs de la fenêtre du site répertorie les couleurs du site individuellement ou en groupes. La liste inclut un nom que vous assignez à chaque couleur ainsi que le nom et la valeur de la couleur HTML. Elle indique également si la couleur est compatible avec le Web et si elle est utilisée dans une page du site. Les couleurs rassemblées dans le panneau Couleurs figurent également dans la liste des couleurs du site dans la palette de couleurs. (Voir « Utilisation de la palette de couleurs », page 60.) Lorsque vous avez utilisé une couleur de site sur une page, vous pouvez mettre la liste à jour dans la fenêtre du site. Pour ajouter des couleurs à votre collection de sites : 1 Effectuez l’une des opérations suivantes : • Sélectionnez une couleur dans la palette de couleurs et faites-la glisser du panneau d’aperçu vers le panneau Couleurs de la fenêtre du site. • Sélectionnez le texte de couleur dans la fenêtre du document et faites-le glisser vers le panneau Couleurs dans la fenêtre du site. Toutes les couleurs sont ajoutées à la liste des couleurs du site si le texte en comporte plusieurs. • Sélectionnez une couleur de site dans le panneau Couleurs de la fenêtre d’un autre site et faites-la glisser vers le panneau Couleurs de la fenêtre du site. • Cliquez sur l’onglet Couleurs dans la fenêtre du site et choisissez Site > Extraire les couleurs pour ajouter à la liste toutes les couleurs utilisées sur les pages du site. Vous pouvez également cliquer sur l’onglet Couleurs et choisir Extraire les couleurs dans le menu contextuel. 2 Renommez les nouvelles couleurs du site en saisissant les nouveaux noms dans le panneau Couleurs de la fenêtre du site ou dans la zone de texte Nom de l’inspecteur de la couleur. Pour appliquer une couleur de site au texte ou aux objets d’une page : 1 Sélectionnez le texte ou les objets auxquels vous souhaitez attribuer une couleur : 2 Effectuez l’une des opérations suivantes : • Faites glisser la couleur du site de la liste des couleurs du site de la palette de couleurs vers la sélection ou la case échantillon dans la barre d’outils. • Cliquez sur la case échantillon dans l’inspecteur, puis sélectionnez une couleur dans la liste des couleurs du site. • Faites glisser la couleur du site du panneau Couleurs de la fenêtre du site vers la sélection. Comment utiliser l'aide | Sommaire | Index Page précédente 350 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 351 Pour modifier une couleur de site et mettre à jour les pages qui l’utilisent : 1 Cliquez deux fois sur la couleur du site dans le panneau Couleurs de la fenêtre du site pour ouvrir la palette de couleurs. Vous pouvez également sélectionner la couleur du site et cliquer sur la case échantillon dans l’inspecteur de la couleur. 2 Sélectionnez une nouvelle couleur dans la palette de couleurs. 3 Dans la boîte de dialogue Modification de la référence, sélectionnez les pages à mettre à jour et cliquez sur OK. Remarque : La boîte de dialogue Modification de la référence affiche uniquement les pages fermées. Pour mettre à jour la liste des couleurs du site : Cliquez sur l’onglet Couleurs dans la fenêtre du site et choisissez Site > Extraire les couleurs. Remarque : Pour extraire les dernières couleurs utilisées sur une page, enregistrez d’abord la page avant de la fermer. Pour supprimer une couleur du site : Sélectionnez une couleur de site dans le panneau Couleurs de la fenêtre du site et effectuez l’une des opérations suivantes : • Cliquez sur le bouton Supprimer dans la barre d’outils, puis cliquez sur Oui. • Choisissez Site > Supprimer les couleurs inutilisées, puis cliquez sur OK. Rassemblement de jeux de polices à utiliser dans un site Vous pouvez rassembler et nommer des jeux de polices pour les utiliser dans des sites spécifiques. Les jeux de polices d’un site peuvent être partagés entre plusieurs personnes travaillant sur le même projet de site à partir de différents ordinateurs ou d’un serveur de groupe de travail. Lorsque le site est ouvert, les jeux de polices du panneau Jeux de polices dans la fenêtre du site sont disponibles dans le sous-menu Police du menu Texte. Si le jeu de polices est appliqué à un texte, le navigateur Web propose plusieurs polices d’affichage. (Voir « Création et application de jeux de polices », page 113.) Les jeux de polices du site restent liés aux pages dans lesquelles ils apparaissent. Par conséquent, vous pouvez modifier un jeu de polices et mettre à jour les pages qui l’utilisent. Pour ajouter un jeu de polices à un site : 1 Cliquez sur l’onglet Jeux de polices dans la fenêtre du site. 2 Effectuez l’une des opérations suivantes : • Faites glisser le texte utilisant le jeu de polices de la page vers le panneau Jeux de polices. • Choisissez Site > Extraire les jeux de polices pour ajouter tous les jeux de polices utilisés dans les pages du site. • Faites glisser un jeu de polices de la fenêtre d’un autre site vers le panneau Jeux de polices de la fenêtre du site. Comment utiliser l'aide | Sommaire | Index Page précédente 351 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index • Page précédente 352 Choisissez Site > Nouveau > Jeu de polices et ouvrez l’inspecteur du jeu de polices pour ajouter des polices au jeu. Pour nommer le jeu de polices d’un site : 1 Sélectionnez le jeu de polices du site. 2 Effectuez l’une des opérations suivantes : • Saisissez un nom de jeu de polices dans le panneau Jeux de polices de la fenêtre du site. • Dans l’inspecteur du jeu de polices, saisissez un nom dans la zone de texte Nom. Pour ajouter, réorganiser ou supprimer des polices d’un jeu : 1 Sélectionnez le jeu de polices dans le panneau Jeux de polices de la fenêtre du site. 2 Dans l’inspecteur du jeu de polices, effectuez l’une des opérations suivantes : • Cliquez sur le bouton Nouvel élément et choisissez une police dans le menu contextuel ou saisissez un nom de police dans la zone de texte en bas de la palette. • Sélectionnez une police et cliquez sur les boutons fléchés pour la déplacer vers le haut ou le bas de la liste. • Sélectionnez une police et cliquez sur le bouton Supprimer les éléments sélectionnés pour supprimer la police de la liste. Pour utiliser un jeu de polices de site : 1 Sélectionnez le texte dans la page. 2 Effectuez l’une des opérations suivantes : • Faites glisser le jeu de polices du panneau Jeux de polices vers le texte sélectionné. • Choisissez Texte > Police > nom du jeu de polices. Si le jeu de polices ne figure pas en bas du menu Police, vérifiez si la fenêtre du site est ouverte. Pour modifier un jeu de polices du site et mettre à jour les pages qui l’utilisent : 1 Sélectionnez le jeu de polices dans le panneau Jeux de polices de la fenêtre du site. 2 Ajoutez, réorganisez ou supprimez des polices du jeu dans l’inspecteur correspondant. 3 Dans la boîte de dialogue Modification de la référence, sélectionnez les pages à mettre à jour et cliquez sur OK. Remarque : La boîte de dialogue Modification de la référence affiche uniquement les pages fermées. Utilisation d’URL et d’adresses électroniques dans un site Vous pouvez utiliser des URL ou des adresses électroniques dans plusieurs pages Web sans être obligé de les saisir à chaque fois que vous les utilisez. Vous pouvez rassembler les URL dans le panneau Externe de la fenêtre du site. Il est possible d’obtenir les URL relatifs à votre collection de sites en les important de votre navigateur Web, en les copiant dans d’autres pages ou sites ou en les saisissant dans la fenêtre du site. Comment utiliser l'aide | Sommaire | Index Page précédente 352 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 353 Si vous devez modifier la valeur d’un URL ou d’une adresse électronique d’un site que vous avez utilisé(e) sur plusieurs pages, faites-le dans la fenêtre du site. GoLive se charge ensuite de mettre toutes les pages à jour. A B C Utilisez l’inspecteur du groupe pour spécifier le type de dossier. A. Adresse électronique d’un site B. URL d’un site C. Quatre types de dossiers de groupes Remarque : Tout URL comportant le symbole @ est automatiquement traité comme une adresse électronique. Dans ce cas, GoLive ajoute « mailto: » à la zone de texte URL dans l’inspecteur. Si vous souhaitez référencer un script CGI ou un nom de fichier contenant le symbole @ sans ajouter « mailto: » à l’URL, vous devez modifier la valeur par défaut Gestion des URL en désactivant l’option Ajouter automatiquement « Mailto: » aux adresses dans la boîte de dialogue Configuration du site ou Préférences, puis en saisissant « mailto: » pour vos adresses électroniques. (Voir « Configuration des préférences », page 65 et « Définition des préférences et paramètres de site Web », page 289.) Pour ajouter un URL ou une adresse électronique au site : Effectuez l’une des opérations suivantes : • Cliquez sur l’onglet Externe dans la fenêtre du site et choisissez Site > Extraire les références. GoLive extrait tous les URL et adresses électroniques référencés sur les pages du site et les répertorie dans le panneau Externe. • Faites glisser l’icône URL du panneau Site de la palette Objets vers le panneau Externe de la fenêtre du site. Dans l’inspecteur de la référence, saisissez un nom d’URL de site dans la zone de texte Nom et saisissez ou collez l’URL complet dans la zone de texte URL. L’URL doit commencer par le type de serveur http:// ou ftp://. A B Icônes d’objet de la balise d’emplacement pour les URL et les adresses A. Icône URL B. Icône Adresse Comment utiliser l'aide | Sommaire | Index Page précédente 353 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 354 • Faites glisser l’icône Adresse du panneau Site de la palette Objets vers le panneau Externe de la fenêtre du site. Dans l’inspecteur de la référence, saisissez un nom d’adresse électronique de site dans la zone de texte Nom et saisissez ou collez l’adresse dans la zone de texte URL en commençant par « mailto: ». Si vous créez une liste d’adresses, utilisez des virgules pour séparer les adresses. • Sélectionnez l’URL dans la fenêtre du navigateur et faites-le glisser (ou l’icône située à sa gauche) vers le panneau Externe de la fenêtre du site. Faites glisser l’icône vers le panneau Externe pour ajouter l’URL. • Choisissez Fichier > Importer > Favoris en tant que sites externes. Sélectionnez un fichier de signets, d’adresses, de surnoms ou de favoris dans Internet Explorer, Netscape Navigator ou Eudora Pro, puis cliquez sur Ouvrir. Si le fichier renferme plusieurs URL ou adresses électroniques, GoLive les importe comme groupes d’URL ou d’adresses. • Faites glisser un URL ou une adresse électronique du panneau Externe de la fenêtre d’un autre site vers le panneau Externe de la fenêtre du site. Pour renommer ou modifier un URL ou une adresse électronique : 1 Sélectionnez l’URL ou l’adresse électronique du site dans le panneau Externe : 2 Effectuez l’une des opérations suivantes : • Saisissez un nouveau nom dans le panneau Externe de la fenêtre du site ou dans la zone de texte Nom de l’inspecteur de la référence. • Saisissez une nouvelle valeur d’URL ou d’adresse dans la zone de texte URL de l’inspecteur de la référence. • Cliquez sur Modifier dans l’inspecteur de la référence, saisissez un nouvel URL ou une nouvelle adresse, puis cliquez sur OK. (Voir « Modification d’URL dans des liens », page 59.) 3 Si la boîte de dialogue Modification de la référence s’affiche, cliquez sur OK pour confirmer le nouvel URL ou la nouvelle adresse et mettre à jour toutes les pages du site qui les utilisent. Pour exclure une page de la mise à jour, désélectionnez-la avant de cliquer sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 354 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 355 Pour organiser des URL et des adresses électroniques en dossiers de groupes : 1 Faites glisser l’icône Groupe d’URLs ou Adresse du panneau Site de la palette Objets vers le panneau Externe de la fenêtre du site. 2 Nommez le dossier de groupes. 3 Dans le panneau Externe de la fenêtre du site, faites glisser les URL ou les adresses électroniques vers le dossier de groupes. Pour utiliser un URL et une adresse électronique dans une page : 1 Sélectionnez le texte ou l’objet sur la page que vous souhaitez utiliser comme lien. 2 Effectuez l’une des opérations suivantes : • Faites glisser l’URL ou l’adresse électronique d’un site du panneau Externe de la fenêtre du site vers la sélection. • Dans l’inspecteur, définissez l’URL ou l’adresse électronique du site en tant que destination dans la zone de texte Source ou Href. (Voir « Liaison des fichiers », page 55.) Utilisation de modèles de site Vous pouvez définir vos propres modèles de site pour créer de nouveaux site. Lorsque vous créez un modèle de site, vous pouvez lui associer deux fichiers image pour décrire la mise en page et la structure du site. Ces images apparaissent sous forme de petites vignettes situées à côté du nom du modèle de site lorsque vous créez un site. Créez ces images avant le modèle du site. Vous pouvez, par exemple, créer une image de la page d’accueil du site pour la mise en page et une image de la vue de navigation du site pour la structure. Vous pouvez utiliser les images fournies à titre indicatif dans le dossier Adobe GoLive 6.0 > Site Templates > Template Icons. Pour créer un modèle de site : 1 Créez un site ou copiez un site existant, y compris le dossier projet, le fichier projet du site, les dossiers racine, de données et de configuration du site, ainsi que le contenu des dossiers. Vous pouvez modifier l’un des modèles de site livrés avec GoLive pour l’utiliser comme modèle de votre site. 2 Placez le site et les fichiers image dans le dossier Adobe GoLive 6.0 > Site Templates. 3 Ouvrez le site en question. 4 Choisissez Site > Configuration ou cliquez sur le bouton Configurer le site de la barre d’outils tout en maintenant la touche Maj enfoncée. Les options Informations relatives au modèle sont affichées dans la boîte de dialogue Configuration du site. 5 Effectuez l’une des opérations suivantes : • Saisissez une description du site. • Cliquez sur Définir et sélectionnez le fichier image représentant la mise en page du site. • Cliquez sur Définir et sélectionnez le fichier image représentant la structure du site. 6 Cliquez sur OK et enregistrez le site. Comment utiliser l'aide | Sommaire | Index Page précédente 355 Aide d'Adobe GoLive Utilisation des éléments de construction de site Comment utiliser l'aide | Sommaire | Index Page précédente 356 Pour utiliser un modèle de site afin de créer de nouveaux sites : 1 Choisissez Fichier > Nouveau site. 2 Dans l’assistant de création de site, sélectionnez Utilisateur unique, puis cliquez sur Suivant. 3 Sélectionnez Copier d’un modèle, cliquez sur Suivant, puis suivez les instructions de l’assistant pour sélectionner le modèle et spécifiez l’emplacement du nouveau site. Pour plus de détails sur la création de sites sur un serveur de groupe de travail, voir « Création d’un site collaboratif », page 383. Comment utiliser l'aide | Sommaire | Index Page précédente 356 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 357 Transfert de fichiers et publication de sites Web Introduction au transfert de fichiers et à la publication de site La publication d’un site consiste à le télécharger (transférer) vers un serveur FTP pour le rendre accessible au public. Il s’agit également de la mise à jour de ce site sur le serveur avec les fichiers nouveaux ou modifiés. Adobe GoLive facilite la publication de sites sur un serveur FTP. Vous n’avez pas besoin de lancer un client FTP tiers pour télécharger les fichiers vers un serveur. GoLive fournit deux clients FTP intégrés : le panneau FTP dans la fenêtre du site et le navigateur FTP. Si vous utilisez le panneau FTP, vous n’avez pas besoin de quitter l’espace de travail de la fenêtre du site. La configuration des clients FTP de GoLive pour la connexion à un serveur FTP est très facile. La boîte de dialogue de configuration de site de GoLive vous permet de spécifier un serveur FTP pour votre site. Vous pouvez également configurer une liste de serveurs disponibles pour l’application. (Voir « Configuration de l’accès FTP », page 360.) Si votre groupe de travail utilise un serveur WebDAV, GoLive vous permet de spécifier des serveurs WebDAV pour un site en particulier ou pour l’application entière. Une fois que vous avez créé les pages de votre site, préparez la publication de celui-ci à l’aide des options de nettoyage, de détection des erreurs et, le cas échéant, d’exportation. (Voir « Rafraîchissement de la fenêtre de site », page 298, « Nettoyage d’un site », page 300 et « Exportation d’un site », page 368.) Panneau FTP Lorsque vous êtes prêt à publier votre site, il vous suffit de vous connecter au serveur FTP en cliquant sur le bouton Connecter/Déconnecter le serveur FTP de la barre d’outils. Les répertoires du serveur sont affichés dans le panneau FTP de la fenêtre du site. L’utilisation de ce panneau est des plus simple et offre une très grande flexibilité pour le téléchargement du site. De plus, le panneau FTP assure la synchronisation des dates de modification des fichiers téléchargés vers le serveur et de vos fichiers locaux. Dès lors, vous pouvez rationaliser et personnaliser le transfert des fichiers à l’aide des commandes GoLive Téléchargement incrémentiel vers le serveur, Télécharger les éléments modifiés, Télécharger la sélection et Tout télécharger. (Voir « A propos du téléchargement vers le serveur et de la mise à jour », page 362.) Vous pouvez également télécharger une sélection de fichiers ou de dossiers en les faisant glisser du panneau Fichiers de la fenêtre du site jusqu’à l’emplacement souhaité dans le panneau FTP. Les fichiers ou dossiers sont automatiquement mis à jour. Comment utiliser l'aide | Sommaire | Index Page précédente 357 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 358 Navigateur FTP Pour les transferts de fichiers classiques vers un serveur, GoLive est doté d’un navigateur FTP. Ce dernier vous permet de choisir un serveur dans une liste que vous avez définie. Pour télécharger les fichiers et les dossiers, il vous suffit de les faire glisser dans la fenêtre de ce navigateur FTP. (Voir « Transfert de fichiers à l’aide du navigateur FTP », page 367.) WebDAV Le client WebDAV de GoLive vous permet d’établir une connexion avec un serveur WebDAV. (Voir « Gestion d’un site Web à l’aide de WebDAV », page 371.) Présentation de la publication de site Pour que le public puisse consulter votre site Web, les fichiers correspondants doivent se trouver sur un serveur HTTP. Néanmoins, le transfert des fichiers (téléchargement vers et depuis) est généralement effectué via un serveur FTP. La publication de site désigne l’ensemble de ce processus. Pour plus de détails sur la préparation d’un site en vue de sa publication, voir « Nettoyage d’un site », page 300 et « Correction des erreurs de site », page 328. Pour préparer un site en vue de sa publication : 1 Si nécessaire, nettoyez le site. Le nettoyage du site permet de s’assurer que les listes affichées dans sa fenêtre principale correspondent à son contenu. Outre les erreurs, telles que les liens rompus et les pages manquantes, il peut s’avérer nécessaire de rechercher sur le site les liens en attente non résolus. Assurez-vous en outre que la bibliothèque Jscript a été optimisée. 2 Vérifiez que le site ne contient pas d’erreurs. 3 Si nécessaire, exportez-le. L’exportation d’un site consiste à le convertir dans une structure adaptée au serveur FTP vers lequel vous le téléchargez. (Voir « Exportation d’un site », page 368.) L’exportation étant rarement nécessaire, consultez l’administrateur du serveur avant de commencer la procédure. Pour publier un site : 1 Connectez-vous au serveur FTP à l’aide du panneau FTP de GoLive. 2 Téléchargez le site ou mettez-le à jour sur le serveur. Configuration de l’accès Internet Avant de pouvoir utiliser les clients FTP GoLive pour la connexion au serveur FTP, vous devrez peut-être personnaliser la configuration de votre réseau pour l’accès Internet. Ainsi, votre fournisseur d’accès vous demandera peut-être d’utiliser un serveur proxy pour des raisons de sécurité ou d’activer le mode passif pour travailler avec un pare-feu interdisant les connexions entrantes. Pour configurer l’accès Internet : 1 Choisissez Edition > Préférences. 2 Cliquez sur l’icône Réseau . Comment utiliser l'aide | Sommaire | Index Page précédente 358 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 359 3 Sélectionnez les options de réseau suivantes : • (Mac OS uniquement) Si vous souhaitez utiliser les paramètres du tableau de bord Internet de votre ordinateur pour l’accès Internet GoLive, cliquez sur le bouton Importer, puis sélectionnez l’option Toujours utiliser. • Si vous devez utiliser un proxy FTP ou HTTP, cochez respectivement la case Utiliser un proxy FTP ou Utiliser un proxy HTTP, puis indiquez un nom d’hôte et un numéro de port. Pour plus de détails, consultez l’administrateur du serveur. • Si vous rencontrez des problèmes de déconnexion automatique lors du téléchargement d’un site, cochez la case Maintenir les connexions. • Si la durée de résolution des liens (fichiers d’alias ou raccourcis) sur le serveur est excessive, désactivez l’option Résoudre les liens. • (Mac OS) Si vous utilisez la fonction de trousseau du système pour l’enregistrement des mots de passe, sélectionnez l’option Utiliser le trousseau du système pour les mots de passe. 4 Cliquez sur OK. Remarque : Si vous devez vous connecter en mode passif, choisissez Edition > Serveurs, sélectionnez un serveur, cliquez sur le bouton Options avancées, puis cochez la case Utiliser le mode passif (PASV) et cliquez sur OK. Si vous obtenez le message « Impossible d’établir la connexion au serveur. Soit le serveur ne fonctionne pas, soit les paramètres proxy sont incorrects. », votre configuration proxy est probablement incorrecte. Pour la vérifier, choisissez Edition > Préférences, puis cliquez sur Réseau. Vous trouverez des informations sur la configuration proxy dans la base de connaissances du service Adobe Online. Connexion à un serveur FTP GoLive se connecte à un serveur FTP via le protocole traditionnel FTP (File Transfer Protocol). Les sections ci-après traitent des connexions FTP à l’aide des clients FTP GoLive. Remarque : La connexion FTP nécessite un accès Internet. A propos des clients FTP de GoLive Les clients FTP établissent une connexion à Internet et utilisent les services (tels que l’accès aux fichiers) fournis par un serveur. GoLive dispose de deux clients FTP : • Utilisez toujours le panneau FTP de la fenêtre du site pour réaliser un téléchargement tout en conservant une relation synchronisée biunivoque entre les fichiers locaux et distants. Ceci vous vous permet d’accéder aux commandes de téléchargement incrémentiel (vers et depuis un serveur) et de procéder à l’exportation et au téléchargement vers le serveur en une seule étape. Le panneau FTP fournit un accès direct à l’ensemble des éléments de construction de la fenêtre du site. Il est déconseillé de l’utiliser pour des transferts de fichiers classiques, en particulier lorsque vous faites glisser des fichiers du bureau pour les transférer sur un serveur. Le cas échéant, le site émet une requête de téléchargement incrémentiel de ces fichiers (depuis le serveur) lors de la publication subséquente. • Utilisez le navigateur FTP pour les transferts de fichiers d’ordre général. Grâce à lui, vous n’avez pas besoin de lancer une application FTP tiers. Comment utiliser l'aide | Sommaire | Index Page précédente 359 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 360 Ces deux clients affichent la liste des fichiers et des dossiers contenus dans le répertoire FTP actif en indiquant la taille, la date de modification et le type de chaque fichier. Remarque : Lorsque vous sélectionnez un fichier ou un dossier dans le panneau ou le navigateur FTP, l’inspecteur de fichier ou de dossier FTP est affiché. Ces inspecteurs fournissent des informations supplémentaires sur les différents fichiers et dossiers. (Voir « Vérification des propriétés de fichier », page 294.) Connexion à un serveur FTP La connexion à un serveur FTP vous permet de télécharger un site (depuis ou vers un serveur) et d’effectuer des opérations de transfert de fichiers. Avant de vous connecter à un serveur FTP pour la première fois, vous devez configurer l’accès à celui-ci. (Voir « Configuration de l’accès FTP », page 360.) GoLive vous permet d’enregistrer plusieurs paramètres pour l’accès à différents serveurs FTP. Pour établir une connexion à un serveur FTP à partir du panneau FTP : 1 Ouvrez un site. 2 Cliquez sur le bouton Connecter/Déconnecter le serveur FTP choisissez Site > Serveur FTP > Connecter. de la barre d’outils ou Remarque : Lorsque vous êtes connecté à un serveur FTP, la fenêtre du site affiche automatiquement le panneau FTP. Pour établir une connexion à un serveur FTP à partir du navigateur FTP : 1 Choisissez Fichier > Navigateur FTP. 2 Effectuez l’une des opérations suivantes : • Cliquez sur Connecter pour établir une connexion au serveur actif. • Choisissez un nouveau serveur dans le menu Serveur et cliquez sur Connecter. Pour modifier le serveur actif pour les connexions FTP : 1 Lorsque la fenêtre du site est active, choisissez l’option Serveur FTP dans le menu contextuel et sélectionnez un serveur. Lors du transfert des fichiers, vous risquez de recevoir un code de réponse FTP. Ce code indique l’état du serveur auquel vous êtes connecté. Vous trouverez une liste des codes de réponse FTP et leur signification dans la base de connaissances du service Adobe Online (http://www.adobe.com). Vous pouvez également consulter le site Web du W3C à l’adresse http://www.w3.org. Configuration de l’accès FTP Pour établir une connexion à un serveur FTP, vous devez indiquer son adresse et plusieurs autres valeurs. Lorsque vous entrez ces valeurs, vous pouvez vous connecter immédiatement au serveur ou les enregistrer en vue de les réutiliser ultérieurement. Les procédures suivantes vous permettent de configurer une liste de serveurs disponibles (FTP ou WebDAV). L’utilisation du serveur WebDAV est décrite plus loin dans ce chapitre. (Voir « Gestion d’un site Web à l’aide de WebDAV », page 371.) Important : Avant de procéder à la configuration de l’accès FTP, assurez-vous que la gestion de réseau TCP/IP est configurée correctement sur votre ordinateur. Pour plus de détails, consultez la documentation de ce dernier. Comment utiliser l'aide | Sommaire | Index Page précédente 360 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 361 Pour configurer une connexion à un serveur FTP ou WebDAV : 1 Choisissez Edition > Serveurs. Vous pouvez également afficher la boîte de dialogue Serveurs disponibles en choisissant l’option Modifier le serveur dans le menu Serveur de la boîte de dialogue de configuration du site, celle du navigateur FTP ou celle du navigateur WebDAV. (Voir « Connexion à un serveur FTP », page 360.) 2 Dans la boîte de dialogue Serveurs disponibles, cliquez sur le bouton Nouvel élément . 3 Saisissez un nom dans la zone de texte Surnom. Ceci permet d’éviter les confusions si vous ajoutez d’autres serveurs à la liste. 4 Effectuez toutes les opérations suivantes en utilisant les valeurs fournies par l’administrateur du serveur FTP : • Spécifiez une adresse dans la zone de texte Serveur. Elle doit commencer par « ftp:// » pour les serveurs FTP et par « http:// » pour les serveurs WebDAV. • Spécifiez un chemin d’accès dans la zone de texte Répertoire. Si vos droits d’accès sont limités à votre dossier personnel, vous pouvez probablement laisser cette zone vide. • Indiquez un ID utilisateur dans la zone de texte Utilisateur. • Cochez la case Enregistrer et saisissez un mot de passe dans la zone de texte Mot de passe. 5 Si nécessaire, cliquez sur Options avancées et effectuez l’une des opérations suivantes : • Sélectionnez Utiliser le mode passif. Cette option vous sera utile si le serveur FTP est protégé par un pare-feu. • Sélectionnez Maintenir les connexions pour éviter les problèmes de déconnexion automatique due à l’inactivité. • (Mac OS uniquement) Laissez l’option Utiliser ISO 8859-1 pour le transport de caractères sélectionnée pour utiliser le jeu de caractères d’encodage Latin 1 qui convient pour la plupart des langues d’Europe occidentale. • Sélectionnez l’option Résoudre les liens pour comparer vos fichiers locaux à ceux placés sur votre serveur FTP. 6 Cliquez sur OK. Les valeurs sont enregistrées pour une réutilisation ultérieure. Pour configurer une connexion à un serveur FTP ou WebDAV à l’aide de la boîte de dialogue de configuration de site : 1 Ouvrez un site. 2 Effectuez l’une des opérations suivantes : • Cliquez sur le bouton Configurer le site FTP et WebDAV. de la barre d’outils ou sélectionnez Serveur • Choisissez Site > Configuration, puis sélectionnez Serveur FTP et WebDAV. 3 Choisissez un serveur dans le menu de serveur approprié. Comment utiliser l'aide | Sommaire | Index Page précédente 361 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 362 4 Cliquez sur OK. Le serveur configuré devient le serveur actif pour le site, c.-à-d. le serveur auquel vous vous connectez lorsque vous utilisez le navigateur FTP ou WebDAV. Remarque : Si le menu Serveur ne contient aucun élément ou que vous n’y trouvez pas le serveur recherché, choisissez l’option Modifier le serveur et suivez les instructions précédentes pour configurer une connexion à un serveur FTP ou WebDAV. Téléchargement de fichiers vers et depuis un serveur à l’aide de FTP Les mêmes méthodes de connexion FTP permettent de télécharger de nouveaux sites vers un serveur FTP et de mettre à jour les sites existants. Vous pouvez télécharger un site depuis le serveur afin de mettre à jour votre copie locale du site. A propos du téléchargement vers le serveur et de la mise à jour La première fois que vous téléchargez un site vers le serveur, il est entièrement copié sur celui-ci. Les téléchargements suivants sont normalement des mises à jour destinées à synchroniser le site local et celui du serveur. Pour les mises à jour, deux options s’offrent à vous : • L’option Téléchargement incrémentiel vers le serveur permet de copier uniquement les nouveaux fichiers du site et ceux dont les dates de modification sur le système local sont plus récentes que celles des fichiers correspondants sur le serveur. (Si un fichier a été modifié à la fois sur le système local et sur le serveur, et que la date de modification est plus récente sur ce dernier, GoLive ne télécharge pas le fichier local.) • L’option Télécharger les éléments modifiés vers le serveur permet de copier uniquement les nouveaux fichiers du site et ceux qui ont été modifiés dans GoLive depuis le dernier téléchargement. Lorsque cette option est appliquée à des fichiers modifiés dans GoLive, les fichiers modifiés sur le système local sont téléchargés vers le serveur sans que les dates de modification du serveur et du système local soient comparées. Dès lors, il se peut qu’un fichier local soit téléchargé alors que son équivalent sur le serveur est le dernier a avoir été modifié. (Si un fichier local a été modifié dans un autre programme que GoLive, il n’est pas téléchargé vers le serveur et ce, quelle que soit sa date de modification.) En outre, l’option Télécharger la sélection vers le serveur vous permet de copier uniquement les fichiers du site que vous sélectionnez. Cette méthode est utile en cas de problème de mise à jour ; par exemple si, à la suite d’une défaillance du système durant le téléchargement incrémentiel, le serveur comporte des fichiers incomplets devant être remplacés bien que leur nouvelle date de modification ne permette pas une nouvelle mise à jour incrémentielle. Pour effectuer le téléchargement d’une sélection de fichiers ou de dossiers, il vous suffit de vous connecter au serveur FTP, puis de faire glisser les fichiers ou dossiers souhaités depuis le panneau Fichiers de la fenêtre du site jusqu’à l’emplacement voulu dans le panneau FTP. Les fichiers ou dossiers sont automatiquement téléchargés vers le serveur. Comment utiliser l'aide | Sommaire | Index Page précédente 362 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 363 Téléchargement vers le serveur et dates de modification Lorsque vous téléchargez des fichiers vers un serveur FTP, GoLive enregistre la date de modification locale dans la mémoire cache pour tout fichier transféré sur le serveur. Une fois le téléchargement terminé avec succès, GoLive reçoit une liste des dates de modification sur le serveur pour les fichiers concernés. Ces dates de modification sont enregistrées dans le fichier du site et servent de référence à GoLive pour distinguer les nouveaux fichiers des anciens. Ceci permet à GoLive de réaliser des téléchargements incrémentiels et sélectifs vers le serveur. Si les dates de modification pour les fichiers locaux et serveur ne sont plus synchronisées parce que vous avez utilisé un client FTP tiers ou que le téléchargement a échoué, GoLive vous permet de synchroniser ces dates manuellement sans transférer aucune donnée. (Voir « Synchronisation des dates de modification pour les fichiers locaux et serveur », page 365.) Téléchargement et mise à jour d’un site sur le serveur Vous pouvez utiliser indifféremment la méthode incrémentielle ou la méthode sélective pour le premier téléchargement d’un site comme pour ses mises à jour subséquentes. Pour télécharger un site vers un serveur FTP : 1 Ouvrez le site en question et connectez-vous au serveur FTP. (Voir « Connexion à un serveur FTP », page 359.) Remarque : Quatre commandes différentes sont associées au bouton de téléchargement vers le serveur . Une modification de la commande risque d’être nécessaire pour obtenir le téléchargement souhaité. Pour vérifier la commande active, placez le pointeur de la souris sur le bouton de téléchargement afin d’afficher l’info-bulle correspondante. Si vous devez modifier la commande du bouton, cliquez sur celui-ci en maintenant le bouton de la souris enfoncé jusqu’à ce que le menu du bouton s’affiche, puis choisissez une commande. 2 Effectuez l’une des opérations suivantes : • Cliquez sur le bouton de téléchargement incrémentiel vers le serveur de la barre d’outils ou choisissez Site > Serveur FTP > Téléchargement incrémentiel vers le serveur. • Cliquez sur le bouton de téléchargement des éléments modifiés vers le serveur de la barre d’outils ou choisissez Site > Serveur FTP > Télécharger les éléments modifiés. Vérifiez ensuite les fichiers qui doivent être téléchargés dans la boîte de dialogue Télécharger le site et cliquez sur OK. • Sélectionnez le dossier ou les fichiers à télécharger dans le panneau Fichiers, puis cliquez sur le bouton Télécharger la sélection vers le serveur de la barre d’outils ou choisissez Site > Serveur FTP > Télécharger la sélection. 3 Si la boîte de dialogue Options de téléchargement est affichée, vérifiez les options définies et apportez les modifications nécessaires. Ces modifications sont appliquées au téléchargement actif uniquement. 4 Cliquez sur OK. (Voir « Définition des options de téléchargement vers le serveur », page 364.) Comment utiliser l'aide | Sommaire | Index Page précédente 363 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 364 Pour télécharger une sélection de fichiers manuellement : 1 Sélectionnez le fichier ou dossier souhaité dans le panneau Fichiers de la fenêtre du site. 2 Faites glisser le fichier ou le dossier à l’emplacement voulu dans panneau FTP. Définition des options de téléchargement vers le serveur Les téléchargements vers le serveur sont réalisés conformément aux options définies, que vous pouvez conserver telles quelles ou modifier si nécessaire. Pour sélectionner des options de téléchargement : 1 Effectuez l’une des opérations suivantes : • Si vous souhaitez définir des options pour le site actif uniquement, cliquez sur le bouton Configurer le site de la barre d’outils ou choisissez Site > Configuration, cliquez sur Téléchargement/Synchr., puis cochez la case Paramètres spécifiques au site. • Si vous souhaitez sélectionner des options pour tous les sites, choisissez Edition > Préférences, développez l’arborescence de la liste Site, puis cliquez sur Téléchargement/ Synchr. 2 Faites votre choix parmi les options de téléchargement suivantes : • Sélectionnez une option de la zone Respecter l’état de « publication » de afin d’utiliser des paramètres de publication pour des fichiers ou des dossiers individuels. Pour outrepasser l’état de publication individuel des fichiers et des dossiers, désactivez les options correspondantes. (Voir « Affectation d’états de publication à des fichiers et dossiers », page 334.) • Cochez la case Télécharger/Synchroniser les fichiers liés uniquement pour télécharger uniquement les fichiers faisant partie de l’arborescence du site. Cette option est disponible uniquement lorsque les options de la zone Respecter l’état de « publication » de sont désactivées. • Cochez la case Afficher la liste des fichiers à télécharger pour vérifier les fichiers à télécharger. • Cochez la case Afficher la boîte de dialogue des options si vous souhaitez vérifier ces options lors de chaque téléchargement. 3 Sélectionnez l’une des options d’élimination des codes HTML suivantes : • Cochez les cases Commentaires et Espaces pour rationaliser le code source sans affecter l’aspect des pages. • Cochez la case Eléments d’Adobe GoLive pour supprimer les balises et attributs GoLive, utilisés pour modifier les animations et les actions de script. • Cochez la case Eliminer les données GoLive des fichiers multimédias pour rechercher et supprimer toutes les données d’objet dynamique dans les fichiers GIF, JPEG, PNG, SWF et SVG afin de réduire leur taille. • Cochez la case Optimiser la bibliothèque de scripts pour détecter les fichiers utilisant la bibliothèque JavaScript de GoLive et recréer les fichiers externes de manière à ce qu’ils contiennent le code JavaScript exact, requis pour le site. (Voir « Optimisation de la bibliothèque de scripts », page 287.) 4 Cliquez sur OK. Comment utiliser l'aide | Sommaire | Index Page précédente 364 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 365 Téléchargement d’un site depuis le serveur en vue de sa mise à jour Vous pouvez synchroniser des fichiers locaux du site avec des fichiers sur un serveur en effectuant un téléchargement vers ou depuis le serveur. La synchronisation par téléchargement depuis le serveur est utile si vous avez modifié le site sur ce dernier et que vous devez répercuter les modifications sur le site local. Deux options s’offrent à vous pour le téléchargement depuis le serveur : • L’option Téléchargement incrémentiel depuis le serveur permet de copier uniquement les fichiers du site dont les dates de modification sur le serveur sont plus récentes que celles des fichiers locaux correspondants. (Lorsqu’un fichier local est doté d’une date de modification plus récente, GoLive ne télécharge pas son équivalent depuis le serveur.) • L’option Télécharger la sélection depuis le serveur permet de copier uniquement les fichiers que vous avez sélectionné à partir du serveur. Elle se justifie pour les mêmes raisons que le téléchargement d’une sélection vers le serveur. (Voir « A propos du téléchargement vers le serveur et de la mise à jour », page 362.) Pour mettre un site à jour en le téléchargeant depuis le serveur : 1 Ouvrez le site en question et connectez-vous au serveur FTP. 2 Effectuez l’une des opérations suivantes : • Cliquez sur le bouton Téléchargement incrémentiel depuis le serveur de la barre d’outils ou choisissez Site > Serveur FTP > Téléchargement incrémentiel depuis le serveur. • Sélectionnez les dossiers ou les fichiers à télécharger dans le panneau FTP, puis choisissez Site > Serveur FTP > Télécharger la sélection depuis le serveur. Synchronisation des dates de modification pour les fichiers locaux et serveur Vous devez conserver la synchronisation des fichiers locaux et serveur pour permettre à GoLive d’effectuer des téléchargements incrémentiels ou sélectifs vers le serveur. GoLive vous permet de synchroniser manuellement les dates de modification de ces fichiers sans transférer aucune donnée. Cette opération s’avère utile lorsque les dates de modification ne sont pas synchronisées alors que vous savez que les fichiers locaux et serveur sont identiques. Des fichiers peuvent être désynchronisés dans plusieurs cas. Par exemple, lorsque vous utilisez un client FTP différent de celui de GoLive pour télécharger les fichiers vers le serveur, puis que vous essayez de synchroniser ces fichiers à partir de GoLive, les fichiers locaux apparaissent plus anciens que ceux du serveur. Ceci provient du fait que GoLive continue de faire référence aux horodatages qu’il a créé lors du dernier téléchargement de fichiers. Afin de conserver la synchronisation des fichiers, GoLive essaie alors de télécharger les fichiers lui semblant nouveaux depuis le serveur. De tels téléchargements sont superflus et risquent de durer longtemps s’ils concernent plusieurs fichiers. Comment utiliser l'aide | Sommaire | Index Page précédente 365 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 366 Pour synchroniser manuellement les dates de modification sans transférer de fichier : 1 Lorsque le site est ouvert et que GoLive est connecté au serveur FTP, effectuez l’une des opérations suivantes : • Choisissez Site > Serveur FTP, puis l’option Synchroniser les heures de modification sélectionnées ou Synchroniser toutes les heures de modification (pour synchroniser le site entier). • Dans le panneau Fichiers de la fenêtre du site, sélectionnez un fichier, un dossier ou un groupe de fichiers ou de dossiers. Utilisez ensuite le menu contextuel pour choisir Serveur FTP, puis l’option Synchroniser les heures de modification sélectionnées ou Synchroniser toutes les heures de modification (pour synchroniser le site entier). 2 Dans la boîte de dialogue Synchroniser les options d’heure, sélectionnez l’une des options suivantes, puis cliquez sur OK : • Les options Respecter l’état de « publication » des dossiers/fichiers font référence à l’état de publication que vous pouvez définir pour chaque fichier ou dossier dans GoLive. Pour outrepasser l’état de publication individuel des fichiers et des dossiers, désactivez les options correspondantes. (Voir « Affectation d’états de publication à des fichiers et dossiers », page 334.) • L’option Afficher la liste des fichiers à télécharger permet d’afficher une liste des fichiers à télécharger avant de démarrer le transfert actif. Pour exclure des fichiers, désélectionnez-les dans la liste. • L’option Afficher la boîte de dialogue des options permet d’afficher la boîte de dialogue Options de téléchargement avant de procéder au transfert des fichiers. Ceci vous permet de revoir les options définies à chaque téléchargement. 3 Si nécessaire, activez ou désactivez les cases des fichiers à synchroniser dans la boîte de dialogue Synchronisation des fichiers, puis cliquez sur OK. Si vous choisissez Synchroniser toutes les heures de modification et que vous souhaitez exclure un fichier de la synchronisation, désactivez la case du fichier concerné dans la boîte de dialogue Synchronisation des fichiers, puis cliquez sur OK. Remarque : Veuillez noter que la synchronisation de toutes les heures de modification pour un site entier entraîne le changement de ces heures pour tous les fichiers, qu’ils aient été modifiés ou pas, mais téléchargés vers le serveur. Lors du prochain téléchargement vers le serveur, ces fichiers ne seront pas téléchargés par GoLive car les heures de modification des fichiers locaux correspondent à celles des fichiers sur le serveur. Il est donc conseillé d’utiliser la commande de synchronisation des heures de modification avec précaution. S’il y a interruption du téléchargement, assurez-vous de ne pas appliquer cette commande aux fichiers qui n’ont pas été téléchargés. Téléchargement d’une page Web depuis le serveur Vous pouvez télécharger une page Web depuis le serveur avec tous les éléments multimédias qu’elle référence et à partir de n’importe quel site auquel vous pouvez accéder avec un navigateur. Pour ce faire, vous n’avez pas besoin de l’accès FTP aux répertoires contenant cette page et ses images. Une fois le téléchargement terminé, la page s’affiche dans une fenêtre de document de GoLive. Comment utiliser l'aide | Sommaire | Index Page précédente 366 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 367 La page est téléchargée à l’emplacement spécifié et ses éléments multimédias sont placés dans un dossier associé à la page. Cette structure de dossiers risque de ne pas correspondre aux emplacements respectifs des fichiers sur le site Web d’origine. Les fichiers et éléments multimédias référencés par des langages, tels que JavaScript, ne sont pas téléchargés (c’est notamment le cas des images de boutons animés). Remarque : Vous pouvez aussi télécharger un site ou une sous-structure de site à l’aide de la fonction Importer d’un serveur de l’assistant de création de site (voir « Création d’un site », page 38 ou le Guide de l’utilisateur d’Adobe GoLive Web Workgroup Server) ou de la commande Télécharger disponible à partir du menu contextuel du panneau Externe dans la fenêtre du site ou à partir de la palette Liens entrants et sortants. (Voir « Importation des sites stockés sur des serveurs distants », page 40.) Pour télécharger une page Web depuis le serveur : 1 Assurez-vous que vous disposez d’une connexion Web active. 2 Choisissez Fichier > Télécharger la page. 3 Indiquez l’URL (Universal Resource Locator) de la page qui vous intéresse. 4 Cliquez sur Enregistrer sous, spécifiez un emplacement, puis cliquez sur Enregistrer. La page à télécharger étant probablement constituée de plusieurs fichiers, pensez à créer un nouveau dossier pour ces derniers. Transfert de fichiers à l’aide du navigateur FTP GoLive comporte un navigateur FTP permettant de transférer des fichiers vers et depuis le panneau Fichiers ou le bureau du système. Vous pouvez également l’utiliser pour toute autre opération FTP. Remarque : Si vous souhaitez télécharger un site dans son intégralité ou effectuer une mise à jour afin de synchroniser les sites sur l’ordinateur local et sur le serveur, utilisez l’une des commandes de mise à jour du menu Site > Serveur FTP (ou le bouton correspondant de la barre d’outils) plutôt que le navigateur FTP. Pour effectuer des transferts de fichiers simples avec le navigateur FTP : 1 Choisissez Fichier > Navigateur FTP. 2 Choisissez un navigateur dans le menu Serveur et cliquez sur le bouton Connecter. 3 Effectuez l’une des opérations suivantes : • Pour télécharger un fichier ou un dossier vers le serveur, faites-le glisser d’un panneau de la fenêtre du site vers le navigateur FTP. • Pour télécharger un fichier ou un dossier depuis le serveur, faites-le glisser du navigateur FTP vers un panneau de la fenêtre du site. • (Mac OS uniquement) Pour télécharger un fichier ou un dossier depuis le serveur, faitesle glisser du navigateur FTP vers le bureau. Comment utiliser l'aide | Sommaire | Index Page précédente 367 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 368 Adaptation des sites à des environnements de serveurs spécifiques Il se peut que vous soyez amené à adapter votre site à l’environnement du serveur vers lequel vous le téléchargez. Dans ce cas, vous devez exporter le site avant de le télécharger vers le serveur. Vous pourrez également être amené à diviser votre site entre plusieurs serveurs. Pour ce faire, vous devez utiliser la fonction de mappage des URL. Exportation d’un site L’exportation d’un site consiste à adapter sa structure de dossiers et d’autres détails à un serveur FTP particulier, à savoir celui vers lequel vous souhaitez télécharger ce site. Cette opération est distincte du téléchargement ; vous exportez le site vers un lecteur local avant le téléchargement vers le serveur. Remarque : Peu de serveurs Web nécessitent l’exportation des sites GoLive. Consultez l’administrateur du serveur avant de commencer la procédure d’exportation. Pour définir les options d’exportation du site : 1 Effectuez l’une des opérations suivantes : • Si vous souhaitez définir des options uniquement pour le site actif, cliquez sur le bouton Configurer le site de la barre d’outils ou choisissez Site > Configuration, cliquez sur Exporter, puis sélectionnez Paramètres spécifiques au site. • Si vous souhaitez sélectionner des options pour tous les sites, choisissez Edition > Préférences, développez l’arborescence de la liste Site, puis cliquez sur Exporter. 2 Définissez les conditions d’exportation suivantes : • Les options de la zone Respecter l’état « publication » s’appliquent aux paramètres de publication définis dans le panneau Fichier de l’inspecteur de fichier. Sélectionnez l’option S’il est référencé (par défaut), Toujours ou Jamais. (Voir « Affectation d’états de publication à des fichiers et dossiers », page 334.) • L’option Exporter les fichiers liés qui ne font pas partie du site englobe les fichiers orphelins. 3 Sélectionnez l’une des options d’arborescence suivantes : • L’option Identique à celle du site permet de reproduire dans le dossier racine résultant la hiérarchie des groupes, des pages et des ressources figurant dans la fenêtre du site. • L’option Séparation des fichiers HTML et multimédias permet de créer un dossier racine contenant deux sous-dossiers destinés, respectivement, aux pages HTML et aux éléments multimédias. • L’option Stockage dans un seul dossier permet de créer un dossier racine contenant toutes les pages HTML et les éléments multimédias, mais aucun sous-dossier. • Les noms de dossiers s’appliquent à l’option Séparation des fichiers HTML et multimédias. Pour les fichiers hors du site, la zone Nom du dossier intervient uniquement lorsque vous sélectionnez Exporter les fichiers liés qui ne font pas partie du site. Comment utiliser l'aide | Sommaire | Index Page précédente 368 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 369 4 Sélectionnez l’une des options d’élimination des codes HTML suivantes : • Les options Commentaires et Espaces permettent de rationaliser le code source sans affecter l’aspect des pages. • L’option Eléments d’Adobe GoLive permet de supprimer les balises et les attributs du programme utilisés pour modifier vos animations, actions de scripts, etc. • L’option Eliminer les données GoLive des fichiers multimédias permet de rechercher dans les fichiers GIF, JPEG, PNG, SWF et SVG toutes les données ajoutées pour activer le processus des objets dynamiques. Les données sont ajoutées uniquement aux fichiers cible des objets dynamiques. Lorsque l’option est sélectionnée, ces données sont supprimées pour réduire la taille des fichiers. • L’option Optimiser la bibliothèque de scripts permet de détecter les fichiers utilisant la bibliothèque JavaScript GoLive et de recréer les fichiers externes de manière à ce qu’ils contiennent le code JavaScript exact, requis pour le site. (Voir « Optimisation de la bibliothèque de scripts », page 287.) L’utilisation de cette option est recommandée. 5 Cochez la case Afficher la boîte de dialogue des options si vous souhaitez vérifier ces options lors de chaque exportation, puis cliquez sur OK. Pour exporter un site vers un lecteur local : 1 Ouvrez le site en question. 2 Choisissez Fichier > Exporter > Site. 3 Si la boîte de dialogue Options d’exportation du site s’affiche, vérifiez les paramètres définis. 4 Cliquez sur Exporter et apportez les modifications nécessaires. Ces modifications sont appliquées à l’exportation active uniquement. Par défaut, les paramètres définis dans la boîte de dialogue Options d’exportation du site sont identiques à ceux de l’élément Exporter dans la liste de la boîte de dialogue de configuration du site. Remarque : Si vous souhaitez afficher la boîte de dialogue Options d’exportation du site lors de chaque exportation, choisissez Edition > Préférences, développez l’arborescence de l’élément Site, cliquez sur Exporter et assurez-vous que la case Afficher la boîte de dialogue des options est cochée. 5 Spécifiez l’emplacement du lecteur local où le dossier racine du site doit être exporté. 6 Cliquez sur Enregistrer. 7 Choisissez Oui ou Non. L’option Oui permet d’afficher les informations suivantes sur l’opération d’exportation : fichiers exportés, fichiers non exportés et raisons de la nonexportation, options d’exportation utilisées. Pour télécharger vers le serveur un site que vous avez exporté vers un lecteur local : Faites glisser le dossier racine exporté ou son contenu vers le dossier cible dans la fenêtre du navigateur FTP. (Voir « Transfert de fichiers à l’aide du navigateur FTP », page 367.) Il n’est pas possible d’utiliser les commandes de téléchargement du menu Site > Serveur FTP ni les boutons correspondants de la barre d’outils pour cette opération. Faites glisser le contenu du dossier plutôt que celui-ci, si vous souhaitez éviter la création d’un niveau supplémentaire inutile dans l’arborescence du serveur FTP. Comment utiliser l'aide | Sommaire | Index Page précédente 369 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 370 Configuration de sites Web répartis Si vous envisagez de répartir votre site Web sur plusieurs serveurs (sous-sites), vous avez toujours la possibilité de le développer et de le tester sur votre système local. Pour ce faire, vous devez configurer le site réparti en définissant des mappages d’URL entre les adresses locales et les adresses du serveur. Les mappages d’URL vous permettent de gérer facilement plusieurs sites sans devoir recréer les URL ou les fichiers en double. Les sites peuvent partager un nombre important de fichiers identiques et être liés les uns aux autres. Pour configurer un site Web réparti sur plusieurs serveurs : 1 Créez un document de site distinct pour chaque serveur. 2 Conservez le nom de fichier par défaut index.html pour la page d’accueil du site qui représente le point d’entrée de votre site réparti. 3 Renommez le fichier de page d’accueil pour tous les autres sous-sites. Ceci permet d’éviter que votre site réparti comporte des noms de fichiers en double. 4 Ajoutez des pages et des hyperliens pour tous les sous-sites. Créez les hyperliens entre ces sous-sites de la même manière que vous procéderiez pour un autre site local. Par exemple, un hyperlien allant d’une page du sous-site Football vers la page Putters.html du sous-site Golf pourra comporter l’adresse file:///chemin/Golf/Putters.html. Les hyperliens définis entre les sous-sites peuvent utiliser des chemins relatifs ou complets. 5 Activez la fenêtre du site contenant la page d’accueil index.html active. 6 Cliquez sur le bouton Configurer le site Configuration. de la barre d’outils ou choisissez Site > 7 Cliquez sur Mappage des URL, puis sur le bouton Nouvel élément 8 Choisissez Racine du site dans le menu le dossier ou le serveur local suivant. . situé en regard de la zone de texte Associer Le chemin du dossier racine correspondant au document du site actif est affiché. Lorsque vous indiquerez un lien externe vers une adresse sur le serveur, au point suivant, vous pourrez probablement conserver une partie de ce chemin. 9 Modifiez le chemin de sorte qu’il contienne l’URL vers l’emplacement où figurera ce dossier racine sur le serveur. Remarque : Vous pouvez également utiliser le mappage des URL pour un dossier local. Par exemple, si vous souhaitez masquer la hiérarchie des dossiers de votre site. 10 Choisissez Racine du site dans le menu associé à la zone de texte Avec le dossier local suivant . Le programme mappe l’emplacement actuel du dossier racine sur son emplacement futur sur le serveur. 11 Cliquez sur OK pour enregistrer la configuration du site ou reprenez les instructions des points 4 à 10 pour chaque document du site que vous avez renommé au point 2. Important : Si vous comptez exécuter la commande Nettoyer le site pour l’un des soussites créés, vous devez d’abord désélectionner les options d’ajout des fichiers et des références externes utilisés dans la boîte de dialogue Options de nettoyage du site. Dans le cas contraire, cette commande détruira la structure du site réparti. Comment utiliser l'aide | Sommaire | Index Page précédente 370 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 371 Pour tester un site réparti dans un navigateur Web avant de le télécharger vers le serveur : 1 Affichez une page d’un dossier racine contenant un hyperlien vers une page d’un autre dossier racine. 2 Placez le curseur sur cet hyperlien. Le lien doit contenir le chemin d’accès local à la page référencée. 3 Reprenez ces instructions pour chaque hyperlien vers une page dans un autre dossier racine. Gestion d’un site Web à l’aide de WebDAV GoLive permet de vous connecter facilement à un serveur WebDAV, de verrouiller les fichiers sur lesquels vous travaillez pour éviter que vos collègues ne les modifient en même temps, de télécharger des fichiers depuis et vers le serveur, d’obtenir des informations sur les fichiers et de conserver une parfaite synchronisation entre les sites du système local et du serveur. GoLive 6 dispose d’un nouveau serveur Web Workgroup Server disposant de la fonctionnalité WebDAV qui peut théoriquement être utilisé comme un serveur WebDAV (voir le Guide de l’utilisateur d’Adobe Web Workgroup Server). A propos de la prise en charge WebDAV GoLive prend en charge la technologie serveur WebDAV (Web Distributed Authoring and Versioning). Il s’agit d’une norme (RFC 2518). Cette technologie valorise le protocole HTTP par le biais d’extensions qui permettent aux concepteurs de sites Web de travailler en toute sécurité dans le cadre d’un groupe de travail, à l’aide de fonctionnalités comme le verrouillage de fichiers, sans la crainte qu’un document soit écrasé ou une mise à jour perdue accidentellement. Pour plus de détails sur WebDAV et ses nouveautés, consultez le site www.webdav.org. Pour utiliser WebDAV, vous devez vous connecter à un serveur disposant de la fonctionnalité WebDAV. Par exemple : • Microsoft IIS 5 (compris dans Windows 2000) • Apache (avec le module mod_dav installé) • Novell NetWare 6.0 Une équipe Web peut travailler sur un serveur de production WebDAV en interne, puis utiliser le protocole FTP de GoLive pour télécharger le site vers un serveur public dépourvu de la fonctionnalité WebDAV. Configuration des serveurs WebDAV Vous devez définir les paramètres généraux de WebDAV et ceux propres à un site avant toute tentative d’utilisation de la fonctionnalité WebDAV de GoLive. Dans la boîte de dialogue Serveurs disponibles, définissez une liste de serveurs (WebDAV ou FTP) disponibles dans GoLive. (Voir « Configuration de l’accès FTP », page 360.) Lorsque vous avez défini un serveur, vous pouvez l’affecter à un site particulier à l’aide de la boîte de dialogue de configuration du site. Dans cette boîte de dialogue, il vous suffit de cliquer sur Serveurs FTP et WebDAV, puis de choisir le serveur souhaité dans le menu Serveur. Comment utiliser l'aide | Sommaire | Index Page précédente 371 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 372 Pour ajouter un serveur WebDAV à la liste Serveurs disponibles : 1 Choisissez Edition > Serveurs. 2 Dans la boîte de dialogue Serveurs disponibles, cliquez sur le bouton Nouvel élément . 3 Effectuez toutes les opérations suivantes en utilisant les valeurs fournies par l’administrateur du serveur WebDAV ou réseau : • Saisissez un nom pour le serveur dans la zone de texte Surnom. Ceci est essentiel pour éviter les confusions entre les différents serveurs ajoutés à la liste. • Spécifiez une adresse dans la zone de texte Serveur. Elle doit commencer par « http:// ». • Spécifiez un chemin d’accès dans la zone de texte Répertoire. Si vos droits d’accès sont limités à votre dossier personnel, vous pouvez probablement laisser cette zone vide. • Indiquez un ID utilisateur dans la zone de texte Utilisateur. • Cochez la case Enregistrer et saisissez un mot de passe dans la zone de texte Mot de passe. Remarque : Ce sont les droits d’accès au serveur WebDAV attribués par l’administrateur WebDAV qui déterminent si la saisie d’un mot de passe est obligatoire ou non. 4 Cliquez sur OK. Les valeurs entrées sont enregistrées en vue d’être réutilisées ultérieurement à partir d’un site quelconque. 5 Reprenez les instructions des points 1 à 5 pour ajouter d’autres serveurs WebDAV. 6 Une fois la saisie des serveurs WebDAV terminée, cliquez sur OK. Pour affecter un serveur WebDAV à un site particulier : 1 Ouvrez le site et cliquez sur le bouton Configurer le site de la barre d’outils. 2 Dans la boîte de dialogue de configuration du site, cliquez sur Serveurs FTP et WebDAV, puis effectuez l’une des opérations suivantes : • Choisissez un serveur dans le menu Serveur WebDAV. • Si le menu Serveur WebDAV ne contient pas de liste de serveurs ou que vous n’y trouvez pas le serveur recherché, choisissez l’option Modifier le serveur et suivez les instructions des points 2 à 5 dans la procédure précédente. 3 Cliquez sur OK. Connexion à un serveur WebDAV Vous pouvez vous connecter ou vous déconnecter d’un serveur WebDAV de plusieurs manières : • A l’aide du bouton Connecter/Déconnecter le serveur WebDAV de la barre d’outils. Cliquez sur ce bouton pour que GoLive vous déconnecte du serveur. Le bouton est activé uniquement lorsqu’un site est ouvert dans la fenêtre du site. Pour l’utiliser, il est indispensable d’avoir configuré et affecté au préalable un serveur WebDAV au site. (Voir « Configuration des serveurs WebDAV », page 371.) Comment utiliser l'aide | Sommaire | Index Page précédente 372 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 373 • En choisissant Site > Serveur WebDAV > Connecter/Déconnecter. Cette commande permet de vous connecter uniquement au site ouvert dans la fenêtre du site. Choisissez-la pour que GoLive vous déconnecte du serveur. Pour l’utiliser, il est indispensable d’avoir configuré et affecté au préalable un serveur WebDAV au site. (Voir « Configuration des serveurs WebDAV », page 371.) • A l’aide du menu contextuel dans le panneau Fichiers de la fenêtre du site. Choisissez Serveur WebDAV > Connecter ou Serveur WebDAV > Déconnecter. • En choisissant Fichier > Navigateur WebDAV. La boîte de dialogue Navigateur WebDAV s’ouvre et vous permet d’accéder à un serveur WebDAV préalablement sélectionné en cliquant simplement sur Connecter. Cette commande permet d’établir une connexion à n’importe quel site situé sur un serveur WebDAV, que celui-ci soit ouvert ou non dans la fenêtre du site. Remarque : Les logiciels pare-feu personnels peuvent perturber le processus de connexion au serveur WebDAV. Pour plus de détails sur les paramètres permettant à GoLive d’accéder à des serveurs externes, consultez la documentation de votre logiciel pare-feu. Pour vous connecter à un serveur WebDAV lorsqu’un site est ouvert localement : Choisissez Site > Serveur WebDAV > Connecter ou cliquez sur le bouton Connecter/ Déconnecter le serveur WebDAV de la barre d’outils. Remarque : Avant de vous connecter, vous devez configurer un serveur WebDAV dans la boîte de dialogue Serveurs disponibles et l’affecter au site dans la boîte de dialogue de configuration du site. (Voir « Configuration des serveurs WebDAV », page 371.) Pour vous connecter à un serveur WebDAV à l’aide du navigateur WebDAV : 1 Choisissez Fichier > Navigateur WebDAV. 2 Choisissez un serveur WebDAV dans le menu Serveur et cliquez sur Connecter. Téléchargement des fichiers vers et depuis un serveur WebDAV GoLive propose plusieurs options pour télécharger des fichiers vers et depuis un serveur WebDAV : • Les commandes du menu Site permettent de télécharger les fichiers sélectionnés ou ceux qui ont été modifiés. • Le bouton Synchroniser tout WebDAV de la barre d’outils vous permet de synchroniser des fichiers. • Les boutons Télécharger les éléments modifiés vers WebDAV et Télécharger les éléments modifiés depuis WebDAV de la barre d’outils vous permettent de télécharger vers ou depuis le serveur les fichiers modifiés uniquement. • La fenêtre du site et celle du navigateur WebDAV vous permettent de faire glisser des fichiers entre les panneaux Fichiers et WebDAV de la fenêtre du site, ou de la fenêtre du navigateur WebDAV vers l’un de ces deux panneaux. Comment utiliser l'aide | Sommaire | Index Page précédente 373 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 374 Pour télécharger une sélection de fichiers vers un serveur WebDAV : 1 Le site étant ouvert dans la fenêtre du site, connectez-vous au serveur en cliquant sur le bouton Connecter/Déconnecter le serveur WebDAV de la barre d’outils. 2 Dans le panneau Fichiers de la fenêtre du site, sélectionnez les fichiers à télécharger vers le serveur. Pour sélectionner plusieurs fichiers, cliquez dessus en maintenant la touche Ctrl (Windows) ou Majuscule (Mac OS) enfoncée. 3 Choisissez Site > Serveur WebDAV > Télécharger la sélection ou faites glisser les fichiers sélectionnés du panneau Fichiers vers le panneau WebDAV de la fenêtre du site. Pour télécharger une sélection de fichiers depuis un serveur WebDAV : 1 Le site étant ouvert dans la fenêtre du site, connectez-vous au serveur en cliquant sur le bouton Connecter/Déconnecter le serveur WebDAV de la barre d’outils. 2 Dans le panneau WebDAV de la fenêtre du site, sélectionnez les fichiers à télécharger depuis le serveur. Pour sélectionner plusieurs fichiers, cliquez dessus en maintenant la touche Ctrl (Windows) ou Majuscule (Mac OS) enfoncée. 3 Choisissez Site > Serveur WebDAV > Télécharger la sélection depuis le serveur ou faites glisser les fichiers sélectionnés du panneau WebDAV vers le panneau Fichiers de la fenêtre du site. Pour télécharger vers le serveur les fichiers modifiés depuis la dernière synchronisation uniquement : 1 Le site étant ouvert dans la fenêtre du site, connectez-vous au serveur en cliquant sur le bouton Connecter/Déconnecter le serveur WebDAV de la barre d’outils. 2 Choisissez Site > Serveur WebDAV > Télécharger les éléments modifiés vers WebDAV ou cliquez sur le bouton de téléchargement des fichiers récents vers WebDAV de la barre d’outils. Pour télécharger depuis le serveur les fichiers modifiés depuis la dernière synchronisation uniquement : 1 Le site étant ouvert dans la fenêtre du site, cliquez sur le bouton Connecter/ Déconnecter le serveur WebDAV de la barre d’outils pour vous connecter au serveur. 2 Choisissez Site > Serveur WebDAV > Télécharger les éléments modifiés depuis le serveur ou cliquez sur le bouton Télécharger les éléments modifiés depuis WebDAV la barre d’outils. de Remarque : Pour travailler en exclusivité sur un fichier que vous avez téléchargé depuis le serveur et, par conséquent, empêcher vos collègues de le modifier en même temps que vous, verrouillez le fichier comme décrit dans la section « Verrouillage des fichiers sur un serveur WebDAV », page 374 avant de le télécharger. Verrouillage des fichiers sur un serveur WebDAV Le protocole WebDAV prend en charge deux types de verrouillages, à savoir exclusif ou partagé : • Le verrouillage exclusif défini par quelqu’un d’autre que vous est signalé par une icône de cadenas . Seul l’utilisateur ayant verrouillé le fichier peut le modifier. Les autres utilisateurs sont contraints d’ouvrir le fichier en lecture seule. Comment utiliser l'aide | Sommaire | Index Page précédente 374 Aide d'Adobe GoLive Transfert de fichiers et publication de sites Web Comment utiliser l'aide | Sommaire | Index Page précédente 375 • Un verrouillage exclusif qui vous est attribué est signalé par une icône de crayon Dans ce cas, vous seul pouvez modifier le fichier. . • Un verrouillage partagé attribué à d’autres utilisateur