Retrouvez gratuitement la notice de l'appareil GOLIVE 6.0 ADOBE au format PDF.
Téléchargez la notice de votre Éditeur web au format PDF gratuitement ! Retrouvez votre notice GOLIVE 6.0 - ADOBE et reprennez votre appareil électronique en main. Sur cette page sont publiés tous les documents nécessaires à l'utilisation de votre appareil GOLIVE 6.0 de la marque ADOBE.
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.
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.
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.
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.
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.
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 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.
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.
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.
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).
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é.
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.
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.
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.
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.
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.
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.
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.
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.
Adobe Online donne accès à la base de connaissances de GoLive, dans laquelle vous trouverez des réponses à vos questions techniques.
Adobe Systems offre un support technique automatisé disponible sous diverses formes : • 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.
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.)
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.)
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.)
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.)
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.
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.)
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.
« 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.)
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.)
Produisez du contenu multimédia élaboré et personnalisé, destiné au Web et à des appareils sans fil.
é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.)
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.)
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.)
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.)
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.)
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.)
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).
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.)
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.)
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.
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.
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.)
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.)
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.
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.
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).
é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.)
é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.)
« 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.)
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.
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.)
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
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.
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.)
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.
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
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.
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.)
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.
ê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.)
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.
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.
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.)
2 Effectuez l’une des opérations suivantes : •
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 : •
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.)
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 : •
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 : •
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.)
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.
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 : •
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.
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 : •
C. Cliquez et maintenez le bouton de la souris enfoncé pour afficher une liste des fenêtres ouvertes. •
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. Dossier projet B. Dossier racine C. Dossier de données D. Dossier de configuration E. Fichier projet de site. 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.
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.)
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.
« 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.
éléments de construction de site.
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 : •
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.
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é.
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 : •
« Création d’un site », page 38.
Pour ouvrir une page du site dans l’éditeur de mise en page : Effectuez l’une des opérations suivantes : •
Ouvrir de la barre d’outils.
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.
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.
3 Effectuez l’une des opérations suivantes : •
de la barre d’outils.
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.)
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 : •
« 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.
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.)
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 : •
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.
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 : •
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 : •
Comment utiliser l'aide | Sommaire | Index
5 Pour supprimer un jeu, sélectionnez-le, puis cliquez sur le bouton Supprimer les jeux sélectionnés . 6 Cliquez sur OK.
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.
3 Dans la zone Fond, effectuez une des opérations suivantes : •
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 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.)
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.
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 (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.)
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.
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.
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
2 Dans l’inspecteur de routeur du navigateur, sélectionnez les navigateurs prenant en charge les fonctions de votre page : •
« 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.
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.)
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 : •
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.
1 Sélectionnez un texte, une image ou un objet sur la page. 2 Dans l’inspecteur, effectuez l’une des opérations suivantes : •
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.)
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 : •
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 : •
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
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
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 : •
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 : •
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).
Vous ne pouvez pas prévisualiser certaines combinaisons de liens et d’ancres dans les aperçus.
Navigator et dans Microsoft Internet Explorer.
Effectuez l’une des opérations suivantes : •
Sélectionnez le marqueur d’ancre l’inspecteur d’ancre.
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.
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.
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.)
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.
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 : •
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.)
(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 : •
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 : •
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.)
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.
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
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.
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 : •
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 : •
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.
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 : •
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.)
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 : •
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.)
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.
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 : •
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.)
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. Grille de mise en page B. Zone de texte (utilisée pour ajouter du texte à la grille)
Effectuez l’une des opérations suivantes : •
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 : •
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.)
Pour ajouter des images ou autres objets à la grille de mise en page : Effectuez l’une des opérations suivantes : •
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)
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.
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 : •
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.
1 Sélectionnez au moins trois boîtes flottantes ou objets sur la grille de mise en page.
é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.
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 : •
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.
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.)
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
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.)
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é.
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.
Pour insérer une boîte flottante dans la page : Effectuez l’une des opérations suivantes : •
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.)
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.)
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 : •
(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 : •
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 : •
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.)
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.
éditeur de montage ou d’animer une boîte flottante.
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.
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.
3 Cliquez sur la première image-clé dans l’éditeur de montage DHTML afin de replacer la boîte flottante à sa position initiale.
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 : •
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
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
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 : •
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.
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
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
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.
être contenues ou parcourues dans des cadres spécifiques du jeu de cadres.
A. Le cadre gauche comporte une page de navigation B. Le cadre droit une page liée depuis la page de navigation.
« Définition des marges d’une page », page 51.)
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.
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 : •
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.
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.
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 : •
Comment utiliser l'aide | Sommaire | Index
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.
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.
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.
(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.
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.)
é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
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é.
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.
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 : •
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.
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 : •
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 : •
Explorer et ne fonctionne pas dans les navigateurs Netscape.
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.)
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.)
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.
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
2 Cliquez sur les balises (<p>, <h1>, etc.) dans la barre d’arborescence des balises au bas de la fenêtre du document.
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.)
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.
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.
3 Choisissez une option de liste dans le menu Texte > Liste pour modifier le caractère de numérotation affecté au paragraphe.
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 : •
L’option Par défaut permet de supprimer tout alignement existant du paragraphe sélectionné.
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.
(<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.
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 : •
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.)
Pour appliquer un attribut de texte HTML physique : 1 Effectuez l’une des opérations suivantes : •
, Italique ou Télétype dans la barre d’outils, ou sélectionnez une option dans le menu contextuel Style.
(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.
(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.
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 : •
A. Nouveau jeu de polices B. Nouvelle police
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 : •
. Saisissez dans la zone de texte le nom de la nouvelle police ou choisissez-en un dans le menu.
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.
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é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.
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
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. Remplace le paragraphe sélectionné B. Complète le paragraphe sélectionné C. Complète le texte en ligne sélectionné
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
é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 : •
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 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 .
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
Comment utiliser l'aide | Sommaire | Index
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 : •
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.)
« 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 : •
Comment utiliser l'aide | Sommaire | Index
Sélectionnez le texte qui est à l’origine du lien, puis cliquez sur le bouton Supprimer le lien de l’inspecteur du texte.
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 : •
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 : •
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.
Supprimer . 7 Cliquez sur OK.
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).
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.
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 : •
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é.
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 : •
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 : •
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.
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 : •
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 : •
GoLive 6.0. Si l’occurrence est GoLive, le résultat est GoLive 6.0.
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.
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.
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.
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.
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 « < », « > » et « & ». 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.
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.
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.
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 : •
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.
, 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.)
Importer > Feuille de style externe. Sélectionnez une feuille de style externe et cliquez sur Ouvrir.
1 Effectuez l’une des opérations suivantes : •
Feuille de style en cascade.
3 Ajoutez des styles à la feuille en adoptant une ou plusieurs des méthodes suivantes : •
, 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.)
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 : •
Externe qui contient la liste des feuilles de style externes référencées.
Vous pouvez définir trois types de styles différents dans une feuille de style : •
Ce type de style permet d’afficher des pages avec précision dans des navigateurs CSS.
à 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.
é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.
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.
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 : •
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 : •
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.
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 : •
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.
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>.
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 : •
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.
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.
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.
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/.
Les unités relatives prises en charge sont les suivantes : •
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.
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 : •
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.
Utilisation de feuilles de style en cascade 4 Pour définir l’alignement vertical d’un style, choisissez l’une des options suivantes dans le menu contextuel Alignement vertical. •
7 Pour définir l’alignement horizontal (Gauche, Centre, Droite ou Justifié), choisissez une option dans le menu contextuel Alignement.
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.
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. Largeur du bloc B. Marge (transparente) C. Bord D. Remplissage E. Contenu F. Largeur de l’élément 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.
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 : •
Pour plus de détails sur les unités, voir « A propos des unités relatives, absolues et des pourcentages », page 144.
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.
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. •
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 : •
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.
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. •
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.
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 : •
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 : •
. 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.
« Suppression de styles », page 142.
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 : •
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
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>. •
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 : •
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
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 : •
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
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 }
#nom_identifiant {propriété: valeur }
.nom_de_classe { propriété: valeur; propriété: valeur } 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.)
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.)
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.
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.
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 : •
Pour sélectionner des colonnes : Effectuez l’une des opérations suivantes : •
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 : •
Ajouter une colonne à gauche ou Ajouter une colonne à droite .
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.
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.
Pour redimensionner un tableau : Effectuez l’une des opérations suivantes : •
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.
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. •
Effectuez l’une des opérations suivantes : •
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.
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.
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.
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 : •
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.
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.
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.
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
7 Cochez la case Légende pour ajouter une légende au tableau, puis choisissez son emplacement dans le menu contextuel.
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.
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
4 Effectuez l’une des opérations suivantes pour fusionner la cellule avec une ou plusieurs lignes vers le bas : •
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.
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.
A. Propriétés de style de classe dans l’inspecteur de la feuille de style CSS B. Style de classe
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 : •
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 : •
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 : •
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 : •
(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.
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.
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 : •
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.
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.
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.
3 Dans le menu contextuel Trier par, effectuez l’une des opérations suivantes : •
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.
(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. 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. 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.
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
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.
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.
Pour ajouter un objet dynamique à votre page Web : 1 Effectuez l’une des opérations suivantes : •
(Windows) ou en maintenant la touche Control enfoncée (Mac OS), puis choisissez Insérer l’objet > SmartObjects et Photoshop, Illustrator ou LiveMotion.
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.
(Voir « Options supplémentaires relatives aux images », page 186.)
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 : •
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.
à 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.
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.)
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 : •
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.
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 : •
« 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.)
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 : •
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.
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.
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.
2 Dans l’inspecteur de tranche utilisateur, cliquez sur le bouton Lien fichier de destination pour le lien.
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.
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.
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.
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.
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.
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.
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.
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.
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. •
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
é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.
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.
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.
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).
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.
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.
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.
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.
é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.
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.
(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.
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.
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 : •
Paramètres. (Voir « Utilisation de paramètres d’optimisation spécifiques », page 202.) (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 : •
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.
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 : •
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.
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.
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 : •
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).
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 : •
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.
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.
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.
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.
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.
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.
1 Activez l’outil de sélection de tranche
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 : •
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
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.)
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 : •
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. •
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.
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.
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.
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.
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.
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.
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.
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.
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é.
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.
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.
3 Dans la zone Normal du panneau Bouton animé, spécifiez un fichier pour l’image d’état Normal.
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.
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.
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.
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 : •
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.
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
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).
Remarque : GoLive reconnaît uniquement les variables d’un fichier Illustrator s’il a été enregistré au format SVG.
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.
2 Dans cette boîte de dialogue, effectuez l’une des opérations suivantes : •
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.
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 : •
1 Sélectionnez l’objet dynamique souhaité dans l’éditeur de mise en page.
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.
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.
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 : •
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.
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.
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 : •
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. 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
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 : •
Désactivez la case à cocher Source dans la palette Image de référence.
Remarque : Vous ne pouvez pas importer d’image Illustrator contenant des calques dans GoLive.
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
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 : •
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.
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.
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 : •
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.
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).
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 : •
Pour choisir des options ColorSync : 1 Pour les images, effectuez l’une des opérations suivantes : •
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 : •
ColorSync dans GoLive.
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.
à 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. •
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.
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 : •
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.)
<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.
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 .
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. •
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.
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.
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. •
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
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.
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.
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 : •
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.
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.
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 : •
Faites plusieurs brouillons de mise en page, testez la logique du flux et la facilité d’utilisation.
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.
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.
Vous pouvez configurer plusieurs types de boutons et de cases à cocher dans le formulaire d’une page Web. •
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 : •
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 : •
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.
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.
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. •
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.
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 : •
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 : •
Si le navigateur ne spécifie aucune préférence d’alignement, la légende est alignée sur la gauche.
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 : •
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.
(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.
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.
Deux éléments revêtent une importance particulière concernant les images : •
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 : •
Valeur. 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.
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.
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.
Les navigateurs compatibles avec l’action sélectionnée sont indiqués entre parenthèses
(Voir « Prévisualisation des fichiers », page 63.)
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.
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 : •
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
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ément lié. 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) •
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.
Les actions de montage sont configurées dans l’éditeur de montage DHTML.
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.
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.)
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.)
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.
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.
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.
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.
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.)
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.
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.
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.
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.
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.
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
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.
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.
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.
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.)
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.
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.
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.
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.
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.
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.
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.
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.
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.
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.
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.)
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.
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.
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).
<font color="#00FF00" size="5">
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.
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.
é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.
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">
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.
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.
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.
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.)
Le menu Multimedia comporte des actions permettant d’interagir avec des boîtes flottantes, des sons ou des images sur une page.
Multimedia > Déplacer boîte flottante et sélectionnez dans le menu contextuel Boîte flottante la boîte que vous souhaitez faire glisser.
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.
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.
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).
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.
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.
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.
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.
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.
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.
Les images doivent se trouver dans le même dossier que la première image placée sur la page.
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.
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
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.
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.
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
dans la zone de texte </close>.
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.
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.
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.
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.)
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.
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.
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.
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.
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).
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.
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.
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.
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.
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.
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.
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.
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.
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).
(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.
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 : •
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.
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.
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.
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.)
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.
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.
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.)
é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.
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.
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é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.
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 : •
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.
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.
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.
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.)
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.
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 : •
Pour définir des paramètres spécifiques à un site : 1 Ouvrez un site. 2 Cliquez sur le bouton Configurer le site Configuration.
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.
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.
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.
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 : •
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.
Effectuez l’une des opérations suivantes : •
Comment utiliser l'aide | Sommaire | Index
(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. •
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.
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.)
é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 : •
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 : •
(Windows) vers un dossier ou panneau 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 : •
(Mac OS) de la barre d’outils.
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
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 : •
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 : •
Edition > Annuler Placer dans la corbeille.
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 : •
3 Choisissez Site > Mettre à jour.
2 Cliquez sur le bouton Rafraîchir la vue Rafraîchir la vue.
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 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 : •
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 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.
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.)
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.
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 : •
Effectuez l’une des opérations suivantes : •
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 : •
Cliquez ensuite sur Contraintes relatives aux noms de fichiers dans le panneau gauche, puis cochez la case Paramètres spécifiques au site.
Pour personnaliser les conventions de dénomination : 1 Effectuez l’une des opérations suivantes : •
Cliquez ensuite sur Contraintes relatives aux noms de fichiers dans le panneau gauche, puis cochez la case Paramètres spécifiques au site.
5 Personnalisez-le à votre convenance dans les autres zones de texte. 6 Cliquez sur OK.
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 : •
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 : •
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.
4 Cliquez sur la case Créer uniquement des liens absolus dans le panneau droit, puis cliquez sur OK.
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. •
« A propos de la vue de navigation », page 306.)
Pour afficher une vue graphique du site : 1 Ouvrez le fichier projet du site approprié. 2 Effectuez l’une des opérations suivantes : •
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. Page d’accueil B. Enfants de la page d’accueil
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.
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 : •
(index.html). de la barre d’outils.
1 Effectuez l’une des opérations suivantes : • affiché en regard de la
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.
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.
à 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 : •
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
Pour afficher ou masquer un panneau périphérique : 1 Effectuez l’une des opérations suivantes : •
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.
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 : •
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 : •
à 200 % au premier clic, puis à 100 % au deuxième.
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.
Navigateur du site : 1 Choisissez Fenêtre > Navigateur du site. 2 Effectuez l’une des opérations suivantes : •
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.)
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.
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. Eclairage B. Collection de pages
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 : •
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 : •
3 Appliquez la commande à la sélection.
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 : •
é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 : •
Eclairer les liens en attente dans le menu de la 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.
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.
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 : •
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.
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 : •
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 .
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.
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 : •
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.
é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.
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.
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 : •
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.
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 : •
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.
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.
« 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.
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.
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 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 : •
Déplacer vers le panneau.
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
« 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.
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.
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 : •
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
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 : •
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 : •
« 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 : •
(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 : •
« Nettoyage d’un site », page 300.)
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.
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 : •
(Vous pouvez uniquement rechercher des couleurs et des polices sur la base d’un nom.)
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.
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.)
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 : •
éléments constitutifs de la page (tels que les images ou les séquences QuickTime) intervenant dans le calcul de cette durée.
Rapports sur le site, modifiez la liste des jeux de navigateurs dans les préférences de l’application.
Comment utiliser l'aide | Sommaire | Index
Pour afficher un rapport sur le site : 1 Un fichier projet de site étant ouvert, effectuez l’une des opérations suivantes : •
Résultats du rapport : •
Pour modifier une page affichée dans un rapport : Cliquez deux fois sur la page dans l’un des panneaux du rapport.
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.
« 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 : •
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.)
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 : •
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 affecter un état à un fichier ou un dossier : 1 Effectuez l’une des opérations suivantes : •
é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.
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.
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.
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.
A B C Symboles indiquant le type de zone modifiable A. Zone de texte en ligne B. Zone de paragraphe C. Zone d’objet 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.
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.
Dans la palette de mise en évidence, cliquez sur l’onglet Couleurs et effectuez l’une des opérations suivantes : •
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 : •
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.
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.
1 Effectuez l’une des opérations suivantes : •
à 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.)
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 dans la page et choisissez Modèle > Dissocier du modèle dans le menu contextuel.
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 : •
Effectuez l’une des opérations suivantes : •
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é.
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 : •
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.
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.
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.
2 Effectuez l’une des opérations suivantes : •
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.)
Cet objet de bibliothèque (appelé extrait_de_code.html par défaut) contient un lien de ressource à un fichier image.
Effectuez l’une des opérations suivantes : •
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.
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.
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.
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 : •
1 Sélectionnez le texte ou les objets auxquels vous souhaitez attribuer une couleur : 2 Effectuez l’une des opérations suivantes : •
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 : •
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 : •
2 Effectuez l’une des opérations suivantes : •
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 : •
2 Effectuez l’une des opérations suivantes : •
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.
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.
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 : •
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 : •
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 : •
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.
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.
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
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.
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.
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 : •
« Vérification des propriétés de fichier », page 294.)
« 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.
Pour établir une connexion à un serveur FTP à partir du navigateur FTP : 1 Choisissez Fichier > Navigateur FTP. 2 Effectuez l’une des opérations suivantes : •
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.
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
é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 : •
1 Ouvrez un site. 2 Effectuez l’une des opérations suivantes : •
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.
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 : •
é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.)
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.)
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.
(Voir « Synchronisation des dates de modification pour les fichiers locaux et serveur », page 365.)
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 : •
Télécharger le site et cliquez sur OK.
2 Faites glisser le fichier ou le dossier à l’emplacement voulu dans panneau FTP.
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 : •
Deux options s’offrent à vous pour le téléchargement depuis le serveur : •
2 Effectuez l’une des opérations suivantes : •
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.
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.)
à télécharger avant de démarrer le transfert actif. Pour exclure des fichiers, désélectionnez-les dans la liste.
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.
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.
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.
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.
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 : •
Vous pourrez également être amené à diviser votre site entre plusieurs serveurs. Pour ce faire, vous devez utiliser la fonction de mappage des URL.
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 : •
Configurer le site de la barre d’outils ou choisissez Site > Configuration, cliquez sur Exporter, puis sélectionnez Paramètres spécifiques au site.
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.
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.
8 Choisissez Racine du site dans le menu le dossier ou le serveur local suivant.
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.
3 Reprenez ces instructions pour chaque hyperlien vers une page dans un autre dossier racine.
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).
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 : •
Serveur. Comment utiliser l'aide | Sommaire | Index
éviter les confusions entre les différents serveurs ajoutés à la liste.
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
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.)
à 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.
WebDAV : • 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.
1 Dans le panneau WebDAV de la fenêtre du site, sélectionnez le fichier à verrouiller. 2 Cliquez sur le fichier sélectionné avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS) et choisissez Verrouiller ou Partager les éléments verrouillés dans le menu contextuel, selon que vous souhaitez un verrouillage de type exclusif ou partagé. L’icône correspondante s’affiche à droite du nom du fichier dans le panneau WebDAV. Pour verrouiller un dossier sur un serveur WebDAV : 1 Dans le panneau WebDAV de la fenêtre du site, cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Commande enfoncée (Mac OS) sur le dossier à verrouiller. 2 Choisissez Tout verrouiller dans le menu contextuel. Remarque : De nombreux serveurs, tels que Microsoft IIS 5, ne prennent pas en charge le verrouillage de dossier, mais permettent de verrouiller et déverrouiller des fichiers individuels. Pour verrouiller une sélection de fichiers sur un serveur WebDAV : 1 Dans le panneau WebDAV de la fenêtre du site, cliquez sur les fichiers à verrouiller en maintenant la touche Ctrl (Windows) ou Control (Mac OS) enfoncée. 2 Cliquez sur les fichiers sélectionnés avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS) et choisissez Verrouillage ou Partager les éléments verrouillés dans le menu contextuel, selon que vous souhaitez un verrouillage de type exclusif ou partagé. L’icône correspondante s’affiche à droite du nom de chaque fichier dans le panneau WebDAV. Pour déverrouiller des fichiers sur un serveur WebDAV : 1 Dans le panneau WebDAV de la fenêtre du site, sélectionnez les fichiers ou dossiers à déverrouiller. 2 Cliquez sur le fichier sélectionné avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS) et choisissez Déverrouiller dans le menu contextuel. L’icône indiquant le verrouillage, située à droite des noms des fichiers dans le panneau WebDAV, disparaît.
Cliquez sur le fichier ou le dossier avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS) et choisissez la commande appropriée dans le menu contextuel : •
Lors de la synchronisation des sites, Adobe GoLive ne compare pas la date de modification sur le système local à celle sur le serveur pour déterminer le fichier devant être téléchargé. Par contre, dès qu’il détecte que l’un des deux fichiers (le fichier sur le serveur et le fichier correspondant sur la plate-forme locale) a été modifié depuis la dernière synchronisation, il signale un conflit de synchronisation et laisse l’utilisateur choisir le fichier à utiliser. Par conséquent, une différence entre le fuseau horaire sur le serveur WebDAV et celui du système local n’a aucune incidence. Pour synchroniser un site dans son intégralité : 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 Effectuez l’une des opérations suivantes : •
La boîte de dialogue de synchronisation indique les fichiers qui seront téléchargés vers le serveur WebDAV et ceux qui seront téléchargés vers la plate-forme locale du site. Les fichiers manquants sont identifiés par des icônes de fichier grisées de chaque côté. Vous pouvez modifier l’affichage des fichiers en sélectionnant l’option Afficher les éléments ignorés. Pour afficher vos fichiers tels qu’ils existent dans les dossiers du serveur, sélectionnez l’option Afficher l’arborescence des dossiers.
pour supprimer le fichier sur le serveur WebDAV et sur le
Remarque : Pour plus de détails sur un fichier à télécharger, sélectionnez celui-ci dans la boîte de dialogue de synchronisation. Les deux panneaux de texte situés au bas de la boîte de dialogue affichent des informations sur le fichier au niveau du système local et du serveur, à savoir son nom, sa date de modification et l’action de synchronisation à exécuter. 4 Cliquez sur Synchroniser pour démarrer le processus de synchronisation. Outre les options d’action de synchronisation déjà décrites, l’icône de conflit s’affiche à côté du nom d’un fichier à chaque fois que ce dernier est modifié sur le serveur et sur le système local. Vous devez alors décider de l’action de synchronisation à attribuer audit fichier. Si vous n’attribuez aucune action, le fichier est tout simplement exclu du processus de synchronisation. Pour synchroniser une sélection à l’intérieur d’un site : 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 Dans la fenêtre du site, sélectionnez les fichiers ou dossiers à synchroniser, puis effectuez l’une des opérations suivantes : •
3 Confirmez les actions de synchronisation attribuées aux fichiers individuels. Pour attribuer une autre action de synchronisation à un fichier, sélectionnez le fichier et cliquez sur l’une des options qui se trouvent sous la liste des fichiers : •
WebDAV Utilisez l’inspecteur des propriétés du fichier pour obtenir des informations relatives aux fichiers situés sur un serveur WebDAV (nom, URL, date de création, date de modification, taille et état du verrouillage). Pour consulter les informations relatives à un fichier : 1 Sélectionnez le fichier dans le navigateur WebDAV ou dans le panneau WebDAV de la fenêtre du site. 2 Le cas échéant, choisissez Fenêtre > Inspecteur pour afficher l’inspecteur des propriétés du fichier. 3 Cliquez sur l’un des onglets de l’inspecteur : •
Pour créer des sites collaboratifs, suivez la procédure ci-après. Installation de Web Workgroup Server Installez et lancez Web Workgroup Server sur un ordinateur accessible aux membres du groupe de travail. (Voir l’aide d’Adobe Web Workgroup Server). Web Workgroup Server est prêt à être utilisé, requiert un minimum de tâches d’administration et comprend des comptes utilisateur pré-installés. Créez des comptes pour chaque membre du groupe de travail, selon vos besoins. Création d'un site collaboratif A l’instar des sites pour utilisateur unique, les sites collaboratifs peuvent être créés via l’Assistant de création de site. Vous pouvez créer un site vierge ou utilisez un dossier de fichiers Web existant. Une autre solution consiste à rendre un site GoLive pour utilisateur unique collaboratif. Lorsque vous créez un site collaboratif, la structure du site (fichier de projet et dossier du site, toute page ou fichier constituant le site) est placée sur Web Workgroup Server. Une copie du fichier de projet et de la structure du site est également créée sur votre ordinateur. Ce fichier de projet diffère légèrement d’un fichier de projet de site GoLive ordinaire en ce qu’il contient des informations d’ouverture de session Web Workgroup Server. Lorsque vous ouvrez un fichier de projet de site collaboratif, vous êtes connecté au site placé sur le serveur.
Une fois les modifications effectuées, archivez à nouveau le fichier et informez les autres utilisateurs des changements apportés à l’aide du champ de commentaire. La colonne de verrouillage est mise à jour automatiquement et indique aux membres du groupe que le fichier est à nouveau disponible.
L’administrateur du serveur a également la possibilité de publier le site via l’outil d’administration de Web Workgroup Server. (Voir l’aide d’Adobe Web Workgroup Server )
Lorsque vous ouvrez un site collaboratif, la barre de titre de la fenêtre du site indique le nom de ce dernier et le nom du serveur de groupe de travail. Le port utilisé est également affiché entre parenthèses. La colonne de verrouillage de la fenêtre du site indique si les fichiers du site sont verrouillés ou non. •
La barre d’outils Groupe de travail, située à droite de la barre d’outils principale, facilite l’accès aux fonctions de travail collaboratif. Les boutons permettent d’extraire et d’archiver des fichiers, de comparer et de restaurer des versions de fichiers, et d’obtenir des informations sur le verrouillage des fichiers. •
Vous pouvez créer un site collaboratif GoLive à l’aide de l’Assistant de création de site ou de l’option de menu Convertir en site collaboratif. Il est également possible d’importer facilement un site Web et de le gérer depuis GoLive. • Cette copie dispose de la même structure de dossier que le site placé sur le serveur mais ne contient aucun fichier autre que le fichier de projet du site. L’ouverture du fichier de projet local permet de se connecter au serveur pour visualiser et modifier le site complet à partir de la fenêtre du site, comme s’il se trouvait sur votre ordinateur. Ouverture d’une session Web Workgroup Server Après avoir sélectionné la méthode de création du site dans l’assistant, vous devez ouvrir une session afin de pouvoir créer le site sur Web Workgroup Server. Avant d’utiliser l’assistant, contactez l’administrateur du serveur pour obtenir les informations suivantes : un nom d’utilisateur et un mot de passe, l’adresse IP ou le nom du serveur (ordinateur sur lequel Web Workgroup Server est exécuté) et le numéro du port correspondant (par défaut, 1102). Gestion avancée des URL Lors de la création du site, vous avez la possibilité de spécifier la méthode de gestion des URL de site de GoLive, y compris l’encodage et le respect de la casse. Si vous créez un site par importation d’un site existant, il est particulièrement important de définir l’encodage des URL de manière correcte afin d’éviter toute rupture des liens au sein du nouveau site. Une fois le site créé, vous pouvez modifier l’encodage des URL dans la boîte de dialogue de configuration du site. Il est cependant impossible de modifier la vérification des URL sensibles à la casse. (Pour ce faire, choisissez Site> Configurer, sélectionnez Gestion des URL, puis activez les options d’encodage souhaitées.) Pour plus de détails sur la gestion des URL, voir « Importation des sites stockés sur des serveurs distants », page 40. Pour créer un site collaboratif via l’assistant : 1 Choisissez Fichier > Nouveau site pour ouvrir l’Assistant de création de site de GoLive. 2 Sélectionnez Groupe de travail, puis cliquez sur Suivant. 3 Effectuez l’une des opérations suivantes : •
Remarque : Pour créer un site collaboratif à partir d’une copie d’un site téléchargé depuis le Web via FTP ou HTTP, vous devez au préalable créer un site pour utilisateur unique à l’aide de l’assistant, puis le convertir en site collaboratif. (Voir « Ajout de fichiers à un site », page 42 et « Conversion d’un site pour utilisateur unique en site collaboratif », page 386.) 4 Cliquez sur Suivant. Si vous avez choisi l’option Importer d’un dossier ou d’un site GoLive, sélectionnez respectivement un dossier ou un fichier de projet de site GoLive, en suivant les instructions de l’assistant. Cliquez ensuite sur Suivant afin d’ouvrir une session Web Workgroup Server. (Pour les options Site vierge et Monter, vous devez ouvrir une session directement.) 5 Dans la boîte de dialogue d’ouverture de session, saisissez les données requises par le serveur : •
Web Workgroup Server est exécuté. Si Web Workgroup Server et GoLive sont exécutés sur le même ordinateur, vous pouvez également spécifier « localhost » comme nom de serveur.
7 Cliquez sur Suivant et suivez les instructions de l’assistant.
Le processus de création de site via l’assistant comprend la création et la dénomination d’une copie locale du site collaboratif. Le nom du dossier contenant cette copie locale est associé au nom du site choisi et au nom ou à l’adresse de l’ordinateur hébergeant Web Workgroup Server. La partie correspondant à l’ordinateur hôte varie selon l’ouverture de session que vous avez effectuée dans l’assistant. •
Workgroup Server sont exécutés sur le même ordinateur uniquement) et que vous avez nommé le site « Site test », le nom de la copie locale est « Site test sur localhost ».
Server, la copie locale est nommée « Site test sur 192.168.1.210 » ou « Site test sur <nom de l’ordinateur> ».
Pour convertir un site pour utilisateur unique en site collaboratif : 1 Ouvrez le site pour utilisateur unique, puis choisissez Site > Groupe de travail > Convertir en site collaboratif et cliquez sur OK dans la boîte de message qui s’affiche. 2 Dans la boîte de dialogue d’ouverture de session Web Workgroup Server, saisissez les données requises par le serveur : •
Web Workgroup Server est exécuté. Si Web Workgroup Server et GoLive sont exécutés sur le même ordinateur, vous pouvez également spécifier « localhost » comme nom de serveur.
Le site pour utilisateur unique local est converti en site collaboratif, puis téléchargé vers Web Workgroup Server. Le fichier de projet du site pour utilisateur unique est également remplacé sur votre ordinateur par une copie locale du fichier de projet du nouveau site collaboratif. Cette version locale comprend désormais les informations d’ouverture de session permettant de vous connecter à Web Workgroup Server dès ouverture du fichier. Remarque : Les conventions de dénomination des copies locales de sites collaboratifs créées via l’Assistant de création de site ne s’appliquent pas au dossier de site obtenu lors de la conversion d’un site pour utilisateur unique (voir « Convention de dénomination pour les copies locales de sites collaboratifs », page 385). Dans ce cas, le dossier du site conserve le nom d’origine du site pour utilisateur unique.
Avant de procéder au montage d’un site collaboratif, assurez-vous que vous disposez des informations ci-après (fournies par l’administrateur de Web Workgroup Server) : •
(adresse IP du serveur, nom d’utilisateur, mot de passe et numéro du port) qui vous ont été fournies par l’administrateur du serveur. Si Web Workgroup Server et GoLive sont exécutés sur le même ordinateur, vous pouvez également spécifier « localhost » comme nom de serveur. 3 Activez l’option Enregistrer pour éviter d’avoir à ressaisir votre mot de passe à chaque ouverture de session. Le mot de passe n’est saisi qu’une seule fois pour chaque session ouverte. Il est donc recommandé d’activer cette option uniquement si vous travaillez sur un ordinateur protégé. 4 Cliquez sur Suivant. Lorsque la session Web Workgroup Server est ouverte, la liste des sites du serveur que vous pouvez modifier s’affiche. L’accès aux sites est géré par l’administrateur système. Contactez ce dernier si le site qui vous intéresse n’apparaît pas dans la liste. 5 Sélectionnez le site que vous souhaitez monter sur votre ordinateur, puis cliquez sur Suivant. 6 Localisez le dossier dans lequel vous voulez enregistrer la copie locale du site à l’aide du bouton Parcourir, ou créez un dossier. Après avoir sélectionné/créé un dossier, le chemin d’accès complet au dossier s’affiche dans la boîte de dialogue. Cliquez sur Terminer. GoLive crée sur votre ordinateur un site correspondant au site du serveur mais contenant des dossiers vides. Le nom du site local suit les conventions de dénomination appliquées à la création d’un site collaboratif via l’Assistant de création de site (voir « Convention de dénomination pour les copies locales de sites collaboratifs », page 385). La fenêtre du site affiche le contenu du site placé sur le serveur. Vous pouvez à présent archiver ou extraire des éléments (voir « Développement d’un site collaboratif », page 388).
Lorsque vous ouvrez un site collaboratif et que Web Workgroup Server ne fonctionne pas, un message d’alerte s’affiche. Cliquez sur OK pour ouvrir la copie locale du site collaboratif malgré tout. Les fichiers que vous avez extraits sont disponibles pour modification. (Voir « Edition de fichiers extraits hors connexion », page 392) Les fichiers suivants sont disponibles en lecture seule : •
Lors de l’extraction d’un fichier, les modifications suivantes s’opèrent : •
Vous pouvez extraire des fichiers et des dossiers du site collaboratif, à condition qu’ils n’aient pas déjà été extraits par un autre membre du groupe de travail. La colonne de verrouillage de la fenêtre du site indique les fichiers disponibles pour l’extraction. Pour extraire des fichiers : 1 Choisissez Fichier > Ouvrir, choisissez le fichier du site collaboratif, puis cliquez sur Ouvrir. 2 Effectuez l’une des opérations suivantes : • Dans le panneau Fichiers, sélectionnez les fichiers et dossiers que vous souhaitez extraire. Cliquez ensuite sur le bouton Extraire de la barre d’outils Groupe de travail.
Après avoir modifié le fichier et enregistré les changements, archivez le fichier afin d’en mettre la nouvelle version à disposition des autres membres du groupe de travail. Lorsque vous ajoutez un nouveau fichier, GoLive vous invite à archiver celui-ci. Ce fichier est alors visible dans la fenêtre du site pour tous les utilisateurs du groupe. Pour archiver des fichiers : 1 Pour sélectionner les fichiers que vous souhaitez archiver, effectuez l’une des opérations suivantes : •
Archiver de la barre d’outils Groupe de travail.
Si vous souhaitez exclure de l’archivage un fichier ou l’ensemble d’un dossier répertorié, désactivez la case à cocher correspondante.
Si vous modifiez un fichier extrait mais que vous ne souhaitez pas enregistrer les changements, vous pouvez annuler l’extraction. Toutes les modifications effectuées sont annulées et le fichier est archivé sur le serveur sans qu’une nouvelle entrée ne soit ajoutée dans l’historique des révisions. Pour annuler l’extraction : 1 Sélectionnez le(s) fichier(s) extrait(s) dans l’onglet Fichiers de la fenêtre du site. 2 Effectuez l’une des opérations suivantes : •
Extraire/Archiver dans le menu contextuel.
Les fonctions de gestion du site de GoLive permettent de contrôler les liens et les références croisées entre tous les fichiers d’un site collaboratif, de la même manière que pour un site pour utilisateur unique. Ainsi, vous pouvez modifier le nom ou l’emplacement dans le site d’un fichier collaboratif, puis mettre à jour les références à ce fichier dans l’ensemble du site. Si le fichier dont vous modifiez le nom ou l’emplacement est lié à un fichier extrait, Web Workgroup Server « retient » que la mise à jour est à effectuer jusqu’à l’archivage du fichier extrait. Les références au fichier modifié sont alors mises à jour. Web Workgroup Server contrôle également les liens et références de fichiers extraits par un client WebDAV autre que GoLive et, le cas échéant, les met à jour lorsque les fichiers sont archivés depuis le client en question. Remarque : Dans le cas des clients WebDAV permettant de renommer, de déplacer ou de supprimer des fichiers du site, Web Workgroup Server met à jour les liens et références au sein du site (comme pour GoLive). Cependant, à cause de certaines restrictions HTTP, les avertissements affichés dans GoLive lors de la mise à jour ne peuvent l’être dans le cas d’un autre client WebDAV.
Un fichier extrait par un autre utilisateur peut être ouvert en lecture seule. Ce fichier correspond à la dernière version archivée sur le serveur, mais aucune des modifications effectuées après l’extraction n’y apparaît. Remarque : Un fichier ouvert sans être extrait est en mode lecture seule. Pour ouvrir un fichier déjà extrait en lecture seule : 1 Dans le panneau Fichiers de la fenêtre du site (ou dans les fenêtres Vue de la navigation ou Vues des liens), cliquez deux fois sur le fichier que vous souhaitez ouvrir. 2 Cliquez sur Oui pour ouvrir le fichier en lecture seule.
Il est possible que vous ayez besoin de modifier des fichiers collaboratifs sans vous connecter à Web Workgroup Server, sur un ordinateur portable ne disposant pas de connexion au réseau, par exemple. Le cas échéant, vous pouvez modifier des fichiers extraits hors connexion. Pour ce faire, vous devez au préalable extraire les fichiers qui vous intéressent en mode connexion. (Voir « Extraction de fichiers et de dossiers », page 389.) Pour que les liens ne soient pas altérés pendant la modification des fichiers, téléchargez ensuite les fichiers liés. Ces fichiers n’ont pas besoin d’être modifiés mais les fichiers extraits y font référence. (Le téléchargement d’un fichier depuis le serveur permet de copier une version en lecture seule du fichier dans votre site local.) Vous pouvez alors modifier les fichiers extraits hors connexion, puis les archiver à nouveau sur le serveur lorsque la connexion est rétablie.
3 Cliquez sur le bouton OK du message d’alerte afin d’ouvrir le site malgré tout. Vous pouvez également passer en mode hors connexion sans fermer le site collaboratif. Sélectionnez > Groupe de travail > Travailler hors ligne. Pour repasser en mode connexion, sélectionnez à nouveau cette commande. Le site s’ouvre en mode hors connexion. La fenêtre du site affiche tous les fichiers du site. Cependant, les seuls fichiers que vous pouvez modifier sont les fichiers extraits exclusivement. Vous pouvez également ouvrir (en lecture seule) tout fichier que vous avez téléchargé ou dont une copie locale se trouve sur votre ordinateur. (Vous disposez localement d’une copie de tous les fichiers modifiés lors de la dernière modification du site.) 4 Dans la fenêtre du site, sélectionnez le fichier extrait que vous souhaitez modifier. Un fichier extrait est identifié dans la colonne de verrouillage par une icône représentant un crayon. 5 Cliquez deux fois sur le fichier extrait afin de l’ouvrir. Effectuez les modifications selon vos besoins, puis enregistrez les changements. 6 Lorsque vous disposez à nouveau d’une connexion au serveur, ouvrez le site et archivez le fichier modifié, selon la procédure décrite dans la section « Archivage de fichiers et de dossiers », page 390.
Lorsque vous créez un site collaboratif, une copie de ce site (contenant uniquement le fichier de projet du site) est créée sur votre ordinateur. Par la suite, une copie de chaque fichier extrait que vous modifiez est enregistrée sur votre site local. Ces copies locales sont conservées même après archivage des fichiers sur le serveur. Vous pouvez supprimer ces copies de votre ordinateur à tout moment.
Suivi de l’activité du groupe de travail Les fonctions de rafraîchissement de GoLive permettent de suivre les mises à jour récentes des fichiers et autres composants du site. Le panneau Activité utilisateur indique les fichiers extraits par des membres du groupe de travail.
Plusieurs utilisateurs pouvant travailler sur le site simultanément, il s’avère utile de rafraîchir régulièrement la vue du site afin de s’assurer qu’elle reflète bien le site stocké sur Web Workgroup Server. Lors du rafraîchissement de la vue du site, GoLive communique avec Web Workgroup Server et vérifie les modifications de verrouillage (les fichiers extraits ou archivés) ainsi que les fichiers ajoutés ou modifiés sur le serveur. Ces informations sont alors mises à jour dans le panneau Fichiers. La vue du site est automatiquement mise à jour lors de l’extraction ou de l’archivage d’un fichier, de la comparaison des versions ou de l’ouverture de la boîte de dialogue de configuration du site. Pour rafraîchir la vue du site : 1 Ouvrez la fenêtre du site, si elle n’est pas déjà ouverte. 2 Effectuez l’une des opérations suivantes : •
Rafraîchir la vue dans le menu contextuel.
La commande Rafraîchir la vue permet de mettre à jour les panneaux Couleurs, Jeux de polices et Externe de la fenêtre du site, en fonction des couleurs, jeux de polices et références ajoutés ou supprimés du site stocké sur le serveur. Comment utiliser l'aide | Sommaire | Index
Pour une analyse approfondie des couleurs, références et jeux de polices de l’ensemble du site stocké sur le serveur, choisissez Extraire les éléments utilisés dans le menu Site. Si des couleurs, références ou jeux de polices trouvés ne sont pas répertoriés, de nouveaux groupes d’éléments sont créés et ajoutés dans les panneaux appropriés de la fenêtre du site. Pour rafraîchir manuellement les panneaux Couleurs, Externe et Jeux de polices : 1 Cliquez sur l’onglet Couleurs, Externe ou Jeux de polices de la fenêtre de site. 2 Effectuez l’une des opérations suivantes : •
Pour visualiser les fichiers extraits par d’autres utilisateurs : 1 La fenêtre de site d’un site collaboratif étant ouverte, effectuez l’une des opérations suivantes : •
2 Pour afficher tous les fichiers extraits par un utilisateur, cliquez sur l’icône de développement placée en regard de son nom.
Lorsque un fichier de site collaboratif est archivé, GoLive crée une révision de ce fichier et l’enregistre sur Web Workgroup Server. Chaque version d’un fichier archivé est ajoutée à la Liste de révisions. Vous pouvez visualiser l’historique de chaque fichier, restaurer une version précédente et comparer le code source HTML de deux versions côte à côte. (Voir « Comparaison des versions d’un fichier », page 397.)
Le fichier situé au sommet de la Liste des révisions correspond à la dernière version archivée du fichier. Pour chaque version répertoriée, la liste des révisions indique la date d’archivage, le nom de l’utilisateur ayant archivé le fichier, le chemin d’accès au fichier sur le serveur et les commentaires éventuellement ajoutés lors de l’archivage. Vous pouvez ouvrir n’importe quel fichier de la liste et, si nécessaire, le restaurer. Une copie du fichier est placée en tête de la liste et constitue la version la plus récente stockée sur le serveur. Pour visualiser l’historique des révisions d’un fichier : 1 Sélectionnez le fichier qui vous intéresse dans la fenêtre du site. 2 Effectuez l’une des opérations suivantes : •
La boîte de dialogue qui s’ouvre affiche la liste de toutes les révisions du fichier sélectionné. Pour comparer ces révisions ou restaurer une version précédente du fichier, suivez la procédure correspondante décrite ci-après. Pour restaurer une version précédente d’un fichier : 1 Dans le panneau Fichiers de la fenêtre du site, sélectionnez le fichier dont vous souhaitez restaurer une version précédente (ce fichier doit être archivé). 2 Ouvrez la liste des révisions en cliquant sur le bouton Liste des révisions de la barre d’outils Groupe de travail ou en sélectionnant Site > Révisions > Liste des révisions.
Elle est également placée au sommet de la liste des révisions. La version qui a été remplacée s’affiche en deuxième position.
Les fonctions de comparaison de fichiers de GoLive permettent de visualiser l’ensemble des différences entre deux versions par comparaison du code source. Vous disposez de trois méthodes de comparaison : •
1 Sélectionnez un fichier dans la fenêtre du site, puis cliquez sur le bouton Liste des révisions ou choisissez Site > Révisions > Liste des révisions. 2 Dans la boîte de dialogue Liste des révisions, sélectionnez la révision que vous souhaitez comparer à la version locale actuelle. 3 Cliquez sur Comparer à la version locale. La boîte de dialogue Comparer les révisions à la version locale affiche le code source de chaque version côte à côte. Les différences sont mises en évidence. Le panneau inférieur gauche de la boîte de dialogue répertorie trois types de différences : •
3 Cliquez sur Comparer les révisions. 4 Les options de la boîte de dialogue Comparer les révisions correspondent à celles de la boîte de dialogue Comparer la révision à la version locale, décrites dans la procédure précédente. Après extraction et modification d’un fichier, il peut s’avérer utile de comparer la version locale avec le fichier tel qu’il était avant l’extraction. En d’autres termes, vous souhaitez comparer la version locale à la version actuellement stockée sur le serveur. Pour comparer la version locale avec la version du serveur : 1 Effectuez l’une des opérations suivantes : •
Vous pouvez supprimer des fichiers et des dossiers dans GoLive de deux manières différentes. Il est possible de déplacer des fichiers dans la Corbeille du site ou de supprimer les fichiers sur le serveur. Si vous décidez par la suite d’utiliser à nouveau ces fichiers, vous pouvez les restaurer au sein du site. Même les fichiers supprimés sur le serveur peuvent être restaurés à leur emplacement d’origine. Les préférences de GoLive permettent de choisir la méthode de gestion des fichiers supprimés.
2 Dans la zone Destination des fichiers supprimés, sélectionnez l’une des options disponibles : •
Corbeille du site, vous pouvez restaurer les fichiers en les replaçant dans le dossier approprié.
Pour restaurer des fichiers de la Corbeille du site : 1 Dans le panneau Divers de la fenêtre du site, développez le dossier Corbeille. 2 Sélectionnez les fichiers à restaurer dans le dossier Corbeille, puis faites les glisser jusqu’à l’emplacement souhaité dans le panneau Fichiers. Pour visualiser et restaurer les fichiers supprimés du serveur : 1 Le site étant ouvert, choisissez Site > Révisions > Afficher les fichiers serveur supprimés. Vous pouvez également cliquer avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS) dans l’arrière-plan du panneau Fichiers, puis sélectionnez Révisions > Afficher les fichiers serveur supprimés dans le menu contextuel. Les fichiers supprimés s’affichent dans la fenêtre du site à leur emplacement d’origine, mais ils sont grisés. 2 Sélectionnez le fichier supprimé à restaurer, puis choisissez Révisions > Restaurer dans le menu contextuel. GoLive restaure automatiquement le fichier à son emplacement d’origine dans le site. Rafraîchissez la vue du site (Site > Rafraîchir la vue) pour vérifier que tous les fichiers sont affichés correctement.
Web Workgroup Server, vous pouvez spécifier les paramètres en cours de publication. Les paramètres ainsi définis écrasent temporairement les paramètres définis dans GoLive.
Avant de pouvoir publier un site depuis GoLive, l’administrateur du serveur (ou un utilisateur du groupe de travail disposant de privilèges d’administrateur) doit définir au moins un serveur de publication via l’outil d’administration du serveur. (Voir l’aide d’Adobe Web Workgroup Server) Un site collaboratif peut disposer d’un serveur de publication ou plus (par exemple, des sites de publication distincts pour le montage, l’archivage et la publication réelle). Pour ouvrir l’outil d’administration de Web Workgroup Serveur, choisissez Site > Groupe de travail > Ouvrir Administration de Workgroup. GoLive lance le navigateur Web par défaut et affiche la page Administration de Web Workgroup Server. Les informations d’ouverture de session sont affichées automatiquement.
La publication d’un site collaboratif comprend la préparation du site pour la publication, la connexion au serveur de publication et le téléchargement des données du site. Pour préparer le site en vue de la publication, utilisez la fonction de nettoyage du site (facultatif ). (Voir « Nettoyage d’un site », page 300.) Remarque : Contrairement aux sites pour utilisateur unique, le téléchargement des fichiers d’un site collaboratif depuis le serveur de publication n’est pas pris en charge. Vous pouvez cependant apporter des modifications de dernière minute au site, après sa publication sur le serveur. Le cas échéant, assurez-vous de mettre à jour les fichiers locaux du site avant de les publier à nouveau, afin d’éviter d’écraser les modification effectuées sur le serveur de publication. Pour publier un site depuis GoLive : 1 La fenêtre du site étant ouverte, cliquez sur le bouton Configurer le site de la barre d’outils ou choisissez Site > Configurer. 2 Dans le panneau gauche de la boîte de dialogue de configuration, cliquez sur l’icône Serveur de publication. 3 Dans le menu contextuel Serveur, choisissez le serveur de publication que vous souhaitez utiliser. Si vous n’êtes pas sûr de savoir quel serveur utiliser, contactez l’administrateur du groupe de travail.
6 Dans le panneau gauche de la boîte de dialogue de configuration, cliquez sur l’icône Publication. 7 Sélectionnez l’une des options suivantes : •
GoLive. Les états de publication disponibles sont les suivants : Si référencé (par défaut), Toujours et Jamais pour les fichiers ; Si non vide, Toujours et Jamais pour les dossiers. Pour outrepasser l’état de publication individuel des fichiers et des dossiers, désactivez les options correspondantes.
éléments de code source sélectionnés afin de rationaliser le code sans affecter l’apparence des pages. •
GoLive, utilisés pour modifier les animations et les actions de script. Si vous n’envisagez pas de modifier à nouveau les animations et les actions, ou que vous conservez l’intégralité du code dans une copie d’archive du site, vous pouvez supprimer ces éléments des fichiers à télécharger.
Remarque : Pour adapter le site à l’environnement du serveur de publication sur demande de l’administrateur du système (par exemple, en modifiant l’arborescence du site ou en éliminant le code à ne pas mettre à disposition du public), voir « Adaptation des sites à des environnements de serveurs spécifiques », page 368. 11 Sélectionnez Afficher la boîte de dialogue des options afin d’afficher la boîte de dialogue Options de téléchargement avant de procéder au transfert des fichiers. Vous pouvez ainsi vérifier les options de téléchargement avant de publier le site. 12 Etablissez la connexion au serveur de publication en effectuant l’une des opérations suivantes : •
13 Pour télécharger l’ensemble du site vers le serveur, effectuez l’une des opérations suivantes : •
Serveur de publication > Tout télécharger dans le menu contextuel.
Publier pour commencer le téléchargement des fichiers.
Après publication d’un site, il se peut que vous ayez des ajouts ou des modifications nécessitant de mettre le site à jour sur le serveur de publication. Dans GoLive, vous pouvez copier des fichiers de site créés ou modifiés depuis le dernier téléchargement (Télécharger les éléments modifiés) ou télécharger tout fichier sélectionné (Télécharger la sélection).
Publier pour commencer le téléchargement des fichiers.
Dans le cas des sites collaboratifs, les paramètres du site ont priorité sur les préférences générales. Cela permet de s’assurer que les membres du groupe de travail disposent des mêmes paramètres de configuration du site. Chaque membre du groupe peut modifier cette configuration. Une fois modifiés, les nouveaux paramètres sont enregistrées sur Web Workgroup Server et sont visibles de tous les utilisateurs dès ouverture/rafraîchissement du site dans GoLive. L’option de désactivation des paramètres du site n’est pas disponible pour les sites collaboratifs. Remarque : Tous les utilisateurs GoLive travaillant sur un site collaboratif doivent utiliser une configuration de site, des modules et des actions identiques, de manière à assurer la cohérence de l’apparence et des fonctions du site.
Le panneau Web Workgroup Server de la boîte de dialogue de configuration du site (Site > Configurer > Web Workgroup Server) affiche les informations courantes d’ouverture de session et les options de rafraîchissement des panneaux Couleurs, Externe et Jeux de polices de la fenêtre du site. Pour afficher les informations courantes d’ouverture de session et les paramètres de rafraîchissement : 1 Choisissez Site > Configurer afin d’ouvrir la boîte de dialogue de configuration du site. 2 Dans le panneau gauche de la boîte de dialogue de configuration, cliquez sur l’icône Web Workgroup Server. •
Pour ouvrir une session Web Workgroup Server sous un nom différent : 1 Choisissez Site > Groupe de travail > Modifier l’utilisateur. 2 Dans la boîte de dialogue Modification de l'utilisateur de Web Workgroup Server, saisissez un nom d’utilisateur et un mot de passe corrects dans les champs appropriés. Activez l’option Mémoriser le mot de passe si vous ne souhaitez pas saisir votre mot de passe à chaque ouverture du site collaboratif. 3 Cliquez sur OK. Vous êtes automatiquement identifié comme un nouvel utilisateur et la colonne de verrouillage de la fenêtre du site est mise à jour. Votre nouveau nom d’utilisateur s’affiche dans le coin inférieur gauche du panneau Fichiers de la fenêtre du site.
Les nom d’utilisateur et mot de passe qui vous sont attribués sont créés par l’administrateur de Web Workgroup Server via l’outil d’administration. Si vous ne disposez pas, en tant que membre du groupe, de droits d’administrateur vous permettant de vous connectez à l’outil d’administration, vous devez modifier votre mot de passe vous-même depuis GoLive. Pour modifier votre mot de passe : 1 Choisissez Site > Groupe de travail > Modifier le mot de passe. 2 Dans la boîte de dialogue qui s’affiche, saisissez votre mot de passe actuel dans le champ Ancien mot de passe. Saisissez ensuite votre nouveau mot de passe dans les champs Nouveau mot de passe et Vérifier le mot de passe. 3 Cliquez sur OK.
Couleurs, Externe et Jeux de polices Bien que les transactions entre GoLive et Web Workgroup Server, telles que l’archivage et l’extraction de fichiers, entraînent le rafraîchissement automatique du contenu du panneau Fichiers de la fenêtre du site, les panneaux Couleurs, Externe et Jeux de polices ne sont pas rafraîchis. Vous pouvez les rafraîchir manuellement (voir « Rafraîchissement des panneaux Couleurs, Externe et Jeux de polices », page 394) ou définir une fréquence de rafraîchissement automatique dans les paramètres de configuration du site.
2 Dans le panneau gauche de la boîte de dialogue de configuration, cliquez sur l’icône Web Workgroup Server. 3 Activez l’option Recharger les données automatiquement. 4 Définissez la fréquence de rafraîchissement en secondes. 5 Cliquez sur OK.
Server avec d’autres applications Adobe, telles qu’Illustrator, Photoshop et LiveMotion. Dans GoLive, vous pouvez désigner ces applications en tant qu’éditeurs de types de fichiers spécifiques (par exemple, Photoshop pour les fichiers GIF ou JPEG). Dans un site collaboratif, l’extraction d’un fichier GIF ou JPEG à partir de la fenêtre du site entraîne le lancement Photoshop et l’ouverture du fichier pour modification. Après modification, le module ARM permet d’archiver à nouveau le fichier sur Web Workgroup Server directement depuis Photoshop, plutôt que GoLive. Après archivage du fichier depuis Photoshop, vous devez rafraîchir la vue du site dans GoLive afin de mettre à jour l’état de verrouillage du fichier. Pour activer/désactiver le module ARM : 1 Choisissez Edition > Préférences. 2 Choisissez Modules dans le panneau gauche de la boîte de dialogue Préférences. 3 Dans le panneau droit, localisez le module ARM, puis sélectionnez/désélectionnez-le. 4 Cliquez sur OK. Remarque : Pour que l’activation soit effective, vous devez redémarrer votre ordinateur.
éléments de construction et d’autres fichiers. Il peut également contenir des annotations, des indicateurs de niveau, des objets personnalisés et des boîtes permettant d’insérer du texte ou des images. Un diagramme de conception vous permet d’établir la structure d’un site avant de créer de vraies pages, et de contrôler le processus de création du site. Vous pouvez utiliser de multiples diagrammes prototypes lorsque vous concevez et modifiez un site, et donc créer et tester les conceptions selon vos besoins. Vous avez la possibilité de visualiser les diagrammes sur papier ou en ligne au format Adobe PDF ou SVG. Lorsque vous êtes prêt à travailler sur des pages dynamiques, il vous suffit d’envoyer le diagramme, ce qui transforme ses pages en pages réelles du site.
En faisant glisser des objets dans la vue de la conception, vous pouvez modifier leur emplacement sur la zone de travail, leur place dans l’arborescence du site, ou les deux. Il vous est possible de grouper les objets pour les manipuler ensemble, et d’utiliser les boutons d’affectation pour ajouter des liens. Vous pouvez aussi ancrer le diagramme à une page du site déjà existante afin que ses pages soient visibles dans une vue de navigation une fois que le diagramme a été envoyé. (Voir « Composition des diagrammes de conception », page 411.) Préparation d’un diagramme en vue de sa présentation Pour que les objets s’affichent sur chaque page d’un diagramme composé de plusieurs pages, faites-les glisser dans le panneau Principal de la fenêtre du diagramme. Les éléments figurant sur ce panneau (vue principale) ne font pas partie de la conception du site et ne peuvent être envoyés. Dans la vue de la conception, vous pouvez ajouter des objets Annotation pour inscrire des commentaires, des objets Niveau pour insérer des crochets indiquant les niveaux du site, ou encore des objets Boîte contenant du texte ou des graphiques. Une fois les objets ajoutés, vous pouvez les aligner et les répartir à l’aide de la palette Alignement. Pour modifier la courbe des lignes de liens, vous pouvez les faire glisser ou utiliser l’inspecteur du lien. Si vous souhaitez présenter le diagramme, vous avez le choix entre l’imprimer sur papier ou l’exporter au format Adobe PDF ou SVG. (Voir « Préparation des diagrammes en vue de leur présentation », page 420.) Envoi d’un diagramme Il est possible d’envoyer la totalité d’un diagramme de conception ou seulement certains éléments. L’opération d’envoi transforme les pages du diagramme en pages réelles du site et crée des fichiers de travail pour les objets personnalisés. Pour annuler un envoi, il suffit de rappeler le diagramme ou les éléments. Vous pouvez envoyer et rappeler un diagramme et des éléments aussi souvent que vous en avez besoin lors de l’élaboration d’un site. (Voir « Envoi des diagrammes de conception », page 425.)
Création et ouverture des diagrammes de conception Lorsque vous ouvrez la fenêtre d’un site, vous pouvez créer un ou plusieurs diagrammes de conception pour ce site. Pour créer un nouveau diagramme de conception : 1 Ouvrez un site existant ou un nouveau site. 2 Choisissez Diagramme > Nouveau diagramme de conception. La fenêtre de diagramme s’ouvre sur le panneau Conception. 3 Si vous souhaitez renommer le diagramme, cliquez sur l’onglet Diagramme de la fenêtre du site, sélectionnez le nom du diagramme et saisissez un nouveau nom. Pour ouvrir un diagramme de conception existant : Effectuez l’une des opérations suivantes : •
La palette Affichage fonctionne avec les vues de conception de la même façon qu’avec les vues de navigation et des liens. Le panneau Conception de la palette comporte des options d’affichage des collections, d’orientation, et de visualisation des panneaux périphériques. Le panneau Affichage permet de définir l’affichage des objets dans le diagramme. Quant au panneau Grille, il fournit des options pour la grille, la résolution des collisions et la zone de travail. Remarque : Les collections sont des ensembles personnalisés de fichiers de pages, qui peuvent être visualisées en les éclairant. (Voir « Création et utilisation de collections », page 314.) Pour définir l’affichage des objets dans le diagramme de conception : Dans le panneau Affichage de la palette Affichage, effectuez l’une des opérations suivantes : •
Dans le cas contraire, elles sont circulaires.
1 Dans le panneau Grille de la palette Affichage, effectuez l’une des opérations suivantes : •
Vous pouvez également afficher ou masquer la grille en choisissant Affichage > Afficher la grille ou Affichage > Masquer la grille.
Si vous utilisez conjointement ces deux fonctions, assurez-vous de saisir sous Eviter les collisions des valeurs multiples de celles de la grille. Pour configurer la zone de travail : Dans le panneau Grille de la palette Affichage, effectuez l’une des opérations suivantes : •
Vous pouvez également élargir l’affichage en effectuant un zoom arrière.
Le panneau Mise en page de l’inspecteur est disponible lorsque vous ajoutez et sélectionnez des objets pouvant être liés à d’autres objets de l’arborescence (pages, sections ou objets personnalisés). Vous avez la possibilité de spécifier l’aspect des liens, l’alignement des parents et enfants, les effets des sauts de page et de la grille ainsi que le style de la pointe de flèche pour les liens. Pour définir la mise en page des objets dans une arborescence : 1 Dans la vue de conception, sélectionnez une page, une section ou un objet personnalisé. 2 Dans le panneau Mise en page de l’inspecteur, effectuez l’une des opérations suivantes : •
(parent, enfant, frère précédent ou frère suivant) avec une autre page ou une section. (Pour plus de détails, voir « Ajout et définition des sections », page 413.) Il est également possible d’ajouter des ensembles de pages enfant à une page ou à une section. Les nouvelles pages enfant peuvent ensuite composer une section avec la page parent (ou une sous-section si la page parent appartient à une section). L’ajout de contenu aux pages peut se faire soit lorsque vous travaillez sur le diagramme, soit une fois que vous avez envoyé les pages et qu’elles sont devenues des pages dynamiques du site. L’ajout de pages à un diagramme modifie son aspect et sa logique de navigation, entraînant dans certains cas un déplacement des autres pages et le changement de direction des lignes les connectant. Si vous projetez d’utiliser un diagramme à des fins de présentation, ajoutez l’ensemble des pages et des objets, puis indiquez leurs positions hiérarchiques avant de les réorganiser pour un effet visuel optimal.
Pour ajouter une seule page à une autre page ou une section : Effectuez l’une des opérations suivantes : •
1 Sélectionnez la page ou la section à laquelle vous souhaitez ajouter les pages enfant. 2 Choisissez Diagramme > Nouvelles pages. 3 Spécifiez le nombre de pages à créer, les noms des fichiers, le nom du gabarit ou du modèle (éventuellement) à utiliser ainsi que les types de liens à générer. (Voir « Ajout de pages vierges et de liens en attente à une hiérarchie », page 322.) 4 Si vous souhaitez définir la page sélectionnée et les enfants que vous créez en tant que section ou sous-section, cochez la case Convertir le parent en section. (Voir « Ajout et définition des sections », page 413.) 5 Cliquez sur Créer. Les pages enfant sont créées. Si vous avez coché la case Convertir le parent en section, la page parent devient une page mère pour la nouvelle section ou soussection. Pour configurer une page dans l’inspecteur de la page : Dans le panneau Page de l’inspecteur de la page, effectuez l’une des opérations suivantes : •
« Modification de l’affichage d’une vue de conception », page 408.)
Dans la vue de la conception, cliquez deux fois sur la page. La page s’ouvre dans une fenêtre de document. Vous pouvez la modifier selon les mêmes techniques employées pour modifier les pages ajoutées directement à un site.
La page parent d’une section ou sous-section est appelée la page mère. Une page mère nouvellement créée porte le nom de fichier index.html, à moins que vous n’ayez changé le nom de fichier de la page d’accueil dans les préférences du site. Les pages mère sont visualisées avec un libellé en caractères gras et une icône de section (si les objets du diagramme apparaissent sous forme d’icônes). Pour ajouter et définir une section : 1 Faites glisser une icône de section du panneau Diagramme de la palette Objets vers la vue de la conception. Une page mère est ainsi créée. 2 Si nécessaire, effectuez les opérations suivantes dans le panneau Page de l’inspecteur de la section : •
« Modification de l’affichage d’une vue de conception », page 408.)
Vous spécifiez le dossier de la page et de ses enfants dans le panneau Section. Par ailleurs, vous n’avez probablement pas besoin de changer le nom de fichier par défaut de la page mère. En effet, même si la page d’accueil du site possède le même nom de fichier, les deux fichiers ont des chemins différents puisque la section comporte un dossier spécifique. 3 Dans le panneau Section de l’inspecteur de la section, effectuez l’une des opérations suivantes : •
Randonnée2.html, etc. Ajout et modification de liens en attente Vous pouvez ajouter des liens en attente entre des pages, des sections et des objets personnalisés, et modifier le type de ces liens. Les liens de type Global connectent une série d’objets (qui ne sont pas obligatoirement des frères adjacents) les uns à la suite des autres. Vous pouvez modifier la couleur des liens et ajouter de nouveaux types de liens dans les paramètres du site. Pour ajouter un lien en attente de type Hyperlien entre deux objets : 1 Dans la vue de la conception, sélectionnez l’objet source. Un bouton d’affectation apparaît. 2 Faites glisser le bouton d’affectation vers l’objet cible. Un nouveau lien, de type Hyperlien, apparaît. Pour ajouter des liens en attente entre des objets déjà reliés : 1 Dans la vue de la conception, effectuez l’une des opérations suivantes : •
Pour modifier un type de lien : 1 Dans la vue de la conception, sélectionnez un lien. Un petit rectangle lien, et les objets source et cible sont mis en évidence.
3 Choisissez un nouveau type de lien dans l’inspecteur du lien. Vous vous contenterez, normalement, de choisir Hyperlien, Global ou un type de lien personnalisé, étant donné qu’il est plus facile de modifier les types de liens familiaux (parent, enfant et frères adjacents) en faisant glisser les objets l’un vers l’autre. (Voir « Déplacement et copie d’objets », page 417.)
échantillon et choisissez une nouvelle teinte.
Les modifications apportées aux types de liens s’appliquent à tous les diagrammes de conception associés au site actif.
Vous avez la possibilité de créer des objets personnalisés représentant des éléments que vous risquez d’ajouter ou de lier à un site, et d’ajouter ces objets dans le panneau Diagramme de la palette Objets. Ce panneau contient différents objets personnalisés prédéfinis qui représentent des formes, éléments, bases de données, applets et scripts. Vous pouvez, en cas de besoin, modifier ou supprimer ces objets. Les objets personnalisés sont des images au format GIF qui sont placées dans le dossier Modules/Diagram Objects du dossier de l’application GoLive. Lorsque vous ajoutez un objet personnalisé à un diagramme, vous pouvez indiquer si vous souhaitez créer un fichier pour cet objet lorsqu’il sera envoyé, et préciser le type de fichier à créer. Le fichier doit être créé à partir d’un modèle, gabarit ou fichier exemple. Vous pouvez, par exemple, ajouter à un site une vidéo : vous créez alors un objet personnalisé utilisant comme fichier exemple le fichier de la vidéo. Lorsque le diagramme est envoyé, un nouveau fichier vidéo est créé à partir du fichier exemple. Tous les fichiers non HTML créés à partir d’objets personnalisés deviennent des éléments de travail. Pour créer un nouvel objet personnalisé et l’ajouter au panneau Diagramme de la palette Objets : 1 Enregistrez une image selon la convention suivante : mon_nom_de_fichiermon_extension.gif, où mon_nom_de_fichier est le nom apparaissant dans l’info-bulle de la palette Objets, et mon_extension est l’extension par défaut utilisée dans les noms de fichiers des objets créés. (Si vous omettez d’indiquer une extension par défaut et le trait d’union qui la précède, c’est l’extension .html qui sera utilisée.) 2 Placez le fichier de l’image dans le dossier suivant : Adobe GoLive 6.0/Modules/ Diagram Objects. 3 Relancez GoLive. Pour être disponible dans la palette Objets, l’objet personnalisé doit se trouver dans le dossier Diagram Objects au lancement de GoLive.
2 Ouvrez le fichier defaults.agldex qui se trouve dans le dossier DocumentStore et copiez une spécification <example></example> existant dans ce fichier. Les spécifications « example » ont le format suivant : <example ident="myfilename" mime="mime type" ext="myextension" group="group name"> <display name="myfilename" context="no" menu="no" sort="2020"/> <file url="examples/mysample.myextension"/> 3 Modifiez la copie de la spécification et placez-la dans le groupe approprié dans le fichier defaults.agldex. 4 Relancez GoLive. Pour être disponible en tant que fichier exemple, le fichier doit se trouver dans le dossier exemples et défini dans le fichier defaults.agldex lorsque vous démarrez GoLive. Pour ajouter un objet personnalisé à un diagramme de conception : 1 Faites glisser l’objet du panneau Diagramme de la palette Objets vers la vue de la conception. Vous pouvez ajouter un objet personnalisé à une zone vide de la vue de la conception, ou le faire glisser vers une page, section ou autre objet personnalisé existant afin de créer un lien de parent, frère ou enfant. 2 Dans le panneau Objet de l’inspecteur de l’objet, effectuez l’une des opérations suivantes : •
Dans la vue de la conception, faites glisser l’objet vers le nouvel emplacement. Si l’option Eviter les collisions est sélectionnée et que vous déposez l’objet à proximité ou sur un autre objet, celui-ci se déplacera également (pour éviter toute collision). Remarque : Si vous faites glisser un objet vers un autre objet et qu’une ligne apparaît en haut, en bas, à gauche ou à droite de celui-ci, cela signifie que vous vous êtes trop approché du centre de l’autre objet. Diminuez la superposition jusqu’à ce que la ligne disparaisse. Lorsque vous faites glisser un objet, les lignes de liens qui y sont attachées se déplacent également. En revanche, les descendants de l’objet ne se déplacent pas avec l’objet comme ils le feraient si vous changiez l’objet de place dans l’arborescence. Pour changer la position d’une page, d’une section ou d’un objet personnalisé dans l’arborescence logique : 1 Dans la vue de la conception, faites glisser l’objet sur la page, la section ou l’objet personnalisé auquel vous voulez qu’il soit relié. Selon la position de l’objet que vous faites glisser, une ligne apparaît au-dessus, en dessous, à gauche ou à droite de l’objet cible. 2 Déposez l’objet au-dessus, en dessous, à gauche ou à droite de l’objet cible en fonction de la relation de famille que vous souhaitez établir entre les deux objets. (Voir « Réorganisation des éléments d’une hiérarchie », page 324.)
1 Dans la vue de la conception, sélectionnez les objets à dupliquer. 2 Choisissez Edition > Dupliquer. Les objets sont copiés, ainsi que leurs liens et connecteurs. Si vous ne sélectionnez qu’un seul objet, il est dupliqué avec ses liens.
Un groupe est un rectangle comprenant un certain nombre d’objets du diagramme de conception que vous traitez comme un seul bloc. Pour déplacer, copier ou supprimer les objets d’un groupe, il suffit de déplacer, copier ou supprimer le groupe. Vous pouvez également fermer un groupe afin de désencombrer temporairement le diagramme. Les objets d’un groupe doivent se trouver dans le rectangle du groupe, mais ils n’ont pas nécessairement de lien logique les uns avec les autres. Pour associer une sélection d’objets : 1 Dans la vue de la conception, sélectionnez des objets. 2 Choisissez Edition > Associer ou cliquez sur le bouton Associer Transformation.
Pour créer un groupe vide à un endroit particulier : 1 Faites glisser une icône de groupe du panneau Diagramme de la palette Objets vers la vue de la conception. Si l’option Eviter les collisions est sélectionnée, tout objet situé à l’emplacement de l’icône ou à proximité se déplace automatiquement. 2 Effectuez au besoin les opérations suivantes : •
2 Dans l’inspecteur du groupe, effectuez l’une des opérations suivantes : •
Pour dissocier des objets groupés : 1 Sélectionnez le groupe. 2 Choisissez Edition > Dissocier, ou cliquez sur le bouton Dissocier Transformation.
Effectuez l’une des opérations suivantes : •
Lorsque vous envoyez un diagramme, ses pages deviennent les pages dynamiques du site. Pour voir ces pages sur la vue de la navigation après que le diagramme a été envoyé, vous devez ancrer les nouvelles pages à une page existante du site. Pour ancrer un diagramme de conception à une page existante d’un site : 1 Affichez la page à laquelle vous envisagez d’ancrer le diagramme dans la vue de la navigation, la vue des liens ou le panneau Fichiers de la fenêtre du site. C’est la vue de la navigation qui donne le meilleur aperçu de l’ancrage du diagramme. 2 Ouvrez la fenêtre du diagramme et affichez la vue de la conception. 3 Assurez-vous que les deux fenêtres sont accessibles, en les déplaçant si nécessaire. 4 Faites glisser la page qui sert de point d’ancrage au diagramme, de sa fenêtre vers la vue de la conception. Cette page apparaît dans la vue de la conception avec une icône d’ancrage . Elle figure également dans le groupe Pages d’ancrage du panneau Montage de la fenêtre du diagramme. Si vous faites glisser la page d’ancrage sur une page du diagramme, créant ainsi un lien de famille, il est préférable d’établir un lien de frère entre ces deux pages. Un lien parent-enfant risque en effet de donner des résultats inattendus.
Les annotations sont des commentaires qui peuvent être affichés ou représentés sous forme d’icônes. Les niveaux sont des crochets (accompagnés éventuellement d’un libellé) pouvant être utilisés pour indiquer les niveaux au sein d’un site. Si vous souhaitez que des objets créés pour la présentation apparaissent sur chaque page du diagramme, vous pouvez les créer en tant qu’éléments principaux dans le panneau Principal de la fenêtre du diagramme.
éléments principaux à mesure que vous élaborez le diagramme dans la vue de la conception. Pour ajouter des éléments principaux à un diagramme de conception : Effectuez l’une des opérations suivantes : •
Pour ajouter une boîte à un diagramme de conception : 1 Faites glisser une icône de boîte du panneau Diagramme de la palette Objets vers la vue de la conception. 2 Dans le panneau Boîte de l’inspecteur de la boîte, effectuez l’une des opérations suivantes : •
Pour ajouter une annotation à un diagramme de conception : 1 Faites glisser une icône d’annotation du panneau Diagramme de la palette Objets vers un objet ou une zone vide de la vue de la conception. 2 Saisissez le sujet et le texte en effectuant l’une des opérations suivantes : •
1 Dans le panneau Conception ou Annotations de la fenêtre du diagramme, sélectionnez l’annotation. 2 Effectuez l’une des opérations suivantes : •
Les objets Niveau sont des crochets (accompagnés éventuellement d’un libellé) pouvant être utilisés pour indiquer l’arborescence des objets sur un diagramme de conception. Ces crochets peuvent être placés n’importe où sur une vue de conception, et redimensionnés afin d’inclure tous les objets d’un niveau donné. Pour ajouter un objet Niveau à un diagramme de conception : 1 Faites glisser une icône de niveau du panneau Diagramme de la palette Objets vers la vue de la conception. 2 Positionnez le crochet en le faisant glisser. 3 Redimensionnez le crochet en faisant glisser l’une de ses poignées. 4 Dans le panneau Niveau de l’inspecteur du niveau, effectuez l’une des opérations suivantes : •
également nommer le niveau dans la vue de la conception en cliquant à gauche du crochet et en saisissant du texte dans la zone qui apparaît.
Saisissez des valeurs pour la largeur et la hauteur des marges du libellé.
Vous pouvez utiliser la palette Alignement pour déterminer le rapport spatial entre les objets d’un diagramme de conception. Remarque : Lorsque vous alignez un objet sur son parent, le parent correspond au dominant géométrique, et non logique comme dans le cas d'une arborescence hiérarchique. Le parent géométrique n’est autre que la zone de travail dans son ensemble, ou bien le groupe si les objets que vous alignez appartiennent à un groupe. Comment utiliser l'aide | Sommaire | Index
1 Sélectionnez deux objets ou plus. 2 Dans la palette Alignement, cliquez sur l’un des boutons Alignement des objets. Pour répartir les objets ou l’espacement : 1 Sélectionnez trois objets ou plus. 2 Dans la palette Alignement, effectuez l’une des opérations suivantes : •
Pour modifier la déflexion d’une ligne de lien : 1 Sélectionnez la ligne. 2 Effectuez l’une des opérations suivantes : •
Un diagramme de conception peut être imprimé pour une présentation sur papier, ou exporté au format Adobe PDF ou SVG pour le présenter en ligne. Exporté, il peut contenir des liens et des annotations dynamiques. Pour imprimer un diagramme de conception : 1 Ouvrez la vue de la conception du diagramme, puis choisissez Fichier > Imprimer. 2 Sélectionnez les options d’impression et cliquez sur OK.
4 Cochez la case Convertir les objets du diagramme en liens et spécifiez l’URL racine pour que les liens ouvrent les fichiers. 5 Selectionnez une option d’annotation : •
Lorsque vous envoyez un diagramme de conception, GoLive convertit ses pages et sections en pages HTML réelles pouvant être modifiées. Les pages sont transférées vers le panneau Fichiers, ce qui signifie qu’elles existent en tant que fichiers du site. Lorsque c’est possible, des fichiers sont créés pour les objets personnalisés. Si vous décidez de rappeler un diagramme que vous avez envoyé, ces transformations sont annulées. Vous pouvez envoyer et rappeler un diagramme à plusieurs reprises lors de l’élaboration d’un site. Vous pouvez également envoyer et rappeler une sélection d’objets du diagramme. Avant d’envoyer un diagramme de conception, il convient de vérifier le montage et de corriger les erreurs éventuelles.
Lorsque vous vérifiez le montage d’un diagramme de conception, vous déterminez si toutes ses pages sont connectées par le biais de liens à une page d’ancrage et vous évaluez les problèmes que peuvent éventuellement poser les noms des dossiers ou des fichiers à l’envoi du diagramme. Vous pouvez alors procéder à toutes les corrections nécessaires. Remarque : Sachez qu’un diagramme comportant des erreurs de montage ne peut être envoyé et que certains cas d’erreurs ne sont décelables qu’au moment de l’envoi. Si vous ne parvenez pas à envoyer un diagramme que vous avez préalablement vérifié sans y détecter aucune erreur, vérifiez-le une nouvelle fois. Pour vérifier le montage d’un diagramme de conception : 1 Dans la fenêtre du diagramme, cliquez sur l’onglet Montage. Si vous n’avez pas envoyé le diagramme, ses pages s’affichent dans le groupe Pages de conception, et les objets personnalisés dans le groupe Objets de conception. Dans le cas contraire, les pages apparaissent sous Pages dynamiques.
Si une icône d’erreur ou une icône d’avertissement apparaît en face d’une page ou d’un objet dans la colonne Vérifier, procédez de la manière suivante pour corriger le problème : •
Pages de conception au groupe Pages dynamiques. (Elles apparaissent également avec une icône de page dynamique dans le panneau Conception.) Les objets personnalisés passent du groupe Objets de conception au groupe Objets dynamiques.
2 Cliquez sur le bouton Tout envoyer sur la barre d’outils, ou choisissez Diagramme > Montage > Tout envoyer, ou encore Tout envoyer dans le menu de la fenêtre du diagramme.
Le rappel d’un diagramme de conception annule toutes les transformations qui ont eu lieu lorsqu’il a été envoyé. C’est une étape tout à fait normale dans le processus de conception. Par exemple, vous pouvez envoyer un diagramme en cours d’élaboration pour l’examiner dans un contexte réel, puis le rappeler pour poursuivre sa création. Vous pouvez également, si vous hésitez entre deux diagrammes, envoyer le premier, le rappeler puis envoyer le second, afin de faire un choix entre les deux. En fait, il n’est pas nécessaire de rappeler un diagramme de conception pour retravailler dessus. Vous pouvez envoyer un diagramme, même non terminé, le dynamiser, puis le retravailler dans la vue de conception. Le fait de le renvoyer ultérieurement mettra à jour le site. Les mises à jour entraînant d’importantes modifications de conception peuvent produire des résultats inattendus. Dans ce cas, essayez de rappeler le diagramme mis à jour, vérifiez-le et corrigez-le avant de le renvoyer. Pour rappeler tous les éléments d’un diagramme de conception : 1 Ouvrez le diagramme dans la vue de conception. 2 Cliquez sur le bouton Rappeler tout sur la barre d’outils, ou choisissez Diagramme > Montage > Rappeler tout, ou encore Rappeler tout dans le menu de la fenêtre du diagramme.
Il est possible d’effectuer des envois et rappels sélectifs de certains éléments d’un diagramme de conception. Par exemple, vous pouvez envoyer seulement certains éléments d’un diagramme que vous avez décidé d’abandonner dans son ensemble mais dont vous souhaitez conserver une partie. Mais vous pouvez aussi envoyer la totalité d’un diagramme, vous apercevoir qu’une partie a besoin d’être retravaillée, et donc rappeler ces éléments.
2 Choisissez Rappeler les éléments dans le menu Diagramme > Montage ou dans le menu de la fenêtre du diagramme.
Dans l’éditeur de code source, vous pouvez visualiser le code source de votre document, en vérifier la syntaxe, l’affiner ou encore concevoir des documents à partir du panneau de travail. Si la programmation HTML n’a plus de secrets pour vous, vous apprécierez d’autant plus l’éditeur de code source. Il vous permet en effet de rédiger et de peaufiner le code source qui structure votre document, comme vous le feriez dans tout autre éditeur de texte HTML. Vous avez la possibilité de créer un nouveau document, d’ouvrir des documents existants GoLive, HTML ou texte, de saisir ou de coller un texte provenant d’un autre document ou d’une autre application, ainsi que de procéder à des modifications et d’enregistrer ces dernières.
Vous pouvez ouvrir et utiliser l’éditeur de code source depuis le panneau Source de la fenêtre du document ou depuis le panneau de code source dans l’éditeur de mise en page, l’éditeur de cadres ou l’éditeur de structure.
Pour modifier rapidement l’emplacement et l’orientation du panneau de code source, cliquez sur le bouton Fractionnement de la source en maintenant la touche Alt (Windows) ou Option (Mac OS) enfoncée. Le panneau est déplacé dans la partie droite de la fenêtre du document et son orientation horizontale devient verticale. Pour placer le panneau de code source en haut de la fenêtre du document (puis à gauche, et de retour en bas), reprenez les instructions de ce point.
Dans l’éditeur de code source, vous pouvez faire glisser une icône d’élément HTML de la palette Objets vers votre code source et l’utiliser comme point de départ pour l’encodage de l’élément. Une fois un élément inséré, vous pouvez modifier ses attributs et valeurs d’attribut pendant que l’éditeur de code source contrôle votre saisie et met en évidence fautes de frappe et erreurs de syntaxe.
Dans l’éditeur de code source, vous pouvez mettre en évidence l’ensemble des liens rompus et des références de fichiers incorrectes (en rouge, par défaut) à l’aide du bouton Avertissements associés aux liens de la barre d’outils.
Dans l’éditeur de code source, vous pouvez appliquer des commandes standard de formatage du texte, disponibles dans le menu Texte, à un texte sélectionné dans le corps de votre document. (Voir « Formatage des caractères », page 110.) Pour formater du texte : Dans l’éditeur de code source, effectuez l’une des opérations suivantes : •
Lorsque vous saisissez ou modifiez le code l’éditeur de code source, GoLive vérifie régulièrement votre code en le comparant avec le contenu et les règles spécifiées dans la configuration de la base de données Web. Lorsqu’il reconnaît un élément, GoLive affiche les balises ouvrantes et fermantes, ainsi que leurs attributs en couleur dans l’éditeur de code source pour indiquer que la syntaxe est complète. GoLive utilise plusieurs couleurs afin de distinguer les différents éléments, les attributs et le contenu du document dans l’éditeur de code source, ce qui vous facilite le suivi du code source. Vous pouvez définir des options pour afficher certains types d’éléments en couleur et déterminer si votre code source doit être aligné sur les marges de l’éditeur de code source. Pour afficher des éléments en couleur et utiliser le retour à la ligne : Pour définir des options d’affichage des éléments en couleur et appliquer le retour à la ligne à votre code source, utilisez les boutons suivants de la barre d’outils dans l’éditeur de code source : •
Remarque : Lorsque vous utilisez l’éditeur de code source, vous pouvez également définir des options pour l’affichage des éléments en couleur et le retour à la ligne dans la palette Afficher.
Pour contrôler le fonctionnement de l’éditeur de code source et l’affichage du code source dans ce dernier, vous pouvez définir les préférences de source suivantes : •
1 Choisissez Edition > Préférences, puis cliquez sur Jeux de navigateurs dans l’arborescence de l’élément Source. 2 Cliquez sur le bouton Nouveau jeu au-dessous de la liste des jeux de navigateurs, puis saisissez un nom évocateur dans la zone de texte. 3 Sélectionnez les navigateurs souhaités dans la liste Navigateur, puis cliquez sur OK. Une fois le jeu de navigateurs créé, vous pouvez le choisir dans la liste de compatibilité du vérificateur de syntaxe. (Voir « Vérification de la syntaxe », page 440.) Pour modifier ou supprimer un jeu de navigateurs existant : 1 Dans le panneau des préférences de jeux de navigateurs, sélectionnez un jeu existant dans la liste Jeu de navigateurs. 2 Effectuez l’une des opérations suivantes : •
2 Sélectionnez une police, sa taille et son style pour le code source. Cette police apparaît uniquement dans l’éditeur de code source, pas dans votre document. 3 Cliquez sur OK. Pour définir des préférences d’affichage en couleur des éléments dans l’éditeur de code source : 1 Choisissez Edition > Préférences, puis cliquez sur Couleurs dans l’arborescence de l’élément Source.
1 Choisissez Edition > Préférences, puis cliquez sur Impression dans l’arborescence de l’élément Source. 2 Pour obtenir une version imprimée de votre document différente de la version consultée en ligne dans l’éditeur de code source, sélectionnez les préférences suivantes : •
La palette Mettre en évidence vous permet de mettre en évidence des éléments, des avertissements et des erreurs pendant votre travail dans l’éditeur de mise en page, l’éditeur de code source ou l’éditeur de structure. Par exemple, vous pouvez mettre en évidence tous les éléments dotés d’un URL, tout le texte ayant une définition CSS spécifique ou l’ensemble des erreurs de syntaxe et de liens. Une fois les éléments mis en évidence, vous pouvez les sélectionner individuellement à l’aide de la palette Mettre en évidence. Il est possible d’enregistrer différents paramètres de mise en évidence (tels que tous les éléments dotés d’un URL) sous la forme d’un jeu de mise en évidence, puis d’utiliser ce dernier par la suite dans d’autres documents.
A. Sélectionnez les éléments de votre document à mettre en évidence. B. Nombre des éléments mis en évidence C. Cliquez sur ces boutons pour sélectionner les éléments mis en évidence précédent et suivant. D. Nombre des erreurs et des avertissements de syntaxe E. Le vérificateur de syntaxe affiche ici les erreurs et les avertissements.
Vous pouvez utiliser la palette Mettre en évidence pour mettre en évidence un seul élément ou une combinaison de plusieurs types d’éléments. Il est également possible de mettre en évidence les avertissements associés aux liens et d’utiliser la vérification de syntaxe pour détecter les erreurs de syntaxe tandis que d’autres éléments sont mis en évidence. (Voir « Vérification de la syntaxe », page 440.) Pour mettre en évidence des éléments : 1 Dans l’éditeur de mise en page, l’éditeur de code source ou l’éditeur de structure, choisissez Fenêtre > Mise en évidence pour ouvrir la palette Mettre en évidence. 2 Effectuez l’une des opérations suivantes : •
évidence : Cliquez sur Effacer dans la palette Mettre en évidence. GoLive supprime la mise en évidence dans le document et efface les paramètres définis dans la palette Mettre en évidence. Pour effectuer un nouveau balayage après l’ajout d’éléments au document : Cliquez sur Balayer dans la palette Mettre en évidence. Pour afficher et masquer toute la mise en évidence : Pour afficher toute la mise en évidence dans le document, choisissez Afficher tous les éléments mis en évidence dans le menu de la palette Mettre en évidence. Une coche indique que la mise en évidence est affichée. Les paramètres actifs dans la palette Mettre en évidence restent inchangés. Pour afficher et masquer la mise en évidence du contenu d’un élément : Pour afficher la mise en évidence du contenu d’un élément ainsi que ses balises, choisissez Mettre également le contenu en évidence dans le menu de la palette Mettre en évidence. Une coche indique que le contenu est également mis en évidence. Pour afficher la mise en évidence dans l'aperçu : Pour afficher la mise en évidence dans l’aperçu du document, choisissez Afficher les éléments mis en évidence dans l’aperçu dans le menu de la palette Mettre en évidence. Une coche indique que la mise en évidence est affichée.
évidence Vous pouvez enregistrer les paramètres de la palette Mettre en évidence sous la forme d’un jeu de mise en évidence pour l’utiliser plus tard dans un autre document. Par exemple, vous pouvez enregistrer et réutiliser un jeu contenant des paramètres de mise en évidence pour tous les éléments img et un autre pour tous les éléments auxquels des actions JavaScript sont associées. Pour enregistrer les paramètres de mise en évidence actifs : 1 Dans le menu de la palette Mettre en évidence, choisissez Enregistrer le jeu de mise en évidence. 2 Saisissez le nom du jeu, puis cliquez sur OK.
2 Sélectionnez le jeu souhaité, puis cliquez sur Ouvrir.
Le panneau Couleurs de la palette Mettre en évidence vous permet de définir les couleurs et leur opacité pour la mise en évidence appliquée par GoLive aux catégories d’éléments. Vous pouvez par exemple appliquer la couleur bleue à tous les avertissements de lien. Il est également possible de définir le style de mise en évidence pour chaque catégorie : bord ou fond en couleur. Par exemple, vous pouvez utiliser un bord vert autour du texte et un fond jaune pour les commentaires. Pour définir les couleurs et l’aspect des éléments mis en évidence : 1 Cliquez sur l’onglet Couleurs de la palette Mettre en évidence. 2 Effectuez l’une des opérations suivantes : •
Le type de document spécifié dans la déclaration !DOCTYPE au début d’un document, fournit aux vérificateurs et navigateurs HTML une définition du type de document (DTD ou Document Type Definition en anglais) utilisée pour traiter le document. Le fichier de définition DTD indique les éléments autorisés dans le document et leurs différents attributs. Par exemple, un DTD HTML 4.0 Strict n’autorise pas les cadres dans les documents, et le DTD XHTML Basic n’autorise pas les éléments de police.
Néanmoins, si vous définissez le type du document tout en assurant sa conformité avec la déclaration DTD, il vous sera possible de l’utiliser avec les prochaines versions de navigateurs qui nécessiteront cette conformité. Lorsqu’un document n’est pas doté d’un type défini, ce qui est le cas de la plupart des anciens documents, les navigateurs peuvent tout de même l’afficher. Si vous définissez le type d’un document et que vous utilisez ensuite la vérification de syntaxe, GoLive vérifie la structure et la syntaxe du document, puis met en évidence tout élément non conforme à la déclaration DTD dans le type de document. (Voir « Vérification de la syntaxe », page 440.)
Si vous choisissez Fichier > Nouveau document spécial pour créer un document HTML, XHTML, WML ou SMIL, GoLive définit automatiquement son type et sélectionne un fichier DTD par défaut. (Voir « Création de documents spéciaux », page 43.) Si vous choisissez Fichier > Nouvelle page, GoLive ne définit pas le type du document. A l’exception des documents SMIL, vous pouvez définir ou modifier le type des documents après leur création. Cette opération est toutefois soumise à certaines restrictions. Vous pouvez, par exemple, modifier le type d’un document HTML ou convertir un document HTML au format XHTML, puis choisir le type de document XHTML. Par contre, vous ne pouvez pas convertir un document WML au format HTML. Pour des résultats optimaux, il est conseillé d’utiliser dès la création, le type de document spécial nécessaire au déploiement final. Pour définir ou modifier le type de document : 1 Dans l’éditeur de mise en page, affichez le menu de la fenêtre du document. (Voir « Utilisation des outils de conception de page », page 17.) 2 Choisissez Type de document, puis sélectionnez un type dans le menu. Ce menu étant contextuel, les DTD HTML appropriés sont disponibles lorsque vous modifiez un document HTML. Pour un document XHTML, vous disposez des DTD XHTML ; pour tous les autres types de document, vous disposez des DTD associés dans le panneau Balise de la boîte de dialogue Configuration de la base de données Web. Par exemple, les DTD WML sont disponibles pour un document WML. (Voir « Utilisation du panneau Balise », page 628.) Remarque : Si vous associez des DTD importés à des fichiers texte ou XML dans le panneau Balise de la configuration de la base de données Web, ces DTD sont également disponibles dans le menu Type de document. (Voir « Importation d’un fichier DTD (Document Type Definition) », page 634.) Lorsque vous avez choisi un type de document dans le menu du même nom, GoLive le définit en insérant ou modifiant la déclaration !DOCTYPE, située au début du code source du document. Le type de document défini est également le DTD sélectionné par défaut dans le vérificateur de syntaxe. (Voir « Vérification de la syntaxe », page 440.) Comment utiliser l'aide | Sommaire | Index
2 Pour assurer la compatibilité de votre document converti XHTML avec un plus grand nombre de navigateurs, sélectionnez les options suivantes afin de définir la conversion de HTML en XHTML dans GoLive : •
Lorsque vous avez défini le type d’un document, GoLive désactive automatiquement des boutons de la barre d’outils et des commandes de menu afin d’éviter l’ajout d’éléments qui ne sont pas conformes au DTD associé au type de document. Par exemple, étant donné que le DTD XHML Basic n’autorise pas les éléments de police, GoLive désactive automatiquement les boutons Gras, Italique et Couleur du texte de la barre d’outils et les commandes du menu Police. Toutefois, cette désactivation automatique ne s’applique pas aux icônes de la palette Objets. Si vous souhaitez masquer les icônes des éléments qui ne sont pas autorisés dans le type de document actif, vous devez configurer la palette Objets manuellement. Remarque : Vous ne pouvez pas configurer la palette Objets pour un DTD importé. Pour configurer la palette Objets pour un type de document : 1 Dans le menu de la palette Objets, choisissez Configurez. 2 Effectuez l’une des opérations suivantes : •
« Modification du code source dans l’éditeur de structure », page 447.)
A. Liste de compatibilité : sélectionnez Construction uniquement, ou bien le DTD ou le jeu de
Vous pouvez vérifier la syntaxe dans n’importe quel éditeur. Pour vérifier la syntaxe : 1 Dans un éditeur, choisissez Edition > Vérifier la syntaxe ou cliquez sur le bouton Syntaxe dans la palette Mettre en évidence. 2 Dans la liste de compatibilité (zone de liste supérieure) de la boîte de dialogue Vérifier la syntaxe, sélectionnez l’une des options suivantes : •
DTD ou un jeu de navigateurs. Par exemple, des messages d’erreur apparaissent lorsque des balises fermantes manquent, que des valeurs d’attribut doivent être mises entre crochets ou qu’un attribut a plusieurs définitions. Lorsque cette option est sélectionnée, la vérification de syntaxe ne génère pas de message d’erreur pour les balises fermantes non requises ni pour les valeurs d’attribut qui ne requièrent pas de crochets.
La déclaration !DOCTYPE est utilisée lors de la vérification de syntaxe pour localiser le DTD qui peut se trouver sur votre ordinateur, sur un réseau local ou sur Internet.
Comment utiliser l'aide | Sommaire | Index
Vérifier la syntaxe. 4 Si vous souhaitez autoriser des éléments supplémentaires dans votre document, sélectionnez les jeux d’éléments dans la zone de liste inférieure de la boîte de dialogue Vérifier la syntaxe. 5 Pour contrôler la cible et le fonctionnement du vérificateur de syntaxe, sélectionnez les options suivantes : •
GoLive affiche un avertissement lorsque la valeur d’un attribut incorrecte comme <body bgcolor="redd">. Les avertissements sont beaucoup moins fréquents que les erreurs.
7 Pour localiser et consulter les erreurs de votre document, effectuez l’une des opérations suivantes : •
GoLive vous permet de recréer automatiquement le code source que vous avez saisi manuellement. Le programme recrée le code avec des retraits et sauts de ligne, modifie la casse des balises et attributs, puis définit des guillemets pour les valeurs d’attributs en fonction de la configuration Web ou du DTD actif si un type de document est spécifié. Par exemple, le code source d’un document XHTML est recréé conformément aux normes XHTML. Pour recréer automatiquement le code source : Dans un éditeur, choisissez Edition > Recréer le code source. GoLive recrée le code source en fonction du DTD actif ou des options sélectionnées dans les panneaux Générale et Balise de la boîte de dialogue Configuration de la base de données Web.
Comme le panneau de code source, la palette Code source vous permet d’utiliser l’éditeur de mise en page, l’éditeur de cadres ou l’éditeur de structure tout en visualisant le code source correspondant. Toutefois, cette palette offre deux avantages supplémentaires pour l’utilisation du code source. Tout d’abord, si votre ordinateur dispose de deux moniteurs, vous pouvez afficher un document dans l’éditeur de mise en page sur un moniteur et le code source correspondant dans la palette Code source sur le deuxième moniteur. Les modifications apportées dans l’éditeur de mise en page sont répercutées dans la palette Code source, et inversement, lorsque vous recliquez sur l’éditeur. Ensuite, vous pouvez choisir l’option Mode local dans la palette Code source afin d’afficher uniquement le code des éléments actuellement sélectionnés dans l’éditeur de mise en page, l’éditeur de cadres ou l’éditeur de structure. La palette Code source indiquant normalement le code du document entier, cette option permet de limiter la quantité affichée de façon à faciliter les modifications. Pour utiliser la palette Code source : 1 Dans l’éditeur de mise en page, l’éditeur de cadres ou l’éditeur de structure, choisissez Fenêtre > Code source. 2 Dans le menu de la palette Code source, sélectionnez l’une des options suivantes : •
Vous pouvez utiliser la barre d’arborescence des balises pour sélectionner un sousélément de l’élément actuellement sélectionné, c’est-à-dire le niveau inférieur suivant dans la structure HTML, tel qu’une ligne à l’intérieur du tableau sélectionné. Il est également possible d’utiliser cette barre pour sélectionner un élément externe à l’élément actuellement sélectionné, c’est-à-dire le niveau supérieur suivant ou plus proche de la racine. Lorsque la cellule d’un tableau est sélectionnée par exemple, vous pouvez sélectionner la ligne ou bien le tableau où se trouve cette cellule. Pour sélectionner un sous-élément (niveau inférieur dans l’arborescence) : 1 Affichez le document dans l’éditeur de mise en page, l’éditeur de cadres, le panneau de code source ou l’éditeur de structure. 2 Effectuez l’une des opérations suivantes : •
« Utilisation de Visual Tag Editor », page 445.)
Pour sélectionner le bloc supérieur : Lorsque du texte ou un élément est sélectionné dans l’éditeur de mise en page, l’éditeur de code source ou l’éditeur de structure, choisissez Spécial > Sélectionner le bloc supérieur. GoLive sélectionne l’élément situé au niveau supérieur suivant dans l’arborescence.
Grâce à Visual Tag Editor, vous pouvez vérifier et modifier le code source d’un élément HTML individuel dans l’éditeur de mise en page sans devoir utiliser l’éditeur ou la palette de code source. Cette fenêtre vous permet également d’insérer un nouveau code source. L’outil performant Visual Tag Editor vous permet de modifier rapidement le code source d’un document sans quitter l’éditeur de mise en page. Pour les opérations plus complexes relatives au code, utilisez plutôt l’éditeur de code source ou la palette Code source.
Vous pouvez utiliser Visual Tag Editor pour modifier rapidement des objets, des éléments ou des attributs existants. Pour modifier un objet ou un élément : 1 Dans la fenêtre Visual Tag Editor, effectuez l’une des opérations suivantes pour ouvrir l’éditeur de balises visuel en mode de modification. •
4 Lorsque vous avez terminé la modification du code source, cliquez sur OK.
L’outil Visual Tag Editor vous permet également d’encadrer rapidement un texte ou un objet sélectionné dans un paragraphe à l’aide de nouvelles balises. Par exemple, si vous sélectionnez une section de texte dans un paragraphe, puis une balise <b> dans Visual Tag Editor, GoLive insère une balise ouvrante <b> au début de la sélection et une balise fermante </b> à la fin. Vous pouvez aussi sélectionner du texte et un objet (tel qu’un module externe) dans un paragraphe, puis les encadrer à l’aide des balises <noembed> et </noembed>. Pour encadrer une sélection avec des balises : 1 Dans l’éditeur de mise en page, sélectionnez une section de texte avec ou sans objet dans un paragraphe unique. 2 Choisissez Spécial > Visual Tag Editor. 3 Effectuez l’une des opérations suivantes : •
L’éditeur de structure présente les éléments HTML sous forme d’arborescence. Il vous permet de générer un code source clair et correct sans devoir le saisir. Vous sélectionnez des éléments et des attributs dans un menu contextuel, les faites glisser de la fenêtre du site ou de la palette Objets vers l’éditeur de structure et utilisez le bouton d’affectation pour lier les documents et les images. Vous pouvez créer des documents à partir du panneau de travail, affiner votre code et faire glisser des éléments vers l’éditeur de structure pour les déplacer rapidement avec leur contenu dans votre document. Lorsque des erreurs sont détectées au cours de la vérification de la syntaxe de votre document, l’éditeur de structure affiche une description de chaque erreur près de l’élément concerné et vous permet de la localiser dans votre document. (Voir « Vérification de la syntaxe », page 440.) Tout en utilisant l’éditeur de structure, vous pouvez mettre en évidence l’ensemble des liens rompus et des références de fichiers incorrectes (en rouge, par défaut) à l’aide du bouton Avertissements associés aux liens de la barre d’outils. Remarque : L’éditeur de structure ne peut être utilisé que si le module Outline Mode est activé dans les préférences des modules. (Voir « Définition des préférences relatives aux modules », page 68.) Comment utiliser l'aide | Sommaire | Index
Vous pouvez faire glisser des éléments HTML fréquemment utilisés de la palette Objets vers l’éditeur de structure, comme vous le feriez dans l’éditeur de mise en page. Après avoir ajouté un élément, vous pouvez modifier ses attributs.
La structure qui apparaît lorsque vous créez ou visualisez un document dans l’éditeur de structure contient tous les éléments essentiels d’un document HTML. Vous pouvez l’utiliser comme modèle et la compléter avec votre contenu personnel. •
Effectuez l’une des opérations suivantes : •
Pour déplacer des éléments dans l’éditeur de structure : Faites glisser la poignée de l’élément vers un autre endroit de la structure. GoLive affiche alors une ligne horizontale pour indiquer le nouvel emplacement de l’élément.
1 Dans l’éditeur de structure, sélectionnez l’élément HTML existant situé directement audessus de l’emplacement où vous souhaitez ajouter un nouvel élément. Par exemple, pour ajouter un paragraphe sous un tableau, sélectionner le tableau. 2 Pour ajouter un élément au même niveau de l’arborescence HTML que la sélection, effectuez l’une des opérations suivantes : •
Choisissez ensuite un élément dans le sous-menu Syntaxe. Deux zones rectangulaires représentant les balises ouvrante et fermante de l’élément sont ajoutées à la suite de la balise fermante de l’élément précédemment sélectionné. Le sous-menu Syntaxe est particulièrement utile pour ajouter des éléments aux documents devant respecter un DTD XML.
Choisissez ensuite un élément dans le sous-menu Insérer un élément. Vous pouvez également choisir Tout élément dans ce sous-menu, puis saisir le nom du nouvel élément dans la zone de texte. L’élément est ajouté après la balise fermante de l’élément précédemment sélectionné.
Elément de la barre d’outils. Saisissez ensuite le nom du nouvel élément dans la zone de texte. L’élément est ajouté après la balise fermante de l’élément précédemment sélectionné.
L’élément est ajouté entre les balises ouvrante et fermante de l’élément précédemment sélectionné.
Choisissez ensuite un élément dans le sous-menu Insérer un élément. Vous pouvez également choisir Tout élément dans ce sous-menu, puis saisir le nom du nouvel
Elément de la barre d’outils. Saisissez ensuite le nom du nouvel élément dans la zone de texte. L’élément est ajouté entre les balises ouvrante et fermante de l’élément précédemment sélectionné.
Vous pouvez perfectionner l’aspect de votre document en ajoutant des attributs à un élément. Les attributs déterminent la façon dont l’élément apparaît dans le navigateur. De nombreux éléments prennent en charge les attributs pour préciser des instructions de formatage spécifiques, telles que l’alignement, la couleur et les chemins d’accès aux fichiers ressource. Pour ajouter un attribut : 1 Dans l’éditeur de structure, sélectionnez l’élément auquel vous souhaitez ajouter un attribut. 2 Effectuez l’une des opérations suivantes : •
Remarque : Si vous n’êtes pas certain que le nom d’un attribut est correct, consultez le site Web du W3C (World Wide Web Consortium) à l’adresse : www.W3.org. 3 Pour spécifier la valeur de l’attribut, effectuez l’une des opérations suivantes : •
échantillon et un code de couleur sont affichés à droite de son nom. Cliquez sur la case échantillon, puis faites glisser une couleur de la palette de couleurs vers la case échantillon.
Pour afficher le contenu de fichiers image dans l’éditeur de structure, cochez la case Images dans la palette Afficher. Si vous avez spécifié des images à faible résolution dans le panneau Avancé de l’inspecteur d’image, vous pouvez les afficher dans l’éditeur de structure en cochant la case Faible résolution dans la palette Afficher.
Une fois que vous avez inséré un élément, vous pouvez utiliser l’éditeur de structure pour ajouter son contenu, tel que le texte qui doit être affiché dans le document. Par exemple, vous pouvez saisir un texte d’en-tête dans un élément h1. Il est également possible d’ajouter un commentaire pour l’élément ; le texte correspondant est enregistré mais pas affiché dans votre document lors de la consultation dans une fenêtre de navigateur. Les commentaires permettent, entre autres, de stocker des informations qui serviront à modifier les documents ultérieurement, par exemple si vous souhaitez incorporer des fonctions avancées qui nécessitent d’importantes informations de fond. Pour ajouter du texte ou un commentaire : 1 Dans l’éditeur de structure, sélectionnez un élément HTML situé directement au-dessus de l’emplacement où vous souhaitez ajouter du texte ou un commentaire. 2 Effectuez l’une des opérations suivantes : •
Texte ou Commentaire de la barre d’outils. Vous pouvez également choisir Ajouter un élément après > Insérer du texte ou Ajouter un élément après > Insérer un commentaire dans le menu contextuel.
3 Saisissez votre texte ou commentaire dans la zone de texte. Si vous interrompez momentanément la saisie et désélectionnez la zone de texte, vous pouvez reprendre en positionnant curseur dans la zone de texte. Remarque : Les commentaires sont grisés dans l’éditeur de structure afin de vous rappeler qu’ils n’apparaîtront pas dans votre document. Vous pouvez néanmoins les sélectionner et les modifier.
Vous pouvez ajouter un élément générique contenant du code non-HTML dans votre document. Par exemple, il est possible d’insérer un élément générique contenant le code ASP. Pour ajouter un élément générique : 1 Dans l’éditeur de structure, sélectionnez un élément situé directement au-dessus de l’emplacement où vous souhaitez ajouter l’élément générique. 2 Effectuez l’une des opérations suivantes : •
3 Cliquez sur le triangle de sous-type et choisissez un sous-type pour l’élément générique, tel que ASP, dans le menu.
Activation/Désactivation du format binaire Vous pouvez activer ou désactiver le format binaire des balises afin de déterminer si une nouvelle balise dispose ou non d’une balise fermante complémentaire. La majorité des balises sont des balises binaires, ou conteneurs. Le contenu d’un élément est encadré par deux balises, l’une ouvrante, l’autre fermante. Par défaut, GoLive affiche les deux parties d’une balise binaire. Toutefois, certaines balises (appelées balises unaires) n’ont pas besoin de balise fermante. La plus fréquente est la balise <img> qui sert à incorporer des images. Vous pouvez activer et désactiver le format de balise binaire uniquement pour l’élément actuellement sélectionné. Pour activer et désactiver le format binaire : 1 Dans l’éditeur de structure, sélectionnez un élément doté de balises binaires. 2 Effectuez l’une des opérations suivantes : •
<body bgcolor=red> ou <body text="black" bgcolor="red">. En revanche, le panneau Elément comprend le langage HTML et peut détecter ces variations. Il vous permet en outre d’ajouter, de supprimer ou de modifier très rapidement les attributs d’éléments existants, de supprimer le contenu d’éléments et de remplacer le texte contenu dans un élément. Ce panneau devient dès lors un outil très performant pour rechercher et manipuler des éléments dans un document ou sur la la totalité d’un site. Le panneau Elément de la boîte de dialogue Rechercher se compose de trois zones : •
1 Choisissez Edition > Rechercher et cliquez sur l’onglet Elément dans la boîte de dialogue Rechercher. 2 Une fois la fenêtre du site ouverte, spécifiez les critères de recherche des éléments dans la zone de recherche du panneau Elément. •
4 Définissez l’étendue de votre recherche en effectuant l’une des opérations suivantes : •
Le panneau Elément vous permet non seulement de rechercher des éléments, mais aussi de les manipuler de différentes manières grâce aux options du menu contextuel dans la zone d’action. Conserver l'élément Cette option permet de conserver l’élément et de définir, de mettre à jour ou de supprimer son attribut. Renommer l'élément Cette option permet de renommer l’élément tout en conservant son contenu. Vous pouvez modifier ou conserver les attributs grâce à une opération Attribut. Supprimer l'élément Cette option permet de supprimer définitivement l’élément, y compris ses balises ouvrante et fermante, ainsi que son contenu. Remplacer l’élément par son contenu Cette option permet de supprimer les balises ouvrante et fermante de l’élément sans toutefois modifier son contenu. Supprimer uniquement le contenu Cette option permet de supprimer le contenu de l’élément, tout en conservant les balises ouvrante et fermante.
1 Définissez les critères et l’étendue de recherche selon la procédure décrite dans la section « Recherche d’éléments », page 455. 2 Choisissez Conserver l’élément dans le menu contextuel situé en haut de la zone d’action. 3 Cliquez sur Créer pour générer une nouvelle action Attribut. 4 Sélectionnez Définir, Mettre à jour ou Supprimer dans le menu contextuel situé en bas de la zone d’action. •
à l’élément sélectionné dans la zone de recherche du panneau Elément.) 6 Saisissez la valeur de l’attribut dans la zone de texte Valeur ou sélectionnez une valeur dans le menu situé à droite de la zone de texte. 7 Effectuez l’une des opérations suivantes : •
2 Effectuez l’une des opérations suivantes : •
Nouveau nom. (Vous pouvez au besoin créer des actions Attribut en rapport avec une action Renommer l’élément.)
3 Effectuez l’une des opérations suivantes : •
1 Définissez les critères et l’étendue de recherche selon la procédure décrite dans la section « Recherche d’éléments », page 455. 2 Choisissez Supprimer uniquement le contenu dans le menu contextuel situé en haut de la zone d’action. 3 Effectuez l’une des opérations suivantes : •
Cliquez ensuite sur Vérifier pour appliquer l’opération au reste des fichiers de la liste dans la zone de filtrage.
Lorsque vous avez spécifié les paramètres d’une tâche de recherche dans le panneau Elément, vous pouvez les enregistrer en vue d’une utilisation ultérieure.
3 Cliquez sur Enregistrer. Pour réexécuter une tâche enregistrée : 1 Choisissez Parcourir dans le menu Tâche situé sous le bouton Enregistrer. 2 Sélectionnez la tâche souhaitée et cliquez sur Ouvrir. 3 Sélectionnez le ou les fichiers auxquels vous souhaitez appliquer la tâche dans la zone de filtrage du panneau Elément et cliquez sur Vérifier.
HTML est un langage qui ne cesse d’évoluer justifiant par là même la création de nouveaux éléments. Afin d’avoir la certitude que vos documents sont toujours actuels et utilisent la technologie la plus récente, vous pouvez utiliser l’icône Balise pour insérer des balises d’emplacement pour les éléments que GoLive ne reconnaît pas. Cette icône vous permet également d’empêcher GoLive d’analyser ou modifier votre code source. Lorsque vous faites glisser l’icône Balise de la palette Objets vers la fenêtre du document, GoLive ajoute des balises ouvrante et fermante <noedit> et </noedit> à votre code source, puis insère une balise d’emplacement au sein de votre document dans l’éditeur de mise en page. Vous pouvez saisir le code que vous ne souhaitez pas voir analysé dans le panneau contenu de l’inspecteur de balise. GoLive l’insère entre les balises <noedit> sans le modifier. Pour ajouter un élément inconnu : 1 Dans l’éditeur de mise en page, faites glisser l’icône Balise du panneau Standard de la palette Objets vers la fenêtre du document.
3 Cliquez sur le bouton Nouvel élément situé en bas de l’inspecteur d’élément. (Les zones de texte situées en dessous de la zone de liste sont activées.) 4 Saisissez un nom d’attribut dans la zone de texte gauche, puis une valeur d’attribut dans la zone de texte droite.
2 Dans le panneau Contenu de l’inspecteur de balise, saisissez le code source. Vous pouvez vérifier le code dans l’éditeur ou le panneau de code source.
La prise en charge intégrée GoLive de JavaScript et de JScript vous permet de rendre vos documents interactifs, de vérifier le contenu de formulaires, d’améliorer l’affichage et de gérer le navigateur de manière dynamique. L’éditeur JavaScript offre la possibilité de créer des scripts dans l’application, de les incorporer dans le document et de les tester immédiatement en lançant le navigateur cible. Pour faciliter l’ajout de scripts JavaScript, GoLive fournit une liste complète de blocs fonctionnels pour tous les dialectes et versions principaux de JavaScript. Chaque fois que vous faites glisser une icône Script de la palette Objets vers la section d’en-tête, vous spécifiez l’application cible dans l’inspecteur qui configure en conséquence l’éditeur JavaScript. Cette fonction, en combinaison avec l’identification des navigateurs par JavaScript, facilite la création de documents destinés à plusieurs plates-formes. Important : Tous les navigateurs ne mettent pas en oeuvre les scripts JavaScript de la même façon. Vous devez donc tester l’ensemble des scripts JavaScript sur tous vos navigateurs cible. Pour vous familiariser avec l’environnement JavaScript dans GoLive, vous pouvez saisir des expressions JavaScript dans la fenêtre Shell JavaScript. Cette fenêtre contient une ligne de commande vous permettant de communiquer de manière interactive avec le moteur JavaScript intégré à GoLive. Pour plus de détails sur l’utilisation de la fenêtre Shell JavaScript, consultez la documentation SDK.
Vous pouvez ajouter des scripts JavaScript à votre document. Vous avez également la possibilité d’insérer ces scripts dans la section d’en-tête de la fenêtre du document pour qu’un script soit exécuté pendant le chargement de la partie visible du document. Pour définir un script JavaScript : 1 Effectuez l’une des opérations suivantes : •
JavaScript qui se trouve dans le coin supérieur droit de la fenêtre du document. Cliquez ensuite sur le bouton Créer un script de la barre d’outils dans l’éditeur JavaScript.
3 Dans l’inspecteur, saisissez un nom descriptif dans la zone de texte Nom. Choisissez un navigateur cible dans le menu contextuel Langage. La version du langage correspondant à celle de votre navigateur s’affiche dans la zone de texte située sous le menu. 4 Pour référencer un fichier de script externe (extension .js uniquement), effectuez l’une des opérations suivantes : •
Pour modifier un script JavaScript existant : 1 Pour ouvrir l’éditeur JavaScript, effectuez l’une des opérations suivantes : •
. 3 Cliquez sur l’onglet Evénements de l’inspecteur JavaScript pour afficher la liste des objets auxquels des événements peuvent être associés, ainsi que celle des événements pris en charge. Pour ajouter un événement au script, sélectionnez-le dans l’inspecteur et saisissez le code dans la zone de texte Evénement.
Dans le panneau Script de l’inspecteur JavaScript, cliquez sur une déclaration de fonction dans la liste Fonctions pour afficher directement cette fonction dans le script. 5 Fermez l’éditeur JavaScript pour enregistrer votre travail. 6 Pour ouvrir la page Web dans le navigateur défini pour l’aperçu et le test dans la boîte de dialogue Préférences, effectuez l’une des opérations suivantes : •
JavaScript dans l’éditeur JavaScript. Le panneau de prévisualisation de la boîte de dialogue Préférences vous fournit un aperçu du résultat des options sélectionnées sur le code.
1 Choisissez Edition > Préférences, puis cliquez sur l’icône JavaScript. 2 Pour contrôler le fonctionnement de l’éditeur JavaScript, définissez les préférences suivantes : •
1 Choisissez Edition > Préférences, puis cliquez sur Police dans l’arborescence de l’élément JavaScript. 2 Sélectionnez une police, sa taille et son style pour le code JavaScript. La police n’apparaît que dans l’éditeur JavaScript et non sur une page Web. 3 Cliquez sur OK. Pour définir les préférences de mise en évidence de la syntaxe : 1 Choisissez Edition > Préférences, puis cliquez sur Couleurs dans l’arborescence de l’élément JavaScript. 2 Cochez la case Activer la mise en évidence de la syntaxe pour définir l’apparence par défaut des différents éléments de code dans l’éditeur JavaScript. 3 Pour associer une autre couleur à un élément de code, cliquez sur la case échantillon de cet élément, sélectionnez une autre couleur et cliquez sur OK dans la boîte de dialogue Couleur. 4 Cliquez sur OK. Pour définir les préférences d’impression : 1 Choisissez Edition > Préférences, puis cliquez sur Impression dans l’arborescence de l’élément JavaScript. 2 Pour obtenir une version imprimée de votre code source JavaScript différente de la version consultée en ligne dans l’éditeur JavaScript, sélectionnez les préférences suivantes : •
(ne présente un intérêt que si vous disposez d’une imprimante couleur), les caractères gras ou la numérotation des lignes.
Utilisation de macros de texte avec les éditeurs de code source Les macros de texte peuvent vous faire gagner du temps si vous utilisez souvent l’éditeur de code source et l’éditeur JavaScript. Elles vous épargnent la saisie de longues chaînes de code source dans le cas des balises et des éléments de script répétés.
éditeur de GoLive. Ce fichier est l’emplacement par défaut des macros de texte de GoLive.
Pour insérer un code source automatisé, saisissez le nom de la macro et appuyez sur Maj + Ctrl + M (Windows) ou Majuscule + Commande + M (Mac OS). Ce faisant, vous introduisez la macro identifiée par le mot situé derrière ou sous le curseur de texte, à condition que ce terme existe dans le fichier macro source par défaut ou dans le fichier macro source de l’éditeur que vous utilisez. Les macros de texte ne sont pas concernées par la casse, si bien que vous pouvez saisir leurs noms en minuscules, en majuscules ou en combinant les deux.
Afin de définir les macros de texte, ouvrez le fichier macro source souhaité dans GoLive ou dans un éditeur de texte, puis saisissez, copiez et collez, ou encore faites glisser le code approprié. Les macros de texte doivent être définies selon le format suivant : MacroName [Delimiter]MacroContent[Delimiter]
A l’exception des espaces et des tabulations, vous pouvez utiliser toutes les combinaisons de caractères. Il est néanmoins conseillé de se limiter aux lettres et aux chiffres. Les éditeurs de code source se distinguent par leur définition d’un mot autonome. Par exemple, le symbole du dollar ($) dans le nom d’une macro sera accepté dans l’éditeur de code source, mais pas dans l’éditeur JavaScript, car ce caractère fait partie intégrante de sa syntaxe. Séparé par un espace, le second élément définit le contenu de la macro. Il s’agit du texte inséré après avoir saisi le nom et appuyé sur Maj + Ctrl + M (Windows) ou Majuscule + Commande + M (Mac OS). L’élément de contenu doit être situé entre deux délimiteurs identiques ou complémentaires. Lorsque vous demandez à GoLive d’insérer une macro de texte, l’interpréteur considérera le premier caractère après l’espace comme le délimiteur et recherchera un caractère identique pour déterminer la fin du contenu.
Ci-après un exemple d’utilisation incorrecte des délimiteurs : image « <img "src=../GIFS/???.GIF" width="20" height="20"> »
à (<) et supérieur à (>) qui entourent les balises HTML.
L’outil de création d’une macro de texte de GoLive sélectionne généralement l’élément complet à insérer. Cependant, afin d’accélérer le processus, vous pouvez également placer le point d’insertion ou sélectionner le texte à écraser à n’importe quel endroit de l’élément à insérer. Positionnez le point d’insertion dans l’élément en ajoutant une « barre verticale » (« | »). Par exemple : image « <img "src=|" width="20" height="20">" »
Afin de sélectionner le texte à écraser, entourez le mot ou la chaîne balise de guillemets simples. Par exemple : image « <img "src=../GIFS/'???'.GIF " width="20" height="20">" »
Vous pouvez utiliser trois caractères de commande pour préciser ce qui se passe lors de l’insertion d’une macro de texte : •
La fenêtre de visualisation, l’éditeur de montage, le panneau QuickTime de la palette Objets et l’inspecteur sont les principaux outils d’édition de séquences. La fenêtre de visualisation est dotée des panneaux Aperçu et Mise en page permettant, respectivement, de visualiser et d’éditer des séquences. L’éditeur de montage permet d’assembler des pistes de séquence, de définir leur comportement et de gérer leur interaction. Le panneau QuickTime de la palette Objets contient les icônes des pistes nécessaires au montage des séquences. La modification des propriétés et des comportements des pistes est réalisée dans l’inspecteur.
La fenêtre de visualisation comporte deux panneaux : le premier pour prévisualiser et le second pour mettre en page et modifier les séquences.
« Edition et prévisualisation de séquences dans la fenêtre de visualisation », page 473.)
L’éditeur de montage représente les pistes d’une séquence à l’aide de barres de montage, incluant notamment la durée de chaque piste et l’heure de début et de fin des pistes par rapport aux autres pistes. C’est dans l’éditeur de montage que la plupart des opérations de création et de contrôle des séquences sont réalisées. Pour insérer des pistes dans une séquence, faites glisser les icônes appropriées depuis le panneau QuickTime de la palette Objets jusque dans l’éditeur de montage. L’éditeur de montage permet également de définir des options dans les inspecteurs de pistes afin de modifier l’aspect et le comportement des pistes d’une séquence.
Vous avez la possibilité de créer une nouvelle séquence ou d’ouvrir une séquence existante. Quelle que soit l’opération choisie, la séquence est affichée dans la fenêtre de visualisation. Pour créer une nouvelle séquence : 1 Choisissez Fichier > Nouveau document spécial > Séquence QuickTime. La boîte de dialogue Nouvelle séquence QuickTime s’affiche. 2 Saisissez un nom dans la zone de texte Nom. 3 Effectuez l’une des opérations suivantes : •
1 Choisissez Fichier > Ouvrir, localisez le fichier séquence, puis ouvrez-le. La séquence s’ouvre dans le panneau Aperçu de la fenêtre de visualisation. 2 Cliquez sur le bouton Afficher la fenêtre de l’éditeur de montage afin d’afficher l’éditeur de montage dans lequel les pistes existantes associées à la séquence sont répertoriées.
La piste est l’élément de base pour la création d’une séquence QuickTime. Chaque type de piste contient des informations spécifiques. Par exemple, une piste vidéo est dotée d’un contenu vidéo et une piste son, d’un contenu audio. L’inspecteur de chaque piste permet de définir les options relatives à l’aspect et au comportement de la séquence, telles que l’heure de début, la durée, la taille, la position, la visibilité et autres comportements spécifiques. Vous trouverez ci-dessous la procédure à suivre pour insérer des pistes dans une séquence. Certaines pistes requiert cependant des informations supplémentaires ou la définition d’options non décrites dans cette section. Pour plus de détails sur chaque type de piste, consultez la section appropriée de ce chapitre ou de l'aide de GoLive. Pour insérer une piste dans une séquence : 1 Dans l’éditeur de montage, effectuez l’une des opérations suivantes : •
échantillons », page 480. Certains types de pistes (les pistes de texte, par exemple) permettent d’afficher différents contenus à différents moments de la séquence. Par exemple, une piste de texte peut afficher un mot pendant les 5 premières secondes d’une séquence, puis un mot différent pendant les 10 secondes suivantes. Les éléments conteneurs de ces différents contenus sont appelés échantillons. Lorsque vous insérez une piste utilisant des échantillons, GoLive crée automatiquement le premier échantillon par défaut. Vous avez la possibilité de créer des échantillons supplémentaires. Pour plus de détails sur la création d’échantillons, voir « Insertion et édition d’échantillons », page 482.
Lorsque vous créez une nouvelle séquence, GoLive y insère automatiquement une piste de couleur par défaut. Cette piste de couleur par défaut permet de spécifier une taille et une couleur de fond pour la séquence en fournissant une piste de contenu visible. (Si GoLive n’ajoutait pas de piste de couleur par défaut, la taille de la séquence serait nulle (en largeur et en hauteur) car elle n’aurait aucun contenu visible.) La piste de couleur par défaut permet de conserver la taille de fenêtre de visualisation (et donc de la séquence) définie dans la boîte de dialogue Nouvelle séquence QuickTime. Elle utilise la couleur de fond spécifiée.
Comme une séquence peut compter différents types de pistes dotées de contenu visible et que les pistes peuvent commencer à des moments quelconques de la séquence, les pistes sont superposées. Supposons, par exemple, qu’une séquence contienne une piste vidéo et une piste de couleur de mêmes tailles et dont la lecture commence simultanément dans la fenêtre de visualisation. Lorsque vous visualisez les deux pistes dans le lecteur QuickTime, la piste visible correspond à celle située en bas de la liste des pistes dans l’éditeur de montage. La piste du bas est en effet superposée à toutes les autres pistes dont la lecture commence en même temps et au même point dans la fenêtre de visualisation. (La couche inférieure est appelée layer 1 dans les propriétés du lecteur QuickTime.) Dans l’exemple précédent, si une piste de couleur est située sous la piste vidéo dans la liste des pistes, cette piste de couleur est superposée à la piste vidéo au moment de la visualisation de la séquence, ce qui rend la piste vidéo invisible. (Dans cet exemple, la piste de couleur n’est pas en mode de mélange translucide. Voir « Définition des propriétés standard des pistes et des échantillons », page 480.) Pour spécifier la superposition des couches dans l’éditeur de montage, déplacez-les par glissement vers le haut et vers le bas de la liste des pistes. Pour placer une couche plus en avant (c’est-à-dire superposée aux autres couches), faites-la glisser vers le bas de la liste. Lorsque vous insérez une piste, vous pouvez faire directement glisser l’icône de piste depuis la palette Objets directement vers l’emplacement souhaité dans la liste de pistes. Vous pouvez également définir la superposition dans le panneau Mise en page de la fenêtre de visualisation. (Voir « Utilisation de la barre d’outils du panneau Mise en page », page 474 et « Utilisation du menu Séquence dans la fenêtre de visualisation », page 475.)
La barre d’outils du panneau Mise en page de la fenêtre de visualisation propose plusieurs boutons permettant d’éditer des pistes dans des séquences. Vous pouvez modifier la position, la taille et la forme d’une piste en la faisant glisser dans le panneau Mise en page. Il est certes essentiel de pouvoir entrer les coordonnées numériques (comme vous le faites dans les inspecteurs), mais il est beaucoup plus facile de déplacer et de positionner les pistes en les faisant glisser dans le panneau Mise en page. Vous pouvez également repositionner et aligner les pistes à l’aide des palettes d’alignement et de transformation. Les menus de séquence et d’affichage du panneau Mise en page proposent également des options permettant de manipuler des séquences et d’afficher ou de masquer la grille et la règle dans le panneau Mise en page. Remarque : Si la fenêtre de la séquence est masquée ou réduite, vous pouvez l’afficher en cliquant dans l’éditeur de montage et en choisissant Séquence > Afficher la séquence.
Pour sélectionner une piste individuelle dans le panneau Mise en page : Activez le panneau Mise en page, puis effectuez l’une des opérations suivantes : •
Activez le panneau Mise en page, puis effectuez l’une des opérations suivantes : •
Pour repositionner une piste ou un groupe de pistes : Sélectionnez les pistes voulues et faites-les glisser dans l’onglet Mise en page ou précisez leur position horizontale et verticale dans la palette de transformation. Pour aligner des pistes par rapport à la fenêtre de la séquence : 1 Sélectionnez la piste ou le groupe de pistes à aligner. 2 Dans la palette d’alignement, sous Alignement sur le parent, sélectionnez un alignement horizontal ou vertical sous Alignement sur le parent. Pour aligner des pistes les unes par rapport aux autres : Sélectionnez les pistes dans le panneau Mise en page, puis sélectionnez un alignement dans la palette Alignement. Vous pouvez aligner les pistes le long de l’axe vertical droit, gauche ou central, ou le long de l’axe horizontal inférieur, supérieur ou central.
La barre d’outils du panneau Mise en page de la fenêtre de visualisation contient les boutons suivants : •
Le menu Séquence propose les commandes suivantes pour les onglets Aperçu et Mise en page : Afficher/Masquer l’éditeur de montage Active ou désactive l’affichage de l’éditeur de montage. Zoom Répertorie plusieurs commandes dans un sous-menu afin de réaliser un zoom avant ou arrière sur une séquence dans la fenêtre de visualisation. Configurer le texte (Windows)/Texte (Mac OS) Permet de définir les options de police pour un échantillon de texte lorsqu’une piste et un échantillon de texte sont sélectionnés. Sous Windows, choisissez Configurer le texte afin d’ouvrir la boîte de dialogue Police, puis définissez les options de police. Sous Mac OS, choisissez Texte, puis une option de sousmenu afin de définir les options de police. Piste > Premier plan/Piste > En avant Permet de positionner une piste au-dessus des autres pistes, c’est-à-dire au premier plan, ou de la déplacer couche par couche, de l’arrière-plan vers le premier plan. Piste > Vers l’arrière/Piste > Arrière-plan Permet de positionner une piste sous les autres pistes, c’est-à-dire à l’arrière-plan, ou de la déplacer couche par couche, du premier plan vers l’arrière-plan. Séquence actuelle Lit les séquences à leur taille maximum. Comment utiliser l'aide | Sommaire | Index
Définition des propriétés et annotation d’une séquence L’inspecteur de séquence fournit des informations techniques sur la séquence, telles que le nombre de pistes qu’il contient, sa durée, le débit des données (en secondes) pendant la lecture , ainsi que sa taille. Vous pouvez également définir des propriétés de base et annoter la séquence avec des informations, telles que les droits d’auteur et la date de création. Pour afficher l’inspecteur de séquence : Ouvrez l’inspecteur, puis activez le panneau Aperçu de la fenêtre de visualisation. Vous pouvez définir les propriétés suivantes dans le panneau Standard de l’inspecteur de séquence : Lecture automatique Entraîne la lecture automatique de la séquence lors de sa visualisation dans le lecteur QuickTime Player ou dans GoLive. Cette option n’a aucune incidence sur la lecture de la séquence dans une page Web par le module externe QuickTime. Si vous sélectionnez Lecture automatique, puis choisissez Aucun dans le menu déroulant Boucle, la séquence est lue une fois. Menu Boucle Dans le menu Boucle, choisissez le mode de lecture voulu pour la séquence. Choisissez Aucun pour lire la séquence une seule fois dans son intégralité. Choisissez Boucle pour lire la séquence dans son intégralité, du début à la fin et de façon répétée. Choisissez Palindrome pour lire la séquence entière en avant, puis en arrière, de façon répétée. Menu du contrôleur Dans le menu du contrôleur, choisissez un contrôleur de lecture adapté à votre séquence. Le type choisi doit être compatible avec le contenu de la séquence. Par exemple, QuickTime n’utilise pas de contrôleur QuickTime VR pour une séquence non dotée de contenu QTVR. Identifiant de séquence Si vous voulez attribuer un nom à la séquence afin de l’utiliser comme cible d’une action liée, sélectionnez Nom de la séquence, puis saisissez un nom dans la zone de texte. Pour attribuer un identifiant à la séquence, sélectionnez ID de séquence, puis saisissez une valeur numérique unique. Lorsque vous définissez la séquence cible d’une action liée (par exemple, Nom de la séquence enfant ou ID de la séquence enfant), utilisez le nom et l’ID de séquence spécifiés dans cette option. (Voir « Liaison de pistes de séquence à des actions », page 486.) Pour annoter une séquence : Activez le panneau Annotation de l’inspecteur de séquence, puis saisissez les informations voulues dans les zones de texte.
Pour définir les préférences de QuickTime : Choisissez Edition > Préférences, sélectionnez QuickTime dans le panneau de gauche de la boîte de dialogue des préférences, puis définissez les préférences dans le panneau de droite.
L’éditeur de montage permet d’insérer des pistes et des effets dans vos séquences QuickTime et également de les rendre interactives.
échantillons, telles que les pistes d’icônes animées et de texte. Pour plus de détails sur les échantillons, voir « Insertion et édition d’échantillons », page 482.
Informations sur la piste Vous pouvez afficher ou masquer les informations relatives aux pistes en cliquant sur le bouton Afficher/Masquer les informations sur la piste . Les colonnes affichent les informations suivantes : •
Cliquez sur l’icône d’oeil pour afficher ou masquer les pistes visuelles, ou pour activer ou désactiver la commande de veille pour les pistes sonores. En règle générale, les pistes masquées peuvent avoir une incidence sur les limites d’une séquence.
Liste des pistes Cette liste, située sur le côté gauche de l’éditeur de montage, répertorie les pistes de la séquence. Chaque barre de piste est identifiée par son nom (Piste vidéo 1, par exemple) ou, si un titre a été spécifié dans l’inspecteur correspondant, par son titre. Pour supprimer une piste, sélectionnez-la, puis choisissez Edition > Supprimer (Windows) ou Edition > Effacer (Mac OS). La position relative des pistes dans la liste des pistes détermine l’ordre de superposition d’une séquence. (Voir « Définition de la superposition des pistes », page 473.) Zone de contenu Cette liste, située sur le côté droit de l’éditeur de montage, affiche une barre (ou une image-clé dans le cas d’un échantillon d’icône animée) représentant le média de chaque piste. Le bord gauche de la barre marque l’heure de début et le bord droit l’heure de fin. L’image-clé indique l’heure de début de l’échantillon d’icône animée. (Voir « Insertion et édition d’échantillons », page 482.)
(jusqu’à un minimum d’une image) et allonger les barres de piste. Toute modification réalisée au niveau du curseur de l’échelle temporelle est enregistrée entre les sessions. L’échelle temporelle est définie par défaut sur 6 images par seconde. Curseur temporel Ce curseur contrôle le positionnement de l’image (ou du moment) active dans une séquence affichée dans le panneau Aperçu. Pour modifier l’image active, faites glisser le curseur temporel vers la gauche ou vers la droite, ou cliquez sur la règle temporelle. Avant d’insérer une nouvelle piste, positionnez le curseur temporel au point correspondant au début de la nouvelle piste.
Les pistes correspondent aux éléments de base des séquences QuickTime. GoLive propose un éventail d’outils facilitant l’insertion et l’édition de pistes et d’échantillons.
Vous pouvez copier-coller une ou plusieurs pistes d’une séquence à une autre à l’aide du presse-papiers. Pour copier-coller des pistes d’une séquence à une autre : 1 Dans la liste des pistes de l’éditeur de montage ou dans le panneau Mise en page de la fenêtre de visualisation, sélectionnez la ou les pistes à copier, puis choisissez Edition > Copier. 2 Dans l’éditeur de montage de la séquence dans laquelle vous voulez copier la piste, choisissez Edition > Coller. La nouvelle piste s’affiche dans l’éditeur de montage. 3 Vous pouvez renommer la piste en saisissant un nom dans la zone de texte Titre de l’inspecteur de piste ou en cliquant deux fois sur le nom de la piste dans la liste. Définissez ensuite les autres propriétés de la piste, selon vos besoins. Vous pouvez également exporter des pistes individuelles vers un fichier séquence pour utilisation dans d’autres séquences ou en tant que séquence autonome. (Voir « Exportation de séquences et de pistes », page 488.) Comment utiliser l'aide | Sommaire | Index
Régler sur l'heure de début de piste/d’échantillon la plus à gauche Cliquez sur ce bouton pour aligner les pistes ou les échantillons sélectionnés sur l’heure de début de l’élément le plus à gauche. Si vous ne sélectionnez pas l’option Régler la durée de l’échantillon/de la piste avant de cliquer sur ce bouton, GoLive aligne les éléments sans modifier leur durée. Régler sur l'heure de fin de piste/d’échantillon la plus à droite Cliquez sur ce bouton pour aligner les pistes ou les échantillons sélectionnés sur l’heure de fin de l’élément le plus à droite. Si vous ne sélectionnez pas l’option Régler la durée de l’échantillon/de la piste avant de cliquer sur ce bouton, GoLive aligne les éléments sans modifier leur durée. Régler la durée de la piste/de l'échantillon Sélectionnez cette option avant d’utiliser les boutons d’alignement si vous voulez modifier les durées des éléments plutôt que leurs heures de début et de fin. GoLive modifie les durées des éléments alignés sur l’heure de début la plus à gauche, plutôt que les heures de fin. De la même façon, le programme modifie les durées des éléments alignés sur l’heure de début la plus à droite, plutôt que les heures de fin. Passer à l’heure de début de la piste de base/Passer à l’heure de fin de la piste de base La piste de base correspond à la piste sur laquelle vous voulez aligner d’autres pistes. Choisissez la piste de base dans le menu Piste de base de l’inspecteur des pistes multiples. Cliquez sur le bouton Passer à l’heure de début de la piste de base pour aligner les heures de fin des autres pistes sélectionnées sur l’heure de début de la piste de base. Assurez-vous que le temps disponible avant la piste de base est suffisant pour les autres pistes sélectionnées. Par exemple, si la piste de base commence au marqueur 2 secondes d’une séquence, seules les pistes dont la durée est inférieure ou égale à 2 secondes peuvent être placées avant la piste de base. Cliquez sur le bouton Passer à l’heure de fin de la piste de base pour aligner les heures de début des autres pistes sélectionnées sur l’heure de fin de la piste de base.
Les inspecteurs de piste et d’échantillon permettent de définir les propriétés, de sélectionner des effets de filtre, de créer des actions d’icônes animées et de gérer les paramètres de mise en page. Il existe un inspecteur spécifique à chaque piste et échantillon. La plupart des propriétés standard suivantes sont disponibles pour les pistes vidéo et autres pistes visuelles (fichiers d’icônes animées, 3D, texte ou SWF, par exemple). Pour en savoir plus sur les propriétés non décrites dans cette section, reportez-vous à la section appropriée plus loin dans ce chapitre ou dans l’aide en ligne. Pour définir les propriétés standard des pistes et des échantillons : Après avoir inséré ou sélectionné une piste, définissez les propriétés suivantes dans le panneau Standard de l’inspecteur de piste : Titre Saisissez un nom pour la piste. Début et Durée Saisissez l’heure à laquelle vous voulez que votre piste commence et la durée d’exécution souhaitée. Comment utiliser l'aide | Sommaire | Index
échantillons (des actions d’images, par exemple) apparaisse à des moments précis de la séquence et si vous modifiez la durée de la piste d’icônes animées en sélectionnant l’option Répartir la durée de l’échantillon, tous les échantillons (images-clés) en seront également affectés. Cette procédure n’est pas recommandée, car elle pourrait modifier les paramètres temporels des échantillons d’icônes animées. Position Saisissez une valeur en pixels afin de positionner la piste sélectionnée horizontalement et verticalement. Vous pouvez, par exemple, placer deux pistes l’une à côté de l’autre en assignant à chaque piste une position différente. Taille Saisissez une valeur en pixels afin de définir la hauteur et la largeur de la piste sélectionnée. Lorsque vous modifiez la taille d’une piste, QuickTime utilise un facteur d’échelle afin de mettre cette piste à l’échelle. Normaliser la piste/Définir les dimensions de la piste Cliquez sur le bouton pour afficher un menu dotés des options Normaliser la piste et Définir les dimensions de la piste. Si la taille de la piste sélectionnée a été modifiée, vous pouvez choisir l’option Normaliser la piste pour en rétablir les paramètres d’origine et la replacer à sa position d’origine. Vous pouvez également choisir Définir les dimensions de la piste pour modifier la taille et la position d’origine de la piste et lui attribuer les taille et position actuelles. Conserver les proportions Permet de redimensionner la piste vidéo de manière proportionnelle. Ainsi, lorsque vous modifiez la valeur dans la zone de texte Largeur, la hauteur est adaptée afin de conserver l’aspect d’origine de la piste, et inversement. Mode Dans le menu Mode, choisissez la méthode de superposition voulue pour une piste vidéo : •
Type du panneau Standard est uniquement disponible pour les pistes de séquences. (Voir « Utilisation de pistes de séquences », page 484.) Les quatre modes suivants déterminent l’affichage du contenu alpha. Un canal alpha définit la manière dont une image est combinée à l’image de fond située à l’endroit où l’image doit être affichée. En définissant un canal alpha, vous précisez la partie d’une image visible devant être laissée de côté (le terme adéquat est « masquée ») de manière à faire apparaître une image de fond dans cette zone. •
échantillons, il n’est, à l’heure actuelle, pas possible de créer ou de modifier directement les échantillons audio ou vidéo. (Pour créer ou modifier un échantillon vidéo ou audio, utilisez une application d’édition vidéo ou audio, telle qu’Adobe Premiere.) Pour les pistes contenant des échantillons, GoLive crée automatiquement un échantillon par défaut lorsqu’une piste est insérée dans une séquence. Vous pouvez insérer des échantillons supplémentaires dans une piste ou modifier des échantillons existants.
échantillon existant. Les échantillons résultants ont des contenus identiques, mais leur durée est raccourcie en fonction du point de division. Après avoir sélectionné l’outil Diviser l’échantillon, cliquez sur l’échantillon existant au point division souhaité. Par exemple, si vous divisez un échantillon de 25 secondes au niveau du marqueur 10 secondes, vous créez un échantillon de 10 secondes et un autre de 15 secondes. Vous pouvez ensuite faire glisser chacun de ces échantillons vers l’intervalle de temps voulu et modifier leur contenu selon le besoin. Outil Unir des échantillons L’outil Unir des échantillons permet de faire coïncider l’heure de fin d’un échantillon avec l’heure de début de l’échantillon suivant s’il existe un écart entre eux. Après avoir sélectionné l’outil Unir des échantillons, cliquez sur le premier échantillon. GoLive prolonge le premier échantillon jusqu’à l’heure de début de l’échantillon suivant. Outil Supprimer l’échantillon L’outil Supprimer l’échantillon permet de supprimer un échantillon (ou une image-clé d’icône animée). Après avoir sélectionné l’outil Supprimer l’échantillon, cliquez sur l’échantillon à supprimer. Outil Inverser les échantillons L’outil Inverser les échantillons permet d’inverser deux échantillons adjacents. Vous pouvez, par exemple, modifier l’ordre des images d’une piste d’image en inversant ses échantillons d’images. Après avoir sélectionné l’outil Inverser les échantillons, faites glisser l’échantillon à inverser vers l’échantillon adjacent.
Une piste de séquence permet d’incorporer un fichier vidéo numérique (ou tout autre fichier pris en charge par QuickTime) stocké sur le Web en référençant l’URL du fichier. Les options de piste de séquence vous permettent de contrôler la méthode d’affichage du fichier incorporé, ainsi que son comportement au sein de la séquence racine. La séquence racine correspond à la séquence « de niveau supérieur » contenant toutes les autres pistes. Si la piste de séquence contient d’autres pistes de séquences, la séquence racine est située à la racine de la structure des séquences imbriquées. Remarque : Un fichier incorporé dans une piste de séquence ne fait pas partie de la séquence racine lors de l’aplatissement de la séquence. Le fichier incorporé doit être stocké au niveau de l’URL référencé pour que la séquence racine puisse l’afficher. Pour insérer une piste de séquence dans votre séquence, faites glisser une icône de piste de séquence du panneau QuickTime de la palette Objets vers la zone de contenu de l’éditeur de montage. (Voir « Insertion de pistes dans une séquence », page 471.) Insérez la piste de séquence, puis saisissez l’URL complet du fichier incorporé dans la zone de texte Lien du panneau URL de l’inspecteur de piste de séquence. Vous pouvez également spécifier un fichier de votre fenêtre de site à importer à l’aide du bouton d’affectation, localiser un fichier vidéo local à l’aide du bouton Parcourir ou choisir un fichier ayant déjà été sélectionné dans le menu URL, accessible en cliquant sur la flèche vers la droite afférente à la zone de texte Lien. Suivez ensuite les instructions de cette section pour définir des options supplémentaires dans l’inspecteur de piste de séquence.
Pour plus de détails sur la définition des propriétés standard d’une piste de séquence, voir « Définition des propriétés standard des pistes et des échantillons », page 480. Il n’est pas possible de choisir des options dans le menu Mode du panneau Standard de l’inspecteur de piste de séquence. Cependant, vous pouvez, en plus des autres propriétés communes du panneau Standard, utiliser le menu Type pour définir les options suivantes. Ces options permettent de déterminer comment le fichier incorporé doit être affiché au sein de la séquence racine : Aucun Affiche le fichier incorporé sans que les pistes situées en dessous ne soient modifiées. Défilement Fait défiler le fichier incorporé dans le cas où son contenu dépasse les limites de sa piste de séquence. Remarque : La version 5.0.2 de QuickTime ne prend pas en charge la fonction Défilement. (Pour plus de détails, voir le site Web d’Apple QuickTime.) Tant que QuickTime ne prend pas en charge la fonction Défilement, les pistes de séquences des séquences QuickTime ne
Remplissage Réduit ou agrandit le fichier incorporé afin de remplir la piste de séquence, mais sans conserver les proportions du fichier, ce qui peut résulter en une séquence à l’aspect étiré. GoLive met à l’échelle le fichier incorporé de façon qu’il remplisse complètement la piste, et ce, sans modifier la taille de la piste. Remplissage complet Réduit ou agrandit le fichier incorporé de façon qu’il tienne complètement dans la piste de séquence. Les proportions du fichier sont conservées. Redimensionnement partiel Réduit ou agrandit les dimensions du fichier incorporé de façon proportionnelle afin que la dimension la plus petite soit complètement visible, ce qui peut entraîner la troncature de la dimension la plus grande.
Vous pouvez sélectionner les options suivantes dans le panneau URL de l’inspecteur de piste de séquence : Lien Spécifie l’URL du fichier incorporé. Redimensionner la zone de piste Redimensionne la piste de séquence de façon à l’ajuster à la taille du fichier incorporé. Si cette option n’est pas sélectionnée, GoLive met le fichier incorporé à l’échelle par rapport à la taille de la piste de séquence définie dans le panneau Standard de l’inspecteur de piste de séquence. Propriétés de la séquence Cliquez sur le bouton Propriétés de la séquence pour que GoLive tente d’utiliser l’URL de la piste de séquence afin d’obtenir les attributs de la séquence, parmi lesquels la taille et la durée de la séquence. Délai d'attente Choisissez une durée dans le menu Délai d’attente afin de spécifier quand GoLive doit arrêter ses tentatives de connexion à un serveur d’enchaînement. Ce paramètre est uniquement appliqué lorsque vous travaillez dans GoLive et non pas lorsque la séquence est visualisée dans un navigateur Web.
Vous pouvez définir les options supplémentaires suivantes dans le panneau Avancé de l’inspecteur de piste de séquence : Temps secondaire Empêche la lecture du fichier incorporé tant que la séquence racine n’a pas atteint l’heure de début du fichier. Le fichier incorporé est contrôlé par le montage de la séquence racine, c’est-à-dire qu’il est lu de la même manière qu’une piste autre que de séquence. Si la durée du fichier incorporé est plus longue que la durée de la piste de séquence à laquelle il est associé, cette option permet également d’arrêter la séquence lorsque la fin de la piste de séquence est atteinte. Lecture automatique Définit la piste de séquence de façon qu’elle soit lue automatiquement lorsqu’un navigateur Web charge le fichier incorporé, même si la séquence racine n’est pas en cours de lecture. Audio secondaire Ignore les éléments audio du fichier incorporé et utilise à leur place les éléments audio de la séquence racine.
Boucle Dans le menu Boucle, choisissez le mode de lecture voulu pour le fichier vidéo incorporé. Choisissez Aucun pour lire le fichier vidéo une seule fois dans son intégralité. Choisissez Boucle pour lire de façon répétée le fichier vidéo dans son intégralité si l’option Lecture automatique est activée, mais pas Temps secondaire. Choisissez Palindrome pour lire le fichier vidéo dans son intégralité et de façon répétée, en avant, puis en arrière. Couleur de fond Définit la couleur de fond affichée dans la zone de piste de séquence pendant le téléchargement du fichier incorporé ou lorsque le fichier incorporé ne peut pas être chargé. Activer le temps de troncature Permet de spécifier une section du fichier incorporé à lire. Saisissez une heure de début dans la zone de texte Début de la troncature et une durée dans la zone de texte Durée de troncature.
Dans le panneau Actions de l’inspecteur de piste de séquence, vous pouvez définir une ou plusieurs actions supplémentaires à déclencher à la fin du chargement de la séquence incorporée. Par exemple, vous pouvez utiliser l’action Activer/Désactiver une piste pour afficher une piste de texte dans la séquence racine, telle que Lecture possible, après le chargement de la séquence incorporée. Pour lier une piste de séquence à des actions : 1 Sélectionnez la piste de séquence dans l’éditeur de montage, puis activez le panneau Actions de l’inspecteur de piste de séquence. 2 Dans le panneau Actions, sélectionnez l’événement Séquence chargée dans la zone de liste Evénements, puis cliquez sur le bouton Nouvel élément , situé en dessous de la zone de liste Actions. Le symbole « • » s’affiche a droite de l’événement Séquence chargée pour indiquer que cet événement est actif. 3 Dans le menu contextuel situé sous les listes Evénements et Actions, choisissez une action (Atteindre l’URL, par exemple), puis définissez ses propriétés selon le besoin sous le menu contextuel. Pour plus de détails sur les actions du menu contextuel, voir « Gestion des pistes à l’aide d’actions », page 499. 4 Cliquez sur Appliquer. Vous pouvez lier la piste de séquence à des actions supplémentaires.
Pour insérer une piste vidéo dans votre séquence, faites glisser une icône de piste vidéo du panneau QuickTime de la palette Objets vers la zone de contenu de l’éditeur de montage. (Voir « Insertion de pistes dans une séquence », page 471.) Lorsque vous sélectionnez un fichier pour l’icône de piste vidéo, vous avez le choix entre les fichier suivants : •
GoLive insère uniquement la première piste vidéo (ou autre piste visuelle) dans la séquence. La première piste d’un fichier séquence est positionnée en haut de la liste de pistes de l’éditeur de montage. Ne confondez cependant pas la première piste vidéo avec la couche supérieure (appelée layer 1) de la séquence, qui est située en bas de la liste des pistes.
Au premier enregistrement d’une séquence, GoLive aplatit automatiquement cette séquence afin d’y copier toutes les données référencées et de la rendre autonome. Avant que la séquence ne soit aplatie, les pistes contiennent des références à des données, mais pas les données. Pour éviter les problèmes de données manquantes au moment de l’ouverture d’une page Web contenant votre séquence par un programme de visualisation, GoLive aplatit la séquence pour le Web. (Après aplatissement, le volume du fichier séquence augmente, car il contient l’intégralité des données.) Remarque : GoLive aplatit les séquences automatiquement lors de leur premier enregistrement uniquement. Si vous voulez aplatir une séquence par la suite, choisissez Séquence > Aplatir la séquence pour réaliser l’aplatissement de façon manuelle ou Fichier > Enregistrer sous pour enregistrer la séquence sous un nouveau nom. Notez également qu’un fichier incorporé dans une piste de séquence ne fait pas partie de la séquence racine lorsque la séquence est aplatie. (Voir « Utilisation de pistes de séquences », page 484.)
Vous pouvez exporter des séquences vers un type de fichier différent de l’original (un fichier AVI, par exemple) ou vers une séquence d’enchaînement RTSP (Runtime Streaming Protocol) pour utilisation sur un serveur d’enchaînement RTSP. Pour en savoir plus sur les séquences d’enchaînement RTSP, voir « Utilisation de pistes d’enchaînement », page 504. Vous pouvez utiliser un compresseur différent lorsque vous exportez une séquence vers un type de fichier différent. Il est également possible d’exporter une piste individuelle en tant que séquence. Remarque : Avant d’exporter une séquence vers une séquence d’enchaînement RTSP, consultez la documentation QuickTime relative à la préparation des fichiers séquence pour l’enchaînement RTSP. Pour exporter une séquence ou une piste : 1 Effectuez l’une des opérations suivantes : •
3 Pour sélectionner les paramètres de compression de la séquence, cliquez sur Options, puis sur Configuration. Sélectionnez les paramètres de compression dans la boîte de dialogue correspondante, puis cliquez deux fois sur OK. 4 Dans la boîte de dialogue d’enregistrer du fichier exporté, sélectionnez le dossier cible, puis cliquez sur Enregistrer. Pour exporter une séquence en tant que séquence d’enchaînement RTSP : 1 Choisissez Séquence > Exporter comme séquence d’enchaînement, nommez le fichier, sélectionnez le dossier cible, puis cliquez sur Enregistrer. 2 Sélectionnez les options dans la boîte de dialogue des paramètres d’exportation d’indications, puis cliquez sur OK. Pour plus de détails sur les options de cette boîte de dialogue, consultez la documentation QuickTime.
Une piste de couleur ajoute une couche de couleur à la fenêtre de la séquence. Pour insérer une piste de couleur dans votre séquence, faites glisser une icône de piste de couleur du panneau QuickTime de la palette Objets vers la zone de contenu de l’éditeur de montage. (Voir « Insertion de pistes dans une séquence », page 471.)
Utilisez une piste d’image pour créer un diaporama ou intégrer une série d’images fixes dans une séquence QuickTime. Vous pouvez définir la durée d’affichage de chaque image et sélectionner des effets spéciaux, tels que l’effet de dissolution, pour les transitions entre les différentes images. Vous avez également la possibilité de définir le nombre de répétitions en boucle des images. Pour insérer une piste d’image dans votre séquence, faites glisser une icône de piste d’image du panneau QuickTime de la palette Objets vers la zone de contenu de l’éditeur de montage. (Voir « Insertion de pistes dans une séquence », page 471.)
Après avoir inséré une piste d’image, définissez les propriétés des images et importez des images dans la piste d’image en vous aidant des informations de cette section. Chaque image importée devient un échantillon d’image. Lorsque vous insérez la piste d’image, GoLive crée automatiquement le premier échantillon d’image en tant qu’image par défaut composée d’une simple couleur blanche et d’une durée équivalente à la durée de la séquence. Vous pouvez conserver ou modifier l’échantillon d’image par défaut situé au début de votre diaporama ou le supprimer après avoir importé des images personnalisées. Pour définir les propriétés des images et importer des images dans une piste d’image : 1 Sélectionnez la piste d’image dans l’éditeur de montage, puis activez le panneau Diaporama de l’inspecteur de piste d’image. 2 Dans le panneau Diaporama, définissez les options suivantes avant l’importation des images : Intervalle entre les diapositives Définit la durée d’affichage de chaque image dans le diaporama. Cette option affecte uniquement les nouvelles images insérées après la définition de cette option. Boucle Spécifie le nombre de répétition de la séquence d’images. Utiliser un effet de transition Ajoute un effet visuel pour les transitions entre les différentes images. Cliquez sur Sélectionner afin de sélectionner un effet de transition, puis définissez les options d’effet. Durée Permet de définir la durée de l’effet de transition par glissement du curseur de durée ou entrée d’une valeur numérique dans la zone de texte de durée.
Couleur de fond Définit la couleur de fond des images importées. 4 Dans l’éditeur de montage, positionnez le curseur temporel de la piste d’image au point où vous voulez insérer les images. Par exemple, si vous voulez insérer les images après le dernier échantillon d’image, positionnez le curseur temporel après l’heure de fin du dernier échantillon d’image. Pour éviter de modifier la durée d’un échantillon d’image existant, positionnez le curseur temporel avant l’heure de début ou après l’heure de fin de l’échantillon d’image existant. 5 Sélectionnez l’option Insérer des images dans le panneau Images de l’inspecteur de piste d’image. Cliquez sur le bouton Importer, localisez le dossier contenant les images, puis sélectionnez les images, en respectant l’ordre selon lequel vous voulez les ajouter à la piste d’image en tant qu’échantillons d’images et les afficher dans le diaporama. Cliquez sur Ajouter dossier ou Tout ajouter pour ajouter l’image ou les images à la liste, puis cliquez sur Terminer. 6 Dans les menus contextuels de la boîte de dialogue des paramètres de compression, sélectionnez un compresseur d’images et une profondeur de couleur. Vous pouvez modifier la qualité de la compression à l’aide du curseur de qualité. La zone d’aperçu située à droite de la boîte de dialogue vous permet d’observer l’aspect de l’image en fonction de la configuration choisie. (Voir « Définition des options de compression », page 491.) Cliquez sur OK. Pour remplacer plusieurs images dans une piste d’image : 1 Sélectionnez la piste d’image dans l’éditeur de montage, puis activez le panneau Diaporama de l’inspecteur de piste d’image. 2 Modifiez les options du panneau Diaporama (si nécessaire) avant d’importer les images. Par exemple, pour modifier les durées d’affichage des nouvelles images uniquement, définissez l’option Intervalle entre les diapositives. 3 Dans l’éditeur de montage, positionnez le curseur temporel sur l’heure de début de la première image à remplacer. GoLive remplace les images en commençant par celle située juste après le point sur lequel le curseur temporel est positionné. 4 Sélectionnez l’option Remplacer les images dans le panneau Images de l’inspecteur de piste d’image. Cliquez sur le bouton Importer, localisez le dossier contenant les images, puis sélectionnez les images, en respectant l’ordre de remplacement souhaité. Le nombre d’images sélectionnées détermine le nombre d’images à remplacer. Par exemple, si vous sélectionnez quatre images, les quatre images suivantes seront remplacées. Dans le cas où seulement trois images existantes se trouvent après le curseur temporel, GoLive crée un nouvel échantillon pour la quatrième image. Si, par contre, le curseur temporel est suivi par dix images existantes, GoLive ajoute quatre nouvelles images après le curseur temporel et supprime les six images restantes. 5 Cliquez sur Ajouter un dossier ou Tout ajouter pour ajouter l’image ou les images à la liste, puis cliquez sur Terminer. 6 Dans les menus contextuels de la boîte de dialogue des paramètres de compression, sélectionnez un compresseur d’images et une profondeur de couleur, puis cliquez sur OK. Comment utiliser l'aide | Sommaire | Index
QuickTime comprend de nombreux compresseurs de format image couvrant la plupart des formats utilisés sur Internet et par les applications de publication courantes. Vous devez choisir le compresseur en fonction du type de l’image et de la taille du fichier de séquence. Si le compresseur par défaut (JPEG) n’est pas satisfaisant, essayez-en d’autres afin de trouver celui qui répond le mieux à vos besoins. Les options de profondeur de couleur disponibles varient en fonction du compresseur sélectionné. Lorsque vous faites glisser le curseur de qualité entre Minimum et Optimale, il affiche une valeur numérique comprise entre 0 et 100. La qualité de l’image et le degré de compression sont inversement proportionnels : plus la qualité est élevée, plus le taux de compression est faible.
Les pistes d’icônes animées permettent d’appliquer des actions et de définir des états de souris individuels aux objets image des pistes, appelés icônes animées. Grâce aux icônes animées, les internautes vivent l’interactivité en direct à travers les objets actifs qui, par exemple, les transportent de page en page. Tout comme la piste vidéo, une piste d’icônes animées est constituée d’une séquence d’images lues à une certaine vitesse. Toutefois, alors qu’une piste vidéo est une chaîne continue d’images en pixels, une piste d’icônes animées dépend d’un groupe d’images stockées avec la première image-clé. L’avantage des icônes animées réside dans le fait que les images suivantes n’ont pas besoin de contenir l’image en pixels réelle, mais simplement une référence à un élément du groupe. Les fichiers de ce type de séquence sont, par conséquent, beaucoup moins volumineux que les fichiers vidéo, dans lesquels les informations sont entièrement exprimées en pixels, ce qui permet le chargement plus rapide de vos animations. Pour créer des icônes animées, il est nécessaire de réaliser plusieurs opérations. Commencez par insérer une piste d’icônes animées et définir les propriétés de cette piste. Importez ensuite des images dans un groupe d’images afin qu’elles soient disponibles lors de l’insertion d’icônes animées individuelles. Associez enfin des comportements et des actions aux icônes animées.
Redimensionner avec la piste Sélectionnez cette option si vos icônes animées contiennent des graphiques vectoriels. Cette option entraîne la modification progressive de vos icônes animées en cas de redimensionnement de la piste d’icônes animées. Si cette option n’est pas activée, les icônes animées avec graphiques vectoriels risquent d’être déformées par le redimensionnement de la piste. Couleur de fond Permet de sélectionner une couleur de fond. La couleur de fond par défaut est le noir. Pour sélectionner une couleur, cliquez sur la case échantillon, puis faites glisser une couleur du panneau de visualisation de la palette de couleurs vers la case échantillon de l’inspecteur de piste d’icônes animées. Nouvelles icônes animées Permet de spécifier le nombre d’icônes animées à insérer. GoLive attribue la première image répertoriée dans votre groupe d’images à chaque icône animée insérée à l’aide de cette option. Cette image est l’image par défaut jusqu’à ce que vous importiez vos propres images dans le groupe d’images de la piste d’icônes animées. (Voir « Importation d’images et insertion d’icônes animées », page 492.) Pour plus de détails sur les propriétés de l’onglet Standard de l’inspecteur de piste d’icônes animées, voir « Définition des propriétés standard des pistes et des échantillons », page 480.
Avant de pouvoir utiliser des images en tant qu’icônes animées, vous devez les importer dans le groupe d’images. Vous pouvez utiliser des images aux formats suivants : BMP, GIF, JPEG/JFIF, MacPaint, Adobe Photoshop, PICT, PNG, QuickDraw GX (Mac OS uniquement, extension QuickDraw GX requise), image QuickTime, SGI, Targa et TIFF. Lorsque vous insérez une nouvelle piste d’icônes animées, GoLive ajoute automatiquement un objet icône animé par défaut (appelé Icône animée) et lui attribue une image par défaut (appelée Image sans titre 1) composée d’une couleur blanche. Vous pouvez soit conserver l’objet icône animée et l’image par défaut, soit les supprimer après avoir inséré vos propres objets icône animée et importé vos propres images. Vous pouvez également importer un fichier Photoshop et créer automatiquement et simultanément une icône animée pour chaque couche du fichier. (Voir « Importation de calques Photoshop sous la forme d’icônes animées », page 496.)
2 Si vous importez un fichier Photoshop et que vous voulez importer chaque calque en tant qu’image individuelle, sélectionnez Importer des calques multiples. Si cette option n’est pas activée, GoLive importe tous les calques en tant qu’image composite. Remarque : Bien qu’il soit possible d’importer un fichier Photoshop depuis le panneau Images et d’utiliser les images importées avec des icônes animées, ce panneau ne crée pas automatiquement les icônes animées et ne définit pas les comportements des boutons animés en fonction des noms des calques. Importez plutôt les fichiers Photoshop depuis le panneau Icônes animées. (Voir « Importation de calques Photoshop sous la forme d’icônes animées », page 496.) 3 Cliquez sur Importer, localisez le dossier contenant les images, puis sélectionnez les images voulues. Cliquez sur Ajouter un dossier ou Tout ajouter pour ajouter l’image ou les images à la liste, puis cliquez sur Terminer. 4 Dans les menus contextuels de la boîte de dialogue des paramètres de compression, sélectionnez un compresseur d’images et une profondeur de couleur, puis cliquez sur OK. (Voir « Définition des options de compression », page 491.) GoLive répertorie les images dans le panneau Images de l’inspecteur d’icône animée. Vous pouvez sélectionner un nom d’image et visualiser ses propriétés. Vous pouvez également renommer chaque image dans la zone de texte Nom. Pour ajouter des icônes animées à une piste d’icône animée et utiliser des images d’un groupe d’images : 1 Sélectionnez la piste d’icône animée dans la liste des pistes, puis cliquez sur la flèche située en regard du nom de la piste afin de développer cette piste si les objets icône animée qui y sont imbriqués ne sont pas déjà affichés. 2 Dans la zone de texte Nouvelles icônes animées, spécifiez le nombre d’icônes animées à ajouter. Après avoir enfoncé la touche Entrée ou cliqué hors du panneau Icônes animées, GoLive insère le nombre d’icônes animées spécifié dans la ou les sous-pistes de la piste d’icônes animées et attribue un nom à chacune de ces icônes animées (Icône animée 2, Icône animée 3, etc.), ainsi qu’une image-clé. Le programme associe également la première image du groupe d’images à chaque icône animée insérée. Cette image correspond à l’image par défaut Image sans titre 1 jusqu’à sa suppression. Vous avez alors la possibilité d’associer une image de votre propre groupe d’images. Voir « Définition de l’aspect et du comportement d’une icône animée », page 494. 3 Pour nommer une icône animée, sélectionnez-la, puis saisissez un nom dans la zone de texte Titre de l’inspecteur de l’objet icône animée. Vous pouvez également cliquer deux fois sur le nom de l’objet icône animée dans la liste des pistes, puis saisir un nouveau nom dans la zone de texte.
2 Sélectionnez l’image à supprimer dans la zone de liste. Remarque : Il n’est pas possible de supprimer une image associée à une icône animée ou référencée pour une action. 3 Cliquez sur Supprimer, puis sur Oui.
Après avoir inséré une icône animée, vous pouvez définir son aspect et son comportement. La définition de l’aspect consiste à spécifier si l’icône animée est visible ou non dans la séquence et à préciser la superposition ou l’interaction de cette icône animée avec les autres icônes animées de la séquence. Vous pouvez également définir son aspect et son comportement en sélectionnant dans le groupe d’images des images à afficher pendant la lecture de la séquence et lorsque l’internaute survole l’icône animée avec le pointeur de sa souris ou clique sur l’icône animée ou à côté de celle-ci. La liste des images et des actions associées à une icône animée est stockée dans son image-clé. Les images-clés sont similaires aux échantillons dans la mesure où elles permettent de définir des attributs d’icônes animées et où chaque icône animée peut avoir plusieurs images-clés. Non seulement les images-clés définissent les attributs, mais elles prennent également effet à un moment spécifique. Vous pouvez, par exemple, créer trois images-clés pour différents moments d’une icône animée et assigner une image différente à chacune de ces images-clés. Pendant la lecture de la séquence, ces images changent aux points de création des images-clés. Il est en outre possible d’attribuer différentes actions aux images-clés afin que ces actions soient exécutées à des moments différents. (Voir « Liaison d’icônes animées à des actions », page 498) Lorsque vous insérez une piste d’icônes animées, GoLive crée automatiquement une image-clé par défaut pour l’objet icône animée. Vous pouvez conserver l’image-clé par défaut. Plutôt que d’utiliser l’image-clé par défaut (Image sans titre 1), il est cependant plus courant de l’utiliser comme point de départ, de modifier son aspect et son comportement et de lui attribuer des images personnalisées.
. Pour plus de détails sur l’utilisation de l’outil Créer un échantillon, voir « Insertion et édition d’échantillons », page 482.
A. Options de l’inspecteur de l’échantillon d’icône animée permettant de définir le comportement de bouton animé de chaque image d’icône animée B. Image-clé
Visible Active la visibilité de l’icône animée dans une séquence QuickTime. Mode Détermine la manière dont l’icône animée sera superposée aux autres icônes dans la séquence. (Voir le menu Mode dans « Définition des propriétés standard des pistes et des échantillons », page 480) 3 Sélectionnez l’option de comportement standard, puis associez une image à l’imageclé de l’icône animée en en sélectionnant une dans le menu déroulant Image. Lorsqu’une image a été sélectionnée, sa vignette s’affiche dans la zone de comportement Standard. QuickTime affiche l’image associée à l’option de comportement standard lorsque l’icône animée est lue. 4 Pour associer d’autres images à d’autres comportements, activez une des options de comportement suivantes, puis sélectionnez une image dans le menu déroulant Image : •
Standard est retournée pour laisser place à l’image Survol.
6 Dans la zone de texte Etat, saisissez les informations sur l’icône animée que vous voulez afficher sur la barre d’état de la fenêtre du navigateur Web pendant la lecture de la séquence.
Le panneau Icônes animées de l’inspecteur de piste d’icônes animées permet d’importer des images depuis un fichier Photoshop et de créer simultanément une icône animée pour chaque calque du fichier, ce de façon automatique. L’avantage de l’utilisation du panneau Icônes animées réside dans le fait que vous pouvez concevoir et mettre en page vos icônes animées dans Photoshop (y compris les images de survol, etc.). L’importation de vos images dans une séquence QuickTime n’est ensuite qu’une simple formalité. Cette méthode permet de concevoir facilement une interface splendide dans Photoshop tout en associant les comportements aux images, puis de l’animer automatiquement dans GoLive sans avoir à repositionner toutes les images ou à leur affecter manuellement un comportement. En définissant par avance les noms des calques dans Photoshop, vous pouvez également associer automatiquement différents comportements de bouton animé à chaque icône animée lors de l’importation du fichier Photoshop. Photoshop peut en outre être utilisé en tant qu’outil prototype pour créer l’aspect initial des images, puis importer ces images dans GoLive et définir les actions interactives. Lorsque vous êtes prêt, vous pouvez utiliser à nouveau Photoshop pour créer les illustrations finales, puis remplacer les images associées aux icônes animées sans perdre les actions interactives de ces icônes animées ou tout autre travail réalisé avec GoLive pour créer la séquence. Pour définir dans Photoshop des images et des noms de calques en vue de création de boutons animés : Dans Adobe Photoshop, créez et mettez en page les images de fond et d’icônes animées comme vous voulez qu’elles s’affichent dans la séquence. Supposons, par exemple, que vous voulez créer une séquence affichant une télévision dotée de quatre boutons de sélection de chaîne. Supposons également que vous voulez associer un comportement de bouton animé à ces boutons afin que leur aspect soit modifié lorsque le pointeur de la souris les survole. Dans le fichier Photoshop, commencez par créer une image de fond représentant une télévision. Ajoutez ensuite quatre boutons en les plaçant chacun sur un calque différent et en leur attribuant l’aspect qu’ils auront lorsque le pointeur de la souris ne sera pas placé sur eux. Positionnez les boutons comme vous voulez qu’ils apparaissent dans la séquence, aligné dans le bas de la télévision, par exemple. Ajoutez ensuite quatre images de boutons alternatives supplémentaires, chacune sur un calque distinct. Ces images seront affichées lorsque le pointeur de la souris sera placé sur elles et leur aspect doit donc être différent de celui des boutons principaux. Positionnez ces boutons alternatifs exactement aux mêmes emplacements que ceux des boutons principaux.
1 Sélectionnez la piste d’icônes animées dans la liste de pistes de l’éditeur de montage. 2 Activez le panneau Icônes animées de l’inspecteur de piste d’icônes animées, puis effectuez les opérations suivantes : •
Standard de l’inspecteur d’échantillon d’icône animée pour chaque icône animée, saisissez l’extension appropriée dans la zone de texte Survol. Par exemple, si les images des boutons alternatifs se trouvent sur des calques intitulés channel1_over, channel2_over, etc., saisissez l’extension over dans la zone de texte Survol.
Standard de l’inspecteur d’échantillon d’icône animée pour chaque icône animée, saisissez l’extension appropriée dans la zone de texte Clic. Par exemple, pour channel1_click, channel2_click, etc., saisissez click comme extension dans la zone de texte Clic.
Pour remplacer les images d’un fichier Photoshop et mettre automatiquement à jour les icônes animées : 1 Assurez-vous que les noms des calques n’ont pas été modifiés dans le fichier Photoshop. 2 Sélectionnez la piste d’icônes animées dans la liste de pistes de l’éditeur de montage. 3 Activez le panneau Icônes animées de l’inspecteur de piste d’icônes animées, puis cliquez sur Remplacer. 4 Localisez le dossier contenant le fichier Photoshop, sélectionnez le fichier Photoshop, puis cliquez sur Ouvrir. 5 Dans les menus contextuels de la boîte de dialogue des paramètres de compression, sélectionnez un compresseur d’images et une profondeur de couleur, puis cliquez sur OK. GoLive remplace les images de chaque icône animée.
Vous pouvez ajouter des actions liées à une icône animée en associant des actions à des images-clés. Par exemple, si vous associez l’action Atteindre l’URL à l’événement Souris cliquée, une page Web s’ouvre lorsque l’internaute clique sur l’icône animée. Pour lier une icône animée à une action : 1 Sélectionnez l’icône animée, puis l’image-clé à laquelle vous voulez associer une action. Si vous créez une image-clé, positionnez-la à l’emplacement désiré dans la piste d’icône animée à l’aide de l’outil Créer un échantillon. (Voir « Insertion et édition d’échantillons », page 482.) 2 Affichez le panneau Actions de l’inspecteur d’échantillon d’icône animée. Dans la liste Evénements, sélectionnez un événement de souris parmi ceux répertoriés ci-dessous afin de déclencher une action d’icône animée. •
5 Cliquez sur Appliquer. Vous pouvez lier l’icône animée à des événements et à des actions supplémentaires, par exemple combiner un événement clic à l’un des deux événements déplacement pour que l’icône animée ne réagisse pas uniquement lorsque l’internaute clique dessus, mais également lorsqu’il la survole avec le pointeur.
GoLive comporte de nombreuses actions liées permettant de contrôler séquences, pistes, icônes animées, objets QTVR et fichiers SWF.
Les actions suivantes permettent de définir les propriétés de la séquence : Régler le volume de la séquence Permet de régler le volume audio de la séquence. Vous pouvez régler le volume entre 0 (minimum) et 255 (maximum). Régler la vitesse de lecture de la séquence Permet de régler la vitesse de lecture de la séquence : 1 pour une lecture à vitesse normale, 2 pour une lecture à vitesse accélérée (x 2), 0 pour arrêter la lecture, -1 ou -2 (ou valeur inférieure) pour une lecture inversée. Régler les indicateurs de séquence en boucle Permet de définir la lecture en boucle de la séquence : •
Revenir au début de la séquence Permet de retourner au début de la séquence. Atteindre la fin de la séquence Permet d’avancer jusqu’à la fin de la séquence. Avancer pas à pas dans la séquence Permet d’avancer dans la séquence image par image. Revenir pas à pas dans la séquence Permet de reculer dans la séquence image par image. Sélectionner un extrait de la séquence Permet de sélectionner une section de la séquence en fonction des heures entrées dans les zones de texte Début et Fin. Cliquez sur le bouton Ouvrir l’extrait actif pour fixer le créneau horaire au point de lecture de l’extrait sélectionné.
Jouer une note Permet de lire une note de musique (MIDI) avec le son spécifié dans une piste d’instrument. (Voir « Utilisation de pistes d’instruments », page 506.) Définir l’URL de la séquence enfant et Charger la séquence enfant Ces deux actions sont utilisées en association. L’action Définir l’URL de la séquence enfant permet de spécifier un URL pour une séquence sans charger cette séquence. Lorsque cette action est appliquée seule, aucun effet n’est donc visible. L’action Charger la séquence enfant permet de charger l’URL spécifié à l’aide de l’action Définir l’URL de la séquence enfant, grâce à quoi le contenu modifié devient visible. Ces actions permettent de modifier le contenu d’une piste de séquence pendant la lecture de la séquence (lorsqu’un internaute clique sur une icône animée, par exemple). Atteindre l'URL Permet d’amener l’icône animée à l’URL indiqué. (Cette action est générale, c’est-à-dire qu’elle ne contrôle pas la fenêtre de lecture de la séquence.) Grâce à la zone de texte Lien, vous avez la possibilité d’utiliser le bouton d’affectation pour spécifier une page Web dans votre fenêtre de site. Vous pouvez aussi atteindre la page Web cible à l’aide du bouton Parcourir, puis saisir l’URL manuellement. Le menu et la zone de texte Cible sont uniquement prévus pour atteindre l’URL d’une séquence incorporée dans une page Web.
Les actions suivantes permettent de définir les propriétés d’une piste : Activer/Désactiver une piste Permet d’activer ou de désactiver une piste, quel que soit son type. Vous pouvez, par exemple, l’utiliser pour basculer entre deux pistes sonores. Définir le n˚ de couche de la piste Permet de définir le numéro de la couche active, spécifiant sa position avant-arrière par rapport aux autres pistes. Choisissez une piste dans le menu Piste. Le numéro de la couche de la piste sélectionnée est affiché dans la zone de texte Couche. Pour la déplacer vers l’avant ou vers l’arrière, il vous suffit de saisir une valeur numérique. Plus celle-ci est petite, plus la piste est affichée en avant. Définir la matrice de la piste Permet de définir les dimensions de la piste cible. Choisissez une piste dans le menu Piste. Les zones de texte de position et de taille renseignent sur la configuration active. Pour modifier ces paramètres, désactivez l’option Normaliser la piste. L’option Conserver les proportions permet de respecter les proportions de la piste. Définir le mode graphique de la piste Permet de définir le mode graphique de la piste sélectionnée. Choisissez une piste dans le menu Piste. Dans le menu Mode, choisissez le mode de superposition voulu pour les pistes. Cliquez sur la case échantillon afférente au menu Mode, puis faites glisser une couleur du panneau de prévisualisation de la palette de couleurs vers la case échantillon. Définir le volume sonore de la piste Permet de déterminer le volume pour la piste sélectionnée. Choisissez une piste dans le menu Piste. Vous pouvez régler le volume entre 0 (minimum) et 255 (maximum).
Icône animée. La zone de texte de position indique la position actuelle de l’icône animée. Définir l'index d'images de l'icône animée Permet de sélectionner l’image pour l’icône animée cible et de créer des effets de survol ou de retournement. Choisissez une piste dans le menu Piste, puis l’icône animée cible dans le menu Icône animée. Choisissez l’image cible dans le menu contextuel situé sous le menu Icône animée. Une vignette de cette image s’affiche alors sur le panneau Actions. Afficher/Masquer l'icône animée Permet d'afficher/de masquer l'icône animée cible. Choisissez une piste dans le menu Piste, puis l’icône animée cible dans le menu Icône animée. L’option Visible permet d’afficher et de masquer l’icône animée. Définir le n˚ de couche de l'icône animée Permet de préciser le numéro de l’icône animée cible, spécifiant sa position avant-arrière par rapport aux autres icônes de la piste. Choisissez une piste dans le menu Piste, puis l’icône animée cible dans le menu Icône animée. Le numéro de la couche de l’icône animée sélectionnée est affiché dans la zone de texte Couche. Pour la déplacer vers l’avant ou vers l’arrière, il vous suffit de saisir une valeur numérique. Plus celle-ci est petite, plus l’icône animée est affichée en avant.
Les actions suivantes définissent les propriétés QTVR : Atteindre l'ID du noeud QTVR Permet de définir l’ID du noeud actuel d’une séquence QuickTime VR. Définir l'angle d'ouverture de QTVR Permet de définir l’angle d’ouverture actuel d’une séquence QuickTime VR. Définir l'angle d'inclinaison de QTVR Permet d’indiquer l’angle d’inclinaison actuel d’une séquence QuickTime VR. Atteindre le champ visuel de QTVR Permet de préciser le champ visuel actuel d’une séquence QuickTime VR. Atteindre la vue par défaut de QTVR Permet de définir la vue par défaut d’une séquence QuickTime VR.
Les actions suivantes définissent les propriétés SWF : Définir l'ouverture de la piste SWF Permet de définir l'ouverture en pourcentage de la piste cible SWF. Cette action déplace la piste SWF conformément à la valeur relative saisie dans les zones de texte correspondantes.
Définir le cadre de zoom de la piste SWF Permet de préciser le cadre de zoom actif de la piste cible SWF. Le cadre de zoom correspond à la zone de la piste SWF qui est agrandie à la taille actuelle de la piste SWF. Supposons, par exemple, que votre séquence contient au moins une icône animée. Importez une piste SWF et attribuez-lui la taille 320 x 240 pixels. Activez le panneau Actions et appliquez l’action Définir le cadre de zoom de la piste SWF en fixant le cadre de zoom à 160 x 120 pixels. Sélectionnez l’événement de déclenchement Souris cliquée. Cliquez sur l’icône animée pour visualiser les effets de l’action : le cadre de zoom 160 x 120 est étendu aux dimensions de la piste (320 x 240 pixels). Atteindre l'image de la piste SWF Permet d’atteindre une image spécifique dans la piste SWF cible. Atteindre le libellé de l'image de la piste SWF Permet d’atteindre un libellé d’image spécifique dans la piste SWF cible, si elle est dotée de libellés. (Les libellés sont créés dans une application de création de documents SWF.)
QuickTime à l’aide de GoLive. Après avoir inséré une piste SWF, utilisez GoLive pour associer des actions liées à des boutons du fichier SWF et pour atteindre directement des libellés prédéfinis à des moments spécifiques du fichier SWF. Vous pouvez, par exemple, disposer d’une barre de navigation SWF avec des menus et des boutons animés, voire même des éléments audio, puis utiliser cette barre avec des actions QuickTime afin de contrôler la séquence QuickTime. (Pour plus de détails sur la définition des boutons, actions, libellés et fréquences d’images SWF, voir la documentation de l’application de création de documents SWF.) Lorsque vous insérez une piste SWF dans une séquence QuickTime, QuickTime adapte la base de temps SWF à celle de QuickTime. Si la vitesse interne d’un fichier SWF est de 15 images par seconde (ips) et sa durée d’une minute, la durée de la piste SWF correspondante correspond également à une minute.
SWF et lier des actions à des boutons Macromedia® Flash™.
1 Sélectionnez la piste SWF dans l’éditeur de montage, puis activez le panneau Libellés de l’inspecteur de piste SWF. 2 Dans le menu Libellés, choisissez le libellé à atteindre.
Le panneau Actions de l’inspecteur de piste SWF permet d’associer une ou plusieurs actions à un bouton SWF. Vous pouvez faciliter l’identification des boutons en associant une chaîne de texte descriptive à chacun d’entre eux ; leur identification n’est ainsi pas restreinte aux seuls identifiants. Définissez les chaînes de texte dans le fichier SWF décrivant chaque bouton. Pour définir la chaîne de texte d’un bouton, insérez une commande FSCommand avec deux arguments dans le fichier SWF. Par exemple : fscommand ("RootButtonScriptA", "RootButton_frame1")
URL : FSCommand:RootButtonScriptA Cible : RootButton_frame1
3 Dans la liste Evénements, sélectionnez un événement de souris parmi ceux répertoriés ci-dessous pour déclencher une action. •
6 Cliquez sur Appliquer. Vous pouvez lier le bouton SWF à des événements et à des actions supplémentaires.
Les pistes d’enchaînement permettent la visualisation quasi-immédiate de séquences dans des pages Web (ou dans le lecteur QuickTime). Avec GoLive, il est possible de créer des pistes d’enchaînement référençant des séquences d’enchaînement RTSP stockées sur un serveur d’enchaînement RTSP. GoLive permet également d’exporter des séquences en tant que séquences d’enchaînement RTSP pour utilisation avec des serveurs d’enchaînement RTSP. (Voir « Exportation de séquences et de pistes », page 488.) Remarque : Pour plus de détails sur la préparation des séquences d’enchaînement, voir la documentation QuickTime.
QuickTime stockées sur un serveur HTTP. La piste d’enchaînement de GoLive est destinée aux séquences d’enchaînement RTSP uniquement.
Pour ajouter une piste d’enchaînement RTSP : 1 Faites glisser une icône de piste d’enchaînement du panneau QuickTime de la palette Objets vers la liste des pistes de l’éditeur de montage. (Voir « Insertion de pistes dans une séquence », page 471.) Dans le panneau Standard de l’inspecteur de la piste d’enchaînement, définissez les propriétés de la piste, telles que sa position et sa taille. (Voir « Définition des propriétés standard des pistes et des échantillons », page 480.) 2 Dans la zone de texte Lien du panneau RTSP de l’inspecteur de piste d’enchaînement, saisissez l’URL de la séquence d’enchaînement. 3 Cliquez sur le bouton Propriétés du contenu d’enchaînement pour ouvrir une connexion avec l’URL RTSP, puis obtenir des attributs importants relatifs à la séquence d’enchaînement, tels que sa taille et sa durée. (Si le contenu d’enchaînement correspond à une retransmission en direct, il n’a pas de durée spécifique.) Vous pouvez annuler la connexion GoLive au serveur RTSP en appuyant sur une touche quelconque. Utilisez le bouton Propriétés du contenu d’enchaînement afin de tester le lien pointant vers le serveur d’enchaînement. 4 Choisissez une option dans le menu Délai d’attente afin de spécifier quand GoLive doit arrêter ses tentatives de connexion au serveur d’enchaînement. Ce paramètre est appliqué uniquement lorsque vous travaillez dans GoLive ; il n’a aucune incidence sur la séquence d’enchaînement dans une page Web pendant les tentatives de connexion au serveur RTSP de la séquence client de l’internaute.
MPEG permet d’insérer des éléments MPEG vidéo, mais pas des éléments MPEG audio, tels que des fichiers .mp3. Pour les fichiers MPEG audio, utilisez une piste son. Pour insérer une piste MPEG dans votre séquence, faites glisser une icône de piste MPEG du panneau QuickTime de la palette Objets vers la zone de contenu de l’éditeur de montage. (Voir « Insertion de pistes dans une séquence », page 471.) Après avoir inséré la piste MPEG, vous pouvez en définir les propriétés de base (voir « Définition des propriétés standard des pistes et des échantillons », page 480).
Vous pouvez importer des fichiers son de différents formats, notamment AIFF/AIFC, System 7 Sound, WAV, mp3 et Sound Designer II, ainsi que des fichiers MIDI standard. Pour insérer un fichier audio dans votre séquence, faites glisser une icône de piste son du panneau QuickTime de la palette Objets vers la zone de contenu de l’éditeur de montage. (Voir « Insertion de pistes dans une séquence », page 471.) Pour insérer une piste MIDI dans votre séquence, faites glisser une icône de piste MIDI du panneau QuickTime de la palette Objets vers la zone de contenu de l’éditeur de montage. Après avoir inséré la piste sonore ou musicale, cliquez sur le bouton de lecture dans l’éditeur de montage pour écouter la piste et vous rendre compte du résultat une fois cette piste associée aux autres.
Utilisez une piste d’instrument pour lire une note après le chargement d’une piste de séquence ou pour lire des éléments sonores lorsqu’un événement spécifique se produit. Vous pouvez, par exemple, définir la lecture d’une note de musique lorsque quelqu’un clique sur une séquence. Les sons des pistes d’instruments proviennent d’une bibliothèque de sons MIDI installée avec QuickTime. Les options des pistes d’instruments définissent le synthétiseur utilisé pour la représentation sonore des instruments et des catégories d’instruments sélectionnés. Vous lisez ensuite la piste d’instrument en la ciblant sur une action liée Jouer une note associée à une piste. Les options de l’action Jouer une note déterminent le timbre, le volume et la durée de la note. Vous pouvez associer une action Jouer une note à des pistes de séquences ou à des échantillons de texte ou d’icônes animées.
Après avoir défini une piste d’instrument avec un ou plusieurs instruments, vous pouvez utiliser un de ces instruments dans une action liée Jouer une note associée à une piste de séquence ou à un échantillon d’icône animée ou de texte. Pour associer une action Jouer une note à une piste ou à un échantillon : 1 Sélectionnez la piste de séquence ou l’échantillon d’icône animée ou de texte dans l’éditeur de montage, puis activez le panneau Actions de l’inspecteur de piste de séquence ou d’échantillon d’icône animée, ou le panneau Texte de l’inspecteur d’échantillon de texte. 2 Sélectionnez un événement dans la liste Evénements, puis cliquez sur le bouton Nouvel élément situé sous la zone de liste Actions. Le symbole « • » s’affiche à droite de l’événement pour indiquer son activation. 3 Dans le menu contextuel situé sous les listes Evénements et Actions, choisissez Jouer une note. 4 Dans le menu Séquence cible, choisissez La présente séquence. 5 Dans le menu Piste, choisissez Piste d’instrument. Modifiez les autres propriétés, telles que le volume, selon le besoin. 6 Cliquez sur Appliquer.
Vous pouvez également utiliser une piste HREF dans une page Web comportant des cadres HTML. La séquence est lue dans un cadre et les URL contactés pendant la lecture sont affichés dans un autre. L’utilisation de cadres permet la lecture de la séquence en continu, tandis que le contenu du second cadre est remplacé en conséquence. Vous ne pouvez insérer qu’une seule piste HREF par séquence.
de la palette Objets
Vous pouvez également spécifier une page Web de votre fenêtre de site à importer à l’aide du bouton d’affectation, localiser un fichier local à l’aide du bouton Parcourir ou choisir un fichier ayant déjà été sélectionné dans le menu URL, accessible en cliquant sur la flèche vers la droite afférente à la zone de texte Lien. 3 Dans le menu Cible, choisissez un cadre dans la cible de l’URL ou saisissez un nom de cadre. 4 Effectuez l’une des opérations suivantes : •
Par défaut, la piste HREF est masquée afin d’empêcher l’affichage de l’URL dans la séquence. Si vous souhaitez que l’URL soit visible, cliquez sur l’icône d’oeil , ce qui permet d’afficher la piste HREF. Remarque : Il n’est pas possible de modifier le nom par défaut de la piste HREF car QuickTime reconnaît une piste HREF grâce à ce nom (« HREFTrack »).
Les pistes dossier permettent d’organiser les pistes par catégories. Vous pouvez, par exemple, regrouper toutes les pistes vidéo ou toutes les pistes de groupes d’images (pistes image et pistes d’icônes animées). Pour insérer une piste dossier dans votre séquence, faites glisser une icône de piste dossier du panneau QuickTime de la palette Objets vers la zone de contenu de l’éditeur de montage. (Voir « Insertion de pistes dans une séquence », page 471.) Après avoir inséré la piste dossier, vous pouvez en définir les propriétés de base (voir « Définition des propriétés standard des pistes et des échantillons », page 480). Pour organiser des pistes dans des dossiers, il suffit de les faire glisser dans l’éditeur de montage ou de faire glisser une icône de piste de la palette Objet vers la piste dossier. Après avoir fait glisser une piste dans la piste dossier, cliquez sur le triangle afférent à la piste dossier pour la développer et la réduire et, ainsi, afficher et masquer les pistes qui s’y trouvent. Sélectionnez une piste dans la piste dossier afin d’afficher l’inspecteur correspondant. Vous pouvez ajouter autant de dossiers que nécessaire pour l’organisation de vos pistes.
QuickTime affiche la piste chapitre sous forme de menu dans le contrôleur QuickTime de la séquence. Il est recommandé d’utiliser une piste de chapitre par séquence. Remarque : Pour pouvoir afficher le menu de chapitre, la piste de chapitre nécessite une séquence d’une largeur de 275 pixels minimum. Pour insérer une piste de chapitre : 1 Faites glisser une icône de piste de chapitre du panneau QuickTime Objets vers la liste des pistes de l’éditeur de montage.
3 Dans le menu Piste chapitre pour, choisissez une piste à associer aux chapitres. 4 Sélectionnez l’échantillon de piste de chapitre dans l’éditeur de montage afin d’afficher l’inspecteur d’échantillon de piste de chapitre. 5 Dans la zone de texte Titre de chapitre, saisissez un titre de chapitre. 6 Ajoutez des chapitres supplémentaires à la piste de chapitre en créant des échantillons de chapitre à l’aide de l’outil Créer un échantillon . (Voir « Insertion et édition d’échantillons », page 482.) Sélectionnez chaque nouvel échantillon de chapitre, puis saisissez un titre dans l’inspecteur d’échantillon de piste de chapitre. Vous pouvez vérifier vos choix dans la fenêtre de visualisation de la séquence en choisissant les chapitres de la liste de chapitre du contrôleur. (Il se peut que deviez redimensionner la fenêtre pour voir le menu contextuel.) Remarque : Si les échantillons de chapitre sont séparés par des espaces temporels, aucun titre de chapitre ne s’affiche pendant ces parties de la séquence.
1 Faites glisser une icône de piste de texte du panneau QuickTime vers la liste des pistes de l’éditeur de montage.
3 Dans la grande zone de texte située au milieu du panneau Texte, saisissez le texte à afficher dans la séquence, puis cliquez sur Appliquer. Pour aligner le texte dans la séquence, effectuez une sélection dans le menu d’alignement. 4 Pour afficher du texte à différents moment de la séquence, créez de nouveaux échantillons de texte avec des contenus distincts à l’aide de l’outil Créer un échantillon . Pour plus de détails sur l’utilisation de l’outil Créer un échantillon, voir « Insertion et édition d’échantillons », page 482.
Vous pouvez lier le texte d’une séquence à une page Web, à un fichier ou à un élément quelconque doté d’un URL. Vous pouvez également spécifier l’événement de souris déclenchant l’activation du lien de texte. Spécifiez, par exemple, l’ouverture d’une page Web spécifique avec un clic sur un lien de texte. Une séquence peut compter plusieurs liens de texte. Pour ajouter des liens de texte associés à des actions : 1 Dans le panneau Texte de l’inspecteur d’échantillon de texte, sélectionnez le texte à lier dans la zone de texte. 2 Cliquez sur l’icône de lien. GoLive souligne le texte sélectionné et change sa couleur en bleu.
Atteindre l’URL pour ouvrir une page Web. Pour plus de détails sur les actions du menu contextuel, voir « Gestion des pistes à l’aide d’actions », page 499. 6 Cliquez sur Appliquer. Vous pouvez lier le lien de texte à des événements et à des actions supplémentaires. 7 Pour ajouter d’autres liens de texte à la séquence, saisissez le texte voulu dans la zone de texte et recommencez la procédure ci-dessus pour associer une action au texte sélectionné.
Après avoir sélectionné un échantillon de texte dans l’éditeur de montage, vous pouvez définir les propriétés de texte suivantes dans le panneau Propriétés de l’inspecteur d’échantillon de texte : Ne pas afficher Empêche l’affichage du texte dans la séquence. Ne pas redimensionner automatiquement Empêche la mise à l’échelle automatique du texte. Ajuster à la zone de texte Modifie la taille de la zone de texte sans changer la distribution du texte. Avant de sélectionner cette option, saisissez des valeurs positives (en pixels) dans les zones de texte Largeur de marge et Hauteur de marge du panneau Mise en page de l’inspecteur d’échantillon de texte. Utiliser la couleur de fond de la séquence Met le texte en couleur avec la couleur de fond de la séquence. Réduire la zone de texte Réduit la taille de la zone de texte en changeant la distribution du texte. Avant de sélectionner cette option, saisissez des valeurs positives (en pixels) dans les zones de texte Largeur de marge et Hauteur de marge du panneau Mise en page de l’inspecteur d’échantillon de texte.
Défilement extérieur Définit le défilement vertical du texte, du haut vers le bas de la séquence. Défilement horizontal Définit le défilement horizontal du texte. Cette option n’est pas disponible avec le texte lié. Défilement inverse Permet d’inverser le sens de défilement du texte. Défilement continu Active les défilements intérieur et extérieur de deux échantillons de texte. Les options Défilement intérieur et Défilement extérieur doivent également être sélectionnées pour que cette option fonctionne correctement. Flux horizontal Fait défiler le texte horizontalement à l’intérieur de la zone de texte. Si cette option n’est pas activée, le texte défile comme si la zone de texte n’avait pas de bord droit. Mise en évidence inversée Permet d’inverser la couleur du texte mis en évidence et la couleur du texte. Mise en évidence de la couleur du texte Permet de définir la couleur de mise en évidence du texte. Début et Fin Définit les heures de début et de fin du défilement du texte.
Après avoir sélectionné un échantillon de texte dans l’éditeur de montage, vous pouvez définir les propriétés de texte suivantes dans le panneau Mise en page de l’inspecteur d’échantillon de texte : Largeur de marge et Hauteur de marge Définit les marges de la zone de texte en pixels. Fond Définir la couleur de fond de la piste de texte. Ombre portée Crée une ombre apparaissant légèrement au dessous et à droite du texte d’origine. Transparente Masque la couleur de fond de la piste de texte.
Les filtres permettent de créer des effets spéciaux dans des séquences, tels que de modifier la couleur d’une piste vidéo ou de mélanger deux pistes vidéo. Vous pouvez également utiliser les filtres pour créer des effets de transition entre des pistes, par exemple, un fondu moiré entre deux images vidéo. Vous pouvez également spécifier les heures exactes de début et de fin des filtres. Une piste filtre enregistre les caractéristiques d’un filtre, ainsi que sa vidéo cible. Quatre pistes filtre différentes peuvent être insérées dans une séquence : •
Pour insérer un filtre générique : 1 Faites glisser une icône de piste filtre générique du panneau QuickTime Objets vers le bas de la liste des pistes de l’éditeur de montage.
3 Dans l’inspecteur d’échantillon de filtre générique, cliquez sur le bouton Sélectionner. 4 Dans la boîte de dialogue Sélection d’effet, effectuez l’une des opérations suivantes : •
échantillon . Pour plus de détails sur l’utilisation de l’outil Créer un échantillon, voir « Insertion et édition d’échantillons », page 482.
Avant d’insérer une piste filtre source unique dans une séquence, insérez la piste vidéo ou d’image devant servir de source pour cette piste filtre source unique. Notez que lorsque vous utilisez une piste vidéo en tant que source de piste filtre, les données de la piste vidéo d’origine ne s’affichent pas dans la séquence. Toutes les données de la piste vidéo sont traitées avec l’effet de filtre spécifié dans la piste filtre, qui détermine également les dimensions et le positionnement. Pour insérer un filtre source unique : 1 Faites glisser une icône de piste filtre source unique du panneau QuickTime palette Objets vers le bas de la liste des pistes de l’éditeur de montage.
5 Dans l’inspecteur d’échantillon de filtre source unique, cliquez sur le bouton Sélectionner. 6 Dans la boîte de dialogue Sélection d’effet, effectuez l’une des opérations suivantes : •
Pour plus de détails sur les effets, voir « Définition des effets filtre source unique de QuickTime », page 516.
8 Pour faire apparaître d’autres filtres source unique à des moments différents de la séquence, créez de nouveaux échantillons de filtres source unique à l’aide de l’outil Créer un échantillon . Pour plus de détails sur l’utilisation de l’outil Créer un échantillon, voir « Insertion et édition d’échantillons », page 482.
Avant d’insérer une piste filtre double source dans une séquence, insérez les deux pistes vidéo devant servir de sources pour la piste filtre. Pour insérer un filtre double source : 1 Faites glisser une icône de piste filtre double source du panneau QuickTime palette Objets vers le bas de la liste des pistes de l’éditeur de montage.
2 Sélectionnez la piste filtre double source dans l’éditeur de montage, puis affichez l’inspecteur de piste filtre double source. 3 Dans le menu Source A, choisissez l’une des pistes vidéo à laquelle vous voulez appliquer la piste filtre double source. Dans le menu Source B, choisissez l’autre piste vidéo à laquelle vous voulez appliquer la piste filtre double source. 4 Sélectionnez l’échantillon de filtre double source dans la zone de contenu de l’éditeur de montage. (Si nécessaire, développez la piste de texte pour afficher les échantillons.) 5 Dans l’inspecteur d’échantillon de filtre double source, cliquez sur le bouton Sélectionner.
. Pour plus de détails sur l’utilisation de l’outil Créer un échantillon, voir « Insertion et édition d’échantillons », page 482.
Avant d’insérer une piste filtre triple source dans une séquence, insérez les trois pistes vidéo devant servir de sources pour la piste filtre. Pour insérer un filtre triple source : 1 Faites glisser une icône de piste filtre triple source du panneau QuickTime palette Objets vers le bas de la liste des pistes de l’éditeur de montage.
2 Sélectionnez la piste filtre triple source dans l’éditeur de montage, puis affichez l’inspecteur de piste filtre triple source. 3 Dans le menu Source A, choisissez l’une des pistes vidéo à laquelle vous voulez appliquer la piste filtre triple source. Dans le menu Source B, choisissez l’autre piste vidéo à laquelle vous voulez appliquer la piste filtre triple source. Dans le menu Cache lumière, choisissez la piste vidéo à utiliser pour le contrôle du mélange des pistes vidéo A et B source. (Pour que cet effet soit plus visible, utilisez une vidéo en niveaux de gris à contraste élevé en tant que Cache lumière.) 4 Sélectionnez l’échantillon de filtre triple source dans la zone de contenu de l’éditeur de montage. (Si nécessaire, développez la piste de texte pour afficher les échantillons.) 5 Dans l’inspecteur d’échantillon de filtre triple source, cliquez sur le bouton Sélectionner.
échantillon . Pour plus de détails sur l’utilisation de l’outil Créer un échantillon, voir « Insertion et édition d’échantillons », page 482.
Lorsque vous définissez des effets pour les filtres source unique (voir « Ajout et application de pistes filtre source unique », page 513), vous avez la possibilité de définir les effets de filtre suivants dans la boîte de dialogue Sélection d’effet : Gain alpha Permet de manipuler le canal alpha d’une piste unique. Cette opération s’effectue généralement avant l’application de l’effet Composition alpha à la piste. Vous pouvez définir les options suivantes : •
Style des couleurs Permet d’appliquer deux effets de modification de couleur à une piste unique. Tous deux traitent séparément les composants rouge, vert et bleu de chaque pixel. Vous pouvez définir les options suivantes : •
Les valeurs du tableau commencent avec une intensité nulle et atteignent l’intensité maximale au point critique. Elles retombent ensuite à zéro. Il est possible de modifier la valeur de solarisation, l’intensité du tableau de solarisation et le point de solarisation (le point critique du tableau de solarisation).
élevée, plus l’effet d’estampage est important. Bruits Simule les effets du temps sur les films anciens et peut s’utiliser pour vieillir une source vidéo. Cet effet propose les options cheveux et éraflures, qui simulent la présence de cheveux et d’éraflures sur la surface du film à l’aide de lignes (presque) verticales de 1 pixel. Cinq paramètres permettent de régler l’aspect visuel : •
L’algorithme de convolution examine chaque pixel de la source et les huit pixels qui l’entourent. Ces valeurs sont multipliées par les valeurs appropriées contenues dans les cellules, puis additionnées. Le résultat est ensuite utilisé comme valeur du pixel cible correspondant. Réglage TSL Permet de régler séparément la teinte, la saturation et la luminosité d’une piste unique. La filtre de réglage TSL comporte trois paramètres : •
Lorsque vous définissez des effets de transition pour les filtres double source (voir « Ajout et application de pistes filtre double source », page 514), vous avez la possibilité de définir les effets suivants, basés sur les canaux alpha, dans la boîte de dialogue Sélection d’effet : Composition alpha Permet de combiner deux images en utilisant les canaux alpha de ces images pour contrôler le mélange. Ce filtre propose les options de mélange de canaux alpha standard et gère la prémultiplication par toutes les couleurs. Toutefois, le blanc et le noir sont les couleurs les plus courantes et les plus rapides à utiliser. L’effet Composition alpha est doté d’un paramètre, Mode de mélange, pouvant prendre l’une des valeurs suivantes : •
Dissolution. Il comporte le paramètre Pourcentage. Vous pouvez modifier le degré de visibilité de chaque source durant le mélange à l’aide de deux curseurs. Explosion Dans un effet d’explosion, la piste B s’agrandit en partant d’un point précis jusqu’à recouvrir entièrement la piste A. Cet effet comporte trois paramètres : •
(Compact Hypertext Markup Language) correspond partiellement à la spécification HTML 4.0, plus connue sous le nom d’i-mode, marque de la société NTT DoCoMo. Le langage WML (Wireless Markup Language) est une norme de balisage reposant sur le langage XML. Enfin, le langage XHTML-Basic renvoie à la spécification XHTML (Extensible Hypertext Markup Language), relative aux appareils sans fil et autres. La création de sites à l’aide de ces langages connaît une forte expansion mondiale. Si votre opérateur de téléphonie mobile propose un service de navigation sans fil, vous avez la possibilité de visiter des sites Web ainsi créés. La réussite du développement d’un site Web sans fil est soumise à des contraintes particulières. Nombreux sont les utilisateurs qui doivent payer un surplus pour naviguer sur le Web depuis leur téléphone mobile ou leur ordinateur de poche. Il est donc nécessaire d’optimiser la conception du texte, des images et de la navigation du site pour de petits écrans, et de limiter la taille des fichiers pour réduire la durée de téléchargement.
Les outils et la méthode à utiliser sont les mêmes pour du contenu sans fil que pour tout autre site construit avec GoLive. Si vous êtes habitué à travailler avec GoLive, l’apprentissage des techniques de création sans fil sera rapide. Organisation de votre site Utilisez le fichier projet du site pour structurer l’organisation des fichiers et des liens entre les pages. Les fonctions de diagramme de conception de GoLive vous permettent d’élaborer l’arborescence du site et le schéma de navigation entre les pages avant de commencer à construire les pages. Ajout de contenu à des pages Ajoutez et formatez du texte et des images, liez des pages et développez des formulaires destinés à recueillir des données utilisateur à l’aide des barres d’outils, des menus, de la palette Objets et de l’inspecteur de GoLive. Utilisation des fonctions uniques de GoLive pour simplifier le développement Les objets dynamiques vous permettent d’ajouter des fichiers image et de les optimiser pour les sites sans fil directement à partir de GoLive. Les pages de gabarit sont des pages par défaut que vous dotez des paramètres et du contenu que vous souhaitez insérer dans chaque page.
Création d’un site CHTML CHTML est un langage de balisage très utilisé au Japon pour le service de téléphonie mobile i-mode qui rencontre un grand succès. L’accès sans fil à Internet via CHTML commence à être disponible dans d’autres parties du monde. Avec GoLive, vous pouvez facilement développer des sites utilisant à la fois des caractères latins et des caractères codés sur deux octets (asiatiques). Vous trouverez des informations supplémentaires sur les technologies CHTML et i-mode sur le site Web de NTT DoCoMo à l’une des adresses suivantes : http://www.nttdocomo.com et http://www.nttdocomo.co.jp.
Configuration de l’environnement et des pages Vous devez configurer la palette Objets de manière à faire glisser uniquement des éléments CHTML corrects sur votre page. Si vous créez un site CHTML japonais, il est nécessaire d’indiquer à GoLive d’utiliser l’encodage de documents Shift-JIS. Pour ce faire, vous devrez définir le type de document CHTML voulu pour la page et configurer l’aperçu dans un navigateur. Lorsque vous définissez le type de document, seules les options de formatage compatibles avec le langage CHTML sont disponibles. Important : Une fois la palette Objets configurée et le type de document défini, tous les éléments (y compris ceux qui ne sont pas compatibles) continuent de s’afficher dans les menus contextuels de GoLive. Evitez d’utiliser les menus contextuels pour ajouter des éléments CHTML et formater du texte. Ajout de contenu Vous avez la possibilité d’ajouter du texte, des liens, des éléments de formulaire et des images comme dans toute autre page GoLive. Cependant, certains éléments HTML ne sont pas pris en charge. Ils ne s’affichent donc pas dans la palette Objets lorsqu’elle est configurée pour le langage CHTML. Remarque : L’élément div étant inclus dans la spécification CHTML, il est déconseillé d’utiliser des boîtes flottantes dans les pages CHTML. Les boîtes flottantes contiennent, en effet, des balises CHTML incorrectes.
Le langage CHTML correspond partiellement au HTML. Certains éléments et attributs ne sont donc pas disponibles pour le CHTML, mais vous pouvez configurer la palette Objets de manière à afficher uniquement les icônes représentant des éléments CHTML corrects. Pour configurer la palette Objets pour la création CHTML : Dans le menu de la palette Objets, choisissez Configurez, puis l’une des options i-mode (version 1.0, 2.0 ou 3.0, selon la spécification suivie pour la conception de votre site). Le menu de la palette Objets est accessible depuis l’angle supérieur droit de ladite palette. Pour plus de détails sur la palette Objets, voir « Utilisation des outils de conception de page », page 17.
Les pages CHTML en japonais doivent utiliser le jeu de caractères Shift-JIS. Les serveurs i-mode japonais recherchent la balise de jeu de caractères « charset=Shift_JIS » dans votre code source. Pour pouvoir utiliser ce jeu de caractères, assurez-vous que le module d’encodage est activé. Cette opération est superflue pour les langues latines qui ne requièrent ni l’activation du module d’encodage, ni la modification de l’encodage du document. Pour inclure des caractères Emoji dans vos pages, vérifiez que le module i-mode Emoji est activé. Pour activer le module d’encodage et le module i-mode Emoji : 1 Choisissez Edition > Préférences. 2 Choisissez Modules dans le panneau gauche de la boîte de dialogue Préférences. 3 Dans le panneau droit de la même boîte, sélectionnez Encodings et i-Mode-Emoji, puis cliquez sur OK. 4 Choisissez Fichier > Encodage du document > Japonais (Shift_JIS). 5 Relancez GoLive.
5 Pour intituler une page, choisissez Spécial > Propriétés de la page, puis saisissez le titre souhaité dans l’inspecteur de la page. Remarque : Le titre de la page est enregistré de manière à servir de nom de signet sur le téléphone lorsque la page est mise en signet par les utilisateurs. 6 Pour définir la couleur du texte des liens ou la couleur de fond de la page, choisissez Spécial > Propriétés de la page, puis définissez les options dans l’inspecteur de la page. N’oubliez pas que la plupart des écrans de téléphone n’affichent pas les couleurs. Le moyen le plus efficace de développer un site i-mode est de définir une page de gabarit dans votre site, et de l’enregistrer au format CHTML après avoir sélectionné le type d’affichage du navigateur que vous utilisez habituellement. Il est ensuite aisé de créer de nouvelles pages dotées de ces caractéristiques en ouvrant le gabarit situé dans le dossier Gabarits du site. Pour plus de détails sur les gabarits, voir « Utilisation de gabarits », page 346. Pour enregistrer une page au format CHTML : 1 Choisissez Fichier > Enregistrer sous, puis saisissez le nom du fichier. 2 Dans le menu Type, choisissez Hypertexte (.html). 3 Pour enregistrer le fichier dans le dossier du site, choisissez Racine dans le menu Dossier de site.
Pour ajouter du texte, il suffit de le taper directement dans la page. En CHTML, les options de formatage du texte sont limitées. Les options inappropriées ne sont pas disponibles dans les menus et sont grisées (sauf dans les menus contextuels). Pour ajouter du texte : Cliquez dans la page pour choisir un point d’insertion, puis saisissez ou collez le texte voulu. Pour formater des paragraphes : Cliquez dans le paragraphe à formater, puis choisissez une option de formatage de paragraphes. •
2 Dans la palette de couleurs, sélectionnez une couleur dans la liste des couleurs Web et faites-la glisser sur le texte auquel vous souhaitez l’appliquer. Pour insérer un saut de ligne : 1 Appuyez sur Entrée (Windows) ou Retour (Mac OS) en maintenant la touche Maj enfoncée, ou faites glisser l’icône Saut de ligne de la palette Objets dans votre document. 2 Pour définir la disposition du texte par rapport un objet inséré dans une ligne, sélectionnez Effacer dans l’inspecteur du saut de ligne, puis l’option souhaitée dans le menu disponible. Pour ajouter du texte défilant sur la page : 1 Faites glisser l’icône Banderole du panneau Standard de la palette Objets dans votre page. 2 Dans l’inspecteur de la banderole, saisissez le texte voulu et définissez les options de mouvement du texte. L’icône Banderole est disponible uniquement pour i-mode 2.0 et 3.0. Pour plus de détails sur les options de banderole, voir « Ajout de banderoles animées », page 102.
Les caractères Emoji sont des images symbole du jeu de polices i-mode. Le glyphe, ou représentation visuelle du caractère, est une image et non une lettre. Etant donné qu’un caractère Emoji est un caractère, et non une image, il requiert deux octets de mémoire, c’est-à-dire beaucoup moins qu’une image GIF peu volumineuse. Il existe 196 caractères Emoji, ce qui vous permet de transmettre des informations avec efficacité. Dans du code CHTML, GoLive représente par défaut les caractères Emoji par des noms. Dans du code HTML, ils sont représentés par des entités HTML, à savoir une esperluette (&) et un signe dièse (#) suivis de 5 chiffres, puis d’un point-virgule (;). Par exemple, l’entité  représente le caractère « soleil » qui ressemble à un soleil brillant. L’utilisation de l’esperluette dans le code permet de se dispenser de l’encodage Shift-JIS de la page. La version japonaise de GoLive inclut la police Emoji gaiji. L’utilisation de cette police requiert un système d’exploitation Windows japonais. Remarque : La visualisation de votre site sur un ordinateur requiert l’installation de la police Emoji. Pour ajouter et modifier des caractères Emoji : 1 Faites glisser l’icône Emoji du panneau Standard de la palette Objets dans la fenêtre du document. 2 Pour modifier le caractère, sélectionnez l’icône Emoji dans votre document, puis cliquez sur un autre caractère Emoji dans l’inspecteur i-mode Emoji. Remarque : Concernant les caractères Emoji, Adobe recommande l’utilisation de l’esperluette dans le code.
Pour ajouter une image GIF à une page : 1 Faites glisser l’icône Image du panneau Standard de la palette Objets dans votre page. 2 Sélectionnez la balise d’emplacement de l’image dans le document, puis spécifiez un fichier GIF optimisé à l’aide du bouton d’affectation dans l’inspecteur de l’image. Pour ajouter une image GIF à l’aide d’un objet dynamique GoLive : 1 Faites glisser une icône d’objet dynamique du panneau SmartObjects de la palette Objets vers votre page. 2 Sélectionnez la balise d’emplacement de l’objet dynamique dans le document, puis spécifiez un fichier source à l’aide du bouton d’affectation dans l’inspecteur correspondant. Remarque : Le fichier source Photoshop auquel vous liez un objet dynamique doit se trouver dans votre fichier projet de site. Pour plus de détails sur la liaison de fichiers et l’utilisation du bouton d’affectation, voir « Liaison des fichiers », page 55. 3 Dans la boîte de dialogue Enregistrer pour le Web, optimisez l’image en choisissant l’option souhaitée dans le menu adéquat de la zone Paramètres. •
1 Faites glisser l’icône Ligne du panneau Standard de la palette Objets. 2 Dans l’inspecteur de la ligne, vous pouvez choisir le style, les dimensions et l’alignement de la ligne. Pour plus de détails, voir « Ajout de lignes horizontales », page 100.
Pour associer un lien à du texte ou à une image : 1 Sélectionnez le texte ou l’image que vous souhaitez utiliser comme origine du lien. 2 Spécifiez la destination du lien en effectuant l’une des opérations suivantes : •
Pour associer un numéro de téléphone à du texte : 1 Sélectionnez le texte auquel vous souhaitez associer un numéro de téléphone. 2 Dans l’inspecteur de texte, cliquez sur le bouton Nouveau lien , puis saisissez tel: dans la zone de texte afférente, suivi du numéro de téléphone. Par exemple, tel:5555555555.
Le code CHTML prend en charge les formulaires pour que les internautes bénéficient de pages interactives. L’information envoyée par un utilisateur via un formulaire doit être traitée par un script CGI (Common Gateway Interface) sur le serveur d’hébergement. Contactez votre service d’hébergement pour définir les fonctions CGI. La plupart des éléments de formulaires HTML sont pris en charge. Veillez toutefois à tester votre formulaire sur tous les types d’appareils susceptibles d’être utilisés pour consulter de votre site. Pour plus de détails sur la conception de formulaires, voir l’aide de GoLive. Pour ajouter des éléments de formulaire : 1 Faites glisser l’icône Formulaire du panneau Formulaire de la palette Objets dans votre page. Tous les autres éléments du formulaire doivent être insérés dans celui-ci. 2 Faites glisser d’autres icônes du panneau Formulaire de la palette Objets dans votre page et configurez leurs inspecteurs.
(anglais). L’attribut istyle est défini dans le code source. Par exemple :
Vous pouvez publier du contenu dynamique sur des pages CHTML à l’aide du module Contenu dynamique de GoLive et du langage de script serveur PHP. Lorsque vous configurez la palette Objets pour le CHTML, seuls les éléments CHTML corrects sont disponibles. Pour plus de détails sur la publication de contenu dynamique, voir « Utilisation de contenu dynamique », page 544.
Vous pouvez prévisualiser vos pages CHTML dans un émulateur de téléphone. Le CD-Rom de GoLive 6 pour Windows inclut le programme de visualisation Access Compact Viewer pour GoLive. Vous trouverez l’émulateur dans le dossier Wireless Emulators situé sur le CD-Rom (Wireless Emulators/ACCESS/ACCESS Launcher/ACCESS i-mode Simulator.exe). Les instructions d’installation se trouvent dans le fichier Readme relatif à l’installation, disponible sur le même CD-Rom. Après avoir défini les préférences de GoLive, vous pouvez démarrer l’émulateur dans GoLive et prévisualiser automatiquement la page active et les pages associées. Pour définir les préférences de prévisualisation dans un émulateur de navigateur de téléphone : 1 Assurez-vous que le programme de visualisation Access Compact Viewer est installé sur votre disque dur. 2 Choisissez Edition > Préférences, puis cliquez sur Navigateurs dans le panneau gauche de la boîte de dialogue Préférences.
Dans le cas contraire, sélectionnez-le dans le menu Afficher dans le navigateur, accessible via la barre d’outils. Vous pouvez également le choisir dans le sous-menu accessible via Fichier > Aperçu dans.
Utilisez les fonctions de transfert de fichiers FTP de GoLive pour publier votre site CHTML. GoLive permet de publier facilement la totalité de votre site, en une seule fois, puis de publier progressivement de nouvelles parties ou des mises à jour du site. Pour plus de détails sur la publication d’un site Web, voir « Introduction au transfert de fichiers et à la publication de site », page 357.
Pour plus de détails sur le WML, rendez-vous sur le site Web Wap Forum (http://www.wapforum.org).
Pour activer le module WML : 1 Choisissez Edition > Préférences. 2 Affichez les modules dans la boîte de dialogue Préférences, et sélectionnez WML dans le dossier Extend Scripts. 3 Relancez GoLive.
Les jeux de cartes sont les éléments conteneurs des documents WML. Lorsque vous créez un jeu de cartes, GoLive lui associe automatiquement une définition du type de document (ou DTD, acronyme anglais de « document type definition »). Par défaut, la version de DTD attribuée est 1.3. Vous pouvez cependant spécifier la version 1.1 ou 1.2. Il existe trois modes d’affichage de la fenêtre d’un document WML. Utilisez la vue Mise en page pour concevoir votre document WML. Utilisez la vue Source pour en visualiser le code WML dans un éditeur de texte. Enfin, utilisez l’éditeur de structure pour afficher l’arborescence du jeu de cartes. Pour créer un document WML : Choisissez Fichier > Nouveau document spécial > Document WML. Pour modifier la version de DTD : Cliquez sur le bouton situé dans l’angle supérieur droit de la fenêtre du document et choisissez la version voulue dans le sous-menu Type de document.
Lorsque vous manipulez des éléments, gardez à l’esprit les conseils ci-dessous. •
éléments du panneau Standard de la palette Objets dans un document WML, le jeu de cartes ne fonctionnera pas correctement.
éléments Template (modèle) et Card (carte). Les règles de contenu régissant un élément s’affichent à droite du nom de l’élément dans la fenêtre du document et au bas de la palette Objets lorsque le pointeur de la souris se trouve sur l’icône de l’élément. Les règles de contenu affichent le type et le nombre d’éléments autorisés à l’intérieur d’un élément conteneur. Un point d’interrogation (?) afférent à un élément signifie que 0 ou 1 élément de ce type sont autorisés, un signe plus (+) signifie 1 ou plus, un astérisque (*) signifie 0 ou plus et le symbole ( | ) inséré entre deux éléments signifie qu’il s’excluent mutuellement. Par exemple, la règle de contenu d’une carte est OnEvent?, Timer*, (Do | P)*. Cette règle signifie que sont autorisés : zéro ou un élément OnEvent, zéro élément Timer ou plus et zéro éléments Do ou P ou plus (Do et P n’étant pas compatibles).
Cliquez sur l’icône WML de la palette Objets. Remarque : Vous devez activer le module WML pour pouvoir visualiser les éléments WML dans la palette Objets. (Voir « Configuration des préférences WML », page 531.)
2 Définissez les attributs de l’élément dans son inspecteur, notamment les attributs facultatifs suivants qui sont aussi les plus courants : •
évocateur. Dans la fenêtre du document, cliquez dans la zone en couleur de l’élément. Un cadre s’affiche autour de l’élément lorsqu’il est sélectionné. Pour déplacer un élément : Sélectionnez l’élément dans la fenêtre du document, puis faites-le glisser vers un autre emplacement. Pour supprimer un élément : Sélectionnez l’élément dans la fenêtre du document, puis appuyez sur la touche de retour arrière ou de suppression.
Une carte est un petit ensemble de données affichées dans un navigateur WML. Une carte peut contenir du texte, des images et d’autres éléments WML permettant aux utilisateurs de saisir des données et de naviguer entre les cartes. Pour ajouter une carte au document : Faites glisser l’icône de carte (Card) du panneau WML de la palette Objets dans la fenêtre du document. Relâchez le bouton de la souris lorsque le pointeur se trouve sur la zone en couleur de l’élément WML. Pour spécifier les attributs de la carte : 1 Sélectionnez la carte souhaitée dans la fenêtre du document. 2 Dans l’inspecteur de la carte, saisissez un titre dans la zone de texte appropriée. Les navigateurs WML restituent les titres de cartes sous des formes diverses (noms de signets, info-bulles, etc.) Pour que le titre ne soit pas tronqué, ne dépassez pas 15 caractères.
« Utilisation des événements », page 537.) L’élément de modèle (« template ») doit être placé en premier dans un document. Pour ajouter un modèle au document : Faites glisser l’icône de modèle (Template) du panneau WML de la palette Objets dans la fenêtre du document. Relâchez le bouton de la souris lorsque le pointeur se trouve sur la zone en couleur de l’élément WML. Le cas échéant, faites glisser l’élément de modèle au niveau supérieur du document. Pour spécifier les attributs du modèle : 1 Sélectionnez le modèle souhaité dans la fenêtre du document. 2 Définissez les attributs facultatifs suivants dans l’inspecteur du modèle : •
événements dans l’élément de modèle. (Voir « Utilisation des événements », page 537.)
Pour ajouter du texte, saisissez-le dans l’espace vierge d’un élément. Par défaut, le texte est contenu dans un élément « p », bien que ce dernier ne s’affiche pas dans la vue Mise en page. Vous pouvez également utiliser l’élément « pre » pour saisir du texte préformaté. Pour saisir du texte : Cliquez dans l’espace vierge d’un élément et saisissez le texte voulu. Appuyez sur la touche de retour pour commencer un nouveau paragraphe. Pour utiliser l’élément « pre » : Faites glisser l’icône de préformatage (Pre) du panneau WML de la palette Objets dans la fenêtre du document. Relâchez le bouton de la souris lorsque le pointeur se trouve sur le paragraphe à formater.
Utilisez l’élément « img » pour ajouter des images à une carte. Les images doivent être au format WBMP. Pour convertir une image au format WBMP, il suffit d’ajouter un objet dynamique à un document HTML dans GoLive. (Voir « Ajout d’images et de fichiers multimédias », page 178.)
1 Sélectionnez l’image souhaitée dans la fenêtre du document. 2 Dans l’inspecteur de l’image, définissez les attributs suivants : •
2 Dans la zone de texte « name » de l’inspecteur de la saisie, spécifiez le nom de la variable affectée aux données saisies par l’utilisateur. (Voir « Utilisation de variables », page 539.) Comment utiliser l'aide | Sommaire | Index
1 Faites glisser l’icône de groupe de champs de saisie de texte (Fieldset) du panneau WML de la palette Objets dans la fenêtre du document. Relâchez le bouton de la souris lorsque le pointeur se trouve sur l’emplacement voulu dans un paragraphe. 2 Définissez les attributs facultatifs suivants dans l’inspecteur du groupe de champs de saisie de texte : •
1 Faites glisser l’icône de liste de sélection (Select) du panneau WML de la palette Objets dans la fenêtre du document. Relâchez le bouton de la souris lorsque le pointeur se trouve sur l’emplacement voulu dans un paragraphe. 2 Définissez les attributs facultatifs suivants dans l’inspecteur de la liste de sélection : •
(conformément à l’attribut « value » de l’élément d’option). (Voir « Utilisation de variables », page 539.)
2 Saisissez le texte correspondant à l’option dans la zone vierge de l’élément d’option. 3 Définissez les attributs facultatifs suivants dans l’inspecteur de l’option : •
Objets dans la fenêtre du document. Relâchez le bouton de la souris lorsque le pointeur se trouve sur la zone en couleur de l’élément « select ». 2 Définissez les attributs facultatifs suivants dans l’inspecteur du groupe d’options : •
Lorsqu’un utilisateur effectue une action à l’aide d’un appareil sans fil, le navigateur WML capture cette donnée. En termes techniques, l’action de l’utilisateur est appelée événement. Vous pouvez utiliser des événements pour exécuter des tâches dans votre jeu de cartes WML.
1 Faites glisser l’icône Onevent du panneau WML de la palette Objets dans la fenêtre du document. Relâchez le bouton de la souris lorsque le pointeur se trouve sur la zone en couleur de l’un des éléments suivants : carte (« card ») , modèle (« template ») ou option (« option »). 2 Dans le menu « type », choisissez le type d’événement auquel vous souhaitez associer la tâche. 3 Ajoutez une tâche à l’élément « onevent ». (Voir « Utilisation des tâches », page 538.) Pour ajouter un élément d’événement extrinsèque (« do ») : 1 Faites glisser l’icône Do du panneau WML de la palette Objets dans la fenêtre du document. Relâchez le bouton de la souris lorsque le pointeur se trouve sur la zone en couleur d’une carte (« card ») ou d’un modèle (« template »). 2 Dans le menu « type », choisissez le type d’événement auquel vous souhaitez associer la tâche. 3 Définissez les attributs facultatifs suivants dans l’inspecteur de l’événement « do » : •
3 Définissez les attributs facultatifs suivants dans l’inspecteur correspondant : •
2 Pour les éléments de retour à la page précédente (« prev ») et de rafraîchissement (« refresh »), ajoutez un élément de définition des variables (« setvar ») à la tâche. (Voir « Utilisation de variables », page 539.)
Les variables permettent le traitement de données utilisateur et la transmission de données entre éléments d’un même document (jeu de cartes). Utilisez un élément « setvar » pour définir les variables. L’élément « postfield » est semblable à une variable dans la mesure où il permet de spécifier le nom d’un champ et la valeur de transmission à un serveur lors d’une requête d’URL. (Voir « Utilisation des tâches », page 538.) Pour définir un élément « setvar » ou « postfield » : 1 Faites glisser l’icône Setvar ou Postfield du panneau WML de la palette Objets dans la fenêtre du document. Relâchez le bouton de la souris lorsque le pointeur se trouve sur la zone en couleur de l’un des éléments suivants : « go », « prev » ou « refresh ». 2 Spécifiez un nom et une valeur dans les inspecteurs appropriés.
éléments ancre (« anchor ») et <a>. L’élément d’ancre vous permet de lier du texte et des images à des tâches de navigation, de retour à la carte précédente ou de rafraîchissement. L’élément <a> est une forme raccourcie de l’élément d’ancre. Pour ajouter un lien hypertexte : 1 Faites glisser l’icône Anchor ou A du panneau WML de la palette Objets dans la fenêtre du document. Relâchez le bouton de la souris lorsque le pointeur se trouve sur l’emplacement voulu dans un paragraphe. 2 Effectuez l’une des opérations suivantes : •
2 Si la carte contient d’autres éléments, placez le temporisateur en haut de la carte. 3 Dans la zone de texte « value » de l’inspecteur, saisissez la valeur souhaitée pour le temporisateur (en dixièmes de seconde). 4 Définissez l’attribut facultatif « name » dans l’inspecteur pour spécifier la variable à utiliser lors de l’initialisation du temporisateur.
Application Protocol). Pour plus de détails, renseignez-vous auprès du prestataire de services chargé de votre site sans fil. Vous pouvez utiliser les fonctions de transfert de fichiers FTP de GoLive afin de transférer votre site sur un serveur. GoLive permet de publier facilement la totalité de votre site, en une seule fois, puis de publier progressivement de nouvelles parties ou des mises à jour du site. Pour plus de détails sur la publication d’un site Web, voir « Introduction au transfert de fichiers et à la publication de site », page 357. Pour plus de détails sur le protocole WAP, le langage WML, les passerelles et les serveurs, rendez-vous sur le site http://forum.nokia.com, puis cliquez sur WAP.
Le langage HTML-Basic a été développé pour les navigateurs ne prenant pas en charge toutes les fonctions HTML, comme les téléphones mobiles et les ordinateurs de poche, par exemple. Grâce à des règles simples et strictes, le code XHTML-Basic permet la création de contenu au format compact, accessible à de nombreux appareils. XHTML-Basic est désormais le langage de référence pris en charge par tous les micronavigateurs : combinés sans fil, applications domestiques et systèmes télématiques de voiture. Pour la plupart, les micro-navigateurs des futurs appareils mobiles seront bimodes. Autrement dit, ils prendront en charge le contenu WML 1.0 et XHTML-Basic. Pour plus de détails sur le langage XHTML-Basic, rendez-vous sur le site http://forum.nokia.com, cliquez sur WAP, puis sur XHTML. Vous pouvez également consulter les adresses suivantes : http://www.access.co.jp, http://www.access.co.jp/english/remarkable/nfw.html, www.assess-us-inc.com et http://www.w3.org/MarkUp/
Pour développer vos pages XHTML-Basic, travaillez dans un fichier projet de site afin de bénéficier de tous les avantages de GoLive. En effet, le fichier projet du site vous permet de gérer les liens et les éléments de construction, d’utiliser le diagramme de structuration du site et d’enregistrer des modèles et des gabarits de pages, le tout pour plus de cohérence et d’efficacité dans le travail. Suivez les instructions de base pour développer votre site. Configuration de l’environnement et des pages Vous devez configurer la palette Objets de manière à faire glisser uniquement des éléments XHTML-Basic corrects sur votre page. Pour ce faire, vous devez définir le type de document XHTML-Basic voulu pour la page et configurer l’aperçu dans un navigateur. Lorsque vous définissez le type de document, seules les options de formatage compatibles avec le langage XHTML-Basic sont disponibles.
Objets lorsqu’elle est configurée pour le langage XHTML-Basic. Prévisualisation de pages via l’émulateur de téléphone Le CD-Rom d’Adobe GoLive 6 (pour Windows uniquement) inclut un émulateur vous permettant de visualiser vos pages XHTML-Basic sur différents modèles de téléphones Nokia. Vous pouvez également utiliser le vérificateur de syntaxe pour vous assurer de la validité du code XHTML-Basic utilisé dans vos pages. (Voir « Vérification de la syntaxe », page 440.)
Le langage XHTML-Basic correspond partiellement au XHTML. Certains éléments et attributs ne sont donc pas disponibles pour le XHTML-Basic, mais vous pouvez configurer la palette Objets de manière à afficher uniquement les icônes représentant des éléments XHTML-Basic corrects. Pour configurer la palette Objets pour la création XHTML : Dans le menu de la palette Objets, choisissez Configurez > XHTML-Basic. Le menu de la palette Objets est accessible depuis l’angle supérieur droit de ladite palette. Pour plus de détails sur la palette Objets, voir « Utilisation des outils de conception de page », page 17.
Avant d’ajouter du contenu à une page, vous devez la configurer et l’enregistrer. Vous pouvez ensuite définir d’autres propriétés de la page, comme le titre ou la couleur du texte des liens. Pour créer et configurer une page : 1 Choisissez Fichier > Nouveau document spécial > Page XHTML-Basic. 2 Pour convertir une page existante au format XHTML-Basic, choisissez Balise > Convertir en XHTML dans le menu de la fenêtre du document, puis sélectionnez le type de document XHTML-Basic 1.0 via le même menu. Remarque : Lors de la création d’un nouveau site, GoLive crée automatiquement la page d’accueil du site (généralement nommée index.html). Pour utiliser cette page, vous devez d’abord la convertir au format XHTML-Basic. 3 Pour simuler l’affichage d’un écran de téléphone, placez le pointeur de la souris dans la fenêtre du document, cliquez pour afficher le menu contextuel, puis choisissez Afficher > Profil du navigateur > Téléphone Nokia XHTML. Pour afficher un menu contextuel, cliquez sur l’élément voulu avec le bouton droit de la souris (Windows) ou en appuyant sur la touche Control (Mac OS). 4 Pour intituler une page, choisissez Spécial > Propriétés de la page, puis saisissez le titre souhaité dans l’inspecteur de la page. Remarque : Le titre de la page est enregistré de manière à servir de nom de signet sur le téléphone lorsque la page est mise en signet par les utilisateurs.
N’oubliez pas que la plupart des écrans de téléphone n’affichent pas les couleurs. Le moyen le plus efficace de développer un site XHTML-Basic est de définir une page de gabarit dans votre site, et de l’enregistrer au format XHTML-Basic après avoir sélectionné l’affichage du navigateur Nokia. Il est ensuite aisé de créer de nouvelles pages dotées de ces caractéristiques en ouvrant le gabarit situé dans le dossier Gabarits du site. Pour plus de détails sur les gabarits, voir « Utilisation de gabarits », page 346.
Vous avez la possibilité d’ajouter du texte, des images et des éléments de formulaire à des pages XHTML-Basic comme à toute page HTML. Faites glisser les icônes de la palette Objets et définissez les options voulues dans l’inspecteur correspondant. Lorsque vous configurez la palette Objets pour le XHTML-Basic, seuls les éléments XHTML-Basic corrects sont disponibles. Vous pouvez formater du texte à l’aide des menus et des barres d’outils, mais aussi des feuilles de style en cascade. En définissant l’affichage du navigateur, vous pouvez visualiser l’aspect approximatif de vos pages sur un téléphone Nokia.
Vous pouvez prévisualiser vos pages XHTML-Basic dans un émulateur de téléphone. Vous trouverez l’émulateur de Nokia pour GoLive 6 sur le CD-Rom d’Adobe GoLive 6.0 (pour Windows uniquement). Il est situé dans le dossier Wireless Emulators du CD-Rom (Wireless Emulators/Nokia). Pour obtenir des instructions d’installation, consultez le fichier Readme relatif à l’installation, disponible sur le CD-Rom de GoLive. Après avoir défini les préférences de GoLive, vous pouvez démarrer l’émulateur dans GoLive et prévisualiser automatiquement la page active et les pages associées. Pour plus de détails sur l’utilisation de l’émulateur, voir le fichier Readme de GoLive sur le CD-Rom du logiciel. Pour définir les préférences de prévisualisation dans un émulateur de navigateur de téléphone : 1 Assurez-vous que l’émulateur de téléphone Nokia est installé sur votre disque dur. 2 Choisissez Edition > Préférences, puis cliquez sur Navigateurs dans le panneau gauche de la boîte de dialogue Préférences. 3 Cliquez sur Ajouter. Ensuite, localisez et sélectionnez l’émulateur, puis cliquez sur Ouvrir. 4 Si vous souhaitez définir l’émulateur de téléphone comme navigateur par défaut, sélectionnez-le dans la fenêtre. Lorsque vous cliquez sur le bouton Afficher dans le navigateur de la barre d’outils, le navigateur sélectionné dans la liste s’ouvre et affiche un aperçu de votre page.
Utilisez les fonctions de transfert de fichiers FTP de GoLive pour publier votre site XHTMLBasic. GoLive permet de publier facilement la totalité de votre site, en une seule fois, puis de publier progressivement de nouvelles parties ou des mises à jour du site. Pour plus de détails sur la publication d’un site Web, voir « Introduction au transfert de fichiers et à la publication de site », page 357.
électronique dynamiques. Grâce à GoLive, un concepteur Web peut créer un modèle de page auquel il lie du texte, des images ou tout autre contenu dynamique provenant d’une base de données, d’une source XML ou d’un serveur de commerce électronique. GoLive génère le code nécessaire pour accéder au contenu dynamique, remplace les balises d’emplacement du modèle et exécute des actions serveur, telles que la mise à jour d’une base de données. Le module de contenu dynamique prend en charge de nombreuses technologies serveur, dont les scripts ASP (Active Server Pages), JSP (JavaServer Pages), et PHP (Hypertext Preprocessor). GoLive facilite également l’utilisation de contenu dynamique grâce à plusieurs fonctions-clés. Pour les sites dont le contenu varie peu, la possibilité de publier du contenu dynamique sous forme de pages statiques est idéale. La fonction CustomMerchant vous permet de créer rapidement un site de commerce électronique. Grâce au logiciel serveur préconfiguré livré avec GoLive, vous n’avez pas besoin d’être un spécialiste réseau pour rendre votre site opérationnel.
Avant d’examiner plus en détails le module Dynamic Content de GoLive et les fonctions associées, il est nécessaire de comprendre le fonctionnement général du contenu dynamique.
Les pages statiques d’un site Web sont des pages dont la mise à jour est effectuée manuellement. Les pages dynamiques sont des modèles ayant vocation à diffuser des informations stockées dans des bases de données en ligne (communiqués de presse, pages produits de sites commerciaux ou actualités, par exemple). L’information est insérée dans le modèle de page de manière à afficher une page complète dans le navigateur de l’utilisateur. Les pages dynamiques peuvent également exécuter des actions telles que la mise à jour d’une base de données.
Supposons maintenant que votre société publie cinq nouveaux communiqués. Dans un site statique, vous devez ajouter manuellement cinq nouveaux titres à la page principale, créer cinq pages, insérer le texte complet de chaque communiqué dans ces pages et créer des liens entre les titres et les pages correspondantes. Ce type de gestion de site vous fait perdre du temps et comporte des risques d’erreur. Vous pouvez réduire considérablement la quantité de travail en utilisant la technologie de contenu dynamique. Dans un site dynamique, il vous suffit de créer deux pages génériques ou modèles : une page index répertoriant les titres et une page détaillée affichant le texte complet d’un communiqué. Les deux modèles tirent leur contenu d’une base de données de communiqués de presse. La page index affiche les titres des communiqués contenus dans la base de données. Lorsqu’un utilisateur clique sur un titre, le second modèle sollicite la même base de données pour obtenir le texte correspondant. Ainsi, pour ajouter des communiqués de presse au site, il suffit de les ajouter à la base de données appropriée. Le processus est automatique et efficace.
Les bases de données organisent les informations sous forme d’enregistrements (noms, adresses ou numéros de téléphone, par exemple). Une série d’enregistrements constitue une table. Généralement, dans une base de données, on nomme les lignes de la table « enregistrements » et les colonnes « champs ». Une base de données relationnelle contient des tables liées les unes aux autres par un champ commun appelé « champ clé ». Ce champ clé peut correspondre à un identifiant (un numéro de sécurité sociale ou un numéro de série , par exemple) et est propre à chaque enregistrement.
(enregistrements). B. Une base de données contient des tables. Lorsque ces tables sont reliées par un champ commun unique (un identifiant d’enregistrement ou un numéro de sécurité sociale, par exemple), la base de données est dite « relationnelle ». C. Un sous-ensemble de données d’une table est appelé « jeu d’enregistrements » et constitue lui-même une table.
Les applications de base de données permettent de contrôler l’accès à une table par le biais d’autorisations. Il est possible d’autoriser un utilisateur à visualiser une table tout en lui interdisant de la modifier. Lors de l’accès à une base de données depuis une page Web, deux identités sont impliquées. La première est celle du serveur Web. Il s’agit souvent de l’identité d’un utilisateur Internet anonyme définie sur le serveur. Par exemple, le serveur Web IIS de Microsoft est configuré par défaut pour fonctionner sous l’identité IUSR_machine dans laquelle machine est le nom réseau de la machine. La seconde identité concernée est celle de l’utilisateur de la base de données. La plupart des systèmes de base de données ont leur propre concept d’identité utilisateur, distinct de celui du système d’exploitation utilisé. Lors de l’établissement d’une connexion à une base de données, il est possible de fournir un nom d’utilisateur de la base de données et un mot de passe qui sont utilisés comme identité de la base de données. C’est cette identité qui détermine les droits d’accès à la page Web. Pour plus de détails sur la définition de l’identité de la connexion à la base de données, voir « Présentation des sources de données », page 564.
Web. Il peut s’agir de bases de données relationnelles, de fichiers XML, de paniers ou de bons de commande. Vous pouvez également définir des sources de données personnalisées. Une source de données est un objet défini dans GoLive pour un site Web spécifique. La source de données inclut des informations sur le mode de connexion à la base de données et, le cas échéant, sur les nom et mot de passe requis pour accéder à la base de données. Pour plus de détails sur l’ajout de sources de données à un site Web, voir « Présentation des sources de données », page 564.
Il est possible de visualiser des pages Web directement depuis le système de fichiers dans lequel la page est stockée. Vous pouvez utiliser le panneau Aperçu de GoLive ou un navigateur Web pour visualiser directement le fichier contenant la page Web. En revanche, étant donné que les pages dynamiques contiennent du code de script exécutable, elles doivent être traitées sur un serveur Web pour que vous puissiez visualiser votre page telle qu’elle s’afficherait dans le navigateur d’un internaute. En conséquence, contrairement à un site Web statique, votre site et la base de données doivent être téléchargés sur un serveur Web pour permettre la création et la prévisualisation de pages Web dynamiques dans GoLive. En clair, un serveur Web est un programme exécuté sur un ordinateur parfois appelé hôte du serveur ou ordinateur hôte. Le logiciel serveur Web envoie des pages Web à des navigateurs lorsque, par exemple, un internaute saisit une adresse Web (URL) ou clique sur un lien dans une page de votre site. Un serveur Web est ainsi nommé car il « sert » ou envoie la page à un navigateur la page demandée par un utilisateur. Remarque : Les serveurs Web peuvent également être caractérisés par la manière dont ils s’intègrent dans le flux de production. Un serveur inaccessible au public, conçu pour effectuer des tests internes de sites, est appelé « serveur de montage ». Le serveur qui héberge le site en vue de l’accès du public est généralement appelé « serveur de production ». Lorsque vous travaillez à un site, il est stocké sur votre ordinateur local ou sur le serveur Web Workgroup Server. Il est possible d’y créer et d’y modifier des pages. Pour tester le site, il est nécessaire d’y accéder via un serveur Web qui procède au traitement des pages dynamiques. Pour ce faire, les pages doivent être téléchargées sur un serveur de montage ou de développement. Voir « Téléchargement de fichiers vers et depuis un serveur à l’aide de FTP », page 362 pour plus de détails sur l’utilisation du protocole FTP, « Gestion des fichiers et dossiers sur un serveur WebDAV », page 376 pour plus de détails sur WebDAV et « A propos des sites collaboratifs GoLive », page 379 du pour plus de détails sur la publication de sites collaboratifs. Si vous utilisez l’assistant de création de site dynamique pour configurer un site en vue d’y insérer du contenu dynamique, GoLive tente de télécharger les fichiers sur le serveur désigné. La réussite de cette opération conditionne le fonctionnement du site. Les serveurs de montage et de production présentent des différences.
Le serveur Web distingue les pages statiques des pages dynamiques. Pour renvoyer des pages statiques, il accède au fichier contenant la page, puis il envoie son contenu au client, généralement un navigateur. Pour les pages dynamiques, le serveur Web exécute un programme qui interprète le contenu de la page et envoie le résultat (des données image, HTML, XML, etc.) au client. Etant donné que les pages dynamiques contiennent souvent des commandes écrites en langage de script, ce processus est parfois appelé exécution de scripts serveur.
Access, Oracle, Microsoft SQL Server et toutes les bases de données accessibles par ODBC telles que FileMaker Pro. Le pilote OBDC ne fournissant pas d’informations sur la clé primaire pour les tables des bases de données, il est recommandé d’utiliser le pilote OLE DB.
Le langage XSLT (Extensible Stylesheet Language Transformations) permet de convertir des documents XML dans différentes versions XML. De plus en plus d’application Web utilisent le langage XML pour envoyer des données à des serveurs Web qui les présentent au format HTML. GoLive vous permet d’extraire des données XML, avec ou sans XSLT, et d’utiliser ces données dans des pages Web aussi simplement que si elles provenaient d’une base de données.
CustomMerchant est une solution de commerce électronique développée conjointement par Adobe Systems, Evocative Software et Plug ‘n Pay, ces deux sociétés étant spécialisées dans les systèmes de paniers. Leur puissant logiciel de transaction est intégré à CustomMerchant ainsi que les outils précis de mise en page et de contenu dynamique de GoLive pour offrir des solutions de commerce électronique personnalisées. Il vous suffit de concevoir et de mettre en page les pages de transaction de votre site de commerce électronique, puis d’utiliser la palette des liaisons dynamiques pour doter vos pages de la fonctionnalité de commerce électronique sans vous soucier de la programmation des logiciels serveur ProCart (d’Evocative) ou Plug ‘n Pay. CustomMerchant fournit une solution de commerce électronique simple, puissante et conviviale, ne sacrifiant ni les fonctions, ni la conception visuelle professionnelle. Pour plus de détails sur l’utilisation de la fonction CustomMerchant, consultez le CD-Rom d’installation.
à d’autres fichiers à l’aide de leur nom alors que JSP utilise les noms d’autres classes localisées à l’aide des mécanismes Java de recherche de classes). Le code de votre page Web peut appeler des fonctions dans ces fichiers externes référencés. GoLive configure automatiquement tout cela. Les fichiers supplémentaires se trouvent dans les dossiers Config et WEB-INF (JSP uniquement). Ni ces fichiers, ni le code ajouté à la page ne sont envoyés au navigateur. En effet, ces éléments sont traités sur le serveur, puis supprimés du code HTML avant l’envoi au navigateur. Le seul facteur d’augmentation du délai d’expédition d’une page est le contenu dynamique à afficher lui-même.
Pour créer des sites ou des pages dotés de contenu dynamique, utilisez différents éléments de l’interface du module Dynamic Content. Cette interface comprend la palette des liaisons dynamiques, la barre d’outils Contenu dynamique, l’Assistant de création de site dynamique, l’éditeur de source de contenu et l’inspecteur de la source de contenu. La palette des liaisons dynamiques permet de lier les éléments d’une page (texte, images, formulaires ou liens) à des sources de contenu dynamique. Pour afficher la palette, choisissez Fenêtre > Liaisons dynamiques. La barre d’outils Contenu dynamique permet de basculer entre les modes d’opération en ligne/hors ligne, d’activer/de désactiver la mise en évidence du contenu dynamique et d’afficher le panneau Contenu dynamique de la boîte de dialogue de configuration du site. Celui-ci vous offre la possibilité de définir les caractéristiques du site dynamique, notamment les paramètres de sécurité, les langages de script serveur, l’emplacement du site Web, les paramètres FTP et WebDAV ainsi que les sources de données. Pour afficher la barre d’outils, choisissez Fenêtre > Barre d’outils Contenu dynamique Vous pouvez laisser flotter cette barre dans la fenêtre ou la faire glisser dans la barre d’outils principale de GoLive et l’y ancrer. L’Assistant de création de site dynamique vous guide pas à pas dans la préparation d’un site en vue de l’utilisation de contenu dynamique. Pour accéder à cet assistant, cliquez sur le bouton Configuration du contenu dynamique du site sur la barre d’outils Contenu dynamique, puis sur le bouton Assistant de création de site dynamique dans la boîte de dialogue de configuration du site. Si le site est déjà dynamique, cette boîte de dialogue affiche les paramètres relatifs au contenu dynamique du site.
L’inspecteur de la source de contenu affiche des informations sur la source de contenu sélectionnée et vous permet de procéder à des modifications. Pour les sources de contenu SQL, il permet également de lier une source de contenu à une base de données ou à un tableau, de définir le filtrage des saisies ainsi que des critères de tri ou encore d’insérer des instructions SQL personnalisées. Pour plus de détails sur la définition des préférences du module Dynamic Content, voir « Configuration des préférences », page 620.
Un site Web dynamique n’est pas une simple série de pages, d’images et de données. Les sites Web dynamiques offrent aux internautes une expérience interactive grâce à des informations générées, regroupées, stockées et traitées de manière dynamique. Ce type de site est parfois appelé application Web. Lorsque vous concevez une application Web, vous devez vous pencher sur le type d’interaction utilisateur, la configuration serveur, les outils de base de données, etc. Ces considérations dépassent le cadre du présent guide. Nous vous présentons ci-après le processus de base et l’utilisation de GoLive en vue de rendre la construction d’une application Web aussi simple et rapide que possible.
Pour structurer le site, utilisez de préférence les outils de diagramme de site de GoLive (voir « A propos des diagrammes de conception », page 406). Spécifiez les pages, les formulaires et les choix des utilisateurs, et définissez des pages auxquelles les internautes accéderont par choix. Pour chaque page dotée de contenu dynamique basé sur SQL, identifiez la base de données et la table (ou tableau) dont proviennent les informations.
A l’aide des outils de base de données, créez une base de données et définissez les tables qui seront utilisées par l’application Web. Si vous utilisez un serveur Windows et la technologie ASP, Microsoft Access est l’application de base de données idéale. Si votre site dynamique vise un public large, il est déconseillé de choisir une base de données Access pour le site de production. MySQL est un système de base de données généraliste qui convient bien aux technologies PHP et JSP. Il est également possible de choisir des systèmes plus importants tels qu’Oracle et SQL Server. Profitez des outils disponibles pour créer des tables pour tous ces systèmes de base de données. A ce stade, vous pouvez générer des requêtes (avec Access) ou leur équivalent dans d’autres applications si nécessaire.
Continuez et créez les pages du site. Effectuez leur mise en page et insérez des tableaux, des formulaires et d’autres éléments. Remplissez les tableaux destinés à recevoir du contenu d’une base de données avec du texte balise, également appelé contenu fictif. Cette méthode vous permet de concevoir la page et de décider de son aspect. Il est d’usage de réviser cette ébauche de site avec des clients et des utilisateurs afin de peaufiner le site avant de le rendre dynamique. Vous pouvez vous inspirer des exemples de sites dynamiques disponibles dans le dossier d’installation de GoLive.
Pour pouvoir travailler avec des pages dynamiques, en afficher un aperçu et obtenir les informations de la base de données, le serveur doit être en mesure de traiter les pages dans le site. Il est donc nécessaire de configurer un espace du serveur pour votre site Web. (Voir « Préparation d’un site sur un serveur Web », page 557.) Outre l’envoi de vos pages Web statiques et dynamiques, le serveur prend en charge la connexion au serveur de la base de données ou d’une autre source de données (XML, par exemple). Il est probable que le serveur soit exécuté via un fournisseur de services Internet. Le cas échéant, faites appel à ce dernier pour obtenir des informations relatives à la méthode à utiliser pour télécharger des pages et du contenu de base de données vers le serveur. La prestation doit comprendre la prise en charge des technologies ASP, JSP et PHP ainsi qu’un accès aux bases de données. GoLive inclut également des serveurs préconfigurés pour Windows et Mac OS X, basés sur les distributions standard Apache, PHP et Tomcat. Tous les modules requis sont inclus et préconfigurés. Ce type de serveur peut être utilisé comme serveur de développement PHP ou JSP. Des exemples de sites et des zones de site de test sont inclus.
Cette étape consiste à rendre le site dynamique afin de le préparer à prendre en charge des pages GoLive dynamiques utilisant des scripts ASP, JSP ou PHP. Un assistant vous guide dans ce processus. A chaque étape, il vérifie que la configuration est correcte. Vous pouvez lancer l’Assistant de création de site dynamique depuis le panneau Contenu dynamique de la boîte de dialogue de configuration du site.
Dans un site dynamique, les sources de données renferment les informations indispensables pour accéder à une base de données ou à une autre source de contenu dynamique. Vous pouvez utiliser un fichier de base de données Microsoft Access au lieu d’une source de données. La source de données comprend généralement des informations spécifiques nécessaires pour accéder à la base de données. En général, la source de données SQL contient les éléments suivants : •
Les sources de données sont toujours stockées sur le serveur comme une partie de votre site. GoLive effectue cette opération automatiquement. Pour plus de détails sur la configuration des sources de données, voir « Présentation des sources de données », page 564.
Lorsque vous rendez un site dynamique, vous lui attribuez la prise en charge des langages ASP, JSP ou PHP. Si vous dynamisez des pages individuellement, elles sont dotées de l’extension .asp, .jsp ou .php au lieu de .html. Un site dynamique peut contenir des pages dynamiques et statiques. Certaines peuvent même posséder uniquement du contenu statique.
éléments des pages aux champs de source de contenu. Vous devez maintenant relier les éléments des pages à des informations dynamiques. Une source de contenu est un objet placé sur une page qui représente des informations issues d’une base de données ou d’une autre source de données. La source de contenu relative à une base de données identifie la base de donnée, le tableau, les critères de tri et les informations concernant la requête. Chaque source de contenu peut fournir zéro, une ou plusieurs saisies (enregistrements).
Vous pouvez définir des actions spéciales déclenchées lorsque l’utilisateur active un lien URL ou un bouton d’envoi de formulaire. Parmi exemple, vous pouvez configurer un bouton d’envoi de manière à ajouter une saisie à une base de données ou à mettre à jour une saisie existante.
Après avoir rendu les pages dynamiques et ajouté les sources de contenu et les liaisons inhérentes, testez-les. Pour ce faire, vous pouvez utiliser le panneau Aperçu de GoLive. Souvenez-vous que le panneau Aperçu n’est pas un véritable navigateur et qu’il ne permet pas systématiquement d’activer toutes les fonctions de la page. Le panneau Aperçu de GoLive télécharge une copie provisoire de la page vers le serveur qui la traite et renvoie le résultat pour l’afficher dans GoLive. Vous pouvez également utiliser la commande d’affichage dans le navigateur pour vos pages dynamiques. Sachez cependant que certaines fonctions dynamiques restent inopérantes puisque la page n’est pas traitée sur un serveur Web. Une autre possibilité consiste à télécharger les pages sur le serveur et à visualiser leur contenu dynamique dans un navigateur en saisissant l’URL de votre site dans le navigateur.
Une fois les pages testées, téléchargez le site sur un serveur de production accessible aux internautes. Vous devez préalablement configurer le site pour les pages dynamiques en définissant un langage (ASP, JSP ou PHP) et l’accès du site à une base de données. Modifiez l’URL de la racine du site dans le panneau Contenu dynamique de la boîte de dialogue de configuration du site. Le cas échéant, redéfinissez aussi le lien de vos sources de données avec les serveurs de bases de données de production. Vous pouvez alors télécharger le site vers le serveur de production. Pour plus de détails sur les questions de sécurité relatives aux serveurs de production, voir « Protection d’un site dynamique », page 619.
Les concepteurs de sites Web dotés de contenu dynamique peuvent se trouver dans différentes situations. Examinons les scénarios les plus courants. Nous présenterons d’abord les aspects généraux de la création d’un site dynamique avant d’entrer dans les détails des tâches à effectuer.
La plupart des concepteurs de sites dynamiques sont confrontés aux scénarios type décrits ci-après.
Ainsi, vous n’avez pas à vous préoccuper des serveurs distants avant le téléchargement du site sur un serveur de montage ou de production. Pour les ordinateurs Macintosh, cette configuration n’est possible que sous Mac OS X. Configuration du serveur : •
Les serveurs Web répondent à des demandes de pages Web spécifiques émanant d’un navigateur en lui renvoyant ces pages après les avoir traitées. Pour les pages statiques, l’opération consiste simplement à renvoyer la page telle quelle au navigateur. Pour les pages dynamiques, cela implique l’exécution de tout le code de la page avant son expédition à l’internaute. Pour exécuter le code d’une page, un environnement spécifique est requis (bibliothèques ou fichiers de configuration définissant cet environnement, par exemple). Les fichiers de configuration des sites Web dynamiques varient en fonction du serveur utilisé. La présente section décrit la procédure de configuration relative aux serveurs les plus courants. Lorsqu’un serveur traite une demande, il identifie la page à l’aide de son URL. Dans sa première partie, l’URL indique le serveur et le numéro du port. Si aucun numéro n’est spécifié, le numéro du port d’écoute par défaut est 80. Le cas échéant, un port est affecté à chacun des serveurs Web installés sur un même ordinateur. L’URL indique ensuite un nom de chemin qui se termine par le nom de la page spécifique. Par exemple : http://www.adobe.com/products/main.html
Pour préparer un site sur un serveur Web : 1 Placez le site sur le serveur Web. Si GoLive, votre site et le logiciel serveur Web sont sur le même ordinateur (scénario 1), passez l’étape suivante. Si le serveur Web est installé sur un autre ordinateur, vous devez créer un dossier destiné au site sur ce serveur avant de poursuivre. Vous devez éventuellement demander à votre administrateur système ou à votre fournisseur de services Internet quelle est la meilleure méthode et où créer le dossier du site sur le serveur Web. L’administrateur système peut aussi être amené à créer le répertoire virtuel et à vous informer du nom et du chemin d’accès attribués. 2 Créez sur votre serveur Web un répertoire virtuel pointant vers le dossier créé à l’étape 1 (ou vers le dossier de développement du site si vous avez passé l’étape 1). Voir « Création de répertoires virtuels », page 558. Remarque : Le dossier de développement de votre site est situé dans le sous-dossier du dossier contenant le fichier site de GoLive.
Cette opération dépend de la plate-forme utilisée. Assurez-vous que le logiciel de serveur Web est installé et exécuté avant d’essayer de créer un répertoire virtuel. Si vous exécutez le serveur PWS (Personal Web server) sous Windows 98/Me ou le serveur IIS sous Windows 2000 /XP, effectuez les opérations ci-après pour créer un répertoire virtuel. Remarque : Ces serveurs prennent en charge le langage ASP ainsi que PHP si le module externe approprié a été installé. 1 Cliquez avec le bouton droit de la souris sur le dossier de développement contenant les fichiers de votre site, puis choisissez Propriétés dans le menu contextuel. 2 Cliquez sur l’onglet de partage Web. 3 Activez le bouton radio Partager ce dossier. 4 Dans la boîte de dialogue Modification d’alias, saisissez le nom du répertoire virtuel. Il peut être identique au nom de votre site. 5 Assurez-vous que les options d’accès Lire et Scripts sont sélectionnées, puis cliquez sur OK.
1 Choisissez Démarrer > Programmes > Outils d’administration > Gestion de l’ordinateur. 2 Dans Services et applications, développez l’arborescence des services Internet. 3 Sélectionnez le site Web par défaut, puis cliquez sur le bouton d’action, pointez sur Nouveau et sélectionnez Répertoire virtuel. 4 Suivez les indications de l’assistant de création de répertoire virtuel. Vérifiez que les options Lire et Scripts sont bien sélectionnées. Le répertoire virtuel est immédiatement disponible sur le serveur. Pour créer un répertoire virtuel sur un système exécutant le logiciel de serveur Web Apache : Remarque : Le serveur Web Apache utilise le terme alias au lieu de répertoire virtuel. 1 Localisez le fichier conf/httpd.conf dans le répertoire d’installation d’Apache. 2 Vers la fin du fichier, saisissez une directive comme ci-dessous. Veillez à ne pas insérez cette directive dans une autre : Alias /site_name "C:\pathname_to_site\your_site_directory" <Alias /site_name "C:\pathname_to_site\your_site_directory"> Options Indexes FollowSymLinks MultiViews ExecCGI AllowOverride All Pour créer un répertoire virtuel sur un système exécutant le logiciel de serveur Web Tomcat : Remarque : Le serveur Web Tomcat utilise le terme contexte au lieu de répertoire virtuel. 1 Localisez le fichier conf/server.xml dans le répertoire d’installation de Tomcat.
4 Arrêtez et relancez le serveur Tomcat (ainsi qu’Apache si vous exécutez Tomcat sous Apache) pour que les modifications prennent effet. Remarque : A chaque installation de nouvelles classes Java dans le contexte Tomcat, il est nécessaire d’arrêter et de relancer le serveur.
Dans un URL classique tel que http://server:82/application/dir1/dir2/page.php, server représente le nom du serveur. L’infrastructure réseau résout ce nom afin d’identifier l’ordinateur sur lequel se trouve le serveur. Le numéro de port (82) sert à identifier la connexion sur ce serveur, et le reste de l’URL fournit le chemin d’une page spécifique. Lorsqu’un navigateur effectue une requête auprès du serveur, ce nom de chemin (« /application/dir1/dir2/page.php ») est résolu par le serveur pour identifier la page à traiter et à renvoyer. Pour les pages et les sites statiques, le serveur doit uniquement ouvrir le fichier et envoyer son contenu au navigateur. Pour les pages et les sites dynamiques, des processus plus complexes entrent en jeu (l’utilisation de bibliothèques spécifiques ou l’installation de fichiers de configuration, par exemple). Les sites JSP requièrent l’association d’un dossier WEB-INF au site. Ce dernier contient du code Java disponible pour les pages Web du site. Les sites PHP et ASP (également nommés applications Web) sont parfois dotés d’informations de codage ou d’initialisation. Le premier segment du chemin du serveur (application dans notre exemple) permet généralement d’identifier l’application Web. Le premier segment, également nommé répertoire virtuel ou alias, peut aussi être mappé à un dossier spécifique du serveur. Cela permet d’installer les sites Web dans n’importe quel dossier du système de fichiers du serveur. Les sites GoLive ASP et PHP ne requièrent pas une application de serveur Web particulière ni la configuration de répertoires virtuels. L’emplacement du site dans le système de fichiers du serveur est indifférent. Un environnement ASP ou PHP configuré de manière adéquate est requis.
Travail en ligne et hors ligne GoLive vous permet de développer votre site en ligne ou hors ligne. Par défaut, un site doté de contenu dynamique fonctionne en ligne. Autrement dit, GoLive tente d’établir une connexion avec le serveur Web lorsqu’une information relative à la base de données ou à un élément de configuration du site est nécessaire. GoLive enregistre la réponse du serveur dans le cache lorsque vous travaillez en ligne. Néanmoins, vous pouvez parfois avoir besoin de travailler hors-ligne. Par exemple, le serveur Web ou celui de votre base de données peuvent être déconnectés pour des raisons variées (de maintenance, par exemple). Puisque GoLive ne peut pas établir de connexion avec un serveur déconnecté, une boîte de dialogue d’avertissement vous invite à travailler hors connexion. Si vous acceptez, GoLive utilise des réponses du serveur stockées dans le cache. Ainsi, vous pouvez continuer à lier des éléments de page et à créer des sources de contenu pour les bases de données et les tableaux existants. Si vous utilisez une nouvelle base de données ou un nouveau tableau, vous avez la possibilité de saisir manuellement les noms de champs mais aucune liste de sélection n’est disponible et les noms saisis ne peuvent pas être validés. Vous pouvez décider de travailler hors ligne à tout moment. Pour passer du mode en ligne au mode hors ligne : Cliquez sur l’icône Connexion/Déconnexion de la barre d’outils Contenu dynamique. Remarque : Cette barre d’outils peut être flottante ou ancrée dans la barre d’outils de GoLive. Choisissez Fenêtre > Barre d’outils Contenu dynamique pour l’afficher ou la masquer.
Lorsque vous créez des pages Web dynamiques, GoLive établit une connexion avec le serveur pour obtenir les informations de la base de données et pouvoir afficher un aperçu des pages. A chaque requête, GoLive met en cache les informations obtenues afin de limiter le nombre d’appels du serveur et de permettre la poursuite des opérations en cours même si le serveur n’est pas disponible. Les informations spécifiques stockées dans le cache comprennent, entre autres, des renseignements sur : •
GoLive ne détecte pas ces modifications car il continue d’utiliser les informations mises en cache. Pour remédier à cela, effectuez l’une des opérations suivantes : •
2 Dans la boîte de dialogue de configuration du site, cliquez sur le bouton de l’Assistant de création de site dynamique. 3 Sélectionnez le langage serveur à utiliser pour votre site (il doit être pris en charge par votre serveur Web), puis cliquez sur Suivant. Remarque : Vous devez éventuellement configurer la prise en charge par le serveur Web de la technologie de script que vous souhaitez utiliser (ASP, JSP ou PHP). Pour des instructions plus détaillées à ce sujet, consultez les serveurs préconfigurés livrés avec GoLive ou la documentation de votre serveur. Notez également que Microsoft propose la prise en charge de plusieurs langages de script sur une page Web. GoLive vous permet de choisir VBScript ou JavaScript comme langage de script pour le code de votre page Web. Cela s’applique uniquement au code placé sur la page Web. Les fichiers de prise en charge ajoutés à votre site par GoLive sont les mêmes pour VBScript et JScript. De cette manière, lorsque vous intégrez la prise en charge du langage ASP/VBScript ou ASP/Jscript, les deux langages de script deviennent disponibles. 4 Sélectionnez l’option de connexion au serveur appropriée : FTP, WebDAV (n’oubliez pas de saisir le nom du serveur) ou Le serveur du site se trouve sur votre système. Cliquez ensuite sur Suivant. 5 Saisissez l’URL HTTP de votre site (http://localhost/nouveausite/, par exemple), puis cliquez sur Suivant.
Web sont installés sur le même ordinateur, le fichier friends.asp contient la seule adresse IP nécessaire : 127.0.0.1. Il s’agit de l’adresse IP d’un hôte local (localhost). Pour plus de détails, voir « Recherche de l’adresse IP de votre ordinateur », page 563. 7 Spécifiez les sources de données à ce stade, ou remettez cette opération à plus tard. Voir « Présentation des sources de données », page 564. 8 Cliquez sur Terminer.
Dès que vous modifiez les paramètres ou la configuration de votre serveur Web, vous devez le relancer afin d’activer les nouveaux paramètres. Pour plus de détails, consultez la documentation accompagnant votre serveur Web. Si vous utilisez l’un des logiciels serveur préconfigurés de GoLive, utilisez le raccourci de redémarrage du serveur, accessible via le menu Démarrer > Adobe (Windows uniquement). Avec JSP, relancez l’application Web (c’est à dire le conteneur), pas le serveur.
La méthode de détermination de l’adresse IP de votre ordinateur dépend de la plateforme et du système d’exploitation utilisés. Pour identifier l’adresse IP d’un PC sous Windows 98 ou Windows Me : 1 Choisissez Démarrer > Exécuter. 2 Tapez command et appuyez sur la touche Entrée. 3 Dans l’invite de ligne de commande, tapez ipconfig et appuyez sur la touche Entrée. 4 Utilisez l’adresse IP affichée. Pour identifier l’adresse IP d’un PC sous Windows NT ou Windows 2000 : 1 Choisissez Démarrer > Exécuter. 2 Tapez cmd et appuyez sur la touche Entrée. 3 Dans l’invite de ligne de commande, tapez ipconfig et appuyez sur la touche Entrée. 4 Utilisez l’adresse IP affichée. Pour identifier l’adresse IP d’un ordinateur Macintosh sous OS 9.1 ou version antérieure : 1 Choisissez Menu Pomme > Tableaux de bord > TCP/IP. 2 Utilisez le numéro affiché dans la zone de l’adresse IP.
GoLive peut générer du contenu dynamique à partir de différentes sources de données. Une source de données représente une base de données ou une connexion à une base de données disponible pour le site. Les sources de données sont placées dans le sous-dossier Datasources du dossier Config d’un site.
Les sources de données sont des objets serveur qui indiquent à votre site comment accéder à une base de données. La source de données pointe vers la base de données en spécifiant la connexion au serveur de la base de données et en nommant cette dernière. Le cas échéant, la source peut également contenir un nom d’utilisateur et un mot de passe permettant d’accéder à la base de données. Lorsque vous modifiez une source de données dans la boîte de dialogue de configuration du site, le fichier source de données est modifié directement sur le serveur. Vous devez donc être connecté au serveur pour pouvoir utiliser les éditeurs de source de contenu. GoLive prend en charge les types de sources de données suivants : Langage ASP associé au format .mdb (base de données Microsoft Access) : Vous pouvez placer directement un raccourci de fichier de base de données Microsoft Access dans le dossier config/datasources sans créer de fichier source de données supplémentaire, à condition toutefois que l’accès à la base de données ne soit pas protégé par mot de passe. Langage ASP associé au format .udl (Microsoft Data Link) : L’éditeur de source de données UDL propose une interface simple permettant de configurer l’accès à la base de données. A cet effet, une boîte de dialogue de propriétés Microsoft complète pour ce type d’objet est disponible sur le serveur (et non sur le client où est installé GoLive, à moins qu’il ne s’agisse du même système). Langage JSP associé au format .jdbc.sbs (connexion de données JDBC) : Cette méthode repose sur une connexion de base à un pilote JDBC et à une base de données, incluant, si nécessaire, la définition d’un nom d’utilisateur et d’un mot de passe. Langage PHP associé au format .mysql.sbs (base de données MySQL) : Vous pouvez spécifier l’hôte du serveur, le nom de la base de données et, le cas échéant, le nom d’utilisateur et le mot de passe. Tout langage associé au format .xds (source de données XML) : Une source de données XML est un type de document XML particulier. Il définit les emplacements du code XML d’où les données doivent être extraites. Il peut aussi pointer vers une source XSLT si la source XML nécessite une modification.
Pour les bases de données Access protégées par mot de passe ou les autres bases de données, vous devez créer un objet source de données. En outre, pour les sources de données autres que Microsoft Access, les pilotes requis doivent être installés sur l’hôte du serveur Web et enregistrés dans Windows comme sources de données ODBC. Pour ajouter une base de données Access (.mdb) à votre site Web : Faites glisser le fichier de la base de données dans le dossier config/datasources de votre site. Téléchargez le dossier Config vers le serveur Web. Une autre solution consiste à utiliser le Finder (Mac OS) ou l’Explorateur Windows pour placer le fichier dans votre site. Si vous effectuez l’opération hors de GoLive, assurez-vous de rafraîchir le site lors de la prochaine ouverture (Site > Rafraîchir la vue). Une fois la base de données téléchargée sur le serveur, elle peut être sélectionnée en tant que source de contenu. Pour préparer un serveur Web Windows pour une base de données autre qu’Access : 1 Effectuez l’une des opérations suivantes : •
5 Donnez un nom approprié à la source de données, puis cliquez sur OK. Cette procédure crée un nom de source de données réutilisable dans l’éditeur de source de données ADO de GoLive. Le nom de la source de données identifie un pilote prenant en charge les connexions à un type particulier de base de données (Oracle, SQL Server ou des fichiers Microsoft Excel, par exemple). Si vous ne voyez pas le pilote recherché dans la liste affichée à l’étape 3, vérifiez que votre application de base de données est installée correctement sur le serveur et consultez la documentation correspondante pour plus de détails sur la configuration de la source de données Microsoft Windows ODBC.
3 Sélectionnez le pilote FileMaker Pro dans la fenêtre Créer une nouvelle source de données et cliquez sur Terminer. Remarque : FileMaker Pro doit déjà être installé pour que le pilote correspondant s’affiche dans la liste. 4 Saisissez FMP dans la colonne Nom de la zone Source de données système et dans la zone Description. 5 Choisissez l’option de connexion à distance et définissez sur le serveur l’adresse IP de l’ordinateur sur lequel la base de données FileMaker Pro est ouverte. Important : Le serveur Web n’accédera pas à la base de données FileMaker Pro si cette option n’a pas été sélectionnée. Si la base de données et le serveur Web se trouvent sur le même ordinateur, choisissez l’option de connexion à distance, puis saisissez l’adresse IP 127.0.0.1. 6 Assurez-vous que FileMaker Pro et les bases de données que vous souhaitez utiliser sont ouverts. Ces bases de données sont affichées dans la liste des tableaux de l’inspecteur d’une source de contenu. 7 Créez un fichier .udl en sélectionnant ODBC comme fournisseur et FMP comme source de données. Voir « Création d’une source de données ASP ADO », page 566. En cas de problème lors de la création de fichiers Data Link (.udl) ou de la configuration des sources ODBC pour FileMaker Pro, consultez l’administrateur de la base de données et l’administrateur de votre réseau ou du serveur Web.
L’objet source de données créé est un fichier Microsoft Data Link doté de l’extension .udl. Cet objet indique à votre site le mode de connexion à votre base de données. Dans la plupart des cas, seuls quatre champs sont obligatoires : le nom du pilote ou du fournisseur, celui de la base de données, et, si l’accès à la base de donnée est protégé, le nom d’utilisateur et le mot de passe. Pour configurer une source de données ADO dans votre site ASP : Remarque : Votre site doit être préalablement converti en site dynamique. Pour plus de détails, voir « Dynamisation d’un site Web », page 562. 1 Lorsque la fenêtre du site est active, choisissez Site > Configurer > Contenu dynamique. 2 Dans la zone Sources de données, cliquez sur Créer.
Remarque : Le mot de passe est stocké en toutes lettres dans le fichier UDL. Assurez-vous que l’accès en lecture HTTP au dossier config/datasources est interdit afin de limiter la visibilité de ce fichier. Voir « Déplacement du dossier config/datasources », page 619. •
Windows. Pour configurer une source de données JDBC dans votre site JSP : Remarque : Votre site doit être préalablement converti en site dynamique. Pour plus de détails, voir « Dynamisation d’un site Web », page 562. Le pilote JDBC doit impérativement être installé. 1 Lorsque la fenêtre du site est active, choisissez Site > Configurer > Contenu dynamique. 2 Dans la zone Sources de données, cliquez sur Créer. 3 Sélectionnez l’option Base de données JDBC, puis cliquez sur Ajouter une source de données. 4 Remplissez les champs de l’éditeur de données JDBC. •
5 Un mécanisme simple d’interconnexion des données est disponible pour les connexions à des bases de données JDBC à partir de sites GoLive. Les valeurs Pool.nstart et Pool.nmax correspondent aux nombres minimal et maximal de connexions en réserve. La modification de ces valeurs peut permettre d’améliorer les performances. Toutefois, les valeurs par défaut sont satisfaisantes dans le cadre du développement d’un site à la fréquentation faible ou moyenne. 6 Pour tester la source de données, cliquez sur le bouton Tester. Ce test consiste à appeler le serveur Web et à établir une connexion avec la base de données. Si l’opération réussit, une représentation XML de la liste des tableaux trouvés dans la base de données est
Pour configurer une source de données MySQL dans votre site PHP : Remarque : Votre site doit être préalablement converti en site dynamique. Pour plus de détails, voir « Dynamisation d’un site Web », page 562. 1 Lorsque la fenêtre du site est active, choisissez Site > Configurer > Contenu dynamique. 2 Dans la zone Sources de données, cliquez sur Créer. 3 Sélectionnez l’option Base de données MySQL, puis cliquez sur Ajouter une source de données. 4 Remplissez les champs de l’éditeur de source de données MySQL. •
5 Pour tester la source de données, cliquez sur le bouton Tester. Ce test consiste à appeler le serveur Web et à établir une connexion avec la base de données. Si l’opération réussit, une représentation XML de la liste des tableaux trouvés dans la base de données est renvoyée et affichée. Si une erreur survient, des informations relatives à cette erreur s’affichent (si possible). Malheureusement, en fonction de la base de données et du pilote utilisés, le message d’erreur peut s’avérer particulièrement abscons.
éléments de la page à des champs de la source de contenu. Lorsque le site est mis en ligne, les navigateurs des internautes affichent le contenu dynamique stocké dans vos sources de données à l’emplacement des éléments liés. Pour rendre une page dynamique : 1 Ouvrez la page voulue. 2 Dans le menu de la palette des liaisons dynamiques, choisissez un langage de script serveur pris en charge par votre serveur. 3 Cliquez sur Convertir la page. GoLive ajoute les fichiers nécessaires au langage de script serveur sélectionné dans le dossier Config de votre site. Pour créer une source de contenu à l’aide de la palette Objets : 1 Faites glisser l’icône Source de contenu du panneau Contenu dynamique de la palette Objets dans la section d’en-tête de la fenêtre du document (ou dans le corps si la section d’en-tête n’est pas ouverte). 2 Dans l’inspecteur, saisissez le nom de la source de contenu dans la zone de texte Description. 3 Dans le menu Type, choisissez le type de source de contenu approprié. Selon le type sélectionné, d’autres options s’affichent. Pour créer une source de contenu à l’aide de l’éditeur de source de contenu : 1 Cliquez sur le bouton Ouvrir l'éditeur de source de contenu dans la partie supérieure de la fenêtre du document. 2 Cliquez sur le bouton Créer une nouvelle source de contenu dans l’éditeur de source de contenu. 3 Dans l’inspecteur, saisissez le nom de la source de contenu dans la zone de texte Description. 4 Dans le menu Type, choisissez le type de source de contenu approprié. Selon le type sélectionné, d’autres options s’affichent. Pour lier un élément de page à du contenu dynamique : 1 Sélectionnez l’élément à lier à une source de contenu. 2 Sélectionnez une source de contenu et un champ dans la palette des liaisons dynamiques. Pour plus de détails sur l’ajout de contenu dynamique à des pages et consulter des exemples de pages, voir « Création d’éléments de page courants », page 571 et « Création de pages dynamiques courantes », page 602.
Il s’agit d’une méthode simple pour définir tableaux, sources de contenu, formulaires et autres éléments ainsi rendus disponibles pour l’ensemble du site. Pour convertir en composant personnalisé un élément de page dynamique tel qu’un tableau : 1 Ouvrez la page contenant l’élément dynamique voulu. 2 Activez le panneau Bibliothèque de la palette Objets. 3 Faites glisser l’élément de page dynamique du panneau Mise en page dans le panneau Bibliothèque. Pour créer un composant personnalisé à partir d’une source de contenu : 1 Ouvrez la page contenant la source voulue. 2 Activez le panneau Bibliothèque de la palette Objets. 3 Si la section d’en-tête est fermée, cliquez sur le triangle approprié pour l’ouvrir. 4 Faites glisser la source de contenu souhaitée de la section d’en-tête du panneau Mise en page dans le panneau Bibliothèque. Pour utiliser un composant personnalisé : 1 Ouvrez la page dynamique dans laquelle vous souhaitez copier le composant dynamique personnalisé. 2 Activez le panneau Bibliothèque de la palette Objets. 3 Faites glisser le composant personnalisé du panneau Bibliothèque vers la zone correcte de la page dynamique (la section d’en-tête pour les sources de contenu, le corps pour des éléments de page comme des tableaux).
GoLive propose diverses méthodes d’amélioration d’un site à l’aide de contenu dynamique, allant de la simple liaison de texte ou d’images aux champs d’une source de contenu jusqu’à la définition des conditions d’affichage/de masquage du contenu dynamique. Vous pouvez créer des menus qui sont remplis de contenu dynamique automatiquement ou encore des boutons spécifiques permettant de naviguer parmi les saisies d’une source de données. Pour créer des liaisons simples, insérez des balises d’emplacement de texte ou d’images dans vos pages, puis liez-les aux champs d’une source de contenu à l’aide de la palette des liaisons dynamiques.
Tous les objets dynamiques de GoLive appartiennent à l’une des catégories suivantes : •
GoLive propose deux objets prenant en charge le contenu dynamique, à savoir l’objet Source de contenu et l’objet Conteneur. Ces deux objets doivent être créés à l’aide du panneau Contenu dynamique de la palette Objets. De plus, GoLive vous permet de définir des événements dynamiques relatifs à des objets HTML existants. Ils sont à votre disposition dans le panneau Contenu dynamique de la palette Objets. Vous pouvez aussi les créer depuis les panneaux Standard et Formulaire de la palette Objets, puis spécifier des liaisons dynamiques via la palette des liaisons dynamiques. Source de contenu : Correspond à une requête de source de données définie pour le site. Lorsque l’objet Source de contenu est placé dans la section d’en-tête d’une page, la source de contenu s’affiche dans la palette des liaisons dynamiques ainsi qu’une série de champs permettant de créer des liaisons. (Voir « Présentation des sources de contenu », page 574.) Conteneur : Permet de définir les conditions d’affichage ou la répétition régissant les balises d’emplacement incluses dans ce conteneur. Les deux objets suivants, disponibles dans le panneau Contenu dynamique de la palette Objets, sont des variantes de l’objet Conteneur dont certaines options ont été prédéfinies. Masquer le contenu : Affiche/masque le contenu dynamique en fonction des conditions que vous avez définies. (Voir « Création de régions conditionnelles », page 584.) Répéter le contenu : Permet l’affichage répété de contenu dynamique lié à des balises d’emplacement incluses dans ce conteneur. Le contenu est répété une fois par saisie dans la source de données. (Voir « Utilisation de la répétition de cellules », page 584.) Répéter les lignes : Permet d’afficher du contenu dynamique orienté verticalement. De nouvelles lignes sont créées pour chaque saisie dans la source de contenu. (Voir « Utilisation de la répétition de lignes », page 583.)
Afficher la saisie précédente : Insère un lien vers la même page et affiche la saisie précédente dans le jeu d’enregistrements. Cet objet s’applique à une page affichant une saisie (enregistrement) au sein d’un jeu d’enregistrements. Voir « Création de boutons de navigation », page 586. Afficher les détails de la saisie actuelle : Insère un lien vers une page affichant des informations supplémentaires sur la saisie actuelle. Cette page doit posséder une source de contenu portant le même nom et afficher une saisie unique. Spécifiez la page cible à l’aide du panneau des liens de l’inspecteur. (Voir « Création de boutons de navigation », page 586.) Image dynamique : Insère une image liée. Vous devez sélectionner la source de contenu et le champ à utiliser comme URL de l’image. Cet objet vous permet également de lier le texte de remplacement de l’image à une valeur stockée dans votre base de données. (Voir « Utilisation d’images dynamiques », page 581.) Action d'envoi : Insère un bouton d’envoi de formulaire. Comme tous les suivants, cet objet est relatif aux formulaires. Pour plus de détails sur les objets de formulaires, voir « Utilisation de contenu dynamique dans les formulaires et mises à jour de bases de données », page 593. Action de bouton : Insère un bouton générique pour lequel vous pouvez définir une action. Action d'image : Insère une image pour laquelle vous pouvez définir une action. Libellé dynamique : Insère un libellé pouvant être lié rapidement à un champ dans une source de contenu. Champ de texte dynamique : Insère un champ de texte pouvant être lié rapidement à un champ dans une source de contenu. Mot de passe dynamique : Insère un objet mot de passe pouvant être lié rapidement à un champ dans une source de contenu. Zone de texte dynamique : Insère une zone de texte pouvant être liée rapidement à un champ dans une source de contenu. Case à cocher dynamique : Insère une case à cocher préconfigurée en vue de la liaison à une source de contenu. Bouton radio dynamique : Insère un bouton radio préconfiguré en vue de la liaison à une source de contenu. Menu déroulant dynamique : Insère un menu déroulant pouvant être lié rapidement à un champ dans une source de contenu disponible. Sert à créer un menu déroulant qui est automatiquement rempli par des données provenant d’une source de contenu.
Une source de contenu est une requête de source de contenu servant à fournir du contenu à la page affichée par un internaute. Une page peut posséder plusieurs sources de contenu. Les champs disponibles d’une source de contenu s’affichent dans différents menus de la palette des liaisons dynamiques. Ces champs peuvent être liés à des éléments de la page. Il existe des types de source de contenu variés. Le plus courant est une requête de base de données visant à récupérer des informations dans une base de données pour les fournir à la page. Les différents types de sources de contenu sont les suivants : Requêtes de bases de données ADO (ASP uniquement), JDBC (JSP uniquement) et MySQL (PHP uniquement) : Effectuent des recherches dans une base de données spécifique pour obtenir des saisies de tables ou de requêtes spécifiques. La source de contenu permet également de filtrer les saisies en testant les valeurs de champs ou en utilisant des clauses SQL WHERE personnalisées. La source de contenu permet également de spécifier l’ordre de tri des saisies. Les mises à jour de bases de données peuvent aussi être envoyées à partir d’une source de contenu. Source de données XML (tous langages) : Fournit des éléments et des attributs XML. Le nombre de saisies renvoyées dépend de la configuration de la source données XML. Navigation Block View (tous langages) : Organise des séries de saisies renvoyées par d’autres sources de contenu sous forme de blocs. Sert à structurer la navigation parmi les saisies obtenues. Panier CustomMerchant (tous langages) : Le type de source CustomMerchant Shopping Cart permet de gérer les saisies décrivant le contenu d’un panier. Bon de commande CustomMerchant (tous langages) : Le type de source CustomMerchant Order Form permet de gérer une saisie décrivant le contenu d’un bon de commande.
GoLive propose divers outils vous permettant de créer, de modifier, de personnaliser une requête SQL et de lui appliquer des critères de tri, le tout à partir d’une source de contenu. Pour créer une source de contenu à l’aide de la palette Objets : 1 Faites glisser l’icône Source de contenu du panneau Contenu dynamique de la palette Objets vers la section d’en-tête de la fenêtre du document. Si la section d’en-tête est fermée, faites glisser l’icône Source de contenu directement sur le triangle situé sous l’onglet Mise en page. Lorsque la section d’en-tête s’ouvre, déposez-y l’icône. 2 Dans l’inspecteur, saisissez le nom de la source de contenu dans la zone de texte Description. 3 Dans le menu Type, choisissez le type de source de contenu approprié. Selon le type sélectionné, d’autres options s’affichent. Pour créer une source de contenu à l’aide de l’éditeur de source de contenu : 1 Cliquez sur le bouton Ouvrir l'éditeur de source de contenu dans la partie supérieure de la fenêtre du document. 2 Cliquez sur le bouton Créer une nouvelle source de contenu dans l’éditeur de source de contenu. 3 Dans l’inspecteur, saisissez le nom de la source de contenu dans la zone de texte Description. 4 Dans le menu Type, choisissez le type de source de contenu approprié. Selon le type sélectionné, d’autres options s’affichent. Pour afficher ou modifier une source de contenu : 1 Ouvrez une page possédant une source de contenu. 2 Cliquez sur le bouton Ouvrir l'éditeur de source de contenu dans la partie supérieure de la fenêtre du document. 3 Sélectionnez la source de contenu voulue.
2 Cliquez sur le bouton Ouvrir l'éditeur de source de contenu dans la partie supérieure de la fenêtre du document. 3 Sélectionnez la source de contenu voulue. 4 Dans l’éditeur de source de contenu, cliquez sur le bouton Supprimer la source de contenu. Pour appliquer un filtre à une source de contenu SQL : 1 Sélectionnez une source de contenu dans la section d’en-tête de la page ou dans l’éditeur de source de contenu. Pour ouvrir ce dernier, vous pouvez cliquer sur l’icône Ouvrir l’éditeur de source de contenu, située dans l’angle supérieur droit de la page. 2 Sélectionnez un champ dans la zone Filtrage des saisies de l’inspecteur de la source de contenu. 3 Dans le menu correspondant, sélectionnez un filtre, autrement dit un type d’association. Les filtres des sources de contenu vous permettent d’affiner votre choix parmi les saisies du tableau à inclure dans la source de contenu. Les filtres disponibles sont les suivants (remplacez x par la valeur à associer) : •
Ouvrir l’éditeur de source de contenu, située dans l’angle supérieur droit de la page. 2 Dans l’inspecteur, sélectionnez un champ dans le menu Trier par afin de trier le tableau de la base de données en fonction de ce champ. Remarque : Par défaut, la source de contenu trie par ordre croissant. Pour inverser l’ordre de tri, sélectionnez l’option de tri par ordre décroissant dans l’inspecteur de la source de contenu.
Ouvrir l’éditeur de source de contenu, située dans l’angle supérieur droit de la page. 2 Choisissez Requête SQL personnalisée le menu Tableau de l’inspecteur de la source de contenu. 3 Tapez une instruction de requête SQL dans la zone de texte SQL. Les instructions SQL personnalisées vous permettent d’élaborer entièrement votre requête à l’aide de sélections personnalisées et de critères de tri. Soyez attentifs lorsque vous saisissez une requête SQL car les erreurs SQL provoquent des erreurs difficiles à diagnostiquer sur les pages en ligne. Pour ajouter une source de contenu permettant de naviguer par blocs : 1 Faites glisser un objet source de contenu du panneau Contenu dynamique de la palette Objets dans la section d’en-tête de la page. 2 Dans l’inspecteur, saisissez le nom de la source de contenu dans la zone de texte Description. 3 Choisissez Navigation Block View comme type de contenu. 4 Dans la zone de source de contenu, tapez le nom de la source de contenu produisant le jeu d’enregistrements complet. Remarque : Les sources de contenu de navigation entre blocs vous permettent de créer des liens entre les pages de saisies de plusieurs pages. Voir « Présentation de la navigation entre blocs », page 587. La source de contenu à laquelle la source de navigation fait référence doit se trouver avant la source de navigation dans la section d’en-tête. Vous pouvez réorganiser les sources de contenu dans la section d’en-tête en les faisant glisser à l’intérieur cette section.
Vous pouvez lier du texte, des images, des champs de formulaire et d’autres éléments de page à toutes les sources de contenu d’une page existante. Comme il a déjà été mentionné, il est possible de créer des liaisons simples en créant des éléments de texte ou d’image sur une page, en les sélectionnant, puis en les liant aux champs d’une source de contenu. Remarque : Pour inclure des actions supplémentaires dans un élément de page (affichage conditionnel, navigation dans les saisies, etc.), il peut s’avérer plus rapide d’utiliser les objets dynamiques appropriés, disponibles dans le panneau Contenu dynamique de la palette Objets. Voir « Création d’éléments de page courants », page 571.
Grâce à la palette des liaisons dynamiques, vous pouvez créer des liaisons simples entre du texte sélectionné et les champs d’une source de contenu.
La palette des liaisons dynamiques affiche le nom d’une source de contenu et les champs disponibles.
Encoder la chaîne au format HTML : Permet de formater du contenu dynamique en tant que format HTML et d’afficher du code HTML sur une page plutôt que de faire interpréter ce code par un navigateur. Encoder la chaîne de l'URL : Permet de formater du contenu dynamique de manière qu’il puisse être envoyé en tant que chaîne de requête dans un URL. Mapper le chemin relatif à l'application : Permet de mapper un chemin relatif à l’application à un chemin relatif à la page. Convertir les fins de lignes : Permet de traiter le contenu dynamique comme du texte préformaté afin de préserver les espaces. Monnaie : Permet de formater du contenu dynamique en tant que monnaie en utilisant la monnaie spécifiée sur le serveur Web. Si la monnaie sélectionnée est l’euro, tout le contenu dynamique formaté via ce filtre est en euros.
Date et heure : Permet de formater du contenu dynamique en tant que date et heure. Format local date and time (PHP) : Permet de formater du contenu dynamique selon une chaîne de formatage et les paramètres régionaux. Format date (JSP) : Permet de formater du contenu dynamique en tant que date, conformément aux paramètres régionaux. Format time (JSP) : Permet de formater du contenu dynamique en tant que date, conformément aux paramètres régionaux. Pour appliquer des filtres de formatage à du texte lié : 1 Sélectionnez du texte lié. 2 Choisissez le filtre de formatage voulu dans le menu Filtre de la palette des liaisons dynamiques. Lorsque vous appliquez un filtre de formatage à du texte lié, vous pouvez aussi parfois accéder à d’autres options qui vous permettent d’affiner le formatage.
Dans les pages dynamiques, vous pouvez ajouter des liens vers d’autres pages, dynamiques ou statiques. GoLive permet de spécifier des actions supplémentaires pour ce type de lien et vous offre la possibilité d’en contrôler plusieurs aspects. Vous pouvez lier le texte d’un lien à un champ de source de contenu afin d’afficher du texte issu d’une source de données. Vous pouvez lier la cible d’un lien à un champ de source de contenu afin d’afficher une page spécifiée par un champ de source contenu lorsqu’un internaute clique sur le lien. En outre, vous pouvez associer des actions à un lien. Ce type d’action permet de contrôler quelle saisie est affichée sur la page de destination du lien. Pour lier le texte d’un lien à un champ de source de contenu : Sélectionnez le texte dans le panneau Mise en page, puis une source de contenu et un champ dans la palette des liaisons dynamiques. Lorsque la page est consultée en ligne, le texte sélectionné est remplacé par le contenu du champ de la source sélectionnée. Pour lier la cible d’un lien à un champ de source de contenu : 1 Sélectionnez le texte du lien. 2 Dans la palette des liaisons dynamiques, saisissez la source de contenu et le champ voulus.
Pour ajouter une action associée à un lien dans une page dynamique : 1 Sélectionnez le texte ou l’image du lien dans le panneau Mise en page. 2 Dans la palette des liaisons dynamiques, sélectionnez l’option Action Liens. 3 Choisissez une action de lien dans le menu. •
1 Sélectionnez le texte ou l’image du lien dans le panneau Mise en page. 2 Dans l’inspecteur, cliquez sur le triangle situé à droite du champ HREF, puis choisissez Modifier le lien dans le menu. 3 Pour ajouter des paramètres, saisissez un nom et une valeur dans les champs appropriés, puis cliquez sur le bouton Ajouter un paramètre. 4 Si vous souhaitez définir une valeur provenant d’un champ de source de contenu dynamique, cliquez sur le triangle situé à droite de la zone de saisie de la valeur, puis sélectionnez une source de contenu et un champ. 5 Cliquez sur OK. Comment utiliser l'aide | Sommaire | Index
Vous pouvez lier des images à du contenu dynamique afin de créer des images dynamiques. A cet effet, les données renvoyées par votre source de contenu doivent inclure le nom de chemin de l’image (/images/nom_image.jpg, par exemple, pour une image du dossier d’images situé dans le dossier racine de votre site). Vous pouvez créer une image dynamique à l’aide de la palette Objets ou en sélectionnant une image existante dans le panneau Mise en page. Pour lier une image à du contenu dynamique : 1 Placez une image ordinaire ou dynamique sur la page à l’aide de la palette Objets, puis sélectionnez-la. 2 Dans la palette des liaisons dynamiques, sélectionnez la source de contenu et le champ correspondant aux noms de chemins de vos images. Remarque : La valeur de la source de contenu est placée directement dans l’attribut src de la balise <img>. La base de données doit donc contenir soit un URL complet, soit un URL relatif à la racine du site. Dans ce dernier cas, sélectionnez l’option L'URL dépend de la racine du site. GoLive ajuste la valeur reçue de la base de données en lui attribuant un préfixe contenant le nombre correct d’entrées de type « ../ » afin que le chemin de l’image renvoie au fichier approprié. Il est judicieux de définir l’attribut src de l’image dans l’inspecteur sur une image similaire à celle qui s’affichera dans la version finale de votre site. Cela facilite la visualisation de l’aspect final de la page. N’oubliez pas que l’image de référence n’est pas utilisée par la page en ligne. C’est la source de contenu qui fournit l’image à afficher. Les images Web sont souvent dotées d’un texte de remplacement qui apparaît si l’affichage des images est désactivé dans le navigateur ou que la page est consultée par un malvoyant à l’aide d’un navigateur et d’un logiciel prenant en charge cette fonction d’accessibilité. Pour ajouter un texte de remplacement dynamique à une image : 1 Sélectionnez une image dans le panneau Mise en page. 2 Dans la palette des liaisons dynamiques, sélectionnez la source de contenu et le champ voulus dans la zone de liaison du texte de remplacement. Vous pouvez formater à votre gré (position, bords, etc.) des images liées à du contenu dynamique. Le contenu dynamique des pages générées par le serveur Web conserve l’aspect spécifié pour vos balises d’emplacement d’images.
Pour permettre à un tableau d’être rempli de contenu dynamique : 1 En commençant par la première ligne à remplir de contenu dynamique, liez le texte (entier ou partiel) de chaque cellule à un champ de source de contenu à l’aide de la palette des liaisons dynamiques. L’aspect du texte et des cellules non liés reste inchangé dans chaque ligne devant intégrer une saisie. Toutes les lignes du tableau situées sous celle-ci sont ignorées. Remarque : Votre tableau peut comporter un nombre illimité de lignes d’en-tête dont l’aspect est conservé sur la page et qui ne sont pas remplacées par du contenu dynamique. 2 Sélectionnez la totalité du tableau ou une cellule, puis l’option Remplacer les lignes dans la palette des liaisons dynamiques. 3 Sélectionnez la même source de contenu qu’à l’étape 1 dans le menu Source de contenu. 4 Choisissez l’option adéquate pour les saisies que vous souhaitez afficher dans le tableau : •
La répétition de lignes permet d’afficher verticalement du contenu reproduit en ajoutant le nombre de lignes nécessaire, de haut en bas. L’objet Remplacer les lignes est un objet de tableau pour lequel l’option Remplacer les lignes est présélectionnée. Pour plus de détails sur la création manuelle de ce type de tableau, voir « Création de tableaux dynamiques », page 582. Pour remplir un tableau de contenu dynamique se répétant de haut en bas : 1 Faites glisser l’icône Remplacer les lignes du panneau Contenu dynamique de la palette Objets dans la page du document. 2 Dans l’inspecteur du tableau, effectuez les modifications voulues. 3 Dans la partie supérieure de la palette des liaisons dynamiques, choisissez une source de contenu dans le menu approprié. 4 Spécifiez les options d’affichage des saisies et le nombre de saisies à afficher par page. 5 Saisissez du texte balise dans une cellule de la ligne supérieure, puis sélectionnez-le. 6 Liez la balise d’emplacement (le texte) à un champ de la source de contenu à l’aide de la palette des liaisons dynamiques. 7 Continuez à ajouter du texte balise et à le lier aux champs appropriés.
L’objet Répéter les cellules du panneau Contenu dynamique de la palette Objets vous permet de remplir un tableau qui se reproduit horizontalement, de gauche à droite. Par exemple, un site de commerce électronique possédant de plusieurs boutiques peut afficher le nom de chacune sur des onglets dans la partie supérieure de la page d’accueil principale. L’objet Répéter les cellules est un objet de tableau pour lequel l’option est présélectionnée. Pour remplir un tableau de contenu dynamique se répétant de gauche à droite : 1 Faites glisser l’icône Répéter les cellules du panneau Contenu dynamique de la palette Objets dans la page du document. 2 Dans l’inspecteur du tableau, effectuez les modifications voulues. 3 Dans la partie inférieure de la palette des liaisons dynamiques, choisissez une source de contenu dans le menu approprié. 4 Spécifiez les options Nombre max. de cellules par ligne et Nombre max. de lignes par page. 5 Saisissez du texte balise dans la cellule située en haut à gauche, puis sélectionnez-la. 6 Liez la balise d’emplacement (le texte) à un champ de la source de contenu à l’aide de la palette des liaisons dynamiques. Remarque : La notion de cellule d’en-tête s’affichant avant les données de la source de contenu n’existe pas. Le contenu dynamique remplit les cellules du tableau en commençant par la première.
Vous pouvez créer du contenu dynamique qui est affiché ou masqué en fonction des conditions définies. Par exemple, vous pouvez créer une page permettant aux internautes de faire une recherche dans la base de données de vos produits. Ils peuvent cliquer sur un bouton de la page pour afficher le résultat de leur recherche. Le cas échéant, vous avez la possibilité de d’afficher les résultats. Si la recherche échoue, vous pouvez choisir d’afficher un message du type « Aucun résultat trouvé, essayez... » ou « Cet article est épuisé. » Vous pouvez utiliser des zones conditionnelles pour afficher ou masquer du contenu en fonction de conditions définies. Condition (Paramètre)
(Champ) Champ identique 1 Faites glisser l’icône Masquer le contenu du panneau Contenu dynamique de la palette Objets dans la page du document. 2 Sélectionnez l’option Afficher ou Masquer dans la palette des liaisons dynamiques. 3 Choisissez et définissez une condition via le menu approprié. 4 Saisissez le texte ou les images voulus (réels ou balises d’emplacement) dans l’objet Masquer le contenu. 5 Le cas échéant, liez les balises d’emplacement à un champ de la source de contenu à l’aide de la palette des liaisons dynamiques.
La navigation entre les saisies fait référence à la présence sur la page de liens permettant à l’internaute d’atteindre d’autres pages affichant des saisies associées. Par exemple, un formulaire de commande peut afficher plusieurs saisies dotées de liens vers une page de présentation détaillée du contenu. Chaque page de ce type doit posséder des liens permettant d’atteindre la saisie précédente ou suivante.
Afficher la saisie précédente, Afficher la saisie suivante, Afficher les détails de la saisie actuelle et Afficher les détails de la saisie vide. Remarque : GoLive désactive automatiquement les boutons Précédent ou Suivant sur la page en ligne si la source de contenu ne contient pas de saisie précédente ou suivante. Pour créer un bouton de navigation permettant d’afficher la première saisie : 1 Tapez du texte représentant le lien, puis sélectionnez-le (Premier, par exemple). 2 Créez un lien vers la page active dans l’inspecteur. 3 Dans la palette des liaisons dynamiques, cochez la case Action Liens, choisissez Afficher la première saisie dans le menu correspondant, puis définissez la source de contenu. Pour créer un bouton de navigation permettant d’afficher la dernière saisie : 1 Tapez du texte représentant le lien, puis sélectionnez-le (Dernier, par exemple). 2 Créez un lien vers la page active dans l’inspecteur. 3 Dans la palette des liaisons dynamiques, cochez la case Action Liens, choisissez Afficher la dernière saisie dans le menu correspondant, puis définissez la source de contenu. Pour créer un bouton de navigation permettant d’afficher la saisie précédente : 1 Tapez du texte représentant le lien, puis sélectionnez-le (Précédent, par exemple). 2 Créez un lien vers la page active dans l’inspecteur. 3 Dans la palette des liaisons dynamiques, cochez la case Action Liens, choisissez Afficher la saisie précédente dans le menu correspondant, puis définissez la source de contenu. Pour créer un bouton de navigation permettant d’afficher la saisie suivante : 1 Tapez du texte représentant le lien, puis sélectionnez-le (Suivant, par exemple). 2 Créez un lien vers la page active dans l’inspecteur du texte. 3 Dans la palette des liaisons dynamiques, cochez la case Action Liens, choisissez Afficher la saisie suivante dans le menu correspondant, puis définissez la source de contenu. Pour créer un bouton de navigation permettant d’afficher les détails de la saisie actuelle : 1 Tapez du texte représentant le lien, puis sélectionnez-le.
1 Tapez du texte représentant le lien, puis sélectionnez-le. 2 Créez un lien vers la page voulue dans l’inspecteur du texte. 3 Dans la palette des liaisons dynamiques, cochez la case Action Liens, choisissez Afficher les détails de la saisie vide dans le menu correspondant, puis définissez la source de contenu. Celle-ci doit être la même que sur la page active.
Les pages peuvent afficher des blocs, c’est-à-dire des groupes de saisies faisant partie d’un jeu important. Par exemple, si vous effectuez une recherche sur le Web à l’aide d’un moteur de recherche, ou si vous recherchez des produits dans un catalogue, vous obtenez généralement des pages contenant 5 à 10 résultats. Certains boutons de navigation vous permettent de passer à la page suivante ou précédente. Il existe également des liens permettant d’atteindre d’autres pages. La navigation entre blocs consiste à atteindre une page affichant un bloc de saisies spécifique. La navigation entre blocs dans GoLive repose sur la définition d’une seconde source de contenu renvoyant des informations sur les blocs relatifs à une source de contenu spécifique. Vous devez d’abord définir la source de contenu des résultats de la recherche, puis celle de la navigation entre blocs y faisant référence. Cette dernière source de contenu renvoie une saisie par bloc. Ainsi, si la source de contenu des résultats de la recherche comprend 34 saisies, chaque page en affichant 10, alors la source de contenu de navigation entre blocs contient 4 saisies. Les champs de chaque saisie de navigation entre blocs sont : •
1 Définissez la page de résultats de manière à afficher le bloc de résultats. Ajoutez la source de contenu à la page. Créez un tableau affichant les résultats. Dans la palette des liaisons dynamiques, spécifiez le tableau de manière à afficher le nombre de saisies voulues par bloc. Comment utiliser l'aide | Sommaire | Index
5 Sur la page, ajoutez un tableau d’une ligne contenant les liens renvoyant aux blocs. Tapez du texte balise dans la première cellule. Vous pouvez, par exemple, choisir les chiffres 1, 2 , 3 (etc.) comme texte fictif pour les cellules de la ligne. Formatez le tableau en vue de son affichage. 6 Sélectionnez le tableau, puis l’option Répéter les cellules de la palette des liaisons dynamiques et choisissez la source de navigation comme source de contenu. 7 Sélectionnez le texte de la première cellule du tableau et liez-le à la page active. 8 Dans la palette des liaisons dynamiques, liez le texte du lien à la source de contenu de navigation et au champ [Nombre de saisies]. 9 Liez également la cible du lien à la source de contenu de navigation et au champ Link_URL. Cette opération remplit le tableau de liens au format 1 2 3 4 5 représentant des numéros de pages. Si vous souhaitez une numérotation de type 1-10, 11-20, 21-30, 31-34, au cours des étapes précédente, vous devez taper le texte balise au format 1 - 10, lier le texte 1 au champ First, le texte 10 au champ Last, puis sélectionner 1 - 10 et lier la cible du lien à Link_URL.
Les pages peuvent afficher des saisies individuelles ou des groupes de saisies. Ces saisies font parfois partie de jeux plus importants définis par une source de contenu. Vous avez la possibilité d’insérer dans la page du texte permettant aux internautes de savoir quelle saisie ils consultent et combien le jeu en comporte. Ce texte doit se présenter comme suit : Saisie n˚ 1 sur 20 ou Saisies n˚ 1 à 5 sur 45. Il peut aussi être utile de numéroter chacune des saisies placées dans un tableau, par exemple. GoLive vous permet d’ajouter ce type de texte via une balise d’emplacement sur la page, puis de lier les parties du texte à des champs de source de contenu spécifiques. Pour ajouter des informations sur le nombre de saisies à une page : 1 Tapez l’expression que vous souhaitez utiliser (Vous consultez la saisie X sur X, par exemple). 2 Sélectionnez le premier X. 3 Dans la palette des liaisons dynamiques, sélectionnez l’option Lier à. 4 Sélectionnez une source de contenu, puis choisissez la variable voulue dans le menu Champ : Nombre de saisies, Décompte des saisies, Première saisie sur la page ou Dernière saisie sur la page.
Les informations sont transmises via des liens utilisant des paramètres de requête. Pour ces paramètres, la syntaxe se compose de l’URL, suivi du symbole ? puis d’une ou plusieurs entrées parm=value séparées par le signe &. Un formulaire envoyé à l’aide de la méthode GET encode les champs de formulaires sous forme de paramètres de ce type. Exemple 1 Une page générale est définie pour afficher des informations. Ces dernières se trouvent dans une base de données et appartiennent à l’une des quatre catégories suivantes : événements, vente, détente et vacances. La page générale possède une source de contenu dotée d’un champ catégorie dont le filtre est Associer au paramètre de requête « catégorie ». Le paramètre de requête est un nom faisant référence soit à un paramètre de requête d’URL, soit à un paramètre de formulaire. Une page d’introduction est également créée. Elle contient quatre liens pointant vers la page générale. Pour chaque lien, la valeur du paramètre de requête d’URL est différente. Dans cet exemple, la page générale sert à afficher diverses informations, sous le contrôle du paramètre d’URL transmis à la page via le lien. Exemple 2 Dans une application Web de répertoire téléphonique, une page de résultats d’une recherche comporte plusieurs entrées parmi lesquelles vous devez effectuer un choix. Vous pouvez cliquer sur l’un des résultats pour afficher une page détaillée sur la personne concernée. Cette page détaillée affiche d’autres personnes appartenant au même service. A cet effet, elle doit disposer de l’identifiant du service. Les noms et identifiants de la personne et du service peuvent être transmis via le lien URL à la page détaillée grâce aux paramètres de requête d’URL. Cette page contient une source de contenu relative à la personne dont le champ « nom_personne » est doté du filtre Associer au paramètre de requête « nom ». La page contient une seconde source de contenu relative aux services dont le champ « nom_service » est doté du filtre Associer au paramètre de requête « nom_service ». Sur la page de résultats, le lien renvoyant à la page détaillée est défini via l’éditeur d’URL. Pour créer un lien doté de paramètres de requête d’URL : 1 Sélectionnez le texte pour le lien. 2 Dans l’inspecteur, cliquez sur le bouton de lien. Tapez le nom de la page cible (détails.asp, dans le présent exemple). 3 Ouvrez la boîte de dialogue de modification d’URL en cliquant sur le triangle situé à droite du champ du lien, puis en choisissant Modifier.
6 Notez que l’URL complet s’affiche au bas de la boîte de dialogue. Cliquez sur OK.
La plupart des images de pages Web proviennent directement d’un fichier situé sur le serveur contenant les images au format final. Toutefois, certaines images sont générées sur demande ou issues d’une base de données d’images. Dans ce cas, la requête effectuée par le navigateur inclut des paramètres relatifs à la lecture de l’image. Ces paramètres fournissent les informations à l’application utilisée pour sélectionner une image ou pour générer une image sur demande. La génération de cartes constitue un exemple courant. Certains sites Internet fournissent des cartes générées dynamiquement sur la base de paramètres de requête URL. GoLive prend globalement en charge les serveurs d’images dynamiques, même si toutes les fonctions proposées ne sont pas opérationnelles. La prise en charge du programme de génération d’images dynamiques d’Adobe, AlterCast, est cependant intégrée à GoLive. La prise en charge d’autres serveurs d’images spécifiques peut être ajoutée grâce aux possibilités d’extension de GoLive. Vous pouvez également consulter le site Web Adobe GoLive Exchange pour obtenir des extensions permettant la prise en charge de serveurs d’images. Voici ce qui se passe lors d’une requête d’image dynamique. Sur la page Web, la balise <img> inclut une référence à l’URL du fournisseur d’images dynamiques. Les paramètres d’URL inclus fournissent les informations nécessaires à la génération ou à la sélection de l’image. Lors du chargement de la page, le navigateur demande chacune des images référencées, notamment les images à construire dynamiquement (le navigateur ne sait pas si l’image est dynamique ou pas). Quand le serveur reçoit une requête d’image dynamique, il la transfère au fournisseur d’images. (Cette technologie est basée sur l’URL ou le type de fichier. L’application de génération d’images doit être installée et enregistrée sur le serveur Web.) Le serveur d’images génère l’image et la renvoie au navigateur. Celui-ci l’affiche sur l’écran de l’internaute avec le reste de la page Web. Il est important de prendre en considération les performances voulues lors de l’utilisation d’images dynamiques. Le temps nécessaire à la génération d’une image dynamique dépend de l’application utilisée et de l’environnement serveur. Ce délai peut ralentir le chargement de la page Web pour l’utilisateur. Assurez-vous de prendre ce facteur en compte lors de la conception de votre site.
Pour utiliser AlterCast avec des pages Web générées par GoLive, AlterCast doit être installé sur le serveur Web qui fournit ces pages. GoLive n’utilise pas AlterCast directement dans le processus de création. AlterCast sert néanmoins à prévisualiser les images dans GoLive et à afficher des images générées dynamiquement dans un navigateur Web.
Plusieurs fichiers doivent être présents dans un site pour permettre la prise en charge de la création de pages contenant des images fournies par AlterCast. Ces fichiers ne sont pas dans le site par défaut ; vous devez les copier manuellement depuis le dossier d’installation de GoLive. Pour activer la prise en charge d’AlterCast par un site : 1 Localisez les fichiers de prise en charge d’AlterCast dans le dossier Settings/Server Pages/AlterCast du dossier d’installation de GoLive. Ces fichiers sont destinés aux sites ASP et JSP. Actuellement, la prise en charge d’AlterCast sous PHP n’est pas assurée. 2 Copiez ces fichiers dans le dossier Config de votre site. Ce dossier est créé automatiquement lorsque le site est rendu dynamique à l’aide de l’assistant de création de site dynamique. Il faut donc procéder à cette opération avant de copier les fichiers de prise en charge d’AlterCast. 3 Pour un site JSP, le fichier config/WEB-INF/web.xml doit également être modifié. Parmi les fichiers du dossier Settings/Server Pages/AlterCast copiés dans votre site (à l’étape 1) se trouve un fichier nommé config/WEB-INF/web.xml.altercast.readme. Ouvrez ce fichier dans un éditeur de texte. Il contient des instructions, ainsi que le texte à ajouter au fichier config/WEB-INF/web.xml. Suivez scrupuleusement les instructions. En complément des instructions, vous devez connaître le nom de chemin d’installation d’AlterCast sur le serveur. Après avoir modifié le fichier web.xml, vous pouvez éventuellement supprimer le fichier web.xml.altercast.readme de votre site. 4 Une fois les fichiers ajoutés, vous devez les télécharger vers le serveur et relancer GoLive afin d’activer les extensions de prise en charge.
AlterCast peut traiter trois sortes de variables : • à quoi les variables sont associées. Le concepteur de l’image doit vous fournir ces informations. Théoriquement, il attribue à la variable un nom évocateur : Prix_produit, URL_image_fond ou Afficher_calque_montagne en sont de bons exemples. Remarque : Toutes les versions de Photoshop ne prennent pas en charge les variables PSD. Consultez la documentation de Photoshop pour savoir si votre version assure cette prise en charge.
Vous devez configurer une image dynamique en vue de l’utilisation avec AlterCast. Pour configurer une image dynamique : 1 Faites glisser un objet Illustrator ou Photoshop du panneau SmartObjects de la palette Objets à l’emplacement souhaité sur la page. Les instructions ci-après concernent un fichier Illustrator SVG. Elles sont identiques pour un fichier Photoshop PSD. 2 Dans l’inspecteur, définissez le champ source du fichier SVG. Le fichier SVG ou PSD doit être inclus dans le site et téléchargé vers le serveur de manière à être accessible à AlterCast. 3 La boîte de dialogue Configuration des variables dresse la liste des variables définies dans le fichier image. Il n’est pas nécessaire de cocher les cases dans cette boîte de dialogue. Cliquez sur OK. 4 Lorsque vous y êtes invité par la boîte de dialogue Enregistrer pour le Web, créez et enregistrez un aperçu de l’image. L’image générée est simplement utilisée comme balise d’emplacement dans le panneau Mise en page. Elle doit être téléchargée vers le serveur. Ignorez tout ce qui concerne les variables. L’image est maintenant configurée. Elle est prête pour la connexion des variables à des champs de source de contenu.
Une fois la balise d’emplacement de l’image créée, vous pouvez connecter des variables de l’image à des champs de source de contenu ou à d’autres sources de valeurs. Pour lier une variable d’image dynamique à une source de contenu : 1 Sélectionnez l’image balise. 2 Dans la zone Serveur d’images dynamiques de la palette des liaisons dynamiques, sélectionnez Adobe AlterCast. 3 Cliquez sur le bouton Liaisons de variables.
Si vous le souhaitez, sélectionnez un filtre à appliquer à la valeur (facultatif ). Cliquez ensuite sur le bouton de mise à jour. Vous pouvez également ajouter ou supprimer des entrées de variables à l’aide des boutons appropriés. 5 Cliquez sur OK lorsque vous avez terminé. N’oubliez pas de cliquer sur Mettre à jour après avoir saisi des valeurs, faute de quoi elles ne sont pas appliquées à l’image.
La configuration d’AlterCast en vue de l’associer à un site peut s’avérer difficile du fait des nombreuses opérations qu’elle implique. Si votre image ne s’affiche pas correctement, vérifiez les points ci-après : •
GoLive vous permet de lier un champ de formulaire à un champ de source de contenu de manière à afficher une ou plusieurs valeurs issues d’une saisie de la source de contenu dans le formulaire. En outre, vous pouvez définir une action de formulaire déclenchée par l’activation du bouton d’envoi du formulaire. Cette action peut consister à créer une nouvelle saisie dans une base de données, à mettre à jour une ou plusieurs saisies existantes ou à créer un formulaire vierge à remplir, par exemple. Comment utiliser l'aide | Sommaire | Index
Outre sa capacité à extraire l’information d’une source de contenu et à la restituer sur une page, GoLive propose des fonctions de mise à jour des informations de la base de données ou d’envoi des informations depuis un formulaire affiché dans un navigateur vers le serveur qui les traite. En langage HTML, les informations peuvent être envoyées du navigateur vers un URL spécifique (l’URL d’action de formulaire). Le code de la page traite ensuite les données de formulaire, met à jour la base de données, puis redirige le navigateur vers une autre page qui s’affiche. GoLive propose un moyen simple d’envoyer les données de formulaire à la page appropriée, fournit tout le code de cette page et vous permet de spécifier la page à afficher après la mise à jour.
Les actions de formulaire sont des actions provoquées par l’activation du bouton d’envoi. Généralement, l’action concerne la ou les saisies affichées dans le formulaire. GoLive propose cinq actions (Mettre à jour les saisies, Ajouter des saisies, Supprimer les saisies, Effacer les données du formulaire et Copier les données du formulaire), qui peuvent être associées à des boutons d’envoi de formulaire. Il existe aussi des actions de mise à jour spécifiques à la fonction de commerce électronique de GoLive, CustomMerchant. De plus, les mécanismes d’extension de GoLive permettent de définir d’autres actions et de les ajouter à un site. Lorsque vous activez une action de formulaire dans la palette des liaisons dynamiques, l’URL d’action de formulaire est défini automatiquement dans le dossier config/actions de votre site. Il est impossible de le modifier depuis l’inspecteur du formulaire. La méthode d’envoi est automatiquement définie sur Post. Cela ne doit pas être modifié. (La méthode d’envoi contrôle le mode d’envoi des champs de formulaire au Comment utiliser l'aide | Sommaire | Index
1 Faites glisser l’objet Formulaire du panneau Formulaire de la palette Objets sur une page statique (HTML) ou dynamique (ASP, JSP ou PHP). Placez-y des éléments de formulaire. Utilisez une grille de mise en page, des tableaux ou d’autres méthodes de mise en page pour disposer les éléments du formulaire. Tous les champs de formulaire doivent être imbriqués dans le formulaire. Vous pouvez utiliser des éléments du panneau Formulaire de la palette Objet ou alors des éléments de formulaire liés du panneau Contenu dynamique de la palette Objets si la page est déjà dynamique. 2 Ajoutez un bouton d’envoi de formulaire par action à définir. 3 Lorsque la mise en page est terminée, rendez la page dynamique (le cas échéant). Cette opération peut être effectuée indifféremment avant ou après la construction du formulaire. 4 Liez les champs de formulaire à des champs de source de contenu. Pour ajouter une action de formulaire à une page : 1 Créez une page de formulaire. Ajoutez un ou plusieurs boutons d’envoi au formulaire. 2 Définissez une action de formulaire pour un ou plusieurs de ces boutons dans la palette des liaisons dynamiques. 3 Si l’utilisateur doit être redirigé vers une autre page, choisissez l’option En cas de réussite, rediriger vers ou En cas d’échec, rediriger vers. Si aucune de ces options n’est sélectionnée, la même page se réaffiche après l’activation du bouton d’envoi. Lors de la création de pages dynamiques contenant des formulaires, vous devez garder à l’esprit les principes suivants : •
Pour configurer la mise à jour directe de saisies via un formulaire : 1 Créez le formulaire et les champs que l’utilisateur devra remplir. 2 Ajoutez une source de contenu à la page qui est connectée à la base de données que vous souhaitez mettre à jour. 3 Liez les éléments de formulaire aux champs de la source de contenu. 4 Ajoutez un bouton d’envoi et sélectionnez-le. Il est judicieux d’attribuer au libellé un nom évoquant la fonction de la page. Ainsi, vous pouvez choisir « Ajouter une nouvelle requête » comme libellé du bouton s’il permet d’ajouter une nouvelle saisie à un tableau de requêtes à traiter. Effectuez cette opération dans l’inspecteur. 5 Dans la palette des liaisons dynamiques, choisissez l’action de formulaire Ajouter des saisies. Vous trouverez cette option dans le menu secondaire Base de données ADO (ASP), MySQL (PHP) ou JDBC (JSP). 6 Choisissez comme source de contenu la source faisant référence au tableau auquel la saisie doit être ajoutée. Il doit aussi s’agir de la source de contenu à laquelle les éléments de formulaire sont liés. Au moins un champ de formulaire doit être lié à cette source de contenu. 7 Si vous ne souhaitez pas que l’utilisateur soit redirigé après avoir cliqué sur le bouton d’envoi, vous n’avez pas besoin de définir l’URL de redirection. Dans le cas contraire, vous pouvez définir la page à afficher après l’ajout d’une saisie ou en en cas d’erreur lors de cette opération. Un formulaire peut contenir plusieurs boutons d’envoi associés à des actions différentes. En règle générale, vous souhaitez que le formulaire affiché en vue de la création d’une nouvelle saisie soit doté de champs vierges. Lorsque vous les liez aux champs de la source de contenu, les valeurs de la base de données s’affichent. Pour plus de détails sur la création de formulaires vierges, voir « Création d’un formulaire vierge en vue de l’ajout de nouvelles saisies à une base de données », page 598. Seules les données d’éléments de formulaire liés sont impliquées dans l’action. Si des champs de formulaire cachés sont liés à des champs de source de contenu, ils fournissent aussi des données utilisées par l’action de formulaire. Les éléments de formulaire liés (texte ou autre) ne sont pas intégrés à la nouvelle saisie.
Création d’un formulaire vierge en vue de l’ajout de nouvelles saisies à une base de données Il arrive que vous souhaitiez afficher un formulaire vierge, même si ses champs sont liés à une source de contenu. Généralement, c’est parce que vous voulez que le formulaire serve à saisir de nouvelles données à ajouter au tableau de la base de données. Pour rendre vierge un formulaire doté d’éléments liés, il existe plusieurs méthodes à déterminer en fonction du flux d’interaction de votre site Web. Certaines méthodes dépendent du flux des pages du site. Dans les instructions ci-après, nous appelons actuelle la page contenant le formulaire à nettoyer et précédente la page affichée immédiatement avant. •
<?php MoveToEnd($content_source_name)?>. Ces chaînes de code placent la source
GoLive effectue un suivi de l’association des saisies aux champs du formulaire afin que les actions de mise à jour puissent envoyer les données de la saisie voulue, même si plusieurs saisies sont affichées dans le tableau. Lors d’une action de mise à jour, toutes les données du formulaire sont écrites dans la base de données pour mettre à jour toute saisie et tout champ présent dans le formulaire. Cette opération inclut les champs cachés liés à la source de contenu. Les champs de formulaire non liés à la source de contenu et les autres éléments liés de la page ne sont pas impliqués dans l’action de mise à jour de la base de données. Lorsque la mise à jour est terminée, une page s’affiche. Il peut s’agir de la page actuelle ou d’une autre page, différente selon que l’opération a réussi ou échoué. Pour configurer la mise à jour d’une base de données via un formulaire : 1 Créez le formulaire et les champs permettant l’affichage et la mise à jour de la base de données actuelle. 2 Ajoutez une source de contenu à la page connectée à la base de données à mettre à jour. 3 Liez les éléments de formulaire aux champs de la source de contenu. 4 Ajoutez un bouton d’envoi et sélectionnez-le. Il est judicieux d’attribuer au libellé un nom évoquant la fonction de la page. 5 Dans la palette des liaisons dynamiques, choisissez l’action de formulaire Mettre à jour les saisies. Vous trouverez cette option dans le menu secondaire Base de données ADO (ASP), MySQL (PHP) ou JDBC (JSP). 6 Choisissez comme source de contenu la source faisant référence au tableau auquel la saisie doit être ajoutée. Il doit aussi s’agir de la source de contenu à laquelle les éléments de formulaire sont liés. Au moins un champ de formulaire doit être lié à cette source de contenu. 7 Si vous ne souhaitez pas que l’utilisateur soit redirigé vers une page différente après avoir cliqué sur le bouton d’envoi, vous n’avez pas besoin de définir l’URL de redirection. Dans le cas contraire, vous pouvez définir la page à afficher après la mise à jour des saisies ou en cas d’erreur au cours de cette opération. Un formulaire peut contenir plusieurs boutons d’envoi associés à des actions différentes. Surveillez comment la base de données gère les champs qui ne sont pas présents dans le formulaire. Si un champ n’est pas dans le formulaire, les options allow zero length, not required ou des valeurs par défaut doivent être spécifiées. Si tel n’est pas le cas, la base de données risque de refuser la mise à jour, provoquant ainsi des erreurs difficiles à diagnostiquer. Comment utiliser l'aide | Sommaire | Index
L’action de suppression s’applique à un formulaire affichant le contenu d’une saisie unique, spécifique. Les valeurs des champs de formulaire ne servent pas à déterminer la saisie à supprimer. La saisie supprimée est toujours celle dont sont issues les valeurs. La source de contenu doit sélectionner une saisie soit en fonction des paramètres de filtre de requête (qui créent un test permettant de sélectionner une saisie précise), soit en fonction des paramètres d’URL de navigation entre les saisies (qui permettent à la source de contenu générale de choisir une saisie spécifique). Ces derniers paramètres sont spécifiés de manière à atteindre une page à partir d’un lien auquel une action est associée. Les actions associées à des liens (Afficher les détails de la saisie actuelle, Afficher les détails de la première/dernière saisie ou Afficher les détails de la saisie précédente/suivante) entraînent la sélection d’une saisie spécifique par la source de contenu. Pour configurer la suppression d’une saisie via un formulaire : 1 Créez le formulaire et les champs permettant d’afficher la saisie à supprimer. 2 Ajoutez une source de contenu à la page connectée à la base de données contenant le tableau qui, lui-même, contient la saisie à effacer. 3 Le cas échéant, liez les éléments de formulaire aux champs de la source de contenu. 4 Ajoutez un bouton d’envoi et sélectionnez-le. Il est judicieux d’attribuer au libellé un nom évoquant la fonction de la page (« Suppression », par exemple). 5 Dans la palette des liaisons dynamiques, choisissez l’action de formulaire Supprimer les saisies. Vous trouverez cette option dans le menu secondaire Base de données ADO (ASP), MySQL (PHP) ou JDBC (JSP). 6 Choisissez comme source de contenu la source faisant référence au tableau duquel la saisie doit être supprimée. 7 Si vous ne souhaitez pas que l’utilisateur soit redirigé vers une page différente après avoir cliqué sur le bouton d’envoi, vous n’avez pas besoin de définir l’URL de redirection. Dans le cas contraire, vous pouvez définir la page à afficher après la suppression d’une saisie ou en en cas d’erreur lors de cette opération. Si vous revenez à la page initiale, vous ne pouvez plus afficher la saisie supprimée. La source de contenu se repositionne automatiquement sur une saisie voisine, si possible. Un formulaire peut contenir plusieurs boutons d’envoi associés à des actions différentes. Par exemple, le formulaire peut contenir des boutons de mise à jour, de suppression et de copie de la saisie actuelle.
Les restrictions de la base de données relatives aux suppressions s’appliquent. Dans la plupart des cas, par exemple, il est impossible de supprimer une saisie via une vue.
Les menus déroulants dynamiques présentent deux caractéristiques essentielles. Ils vous permettent de contrôler la provenance de la valeur du menu sélectionnée (et sa destination dans le cas d’une action de mise à jour), ainsi que la liste des valeurs affichées lorsque l’utilisateur clique sur le menu. Généralement, ces liaisons renvoient à des sources de contenu très différentes. Par exemple, la liste des valeurs peut être composée à l’aide d’un tableau de votre base de données, mais la liste déroulante peut également être liée à un autre tableau de la base de données en vue de la saisie de données, par exemple. Gardez à l’esprit que les éléments de menu déroulant possèdent deux composants : le libellé (affiché à l’écran) et une valeur (transmise au serveur en tant que valeur du champ). Supposons vous utilisiez un tableau de base de données répertoriant des langues et des noms d’encodage. On peut y trouver une saisie dotée d’un champ Langue avec la valeur « Français (Canada) » et un champ « Encodage » avec la valeur FR_CA. Remplissez un menu déroulant avec les libellés et valeurs de cette source de contenu. Pour insérer des éléments dans un menu déroulant : 1 Faites glisser l’objet Menu déroulant dynamique du panneau Contenu dynamique de la palette Objets dans le formulaire de votre page. 2 Dans la palette des liaisons dynamiques, sélectionnez l’option Construire dynamiquement, puis une source de contenu. 3 Spécifiez le champ de valeur (« Encodage », par exemple) et le champ de libellé (« Langue », par exemple) avec les valeurs à insérer dans votre menu déroulant. Pour lier une valeur de menu déroulant à un champ de source de contenu : 1 Faites glisser l’objet Menu déroulant dynamique du panneau Contenu dynamique de la palette Objets dans le formulaire de votre page ou sélectionnez un menu déroulant existant sur le formulaire. 2 Dans la palette des liaisons dynamiques, sélectionnez la source de contenu et le champ contenant les valeurs à associer au menu déroulant. La procédure de création de zones de texte dynamiques est identique, sauf que vous devez faire glisser l’objet Zone de liste dynamique.
La création de groupes de boutons radio dynamiques est un peu plus complexe car elle implique l’utilisation d’un autre objet dynamique pour effectuer la répétition automatique du bouton radio lié.
3 Si vous souhaitez que toutes les valeurs de bouton radio de votre base de données soient affichées, assurez-vous que l’option Toutes les saisies est sélectionnée. 4 Faites glisser l’objet Bouton radio dynamique du panneau Contenu dynamique de la palette Objets dans la première ligne de l’objet Remplacer les lignes. 5 Dans la palette des liaisons dynamiques, sélectionnez la source de contenu stockant les valeurs à associer à votre groupe de boutons radio. 6 Sélectionnez l’option Construire dynamiquement, la source de contenu et le champ de valeur contenant les valeurs à associer à votre groupe de boutons radio. 7 A droite de l’objet Bouton radio dynamique, tapez un espace et un libellé de balise d’emplacement. 8 Sélectionnez ce libellé et liez-le au même champ de source de contenu que le bouton radio dynamique inséré précédemment. Le panneau Contenu dynamique de la palette Objets contient de nombreux autres éléments de formulaire prédéfinis en vue de la liaison à un champ de source de contenu. Hormis cette particularité, ils sont identiques aux éléments de formulaire classiques et fonctionnent de la même manière.
Si vous êtes amené à créer de nombreuses pages dotées de contenu dynamique, certains types sont récurrents. • Chaque section comprend la capture d’écran de la page finale, la présentation du type de page, son intérêt, la liste des tâches à connaître et, enfin, les instructions détaillées permettant de créer la page. Remarque : Les instructions sont relatives à la création d’un site ASP. Si vous utilisez le langage JSP ou PHP, suivez les indications de remplacement par des fichiers .jsp ou .php.
1 Faites glisser l’objet Formulaire du panneau Formulaire de la palette Objets dans le panneau Mise en page. 2 Ouvrez la section d’en-tête de la fenêtre du document, puis sélectionnez l’objet Source de contenu. 3 Dans la zone de filtrage des saisies de l’inspecteur de la source de contenu, sélectionnez le champ à utiliser comme clé de recherche. Dans la zone de saisie, tapez ensuite l’expression : like '%{Request.QueryString("keyword")}%'. Pour PHP, tapez like %{@GLOBALS["keyword"]}%. Pour JSP, tapez like '%{request.getParameter("keyword")}%'. 4 Faites glisser l’objet Champ de texte du panneau Formulaire de la palette Objets.
Pour créer la zone de résultats d’une page de recherche : 1 Faites glisser l’objet Formulaire du panneau Formulaire de la palette Objets dans le panneau Mise en page, juste sous le premier formulaire. 2 Faites glisser l’objet Remplacer les lignes du panneau Contenu dynamique de la palette Objets dans le second formulaire. 3 Dans la palette des liaisons dynamiques, cochez la case Lier à, puis sélectionnez votre source de contenu dans le menu approprié. 4 Dans le tableau, tapez un libellé et du texte balise pour chaque cellule voulue. 5 Liez toute balise d’emplacement aux champs souhaités dans votre source de contenu. Si vous voulez que l’utilisateur puisse modifier une saisie affichée dans la zone de résultats de la page, suivez les instructions ci-après. Pour créer un bouton de modification : 1 Ajoutez une cellule à droite de la dernière cellule du tableau créé dans le second formulaire. 2 Tapez le mot EDIT (Modifier) dans la cellule, puis sélectionnez-le. 3 Dans l’inspecteur du texte, liez le texte à la page détaillée (si elle n’existe pas, ajoutez simplement une page dynamique vierge à votre site). 4 Dans la palette des liaisons dynamiques, sélectionnez l’action Afficher les détails de la saisie actuelle. Bien que la conception de pages de requête ou de recherche exige l’exécution de scripts serveur et la connaissance du langage SQL, la page décrite ci-dessus constitue un prototype simple à utiliser et à modifier selon les besoins de votre site.
Généralement, les pages de recherche permettent à l’utilisateur de cliquer sur un élément de la liste de résultats pour en savoir plus à son sujet. Ce clic permet d’atteindre une autre page, appelée page détaillée, qui affiche des informations spécifiques à l’élément (produit d’un site de commerce électronique, communiqué de presse, descriptif d’un DVD). Dans cette section, il est entendu que vous avez créé et ouvert un site dynamique. Ouvrez une page vierge dans le site, rendez-la dynamique, ajoutez-lui une source de contenu et effectuez les opérations suivantes. Dans notre exemple, vous devez : •
1 Faites glisser l’objet Tableau du panneau Standard de la palette Objets dans le panneau Mise en page. Utilisez l’inspecteur du tableau pour le formater. Vous pouvez ensuite ajouter des objets permettant d’afficher les champs d’une saisie de votre base de données. 2 Faites glisser les objets dynamiques correspondant aux types de champs à afficher depuis le panneau Contenu dynamique de la palette Objets. 3 Liez ces objets aux champs appropriés dans votre source de contenu. 4 Cliquez sur l’onglet Aperçu de la fenêtre du document pour visualiser la première saisie de votre base de données qui a remplacé le contenu fictif. Généralement, cette visualisation s’avère inutile. Vous pouvez ajouter des boutons de navigation permettant la navigation parmi les saisies de la base de données. Pour créer des boutons de navigation : 1 Faites glisser l’objet Afficher la saisie précédente du panneau Contenu dynamique de la palette Objets sous la zone que vous venez de mettre en page. 2 Faites glisser l’objet Afficher la saisie suivante du panneau Contenu dynamique de la palette Objets immédiatement à droite du bouton Afficher la saisie précédente que vous avez créé. Comment utiliser l'aide | Sommaire | Index
Afficher la première saisie dans le menu. Sélectionnez une source de contenu. 6 Tapez LAST (Dernière) après le bouton Afficher la saisie suivante, et sélectionnez ce texte. 7 Créez un lien vers la page active dans l’inspecteur du texte. 8 Dans la palette des liaisons dynamiques, cochez la case Action Liens, puis sélectionnez Afficher la dernière saisie dans le menu. Sélectionnez une source de contenu.
2 Sélectionnez tous les éléments de la page à l’exception du conteneur de formulaire. 3 Faites glisser les éléments sélectionnés dans ce conteneur. Maintenant que tous les éléments de votre page font partie d’un formulaire, vous pouvez ajouter des boutons de formulaire et leur associer des actions afin de permettre à l’utilisateur (ou à vous-même) de modifier la saisie affichée. Comment utiliser l'aide | Sommaire | Index
3 Sélectionnez le premier bouton d’action d’envoi. 4 Dans l’inspecteur du bouton d’entrée, saisissez Mettre à jour (Update) dans le champ Libellé. 5 Dans la palette des liaisons dynamiques, cliquez sur Action, sélectionnez Base de données ADO > Mettre à jour les saisies, puis une source de contenu. 6 Sélectionnez l’option En cas d’échec, rediriger vers, et créez un lien vers le fichier config/actions/glerror.asp. 7 Reprenez les étapes 3 à 6 pour définir les autres boutons. Nom du bouton
Web ou à l’aide d’un URL renvoyant à un site accessible à votre serveur Web. L’accès via un URL a la particularité de pouvoir faire référence à tout type de page, y compris dynamique, en capacité de renvoyer des données XML (et non nécessairement à des pages statiques). Les serveurs de bases de données, par exemple, peuvent répondre à une requête d’URL en renvoyant des informations stockées dans la base de données sous forme de données au format XML. L’URL peut contenir des paramètres de sélection des données à renvoyer.
Pour définir la configuration du proxy, exécutez l’utilitaire proxycfg de Microsoft. Cela fait, redémarrez le système IIS.
XML au même format. La source de données identifie une classe de fichiers XML. Chaque fichier XML au même format peut être traité avec le même objet source de données XML. Pour plus de détails sur la création d’un objet source de données XML, voir « Création d’une source de données XML », page 610. Les éléments XML sont des composants syntaxiques contenus entre les balises <tag_name> et </tag_name>. tag_name est le nom de l’élément : il en indique le type. Le contenu situé entre les balises ouvrante et fermante peut se composer de texte ou d’autres éléments XML. Nous nommons « corps de l’élément » ce contenu et « enfants de l’élément » les éléments imbriqués. Les éléments peuvent aussi posséder des attributs apparaissant dans le code XML sous la forme <tag_name attr_name= "value">. Un élément peut être doté d’attributs ou pas. Dans un souci de simplicité, les sources de données XML de GoLive traitent les attributs et les éléments imbriqués de la même manière. La méthode d’accès aux valeurs des attributs et des éléments imbriqués est identique. En outre, les sources de données XML de GoLive définissent, pour chaque élément doté d’un enfant, un autre élément enfant spécifique nommé [body]. Cet élément spécial représente la valeur complète du corps de l’élément. Il comprend tous les éléments enfant, leurs balises d’encadrement et le texte inséré entre eux. Bref, l’élément [body] représente la totalité du contenu situé entre les balises ouvrante et fermante de l’élément. Pour chaque élément XML (balise, attribut ou élément [body]), vous pouvez spécifier l’une des options de liaison disponibles. Les options Liable et Non liable peuvent être appliquées à chaque balise d’élément. Les options Lier les enfants uniquement et Traiter comme un jeu de lignes s’appliquent uniquement aux balises d’éléments, pas aux attributs ni à l’élément [body]. Liable : L’élément XML doté de cette balise peut être lié à des éléments de page. La valeur renvoyée comprend tout le contenu de la balise sous forme de chaîne, notamment les espaces, commentaires et instructions de traitement. Cela peut néanmoins varier en fonction de l’implémentation XML (qui ne dépend pas de GoLive mais du serveur). Non liable : Un élément XML doté de cette balise ne peut pas être lié. Cette option a pour objectif de limiter la liste des balises dans laquelle le créateur d’une page Web doit effectuer une sélection. Certaines définitions de balises XML incluent des centaines de balises dont une minorité est pertinente pour un site Web donné. Lier les enfants uniquement : L’élément XML lui-même ne peut pas être lié mais ses éléments imbriqués sont visibles. Vous devez leur attribuer des balises à l’aide de l’une des options de liaison XML. Dans ce cas, le texte situé entre les éléments n’est pas liable (utilisez l’élément spécial [body] pour accéder au texte complet d’un élément avec enfant). Cette option est disponible uniquement si des enfants de l’élément sont présents dans le fichier échantillon XML. Vous pouvez lier la balise complète en rendant son enfant [body] liable.
Pour créer une source de données XML : Remarque : Votre site doit être préalablement converti en site dynamique. Pour plus de détails, voir « Dynamisation d’un site Web », page 562. 1 Lorsque la fenêtre du site est active, choisissez Site > Configurer > Contenu dynamique. 2 Dans la zone Sources de données, cliquez sur Créer. 3 Sélectionnez XML Data Source, puis cliquez sur Ajouter une source de données. 4 Remplissez les champs de l’éditeur de source de données XML. •
échantillon XML, puis d’afficher la structure obtenue dans une fenêtre. 7 Parcourez les balises affichées dans la fenêtre et sélectionnez les options de liaison voulues pour chaque balise (Liable, Non liable, Lier les enfants uniquement et Traiter comme un jeu de lignes).
9 Pour tester le traitement du fichier échantillon XML, cliquez sur le bouton de test. Si le test réussit, une fenêtre affiche le contenu analysé du fichier échantillon XML. Le bouton de test d’une source de contenu permet de tester la source XML réelle. Le bouton de test appliqué à la source de données vérifie uniquement le fichier échantillon.
Examinez l’exemple suivant : <addresses> Examinez attentivement le premier niveau de la structure XML : un élément de premier niveau (<addresses>) contient une série d’éléments <entry>. Chacun d’eux est traité comme saisie (record) et vous pouvez utiliser un tableau pour lequel l’option Remplacer les lignes est activée (ou un conteneur Répéter le contenu) afin que chaque élément <entry> s’affiche sur une ligne. Cette structure XML permet la représentation de saisies multiples.
A l’inverse des bases de données où chaque saisie possède la même structure et les mêmes champs, ceux-ci peuvent varier pour les éléments XML. Par exemple, un élément <product> peut avoir les enfants <price> et <discount> tandis qu’un autre élément <product> a les enfants <price>, <sale_price> et <sale_area>. <products> <product> D’autres tests permettent d’effectuer des opérations de ce type.
GoLive prend implicitement en charge les saisies multiples dans une source XML au premier niveau de la structure XML. Il prend également en charge le traitement des éléments répétés s’ils sont imbriqués dans le code XML. Examinez la structure XML suivante : <addresses> <entry> <name>Russell</name> Remplacer les lignes pour la source de contenu XML principale. Imbriquez un second tableau dans le premier et activez l’option Remplacer les lignes pour la source de contenu XML secondaire. Comment utiliser l'aide | Sommaire | Index
De la même manière, lorsqu’une page Web contenant une source de contenu XML est visualisée en ligne, la transformation XSLT est appliquée au code XML avant son traitement et l’insertion du contenu dans la page.
EasyHost est une solution d'hébergement complète proposée par Adhost et Adobe Systems, Inc. Les utilisateurs des fonctions de création de contenu dynamique de GoLive disposent désormais, pour l’hébergement de leurs applications Web PHP et ASP, des services d’un prestataire reconnu et fiable, leader sur le marché de l’hébergement professionnel. Vous pouvez tester votre site facilement en créant un compte auprès d’Adhost. Pour plus de détails sur le programme d’hébergement spécifique, voir http:// golive.adhost.com. Fondée en 1995, la société Adhost (www.adhost.com) fournit des solutions d’hébergement Web complètes à plus de 1 400 clients professionnels. Adhost assiste les entreprises au cours des différentes phases de la vie de leur site Web : développement, hébergement, maintenance et promotion. Adhost utilise une gamme complète de solutions de développement pour assurer à ses clients une présence professionnelle dynamique et effective sur le Web. EasyHost vous évite le désagrément de rechercher un fournisseur de services Internet susceptible d’héberger des applications Web faisant appel à des bases de données, ce qui accélère considérablement le processus de développement de votre site Web. Les acquéreurs de GoLive 6.0 peuvent bénéficier de l’offre d’essai gratuit d’EasyHost pour une durée de 30 jours afin de constater par eux-mêmes à quel point le déploiement de sites complexes est ainsi simplifié.
Dans ce cas, vous avez deux sites : un site dynamique utilisé pour générer des pages statiques et un site statique mis en ligne à l’intention du public. Vous pouvez également utiliser la génération de pages statiques pour créer des rapports, des images ou d’autres pages Web basées sur un modèle et des sources de données externes.
La génération de pages hors ligne implique les fonctions suivantes : Page modèle Pour la génération de pages hors ligne, tout fichier traité sur votre serveur Web peut servir de modèle quel que soit son format (HTML, ASP, JSP, XML et PHP). Une page modèle peut correspondre à un site Web dynamique, à une partie de site dynamique ou même à un ensemble de pages aléatoires. Tableau HTML Page dotée d’un ou plusieurs tableaux HTML répertoriant des URL, des paramètres d’URL et des noms de fichiers de sortie Générateur de pages Application puissante permettant de traiter les pages modèle selon les instructions du tableau HTML. Elle peut être lancée via la ligne de commande ou la commande du menu Fichier de GoLive. Voici un exemple simple illustrant le processus. Le tableau HTML (pagelist.html) crée quatre fichiers de sortie. Lorsque vous faites appel au générateur de pages, il traite le fichier figurant dans la première colonne à l’aide des paramètres des deuxième et troisième colonnes (« Id » et « Price », correspondant respectivement à l’identifiant et au prix du produit). Le fichier obtenu est affiché dans la quatrième colonne : Modèle
Pour générer des pages depuis la ligne de commande : 1 Ouvrez la ligne de commande du système sur lequel GoLive est installé. 2 Utilisez la commande cd pour parvenir au dossier Générateur de pages situé dans le dossier Modules du dossier d’installation de GoLive. 3 Tapez l’une des commandes suivantes : •
Génération de pages HTML statiques avec GoLive La commande de menu (Fichier > Générateur de pages) affiche une boîte de dialogue vous invitant à définir les mêmes paramètres que l’interface de lignes de commande. Cette méthode utilise les paramètres de proxy HTTP définis dans les préférences réseau. Pour générer une page avec la commande de menu de GoLive : 1 Choisissez Fichier > Générateur de pages. 2 Tapez des valeurs dans les champs de paramètres de la boîte de dialogue ou, le cas échéant, utilisez les boutons Parcourir pour localiser des fichiers. 3 Cliquez sur Générer. Le générateur de pages est exécuté en fonction des paramètres saisis.
Elle est désactivée par défaut. Informations de dépannage (/config/info/trouble-shooting.asp) : Fournit des informations sur votre environnement serveur sur une simple page HTML que vous pouvez visualiser dans un navigateur.
JSP : Outil de test SQL (/config/info/testsql.jsp) : Fournit un environnement de test des requêtes SQL utilisant une ressource de base de données disponible. Outil de débogage (/WEB-INF/web.xml) : Permet d’afficher des informations de débogage plus détaillées sur la page comportant des erreurs. A l’aide d’un éditeur de texte, vous pouvez définir le paramètre com.adobe.gl.runtimeDebug sur true et réinitialiser le serveur afin d’activer cette fonction. Elle est désactivée par défaut. Ce paramètre peut également être défini en cochant la case appropriée sur la page config/info/ debug.jsp. Vous pouvez obtenir des informations de débogage à la condition expresse de figurer comme utilisateur autorisé dans le fichier friends.xml. Informations de dépannage (/config/info/trouble-shooting.jsp) : Fournit des informations sur votre environnement serveur sur une simple page HTML que vous pouvez visualiser dans un navigateur.
PHP : Outil de test SQL (/config/info/testsql.php) : Fournit un environnement de test des requêtes SQL utilisant une ressource de base de données disponible. Outil de débogage (/config/include/utils.runtime6.php) : Permet d’afficher des informations de débogage plus détaillées sur la page comportant des erreurs. A l’aide d’un éditeur de texte, vous pouvez définir la valeur RuntimeDebug sur true afin d’activer cette fonction. Elle est désactivée par défaut.
Le module Dynamic Content de GoLive peut analyser la configuration du serveur et du site et afficher les résultats dans un rapport de dépannage couvrant tous les aspects de votre configuration serveur. Le site doit être ouvert et installé sur un serveur Web. Pour tester la configuration du site et du serveur : 1 Choisissez Site > Configurer. 2 Sélectionnez le langage de script serveur utilisé pour le site dans la zone Langages de scripts serveur de la boîte de dialogue de configuration. 3 Cliquez sur Test. Le rapport de dépannage relatif au langage sélectionné s’ouvre dans votre navigateur par défaut. Ce rapport peut vous aider à résoudre les problèmes. Imprimez-le et conservez-le à proximité au cas où vous devriez contacter le support technique d’Adobe. Vous pouvez également vérifier le fonctionnement des sources de données installées dans votre site. Pour tester une source de données : 1 Choisissez Site > Configurer. 2 Sélectionnez la source de données à vérifier dans la zone Sources de données de la boîte de dialogue de configuration. 3 Cliquez sur Test. Une boîte de dialogue vous indique si la source est correcte ou non.
GoLive vous permet de détecter les liaisons incorrectes et les erreurs dans le code serveur. Par défaut, les liaisons incorrectes sont affichées en rouge dans le panneau Mise en page. Pour vérifier le code serveur utilisé pour le contenu dynamique : Cliquez sur l’onglet Source. GoLive affiche le code serveur dans une couleur spécifique (orange, par défaut). Pour modifier cela, choisissez Edition > Préférences, puis choisissez une nouvelle couleur pour le code serveur. GoLive vous permet aussi de déboguer des pages individuelles de votre site dans l’éditeur de code source. L’éditeur de code source a la possibilité de balayer la page à la recherche de problèmes fréquents. Pour rechercher des erreurs fréquentes dans une page : 1 Cliquez sur l’onglet Source dans la fenêtre du document. 2 Le cas échéant, cliquez sur le bouton d’affichage des erreurs. 3 Cliquez sur le bouton Lancer la vérification de la syntaxe. GoLive affiche les erreurs dans le panneau supérieur. Cliquez sur une erreur pour afficher le code correspondant dans le panneau principal de l’éditeur de code source. Comment utiliser l'aide | Sommaire | Index
• à une base de données contenant les identifiants et mot de passe de la base de données.
Définition des accès en écriture pour le dossier Config Le dossier Config doit contenir des droits en écriture de système de fichiers pour le serveur Web en vue de la prévisualisation d’un site dans GoLive uniquement sur le serveur de montage ou de développement. Sur le serveur de production, accessible au public, désactivez les droits d’écriture pour ce dossier. Le dossier config/include ne nécessite pas l’accès en lecture HTTP : mieux vaut le désactiver.
Définissez un mot de passe pour votre dossier Config sur le serveur à l’aide de l’authentification standard.
Vous pouvez déplacer le dossier config/datasources hors de la racine virtuelle. Cela le rend inaccessible via HTTP. Pour déplacer le dossier Datasources, vous devez modifier l’un des fichiers du dossier Config. A cet effet, il est nécessaire de connaître les langages ASP, JSP ou PHP. Pour déplacer le dossier Datasources, examinez : •
Modification des préférences de contenu dynamique Dans le panneau Contenu dynamique de la boîte de dialogue des préférences, vous pouvez contrôler : •
Le panneau Source > Couleurs de la boîte de dialogue Préférences vous permet de choisir la couleur d’affichage du code serveur dans l’éditeur de code source. Pour modifier la couleur d’affichage du code serveur dans l’éditeur de code source : 1 Choisissez Edition > Préférences. 2 Développez l’arborescence de l’icône Source du panneau gauche de la boîte de dialogue Préférences, puis cliquez sur Couleurs. 3 Cliquez dans la zone Code serveur pour choisir la couleur voulue.
Dans le panneau Contenu dynamique de la boîte de dialogue de configuration du site, vous pouvez contrôler : •
2 Cliquez sur l’icône Contenu dynamique dans le panneau gauche de la boîte de dialogue de configuration. 3 Effectuez l’une des opérations suivantes : •
« Préparation d’un site sur un serveur Web », page 557.
Par défaut, le module Dynamic Content est activé. Toutes les fonctions décrites dans le présent chapitre requièrent l’activation de ce module. Vous pouvez le désactiver si vous travaillez sur un site Web statique ou que la mémoire ou d’autres ressources sont insuffisantes.
3 Utilisez la case Dynamic Content du panneau droit pour activer/désactiver le module. La case est cochée quand le module est activé (option par défaut). 4 Cliquez sur OK. 5 Relancez GoLive.
GoLive est compatible avec bon nombre de logiciels serveur Web, de bases de données et de technologies de script. Le tableau ci-après résume les configurations serveur prenant en charge les sites Web dotés de contenu dynamique. MySQL. Pour plus de détails et des instructions d’installation du logiciel serveur préconfiguré, voir le fichier Lisezmoi accompagnant ce dernier. Ce serveur convient au développement de sites GoLive dynamiques utilisant PHP ou JSP. Vous le trouverez sur le CD-Rom serveur de GoLive. Pour le développement de sites ASP, utilisez les serveurs IIS (Internet Information Server) ou PWS (Personal Web Server) de Microsoft. PWS est disponible pour Windows 98 et 2000, IIS pour Windows NT, 2000 et XP Professional.
Configuration de la base de données Web est dotée de plusieurs panneaux qu’il est possible de modifier en fonction des besoins. La base de données Web fait également office de référence en assistant les concepteurs de sites Web dans leur choix d’éléments et d’attributs adaptés à leurs pages Web. Remarque : Dans le cas du développement d’un site collaboratif sur un serveur collaboratif, les utilisateurs doivent s’assurer que tout le monde utilise la même base de données Web. Pour afficher la base de données Web : 1 Choisissez Edition > Configurer la base de données Web.
Plusieurs options s’offrent à vous pour supprimer des modifications apportées à la base de données Web. Vous pouvez empêcher l’enregistrement des modifications à la fermeture de la fenêtre, restaurer les paramètres par défaut d’éléments sélectionnés ou d’un panneau entier de la fenêtre Configuration de la base de données Web, ou restaurer l’intégralité des paramètres par défaut de la base de données Web. Pour fermer la fenêtre Configuration de la base de données Web sans enregistrer les modifications : 1 Fermez la fenêtre Configuration de la base de données Web en appuyant sur la touche Alt (Windows) ou Option (Mac OS). 2 Cliquez sur Non lorsque vous êtes invité à enregistrer la configuration de la base de données Web. 3 Quittez, puis relancez GoLive. La base de données Web retrouve alors la configuration définie avant sa dernière ouverture. Pour restaurer les paramètres par défaut d’éléments sélectionnés : 1 Dans les panneaux Balise, Caractères ou Association de fichiers, sélectionnez un élément, un attribut, une énumération, un caractère ou un suffixe doté du libellé « change » ou « x » dans la colonne Utilisateur. 2 Appuyez sur la touche de suppression de votre clavier.
2 Localisez le dossier de configuration dans le dossier des préférences de GoLive : •
Pour restaurer les paramètres par défaut d’un panneau spécifique de la fenêtre Configuration de la base de données Web : 1 Localisez le dossier des préférences d’Adobe GoLive 6 : •
Sélectionnez un élément marqué « nouveau » ou « x » dans la colonne Utilisateur du panneau Balise, Caractères ou Association de fichiers, puis appuyez sur la touche de suppression.
Retrait : définit la valeur et le type de retrait entre des jeux de balises conteneur insérées dans le code source. Caractère de saut de ligne : permet de spécifier le mode d’écriture des sauts de ligne pour la plate-forme de votre serveur Web. •
(Document Type Definition) XML et le lier aux extensions de fichier et aux types MIME.
être organisés en sections ou visualisés par ordre alphabétique. Les informations relatives aux éléments, aux attributs ou à l’énumération sont affichées dans l’inspecteur. Pour afficher des éléments : 1 Dans le panneau Balise de la fenêtre Configuration de la base de données Web, développez une section puis sélectionnez un langage de balisage. 2 Parcourez la liste de la section de droite du panneau Balise (si l’affichage est défini sur Dossiers séparés, développez une section), puis sélectionnez un élément. Consultez l’inspecteur de l’élément de la base de données Web pour visualiser les informations structurelles disponibles sur cet élément. 3 Pour afficher les attributs d’un élément dans le panneau Balise, développez la balise, puis sélectionnez l’attribut. (Certaines balises n’ont pas d’attribut.) Pour afficher l’énumération d’un attribut, développez cet attribut, puis sélectionnez l’énumération. (Certains attributs n’ont pas d’énumération.) Pour plus de détails sur les options de balise, d’attribut et d’énumération de l’inspecteur, voir « Modification d’un élément », page 630, « Modification d’un attribut », page 632 ou « Modification d’une énumération », page 634. Pour afficher ou masquer les colonnes du panneau Balise : Cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS) sur le titre d’une colonne, puis choisissez le nom d’une colonne ou une option dans le menu contextuel qui s’affiche. Vous pouvez afficher ou masquer toutes les colonnes, ou afficher une sélection de colonnes.
Le panneau Balise de la fenêtre Configuration de la base de données Web constitue un environnement pratique pour l’ajout, la modification ou la suppression d’éléments et de leurs attributs, ainsi que d’énumération. Tous les éléments, nouveaux ou non, du panneau Balise de la fenêtre Configuration de la base de données Web sont utilisés par le vérificateur de syntaxe de l’éditeur de code source. Important : Ne modifiez pas la base de données Web si vous n’êtes pas expert en matière de langage HTML. En effet, en cas d’erreur pendant la modification de la base de données Web, les documents risquent de se trouver gravement endommagés. Avant d’ajouter de nouveaux éléments ou de modifier des éléments existants, vérifiez les spécifications HTML actuelles définies par le consortium W3C (World Wide Web Consortium) à l’adresse suivante : http://www.w3c.org. Pour plus de détails sur la fermeture de la fenêtre Configuration de la base de données Web sans enregistrement des modifications ou sur la restauration de la configuration de la base de données Web, voir « Restauration de la base de données Web par défaut », page 625
Pour ajouter un élément, cliquez sur le bouton Elément choisissez Ajouter un élément dans le menu contextuel.
2 Une fois le nouvel élément sélectionné, modifiez ses propriétés dans l’inspecteur. (Voir « Modification d’un élément », page 630, « Modification d’un attribut », page 632 ou « Modification d’une énumération », page 634) Remarque : Pour ajouter de nouveaux éléments de base de données à un document, vous devez saisir le code de ces éléments manuellement dans l’éditeur de source du document. Pour ajouter de nouveaux attributs d’éléments ou énumérations à un document, vous devez saisir leur code manuellement dans l’éditeur de source ou les sélectionner dans les menus contextuels d’attribut ou d’énumération de l’éditeur de structure. Pour supprimer des éléments ajoutés au panneau Balise : Sélectionnez l’élément, puis effectuez l’une des opérations suivantes : •
élément. Vous pouvez modifier les éléments et en définir de nouveaux. Important : Ne modifiez pas la base de données Web si vous n’êtes pas expert en matière de langage HTML. En effet, en cas d’erreur pendant la modification de la base de données Web, les documents risquent de se trouver gravement endommagés. Avant d’ajouter de nouveaux éléments ou de modifier des éléments existants, vérifiez les spécifications HTML actuelles définies par le consortium W3C (World Wide Web Consortium) à l’adresse suivante : http://www.w3c.org. Pour plus de détails sur la fermeture de la fenêtre Configuration de la base de données Web sans enregistrement des modifications ou sur la restauration de la configuration de la base de données Web par défaut, voir « Restauration de la base de données Web par défaut », page 625 Pour modifier un élément : 1 Sélectionnez l’élément dans le panneau Balise de la fenêtre Configuration de la base de données Web. Saisissez ensuite le nom de l’élément dans la zone de texte Nom du panneau Standard de l’inspecteur. Comment utiliser l'aide | Sommaire | Index
Pour définir le formatage de base d’un élément : 1 Sélectionnez l’élément dans le panneau Balise de la fenêtre Configuration de la base de données Web.
Modification du vérificateur de syntaxe Pour tout élément, attribut ou propriété de la fenêtre Configuration de la base de données Web, le panneau Version de l’inspecteur permet de spécifier les navigateurs ou les versions HTML prenant en charge l’élément et, dans certains cas, de définir des attributs personnalisés. Les options de compatibilité de navigateur sélectionnées pour un élément spécifique peuvent provoquer l’affichage d’avertissements relatifs aux navigateurs lors du lancement du vérificateur de syntaxe (voir « Vérification de la syntaxe », page 440). Remarque : Les paramètres définis dans le panneau Version de l’inspecteur n’ont aucune incidence sur l’écriture du code HTML par GoLive ou sur l’affichage des pages dans les navigateurs. Pour modifier les règles de vérification de la syntaxe : 1 Sélectionnez un élément, un attribut ou une énumération dans le panneau Balise de la fenêtre Configuration de la base de données Web. 2 Dans le panneau Version de l’inspecteur, sélectionnez les versions HTML ou de navigateurs prenant en charge la sélection. 3 S’il s’agit d’un élément, sélectionnez l’option Peut avoir n’importe quel attribut afin d’autoriser les attributs autres que ceux spécifiés dans la fenêtre Configuration de la base de données Web.
L’inspecteur d’attribut de la base de données Web permet de définir la fonction, le type de valeur et la valeur par défaut d’un attribut. Vous pouvez modifier les attributs et en définir de nouveaux. Important : Ne modifiez pas la base de données Web si vous n’êtes pas expert en matière de langage HTML. En effet, en cas d’erreur pendant la modification de la base de données Web, les documents risquent de se trouver gravement endommagés. Avant d’ajouter de nouveaux éléments ou de modifier des éléments existants, vérifiez les spécifications HTML actuelles définies par le consortium W3C (World Wide Web Consortium) à l’adresse suivante : http://www.w3c.org. Pour plus de détails sur la fermeture de la fenêtre Configuration de la base de données Web sans enregistrement des modifications ou sur la restauration de la configuration de la base de données Web par défaut, voir « Restauration de la base de données Web par défaut », page 625 Pour modifier un attribut : 1 Saisissez le nom de l’attribut dans la zone de texte Nom. 2 Saisissez une description dans la zone de texte Commentaire.
6 Dans le panneau Version de l’inspecteur, sélectionnez les versions HTML ou de navigateurs prenant en charge l’attribut. Remarque : Les options de compatibilité de navigateur sélectionnées pour un attribut peuvent provoquer l’affichage d’avertissements relatifs aux navigateurs lors du lancement du vérificateur de syntaxe (voir « Vérification de la syntaxe », page 440). Les paramètres définis dans le panneau Version de l’inspecteur n’ont aucune incidence sur l’écriture du code HTML par GoLive ou sur l’affichage des pages dans les navigateurs.
Pour modifier une énumération : 1 Saisissez le nom de l’énumération dans la zone de texte Nom de l’inspecteur d’énumération de la base de données Web. 2 Saisissez une description dans la zone de texte Commentaire. 3 Dans le panneau Version de l’inspecteur, sélectionnez les navigateurs et les versions HTML prenant en charge la propriété. Remarque : Les options de compatibilité de navigateur sélectionnées pour un attribut peuvent provoquer l’affichage d’avertissements relatifs aux navigateurs lors du lancement du vérificateur de syntaxe (voir « Vérification de la syntaxe », page 440). Les paramètres définis dans le panneau Version de l’inspecteur n’ont aucune incidence sur l’écriture du code HTML par GoLive ou sur l’affichage des pages dans les navigateurs.
Un fichier DTD importé peut être lié à des extensions de fichier et à des types MIME. GoLive peut ainsi ouvrir un fichier quelconque doté de cette extension et lui associer le fichier DTD importé pour la vérification de la syntaxe et le placement des éléments dans l’éditeur de structure. Pour importer un fichier DTD XML : 1 Choisissez Importer un XML-DTD dans le menu contextuel de la partie gauche du panneau Balise de la fenêtre Configuration de la base de données Web. 2 Ouvrez un fichier DTD. Le fichier DTD s’affiche dans le dossier Imported du panneau Balise. Les éléments, les entités et les notations contenus dans le fichier DTD sont répertoriés dans la partie droite du panneau. Pour modifier un fichier DTD XML : 1 Sélectionnez le nom du fichier DTD dans la partie gauche du panneau Balise de la fenêtre Configuration de la base de données Web. 2 Dans la zone de texte Extensions de l’inspecteur du DTD XML, saisissez une ou plusieurs extensions (si vous saisissez plusieurs extensions, séparez-les par des virgules). Comment utiliser l'aide | Sommaire | Index
Panneau Caractères de la fenêtre Configuration de la base de données Web organisé par ordre alphabétique
Les caractères peuvent être affichés par catégories ou par ordre alphabétique. Si un caractère ne peut être affiché dans la police du système, il est remplacé par une petite case (Windows) ou par une croix (Mac OS) dans la colonne Caractère du panneau Caractères de la fenêtre Configuration de la base de données Web. Pour afficher des caractères spéciaux : 1 Activez le panneau Caractères de la fenêtre Configuration de la base de données Web. Dans la palette Affichage, sélectionnez ensuite une des options suivantes : •
1 Sélectionnez le caractère dans le panneau Caractères de la fenêtre Configuration de la base de données Web. 2 Activez l’inspecteur d’entité de la base de données Web, sélectionnez le caractère dans la troisième zone de texte Code ISO (Windows) ou Mac (Mac OS), puis choisissez Copier dans le menu contextuel.
2 Effectuez l’une des opérations suivantes : •
• HTML prenant en charge le caractère.
Les profils de remplacement peuvent être utilisés pour la prévisualisation des pages à l’aide de la palette Affichage. (Voir « Définition des options d’affichage de mise en page », page 48.)
écrit le code HTML, ni sur l’aspect final de votre site. Les profils sont réalisés à l’aide de feuilles de style en cascade utilisant les styles de sélecteurs d’éléments. Si vous savez comment créer des feuilles de style en cascade, vous pouvez dupliquer un profil existant et le modifier afin de créer un nouveau profil de navigateur. Remarque : Les feuilles de style créées dans l’éditeur de feuilles de style CSS ne sont ni affectées par, ni associées aux profils reposant sur des feuilles de style et se trouvant dans le panneau Profils du navigateur de la fenêtre Configuration de la base de données Web.
Les profils de navigateur du panneau Profils du navigateur de la fenêtre Configuration de la base de données Web sont protégés en écriture. Vous pouvez uniquement consulter leurs propriétés. Pour afficher les propriétés du profil : 1 Sélectionnez un profil dans la liste du panneau Profils du navigateur de la fenêtre Configuration de la base de données Web. 2 Le panneau Standard de l’inspecteur de la feuille de style racine permet de visualiser le système et les commentaires correspondant à ce profil. 3 Le panneau Configuration affiche la résolution et d’autres options. 4 Le panneau Source affiche la feuille de style associée au profil et utilisée pour la simulation du navigateur et de la plate-forme.
1 Dans le panneau Profils du navigateur de la fenêtre Configuration de la base de données Web, sélectionnez le profil correspondant le plus à votre navigateur cible, puis choisissez Dupliquer dans le menu contextuel. 2 Sélectionnez le nouveau profil dupliqué. Entrez ensuite un nom, des informations relatives au système et des commentaires dans le panneau Standard de l’inspecteur de la feuille de style racine. 3 Dans le panneau Configuration de l’inspecteur, spécifiez une résolution d’affichage (généralement 96 sous Windows et 72 sous Mac OS) dans la zone de texte PPP, puis sélectionnez l’option Peut gérer les feuilles de style. 4 Développez le profil dans la fenêtre Configuration de la base de données Web, puis sélectionnez l’élément à modifier. Effectuez les modifications voulues à l’aide de l’inspecteur de style CSS. Le nouveau profil s’affiche dans le menu contextuel des profils de la palette Affichage.
Dans le panneau Profils du navigateur de la fenêtre Configuration de la base de données Web, le profil Racine détermine le profil par défaut utilisé pour l’affichage des documents dans l’éditeur de mise en page. Vous pouvez utiliser le menu des profils de la palette Affichage pour simuler l’aspect du document dans différents navigateurs et plates-formes. Pour prévisualiser des pages avec différents profils de navigateur : Ouvrez l’éditeur de mise en page du document, puis sélectionnez un profil dans le menu des profils de la palette Affichage. Pour définir un profil de navigateur comme profil par défaut utilisé dans l’éditeur de mise en page : Dans la colonne Racine du panneau Profils du navigateur de la fenêtre Configuration de la base de données Web, sélectionnez le bouton radio correspondant au profil du navigateur voulu.
Panneau Association de fichiers de la fenêtre Configuration de la base de données Web organisé par ordre alphabétique
Vous pouvez afficher toutes les extensions (ou suffixes) de fichiers définies dans la base de données Web, ainsi que le type de fichier, le type MIME et l’application associée à chacun d’entre eux. Pour modifier l’affichage des associations de fichiers : Activez le panneau Association de fichiers de la fenêtre Configuration de la base de données Web, puis sélectionnez une propriété d’affichage dans la palette Affichage. Pour afficher ou masquer des colonnes du panneau Association de fichiers : Dans le panneau Association de fichiers, cliquez avec le bouton droit de la souris (Windows) ou en maintenant la touche Control enfoncée (Mac OS) sur l’un des en-têtes de colonne. Choisissez ensuite un élément dans le menu contextuel qui s’affiche. Vous pouvez afficher ou masquer toutes les colonnes, ou afficher une sélection de colonnes.
Vous avez la possibilité d’ajouter et de modifier des associations de fichiers dans le panneau Association de fichiers de la fenêtre Configuration de la base de données Web. Pour supprimer des modifications apportées à une association de fichier par défaut, voir « Restauration de la base de données Web par défaut », page 625. Pour ajouter ou supprimer une association de fichier : Dans le panneau Association de fichiers de la fenêtre Configuration de la base de données Web, effectuez l’une des opérations suivantes : •
Pour modifier une association de fichier : Dans le panneau Association de fichiers de la fenêtre Configuration de la base de données Web, sélectionnez l’extension, puis définissez les options correspondantes dans l’inspecteur de l’extension de fichier : •
Pour utiliser les associations du Tableau de bord Internet plutôt que celles de GoLive (Mac OS) : Sélectionnez Utiliser le tableau de bord Internet dans le panneau Association de fichiers de la fenêtre Configuration de la base de données Web. Pour lancer et modifier le tableau de bord Internet sous Mac OS : Cliquez sur le bouton Utiliser le tableau de bord Internet du panneau Association de fichiers de la fenêtre Configuration de la base de données Web. Remarque : Si vous ajoutez ou modifiez une association portant le même suffixe que l’une des associations du Tableau de bord Internet alors que vous utilisez la fonction correspondante de ce dernier, vos associations sont écrasées.
Placer le curseur au début du mot
Localiser un fichier dans le Finder Afficher dans le Finder les informations sur un objet
+ cliquer sur le fichier Control + cliquer sur le fichier, choisir Ouvrir/Afficher les propriétés
Sélectionner le fichier suivant
Le curseur étant dans la fenêtre du document, + , (virgule)
Afficher ou masquer la liste des attributs d’une balise de manière récursive
Faire glisser sur l’onglet associé
Ouvrir/Localiser dans l’Explorateur
Ouvrir/Afficher les propriétés
Sélectionner le fichier suivant
Afficher ou masquer la liste des attributs d’une balise de manière récursive Activer la zone de texte suivante Activer la zone de texte précédente Activer le menu contextuel associé à la balise Maj
Les informations contenues dans ce manuel sont fournies à titre purement indicatif et ne doivent pas être considérées comme un engagement de la part d’Adobe Systems Incorporated, qui se réserve le droit de les modifier sans préavis. Adobe Systems Incorporated décline toute responsabilité en cas d’éventuelles erreurs ou inexactitudes relevées dans le contenu informationnel de ce manuel. Nous attirons votre attention sur le fait que les illustrations ou images que vous pouvez être amené à inclure dans vos projets sont peut-être protégées par des droits de propriété. L’exploitation de matériel protégé sans l’autorisation de l’auteur constitue une violation de droit. Assurez-vous d’obtenir les autorisations requises avant de procéder. Toute référence à des noms de sociétés dans les modèles sont purement fictives et ne visent aucune entreprise existante. Adobe, the Adobe logo, Acrobat, Acrobat Reader, After Effects, Classroom in a Book, GoLive, Illustrator, ImageReady, InDesign, LiveMotion, Adobe Premiere, Photoshop, Reader, et 360Code sont des marques ou des marques déposées d’Adobe Systems Incorporated aux Etats-Unis et/ou dans d’autres pays. ActiveX, Microsoft, Windows and Windows NT sont des marques ou des marques déposées de Microsoft Corporation aux Etats-Unis et/ou dans d’autres pays. Apple, AppleScript, ColorSync, Mac, Macintosh et Power Macintosh sont des marques déposées d’Apple Computer, Inc. aux Etats-Unis et/ou dans d’autres pays. QuickTime et le logo QuickTime sont des marques utilisées sous licence. Le logo QuickTime est déposé aux Etats-Unis et dans d’autres pays. Pentium est une marque déposée d’Intel Corporation. SVG est une marque du World Wide Web Consortium ; les marques du W3C sont déposées et détenues par ses institutions hôtes MIT, INRIA, et Keio. Macromedia et Flash sont des marques ou des marques déposées de Macromedia, Inc. aux Etats-Unis et/ou dans d’autres pays. Solaris est une marque déposée de Sun Microsystems, Inc. aux Etats-Unis et/ou dans d’autres pays. Toutes les marques déposées de SPARC sont utilisées sous licence et constituent des marques ou des marques déposées de SPARC International, Inc. Les produits portant les marques SPARC sont basés sur une architecture développée par Sun Microsystems, Inc. Toutes les autres marques déposées sont la propriété de leurs détenteurs respectifs. Logiciel Apple Information Access Toolkit inclus. Ce logiciel repose en partie sur le travail du groupe Independent JPEG. Ce produit inclut un logiciel développé par la Fondation Apache Software ((http:www.apache.org/). Base de données Proximity/Franklin ©1994 Franklin Electronic Publishers, Inc., ©1990. Tous droits réservés. Proximity Technology, Inc. Base de données Proximity/Merriam-Webster ©1990 MerriamWebster Inc., ©1990. Tous droits réservés. Proximity Technology, Inc. Bases de données Proximity/Collins ©1990 William Collins Sons & Co. Ltd., © 1990. Tous droits réservés. Proximity Technology, Inc. Base de données Proximity/Munksgaard © 1990 Munksgaard International Publishers Ltd., © 1990. Tous droits réservés. Proximity Technology Inc. Bases de données Proximity/Van Dale ©1990, 1995 Van Dale Lexicografie bv., ©1990, 1996. Tous droits réservés. Proximity Technology, Inc. Bases de données Proximity/IDE © 1990 IDE a.s., ©1990. Tous droits réservés. Proximity Technology, Inc. Base de données Proximity/Hachette ©1992 Hachette, ©1992. Tous droits réservés. Proximity Technology, Inc. Base de données Proximity/Bertelsmann ©1997 Bertelsmann Lexikon Verlag, ©1997. Tous droits réservés. Proximity Technology Inc. Base de données Proximity/Text & Satz ©1991 Text & Satz Datentechnik, ©1991. Tous droits réservés. Proximity Technology Inc. Items » et (b) uniquement selon les droits accordés aux autres utilisateurs finaux ayant accepté les termes et les conditions dudit contrat. Droits non spécifiés réservés en vertu de la législation sur les droits d’auteur en vigueur aux Etats-Unis. Adobe Systems Incorporated, 345 Park Avenue, San Jose, CA 95110-2704, Etats-Unis. Pour les utilisateurs finaux de l’administration, Adobe accepte de se conformer aux lois antidiscrimination en vigueur, notamment et le cas échéant, aux dispositions du décret-loi 11246, à la section 402 du Vietnam Era Veterans Readjustment Assistance Act de 1974 (38 USC 4212), à la section 503 du Rehabiliation Act de 1973 et aux amendements correspondants, ainsi qu’aux régulations contenues dans l’article 41 CFR, parties 60-1 à 60-60, 60-250 et 60-741. Les clauses et les régulations des mesures antidiscriminatoires contenues dans la phrase précédente seront incorporées par référence.
Afficher la saisie précédente 580, 586 Afficher la saisie suivante 580, 586 Action d’en-tête, icône 251 Action de corps, icône 251 Action de montage 254 Action liée pour séquence QuickTime 499 Action navigateur 251 Actions associées à des liens 252, 258 Actions utilisateur 252 Affichage de balise binaire, activer et désactiver dans l’éditeur de structure 454 Affichage, palette 116 ajouter un navigateur au menu de profils 639 feuille de style en cascade 138 modifier le profil par défaut 639 options de mise en page et de prévisualisation 48 options pour les diagrammes de conception 408 Affichage, panneau de la palette Affichage 408 Afficher au hasard, action 257 Afficher dans le navigateur, bouton 20, 64 Afficher dans le navigateur, menu 529, 543 Afficher date courante (ID), action 274 Afficher heure locale, action 277 Afficher l'écran de présentation, préférences Afficher un avertissement, action 267 Afficher/Masquer, action 271 boîte flottante 82, 88 éditeur de montage 88 Agrandissement et réduction d’une vue de site Navigateur du site 313 Zoom, menu 313 AI, fichier. Voir Illustrator, fichier Aide 6 Aide à la navigation, cadre 92 Aide en ligne 6 Ajouter un niveau, option 108 Ajouter une colonne à droite, bouton 161 Ajouter une colonne à gauche, bouton 161 Ajouter une ligne après, bouton 161 Ajouter une ligne avant, bouton 161 Alignement image sur du texte 108 objets 78 objets d’un diagramme de conception 423 pistes d’une séquence 474 Alignement des objets du diagramme sur la grille 409 Alignement horizontal des objets 78 Alignement vertical des objets 78 Alignement, menu 108 Alignement, palette 78, 79, 423, 474 Aligner sur le Web, curseur 208 AlterCast ajouter une image dynamique 592 présentation 591 prise en charge par un serveur Web 591 variables SVG et PSD 591 Amiga IFF, fichier ajouter à une page Web 183 comme image de référence 223
éléments multimédias 229 formulaire 249 page 63 profil de navigateur Web 48 style de tableau 165 Aperçu du cadre 98 Aperçu, panneau 20, 64 Appeler une action, action 278 Appeler une fonction, action 279 Appliquer un lien, commande 58 Appliquer un modèle, commande 343 Arborescence des objets dans les diagrammes ajouter des objets personnalisés 416 ajouter des pages 411, 413 mettre en page 410 repositionner des objets 417 Arborescence partielle, commande 313 Archivage de fichiers et de dossiers 390, 393
Assistant de création de site dynamique 551 instructions 562 présentation 553 sélectionner une technologie d’exécution de scripts serveur 554 Association objets 77 Association de fichiers, panneau de la fenêtre Configuration de la base de données Web 640, 641 Associer à une touche, action 280 Associer, bouton 77 Associer, commande 418 Aucun, option du menu Format du paragraphe 106 Audio, ajouter à une page Web 229 Augmenter le retrait du bloc, option 108 Autoriser le débordement du contenu 77
Balise, panneau de la fenêtre Configuration de la base de données Web 628 Balises ouvrante et fermante, modifier 53 Banderole animée 102 Banderole, icône 102 Barre d’arborescence des balises 18, 106 à propos 444 sélectionner des éléments 444 sélectionner un tableau ou une cellule de tableau 158 utiliser dans Visual Tag Editor 447 à propos 81 action Changer le texte 264 action de montage 254 action utilisateur 252 ajouter à une page 82 ajouter du texte et des images 83, 105 animer 88, 89 configurer des actions 255, 266, 268 convertie à partir d’un fichier de calques Photoshop 226 convertir en grille de mise en page 87 dans une conception de mise en page 23, 71, 81 déplacer et redimensionner 84 enregistrer un chemin d’animation 90 index Z 84, 85 marqueur SB 85 masquer temporairement dans le panneau Mise en page 86 nommer 83 SB, marqueur 84 sélectionner 84 utilisation de l’éditeur de montage DHTML 88 utiliser l’action Afficher/Masquer 82, 88 verrouillage 86 Boîte flottante, icône 83, 85 Boîtes flottantes disposition en couches 85 Configuration de la base de données Web 635 Card, icône 533 carte 530 Cascade, commande 37 Case à cocher dans un formulaire 240, 242 à propos 304 configurer une préférence 305 utiliser dans un lien 304 Chemin relatif dans un URL 59 Chemin relatif, commande 59 CHTML 523 CHTML (i-mode) 524 Conception du site. Voir Diagramme de conception Conception, panneau Affichage, palette 408 fenêtre de diagramme 408 Config, dossier 549 accès en écriture et protection 619 dossier Datasources 546, 564 protéger par mot de passe 619 sous-dossier 549 Configuration en ligne 7 FTP 360 panneau Balise 628 réseau 358 WebDAV 360 Configuration de la grille de la boîte flottante, boîte de dialogue 84 Configuration de la zone de travail des diagrammes 409 Configuration des variables, boîte de dialogue 188, 219 Configuration du site, boîte de dialogue 65, 361, 403, 621 Configuration réseau, personnalisation 358 Configurer la grille de la boîte flottante, commande 85 Configurer le site, bouton 361 Confirmer le lien, action 258 Connecter/Déconnecter le serveur FTP, bouton 29, 360 Connecter/Déconnecter le serveur WebDAV, bouton 374 Connecteurs dans les diagrammes 410 Connexion, serveur Web 359 Conserver Netscape CSS, action 275 Construire dynamiquement, option groupe de boutons radio 602 menu déroulant 601 Contenu dynamique 529 aperçu dans GoLive 555 avantages 545 base de données 545 bouton d’envoi 555 contenu fictif 553 créer un composant personnalisé 571 créer une base de données 552 formater le texte 578 formulaire 593 liaison incorrecte 618 lien URL 555 lier des éléments de page 555 lier un élément de texte 578 lier une image 581 Convertir en grille de mise en page, commande 87 Convertir la grille en tableau, commande 80 Convertir le texte en bannière, commande à propos 221 utiliser un fichier Illustrator 223 utiliser un fichier LiveMotion 222 utiliser un fichier Photoshop 223 Cookie lier une action 281 supprimer 282 cool gridx 79 Copie objets dans les diagrammes de conception 418 Copier 104 texte 105 Copier d’un modèle, option 40 Corbeille du site, dossier 297 Couleur du texte, champ 81, 117 Couleur Web sécurisée 208 Couleur, palette 49, 117, 350 à propos 60 Couleurs compatibles avec le Web 80 Couleurs, panneau 81, 117 à propos 291 dans la fenêtre du site 350 dans la palette de mise en évidence 340 rafraîchir 298 supprimer une référence inutilisée 299 Courbe des lignes de liens dans les diagrammes 424 Création d’un lien
Création de liens lien de navigation 25 lien de ressource 25 vérifier l’intégrité des liens 28 Création de site, Assistant 40 Créer cookie d’accueil, action 285 Créer un fondu, action 273 Créer un lien vers une feuille de style CSS externe, bouton 155 Créer un site, bouton 462 Créer un style d’élément, bouton 137, 138, 140 Créer un style de classe, bouton 137, 138, 141 Créer une collection, commande 315 Crochet dans les diagrammes de conception 423 Cryptage dans un formulaire 247 CSS, créer un document 43 CSS, style ID pour les boîtes flottantes 82 CustomMerchant définition 550
Déclaration de type de document. Voir Type de document Déclarer la variable, action 281 Déclenchement action 216, 252 navigateur 251 Default.macro, fichier 465 Défilement de page, minimiser 76 Défiler vers la droite, action 276 Défiler vers la gauche, action 276 Défiler vers le bas, action 276 Défiler vers le haut, action 276 Définir comme taille d’origine, bouton 185 Définir couleur de fond, action 277 Définir un titre, masquer la boîte de dialogue 46 Définir une fenêtre, action 261 Définition, option 111 Déflexion des lignes de liens dans les diagrammes 424 Demander la redirection, action 262 Dépannage, contenu dynamique 617 ASP 617 déboguer une page 618 JSP 617 PHP 617 problèmes fréquents 617 tester les sources de données 618 tester un site 618 Déplacement d’objets dans les diagrammes de conception 417 Déplacement vers la palette Web, bouton 208 Déplacement/Annulation du déplacement des couleurs sélectionnées Web, commande 208 Déplacer boîte flottante, action 268 Déplacer comme action, action 270 Document avec jeu de cadres à propos 93 configurer 94 nommer et enregistrer 95 Document de site. Voir Fichier projet de site Données GoLive, éliminer 207, 364, 369 Données masquées dans un formulaire 247, 248 Données, masquées dans un formulaire 247 Dossier créer 294 supprimer 297 vérifier 294 Dossier de configuration 15, 39 Dossier de données 15, 39 Dossier de site, menu 42 Dossier du site, description 293 Dossier racine 15 description 39, 293 enregistrer la page dans 42 DTD (Document Type Definition) 43, 46 DTD, conformité déclaration doctype 437 vérifier avec la syntaxe 440
à propos 17, 429 afficher les erreurs après la vérification de syntaxe 442 barre d’outils 431 configurer la police 433 couleur de syntaxe 431, 433 faire glisser des couleurs de la palette 431 faire glisser des éléments vers 430 formater le texte 431 préférences 432 retour à la ligne 431 vérifier la syntaxe 440 Editeur de feuille de style CSS à propos 135 créer un style d’élément HTML 139 créer un style de classe 141 créer un style ID 142 créer une feuille de style externe 137 créer une feuille de style interne 137 gérer des styles 142 options d’affichage 138
Editeur de mise en page afficher une nouvelle page 42 définir le profil du navigateur par défaut 639 masquer les images 48 utiliser pour la mise en page 22 Editeur de montage de séquence QuickTime à propos 470, 477 copier des pistes d’une séquence à une autre 479 curseur temporel 472 éditer des séquences 477 insérer et éditer des échantillons 482 inspecteur des pistes/échantillons multiples 480 inspecteurs de piste et d’échantillon 480 outils de séquence QuickTime 477 réaliser un alignement temporel des pistes et des échantillons 480 sélectionner des pistes et des échantillons 477 Voir aussi Séquence QuickTime Editeur de montage DHTML 18 action 268 bouton Lire 90 description 88 insérer une image-clé 89 marqueur d’animation 89 menu des scènes 91 ouvrir 89 piste d’action 254 Editeur de montage DHTML, bouton Arrêter Editeur des jeux de polices 113, 114 Editeur JavaScript 18 à propos 460 accéder à une fonction 462 ajouter un script 460 blocs fonctionnels 460 définir un événement 462 mettre en évidence la syntaxe 464 modifier un script 462 objets 462 personnaliser 464 prévisualiser un script 462 utiliser une macro de texte 464 Editeurs, afficher dans la fenêtre de document 33 Edition d’une séquence QuickTime 473 Edition de fichiers extraits hors connexion 392 Effacer les styles de paragraphe, commande 203 enregistrer des images 209 enregistrer des paramètres d’optimisation 202 sélectionner une vue 202 Table des couleurs, palette 207 Taille de l’image, palette 209 taille du fichier affichée 207 utiliser des tranches 209 En-tête, option 106 En-tête, panneau 18, 51 En-tête, section ajout d’éléments inconnus 460 ajouter un élément ou un script 51 Envoyer les éléments, commande 428 Envoyer, bouton dans un formulaire 240 EPS, fichier ajouter à une page Web 183 comme image de référence 223 Erreur corriger un lien rompu 328 icône 328 rechercher 328 Erreurs
JavaScript 462 Excel, feuille de calcul 105 Exclure d’un jeu, action 260 Exécuter d’autres programmes pour modifier les fichiers multimédias, préférence 67 Extraction de couleurs 81 Extraction de fichiers et de dossiers 389 Extraction des éléments utilisés de Web Workgroup Server 395 Extraction des fichiers collaboratifs, boîte de dialogue 390 Extraire les couleurs, commande 350 Extraire les références, commande 353 Extrait de code de balisage. Voir Objet de bibliothèque Extrait de code source, enregistrer 338, 347
Fenêtre de visualisation à propos 469, 473 aligner des pistes dans une séquence 474 annoter une séquence QuickTime 476 inspecteur de séquence 476 menu Séquence 475 onglet Mise en page 473 option Lecture automatique 476 sélectionner une piste 474 Voir aussi Séquence QuickTime Fenêtre du navigateur, nouvelle 261 Fenêtre du site Diagrammes, panneau 408 faire glisser des fichiers vers une page 73 Fichiers, panneau 426 Fermer la fenêtre, action 258 Feuille de calcul, importation de données dans un tableau 105 Feuille de style CSS, palette à propos 135
Fichier ajouter à un site 16, 43 comparer la version locale à celle du serveur 397 comparer les versions précédentes 397 copier dans un site 43 déplacer vers un dossier 294 déverrouiller 44 importer dans un site 43 lier 55 mettre à la corbeille 297 rechercher 330 rechercher des erreurs 328 renommer 302 restaurer 297 restaurer une version précédente 396 supprimer 297 vérifier l’historique des révisions 396 Fichier Access ajouter en tant que source de données 565 source de données 565 Fichier AI en fichier SWF, option 195 Fichier cible
étrangère 133 Fichier texte délimité par tabulation 105 Fichier verrouillé, déverrouillage 44 Fichier, panneau de l’inspecteur du fichier 294 fichiers et dossiers supprimés définir les préférences 398 restaurer 398 vérifier 398 Fichiers PDF visualiser avec Acrobat Reader 5 Fichiers source référencés Filtre de formatage et contenu dynamique 578 Générateur de clé, élément dans un formulaire 248 Générateur de pages, génération hors ligne 615 Génération de pages hors ligne contenu dynamique 615
Grille sur la vue de conception 409, 410 Grille, panneau de la palette Affichage 408, 409 Groupe d’objets dans les diagrammes, dissocier 419 Groupe de travail, barre d’outils Activité utilisateur, bouton 383 afficher/masquer 33 Identifiant dans une feuille de style 142, 153 Ignorer les polices Web, option 48 Illustrator, fichier à calques 190 ajouter à une page Web 190 comme image de référence 223 comme objet dynamique 183 variable 220 Voir aussi Illustrator, objet dynamique et SVG, fichier Illustrator, objet dynamique ajouter à une page Web 183, 190 enregistrer au format bitmap 191 enregistrer au format SVG 191 enregistrer au format SWF 191 optimiser pour le Web 200 tranché 192 Voir aussi SVG, fichier et SWF, fichier Image action 268 afficher au hasard 257 afficher dans l’éditeur de mise en page 48 afficher en mosaïque sur le fond d’un objet 81 afficher/masquer dans une boîte flottante 88 ajouter à un bouton de formulaire 247 ajouter à une boîte flottante 83 ajouter à une page Web 182, 211 associer un lien 186 bords 186 choisir un format de fichier 197 comme objet dynamique 182 compatible avec le Web 197 dans les diagrammes de conception 421 couleur de fond 187 couleur du cache 187 en tant que bouton animé 26
202 faible résolution 227 fond 49 fond de la cellule 171 fond du tableau 169 formats de fichiers pris en charge pour l’importation 182 GIF transparente 101 Illustrator 190 image Photoshop de référence 71 image Photoshop tranchée 71 mettre à jour 184 mettre à l’échelle 187 mosaïque 150 optimiser pour le Web 26, 197 optimiser pour un appareil sans fil 210 optimiser selon une taille de fichier spécifiée 206 options 212 permuter dynamiquement 258 Inspecteur de date de modification 99 Inspecteur de feuille de style racine 638, 639 Inspecteur de feuilles de style CSS 113 Inspecteur de jeu de cadres 95, 97 Inspecteur de l’action 250, 251, 254 Inspecteur de l’action d’en-tête 251 Inspecteur de l’action de corps 251 Inspecteur de l’annotation 422 Inspecteur de l’image 27, 528 Inspecteur de l’objet 417 Inspecteur de la banderole 102, 526 Inspecteur de la boîte 421 Inspecteur de la boîte flottante 83, 84, 88, 90 Inspecteur de la carte 533 Inspecteur de la couleur 350 Inspecteur de la feuille de style CSS à propos 135 Bloc, panneau 147 Bord, panneau 150 Fond, panneau 150 Liste et divers, panneau 151, 152 Inspecteur de la référence 353 Inspecteur de la section 413 Inspecteur de la source de contenu 552, 570 Inspecteur de la zone de texte 77 Inspecteur de lien 155 Inspecteur de ligne 100 Inspecteur de menu déroulant d’URL 100 Inspecteur de module externe Attributs, onglet 230, 232 Avancé, onglet 231 Inspecteur du fichier Contenu, panneau 294 Fichier, panneau 294 Nom, panneau 294 Inspecteur du niveau 423 Inspecteur du saut de ligne 110, 526 Inspecteur du tableau 80, 105 à propos 157 formater un tableau 167 formater une cellule 169 formater une ligne 169 importer un texte 175 modifier des lignes et des colonnes 161 redimensionner une colonne, une ligne et un tableau 162 Inspecteur du texte 98, 121 Inspecteur i-mode Emoji 526 Inspecteur JavaScript panneau Evénement 462 panneau Objets 462
Voir aussi Police de site appliquer à un texte 113, 352
ColorSync 197 ColorSync. Voir Aide en ligne comme image de référence 223 compression avec perte de qualité 198 correspondance des couleurs 197 formats pris en charge 211 optimiser pour le Web 205 optimiser. Voir Aide en ligne progressif 198 utiliser 197 utiliser avec ColorSync 228 visualiser sans artefacts 228 JPEG, fichier progressif 198
Lien de navigation à propos 31 créer 56 description 25 page dans un cadre 97 Lien de référence vide 56 Lien de ressource 22 à propos 31 créer 56 description 25 Lien dynamique action associée à un lien 580 lier à une page dynamique 579, 580 Lien en attente résoudre 325 Lien hypertexte 56 appliquer un URL ou une adresse électronique d’un site 355 créer 121 supprimer 122 Lien non résolu, résoudre 325 Liens dans les diagrammes 410 Liens de type Global, ajouter aux diagrammes 414 Liens en attente ajouter et modifier dans les diagrammes 414 mettre à jour dans les diagrammes envoyés 426 dans la présentation d’un diagramme 425 Liens en attente, palette 426 Liens entrants et sortants, palette à propos 28 afficher les liens entrants et sortants 320 afficher un lien de ressource dans les objets de bibliothèque 349 basculer entre les modèles de page 344 créer plusieurs liens simultanément 56 importer un URL externe à l’aide d’un menu contextuel 41 modifier des liens dans l’intégralité du site 321 rétablir des liens 29 Liens, élément 54 Liens, panneau 35, 98 Lier à deux cadres, action 264 Lier à tiers, action 264 Liste des couleurs du site 61, 80, 117, 350 Liste des couleurs Web 61, 80, 117 Liste des couleurs Web nommées 49, 61 Liste des révisions, boîte de dialogue 396 Liste numérotée 107 Liste numérotée, bouton 107 Marqueur temporel de l’éditeur de montage DHTML 90, 91 Masquer l’arborescence, option 87 Masquer la grille, commande 409 Masquer le contenu, objet 584 Menu dans un formulaire 243 hypertexte externe 264 Voir aussi Menu contextuel, Menu de palette Menu contextuel afficher 34 dans un formulaire 243 liste des fichiers récemment liés 57 sur une page 99 Menu contextuel Paragraphe 24 Menu de palette, afficher 35, 36 Menu déroulant contenu dynamique 601 à propos 362 Voir aussi Téléchargement du site, vers le serveur Mise à jour, action Ajouter des saisies 594 Copier les données du formulaire 594 Effacer les données du formulaire 594 Mettre à jour les saisies 594 Supprimer les saisies 594 Mise à l’échelle, image 185, 187, 211 Mise en évidence, palette 339, 340 à propos 434 définir les couleurs et l’aspect de la mise en évidence 437 effacer la mise en évidence 436 enregistrer et charger des paramètres 436 mettre en évidence des éléments 434 sélectionner les éléments précédent et suivant 436 Mise en page, onglet utiliser pour la mise en page 70 Mise en page, panneau à propos 17 afficher le panneau Code source 32 Mise en page, panneau de l’inspecteur 410 Mode unaire/binaire, bouton 454 Modèle de formatage CSS1 147 Modèle de page
Voir aussi Modèle de page applique à un nouveau site 356 créer 355 spécifier une image d’aperçu 355 Modèle. Voir Modèle de page, Modèle de site, Gabarit Modification des liens dans l’intégralité du site 321 Modification du titre d’une page HTML 45 Modifier l'original, commande 184 Modifier l’URL, boîte de dialogue 59 Modifier le serveur, commande 361 Modifier le style, boîte de dialogue 118, 119 Modifier les jeux de polices, commande 113 Module activer et désactiver 68 gérer 68 Module d’encodage 524 Module externe ajouter 229 configurer 230 préférences 235 Montage, panneau de la fenêtre de diagramme 419, 425, 426 Mosaïque horizontale, commande 37
Nombre de mots dans un document 65 Noop, icône 539 Normal, option 111 Nouveau caractère, bouton 637 Nouveau diagramme de conception, commande 408 251 convertir en objet standard 187 dans un modèle de page 338 définition 182 formats de fichiers pris en charge 182 Illustrator. Voir Illustrator, objet dynamique LiveMotion. Voir LiveMotion, objet dynamique mettre à jour 180, 184 optimiser pour le Web 200 ouvrir dans l’application d’origine 184 Photoshop. Voir Photoshop, objet dynamique redimensionner 185 utiliser des variables 218 Objet dynamique, dossier 183 Optimiser pour la taille du fichier, option 203 Optimiser, bouton 75 Option, icône 537 Options d’affichage des polices 48
Page de remplacement pour navigateur 54 Page de résultats de recherche, création 603 Page de résultats de requête, création 603 Page détaillée, création 605 Page dynamique 547, 602 Page HTML. Voir Page Panneau afficher au premier plan de la fenêtre de site 35 déplacer 35 Panneau d’aperçu de la palette de couleurs 61 Panneau de prévisualisation de la palette de couleurs 81 Panneau de référence de la vue de navigation ou des liens 310 Panneau de travail de la vue de navigation 310 Panneau périphérique de la vue de navigation ou des liens 310 Par défaut corps de police 116 couleurs des liens et du texte 50 Paragraphe aligner et mettre en retrait 108 appliquer des attributs à partir d’une palette 120 format par défaut 106 formater à l’aide d’éléments de structure HTML 106 insérer un espace insécable 110 insérer un saut de ligne 110 liste 107 sélectionner des éléments de paragraphe 105, 106 supprimer des balises 107 supprimer les balises de type p 107 Paragraphe, formatage 525 Paramètre ajouter à un lien 589 requête d’URL 589 transmettre entre pages dynamiques 589 paramètre de requête, ajouter aux URL 59 Paramètres d’optimisation appliquer 202, 203 Photoshop, objet dynamique ajouter à une page Web 183
PICT, fichier ajouter à une page Web 183 comme image de référence 223 Pipette 81 Piste d’action dans l’éditeur de montage DHTML 89 Piste temporelle de boîte flottante 88 Piste, insérer dans une séquence QuickTime 471 Pixar, fichier ajouter à une page Web 183 comme image de référence 223 Pixel corps de police 116 déplacer des objets 76 Placer au centre, commande 313 Planifier l’affichage, action 265 PNG, fichier à propos 199 à propos. Voir Aide en ligne Aligner sur le Web, curseur 208 comme image de référence 223 compression à qualité intégrale 199 optimiser pour le Web 204, 206 optimiser. Voir Aide en ligne utiliser 197 Police 104 Police du site à propos 338, 351 ajouter à un site 351 appliquer à un texte 352 nommer un jeu de polices 352 Police par défaut, commande 115 Police, préférences 116, 433 Police. Voir Jeu de polices Police du site Voir aussi Jeu de polices Postfield, icône 539 Pre, icône 534 Précharger des images, action 257 Profil de navigateur 20 Profil, menu 48 Configuration de la base de données Web 638 Programme de certification d’Adobe 8 Programme de création, modification 53 Programmer modification, action 281 Progressif, option pour JPEG 206 Projeter diaporama auto, action 272 Projeter un diaporama, action 272 Propriétés de bloc des feuilles de style 146, 147 Propriétés de bord des feuilles de style 150 Propriétés de la page, commande 21, 51 Propriétés de la page, exporter le code vers une bibliothèque externe 286 Propriétés de liste des feuilles de style 151, 152 Propriétés de police des feuilles de style 144 Propriétés de position des feuilles de style 148, 151 Propriétés de remplissage des feuilles de style 147, 148 Propriétés des feuilles de style non prises en charge 152 Propriétés du texte des feuilles de style 145 Propriétés standard des feuilles de style 140 Protection accès en écriture, dossier Config 619 accès IP 619 contenu dynamique 619 dossier Datasources 619 mot de passe 619 Proxy, serveur configurer 358 message d’erreur 359 PSD, fichier. Voir Photoshop, fichier Rechercher des fichiers, bouton 330 Rechercher et remplacer, panneau 124, 125 Rechercher la sélection, commande 125 Rechercher, commande 124, 125 Rechercher, fenêtre 123, 125 Règle de contenu 532 Règles de mise en page à propos 33 afficher/masquer 33 Regroupement créer un groupe 295 élément de formulaire 245 Réinitialiser, bouton dans un formulaire 240, 241 Remplacer et rechercher, commande 125 Remplacer les lignes, objet 583 Remplacer les lignes, option de tableau dynamique 582 Remplacer, commande 125 Remplir de nouveau les vues, commande 203 Renommer un style de tableau, bouton 165 Renvoi, recherche par caractères génériques 130 Répartition des objets dans les diagrammes 423 Répertoire virtuel Apache 559 créer 558 Tomcat 559 Résolution des collisions dans les diagrammes 409, 418 Restauration d’un fichier ou d’un dossier 297 Restauration d’une référence supprimée 300 Restauration de fichiers supprimés de la Corbeille du site 399 du serveur 399 Restaurer la version enregistrée, commande 63
Sections dans les diagrammes de conception 412, 413 Select, icône 536 Sélecteur de feuille de style 139 Sélecteur de fichier, élément dans un formulaire 248 Sélection d’objets dans les diagrammes 414 Sélection de fichier interactive dans un formulaire 247 Sélection de tranche, outil 210 Sélectionner le bloc supérieur, commande 445 Sélectionner un tableau parent, bouton 159 Sélectionner une fenêtre, bouton 37, 58 Séquence QuickTime à propos 469 action liée 499 aligner des pistes dans une séquence 474 annoter une séquence 476
Serveur FTP configurer l’accès au 29 importer un fichier depuis 40 se connecter au 29 Serveur HTTP, importer un fichier depuis 40 Serveur Web AlterCast 591 configurer pour le contenu dynamique 553 définition 547 montage 547 page dynamique 547 préconfiguré 553 production 547 se connecter au 359 type 547 Serveur, menu contextuel 400 Suivre la souris, action 269 Superposer les paragraphes, option 48 Suppression de la copie locale d’un fichier archivé 393 Supprimer la couleur, commande 117 Supprimer le cookie, action 282 Supprimer le lien, bouton 57, 122
351 Supprimer les éléments inutilisés, commande à propos. Voir Aide en ligne ajouter à une page Web 190, 191 AlterCast 591 associer des fichiers 184 comme image de référence 223 comme objet dynamique 180 modifier des liens 192 options d’optimisation 193 options d’optimisation avancées 194 Rediriger SVG, action 263 tranché 192 utiliser 197 variable 220 SVG, module externe 230, 235 167 formater avec une feuille de style en cascade 171 formater une cellule 169 formater une ligne 169 HTML standard 23 image de fond 169 importer des données sous forme de texte 175 importer du texte délimité par tabulation 105 largeur de bord 167 légende 169 masquer un bord 167 modifier des lignes et des colonnes 161 personnaliser 167 redimensionner 162 sélectionner 158 supprimer un style prédéfini 166 trier 175 utilisé pour la mise en page d’un formulaire 238 Tableau de bord Internet 641
TARGA, fichier ajouter à une page Web 183 comme image de référence 223 Technologie d’exécution de scripts serveur ASP 549 JSP 549 PHP 549 remplacement de l’interface CGI 549 à propos 365 éléments modifiés uniquement 374 fichiers sélectionnés uniquement 365, 374
88 ajouter à un tableau 172, 174 ajouter à une boîte flottante 83 ajouter à une page 24, 103, 104 ajouter dans l’éditeur de structure 452 banderole animée 102 champ et zone d’un formulaire 242 codé sur deux octets 131 coller dans un tableau 105 contrôler le déroulement du texte 109 copier 105 couleur par défaut 50 définir la police, le corps et la couleur 113 encodage des caractères dans une nouvelle page 43 enregistrer les attributs de formatage 104 espace insécable 101 formater dans l’éditeur de code source 431 formater des caractères en ligne 110, 120 habiller des images 108 HTML, attributs physiques 110 insécable 109 jeux de caractères romains et non romains 131 lier à une page ou à un URL 121 ligne horizontale 100 menu d’actions Message 265 mettre la sélection en couleur 117 positionner à l’aide d’une grille de mise en page 76 rechercher le texte sélectionné 125 remplacement pour une image 186 saut de ligne 110 vérifier l’orthographe 122 Texte de remplacement
Texte HTML attribut de formatage 106, 110, 111 attribut de paragraphe 106 attribut physique 110 attribut structurel 111 attributs de formatage 103 enregistrer des attributs dans une palette 117 en-tête 116 Texte lié, formatage 578 URL ajouter des paramètres de requête 59 enregistrer avec un site 338, 352 mailto: 121 transformer un chemin relatif en chemin absolu 59 URL et adresse électronique d’un site à propos 338, 352 ajouter à un site 353 appliquer à un lien de page 355 nommer et modifier 354 URL externe enregistrer avec un site 338, 352 vérifier 330 URL mailto 353 URL, icône 353 URL, mappage 370 Vérification de syntaxe à propos 440 vérifier la compatibilité avec les navigateurs 440 vérifier la conformité DTD 440 Vérifier le montage, commande 426 Vérifier les liens externes, commande 29 Verrouillage des fichiers, sur serveur WebDAV 374 Verrouillage du texte Voir aussi Modèle de page Verrouillage, commande 375 Verrouiller la page, commande 341 Verrouiller la visibilité, option 86 Vidéo, ajouter à une page Web 229 Vignettes diagramme de conception 408
Vue de conception 408 Vue de la navigation à propos 306 afficher et masquer 311 description 28 modifier l’orientation 309 panneau périphérique 310 Vue des liens à propos 307 afficher et masquer 311 description 28 modifier l’orientation 309 panneau périphérique 310 Vue du site définir le rafraîchissement automatique 405 Rafraîchissement 394 Vue du site, optimiser 322 Vue du site. Voir Affichage, palette ; Mise en évidence, palette Vue structurelle de site, description 28
Zone de texte à propos 22 Voir aussi Texte ajouter du texte, des images ou des objets 76, 105 contrôler l’espace entre les images et le texte 116 redimensionner dans les navigateurs 77 Zone de texte, icône 77, 243 Zone modifiable dans un modèle de page 338 Zone sensible dans les images tranchées 210 définir 217 personnaliser l’aspect 217 Zones modèles, palette 338, 339, 342
Notice Facile