CRÉER ET GÉRER UN SITE WEB AVEC FRONTPAGE U.P.S. TOULOUSE C.F.A.T.I.C.

Transcription

1 U.P.S. TOULOUSE C.F.A.T.I.C. CRÉER ET GÉRER UN SITE WEB AVEC FRONTPAGE Téléphone Centre de Formation aux Applications des Technologies de l information et de la Communication Courrier électronique : cfatic@cict.fr Serveur Internet pédagogique du C.F.A.T.I.C. : Serveur de téléchargement du C.F.A.T.I.C. : ftp://toutatis.ups-tlse.fr Télécopie & Répondeur

2 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. A l'aide de Microsoft FrontPage, vous pouvez facilement créer et gérer vos sites Web, leur donner un style professionnel, tout en utilisant le contenu (textes, images ) que vous avez déjà réalisé dans d autres applications, et pour d'autres utilisations (journaux, brochures, plaquettes commerciales ). Grâce à ses fonctionnalités puissantes et très simples d'emploi, créer votre site Internet ou intranet deviendra un jeu d'enfant. Comme il convient malgré tout de s'initier, ces leçons vous guideront pas à pas, de la création de votre premier site et de ses premières pages jusqu'à sa publication sur le World Wide Web. Découvrez dès maintenant la leçon 1 : Construire un nouveau site Web. Vous apprendrez à utiliser l'explorateur FrontPage pour créer un site de 4 pages, au design professionnel, dotées de barres de navigation fonctionnelles. A la fin de cette leçon, vous saurez également ajouter du texte, des images, des listes formatées et des liens hypertexte à l'aide de l'editeur FrontPage. Passez ensuite à la leçon 2 : Mettre en page dans l'editeur FrontPage. Vous apprendrez à insérer des fichiers dans vos pages, à récupérer les commentaires des visiteurs de votre site, à créer des zones réactives sur les images, à ajouter une table, une liste et du texte circulant (marquee), à l'aide de l'éditeur FrontPage. Puis vous terminerez avec la leçon 3 : Publier votre site Web FrontPage. De retour dans l'explorateur FrontPage, vous pourrez tester vos hyperliens, vérifier l'orthographe, ainsi que trouver et remplacer du texte sur vos pages. Vous serez alors prêt à publier votre site FrontPage sur le World Wide Web. 1 Leçon Créer un nouveau site Vous allez créer un nouveau site Web à l'aide de Microsoft FrontPage. Ce site vous servira tout au long des leçons. Vous y créerez de nouvelles pages au fur et à mesure. Pour que vous puissiez suivre ces leçons, nous supposons que vous disposez de tous les droits nécessaires pour créer un site Web sur votre serveur. Si tel n'était pas le cas, demandez à votre administrateur réseau les autorisations nécessaires. 1 - Lancez Microsoft FrontPage, depuis le menu Démarrer, puis Programme. Page 2/2 U.P.S. Chabert - février 2000

3 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage 2 - Créer un nouveau site Web. "Fichier" --> "Nouveau" ---> "Site Web..." 3 - La boîte de dialogue Nouveau Site Web FrontPage s'affiche. Chabert - février 2000 U.P.S. Page 3/3

4 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. 4 - Dans la zone de "type de site Web à créer", sélectionnez l'option Site Web vide. 5 - Dans la zone Option : Choisissez l'emplacement du nouveau site Web, entrez le nom "nom_ordinateur" est le nom de la machine mise à votre disposition (automatique); votre_nom est votre nom! Validez par OK. FrontPage crée les répertoires qui contiendront vos pages et images, puis passe en affichage "Page" 6 - Passez en affichage "Navigation". L'affichage Navigation consiste en un écran divisé en 2 parties : celle de droite présente l'organisation de votre site, celle de gauche contient une présentation de dossiers et de fichiers, à la manière de l'explorateur Windows. Page 4/4 U.P.S. Chabert - février 2000

5 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage L'explorateur FrontPage est l'un des composants principaux de Microsoft FrontPage. Vous l'utilisez pour créer de nouveaux sites, puis plus tard pour les modifier, en assurer la maintenance, les administrer, et publier les sites Web opérationnels. Les 6 boutons sur la barre "Affichage" vous proposent différents modes de visualisation de l'information dans votre site Web FrontPage. Vous pouvez y choisir la manière dont vous voulez voir le contenu de votre site tout au long du projet de conception, depuis les premières étapes jusqu'au moment où il est prêt à être publié sur le World Wide Web. Dans la suite de la leçon, nous allons créer les premières pages. 1.2 Créer les premières pages Vous êtes en mode navigation. Votre site Web ne contient une page, elle est nommée "Page d'accueil" (c'est le fichiers "index.htm ou default.htm). Elle sera la porte d'entrée de votre site Web. Si vous souhaitez que les internautes puissent visiter votre site Web, vous devez impérativement appeler la page d'accueil "index.htm" ou "default.htm" selon les choix d'installation. 1 - Cliquez le bouton Nouvelle page dans la barre d'outils FrontPage. Par défaut, comme votre site Web ne contient aucune page, elle est nommée Page d'accueil. Vous venez de créer la page qui sera la porte d'entrée de votre site Web. 2 - Assurez-vous que la page d'accueil est bien sélectionnée, et ajoutez trois nouvelles pages en cliquant le bouton Nouvelle page. Se créent automatiquement des barres de navigation pour relier vos pages entre elles. Vous disposez maintenant de trois nouvelles pages, qui portent le nom Nouvelle page 1, 2 et 3. Chabert - février 2000 U.P.S. Page 5/5

6 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. Remarquez la structure hiérarchique de vos 4 pages. L'affichage Navigation présente les pages reliées entre elles par des lignes, comme dans un organigramme hiérarchique. C'est la structure hypertexte que FrontPage utilise pour générer les barres de navigation sur vos pages. Si vous ne voyez pas ces lignes et ces pages dans la fenêtre de droite, cliquez sur le + de. Avant de commencer à travailler sur ces pages, donnons leur un titre significatif Donner un titre aux pages : 1 - La page d'accueil étant toujours sélectionnée, appuyez sur la touche Tabulation de votre clavier. FrontPage met en surbrillance la page à gauche et en dessous de la page d'accueil et active son titre pour l'édition. 2 - Tapez "Centres d'intérêt" et validez par la touche Entrée. 3 - Appuyez de nouveau sur la touche Tabulation, et modifiez le titre de la 2 ème page en "Album Photo". Répétez l'opération pour la 3 ème page, que vous nommerez "Favoris". Votre écran correspondra alors à celui-ci : Astuce : une autre manière d'ajouter une page en affichage Navigation, est de cliquer avec le bouton droit sur une page, et de choisir la commande Nouvelle page dans le menu contextuel. Cette commande créera une page en dessous de la page cliquée. Toute modification que vous effectuez sur la structure de votre site FrontPage en affichage Navigation ne sera appliquée que lorsque vous aurez effectué certaines actions, telles que changer d'affichage, basculer vers une autre application Windows ou ouvrir une page dans l'éditeur FrontPage. Donc, si vous vous êtes trompé ou si vous avez changé d'idée, vous pouvez utiliser le bouton Annuler sur la barre d'outils, pour annuler votre dernière action. 1.3 Appliquer un Thème FrontPage Avec Microsoft FrontPage, vous pouvez facilement créer des sites dynamiques et dont la charte graphique est cohérente sur l ensemble des pages, en appliquant l'un des nombreux thèmes prédéfinis. Avant de l'appliquer vous pourrez le prévisualiser dans l'affichage Thèmes de FrontPage. Page 6/6 U.P.S. Chabert - février 2000

7 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage 1 - "Format" --> "Thèmes..." Sélectionnez différents thèmes dans la liste déroulante. La zone "Aperçu du thème" vous permet de visualiser les éléments graphiques, tels qu'ils apparaîtront sur vos pages Web, avant de l'appliquer. Avant d'appliquer le thème, vous pouvez sélectionner trois options qui modifieront l'apparence de ses composants : Couleurs vives appliquera des couleurs plus lumineuses au texte et aux images, Graphismes animés animera certains composants du thème, Image d'arrière-plan appliquera une image de fond aux pages de votre site actuel. Pour cette leçon, nous choisirons Couleurs vives, Graphismes animés et Image d'arrière-plan. Dans la liste des Thèmes, sélectionnez International (ou un autre, cela n'a pas d'importance) et cliquez le bouton OK. Le thème sélectionné est appliqué sur les pages de votre site Web courant, dès que vous avez répondu Oui au message vous signalant la modification de la mise en forme de vos pages. Dans la suite de la leçon, nous verrons comment le thème sélectionné donne à vos pages une apparence attractive et cohérente. 1.4 Définir les bordures partagées Avec Microsoft FrontPage, vous pouvez facilement des lien hypertextes entre les pages du site Web. Pour cela, il faut créer des bordures partagées entre toutes les pages et placer dans ces bordures des boutons de navigation qui se retrouveront automatiquement dans toutes les pages (sauf autre choix). ASSUREZ-VOUS QU'AUCUNE PAGE N'EST SÉLECTIONNÉE. Chabert - février 2000 U.P.S. Page 7/7

8 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. 1 - "Format" --> "Bordures partagées..." Sélectionnez : Pour "TOUTES LES PAGES" Une bordure en haut, avec boutons de navigation, Une bordure à gauche, avec boutons de navigation. Pour information, ce site utilise aussi une bordure partagées en bas pour la signature de chaque pages. 1.5 Ouvrir les pages dans l'éditeur FrontPage Maintenant que la structure de votre site est faite, nous allons ajouter du contenu sur chacune des pages. Si la création et la gestion des pages sont plus pratiques dans l'explorateur FrontPage, la mise en page et l'édition sont faites dans l'éditeur FrontPage. Il permet de créer, éditer et afficher les pages, grâce à une interface WYSIWYG (What You See Is What You Get - ce que vous voyez est ce que vous obtenez), similaire à des programmes tels que traitements de texte, de P.A.O., etc. Tous les formatages de texte, de styles et de pages sont basés sur les standards HTML (HyperText Markup Language, le langage de description de pages du Web). 1 - Dans l'explorateur FrontPage, cliquez sur le bouton Navigation de la barre affichage. 2 - Double-cliquez la page d'accueil dans la fenêtre de Navigation ou sélectionnez la page, et choisissez la commande Ouvrir du menu Édition de l'explorateur FrontPage. La page d'accueil s'ouvre dans l'éditeur FrontPage. Page 8/8 U.P.S. Chabert - février 2000

9 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage Vous remarquerez que les éléments du Thème choisi dans la section précédente de la leçon ont été appliqués. Votre page d'accueil dispose d'une texture à l'arrière plan, d'une bannière avec le titre de la page, et d'une barre de navigation pointant vers les autres pages de votre site. Pour ajouter du texte, commencez à taper comme vous le feriez dans un traitement de textes. MAIS ATTENTION! Ne tapez pas dans la bordure du haut ou dans la bordure de gauche, sinon votre texte va se retrouver dans toutes les pages. Tapez dans la grande partie libre. 1 - Tapez "Bienvenue sur mon site Web!", puis appuyez sur Entrée. Le fait d'appuyer sur la touche Entrée crée un nouveau paragraphe sur la page. 2 - Sur une nouvelle ligne, tapez "N'oubliez pas de visiter les autres pages de mon site" et appuyez sur Entrée. Vous pourrez bien sûr remplacer ce texte par celui de votre choix, accompagné d'une description du contenu de votre site. Votre page devrait maintenant ressembler à ceci : Chabert - février 2000 U.P.S. Page 9/9

10 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. Dans le menu Fichier, cliquez sur Enregistrer sous (nom que vous voulez). Vous avez la possibilité d'enregistrer votre page sur votre site Web FrontPage, sur le World Wide Web, sur votre disque, ou comme modèle. Vous pouvez également en changer le titre et l'url (Uniform Resource Locator). L'URL est un nom unique que le navigateur Web utilisera pour trouver et afficher la page. Cliquez sur OK. 1.6 Éditer la page Centres d'intérêt Cette seconde page de votre site contiendra une liste à puces de vos centres d'intérêt. Vous pourrez bien sûr la personnaliser plus tard. 1 - Dans le menu Fichier de l'éditeur FrontPage, choisissez Ouvrir. La boîte de dialogue Ouvrir s'affiche. Elle vous permet d'ouvrir des pages depuis votre site Web FrontPage actuel, votre disque dur, sur un autre serveur Web, ou directement sur le World Wide Web. Dans la liste, sélectionnez la page Centres d'intérêt et validez par OK. Lorsque la page est affichée, vous remarquerez que les éléments de mise en page du Thème ont bien été appliqués. 2 - Entrez le texte suivant : "Voici quelques-uns de mes centres d'intérêt". Cliquez sur le bouton Centrer sur la barre d'outils. La phrase que vous venez de saisir est centrée. Lorsque vous appliquez un formatage de texte, tel que le centrage, FrontPage ajoute les tags (marqueurs) HTML correspondants dans la page. 3 - Dans le menu Insertion, choisissez Ligne horizontale. Une ligne de séparation est insérée sous votre texte. 4 - Annulez le centrage en cliquant de nouveau sur. En HTML, il n'y a pas encore de justifié. 5 - Cliquez sur le bouton Liste à puces de la barre d'outils. FrontPage commence une liste et affiche la première puce. Du fait que vous avez choisi un thème pour votre site Web, les puces habituellement utilisées sont remplacées par des images. Page 10/10 U.P.S. Chabert - février 2000

11 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage Entrez le texte suivant : "Intérêt 1 : description de mon activité favorite" et appuyez sur Entrée, afin de terminer l'élément de liste et de créer la prochaine puce. 6 - Sur la ligne suivante, entrez "Intérêt 2 : ", puis appuyez sur Entrée. Sur la 3ème ligne, entrez "Intérêt 3 : ", puis appuyez sur Entrée deux fois, ce qui permet de terminer la liste. 7 - Vous pouvez copier et coller du texte comme dans n'importe quel traitement de textes. Pour compléter le texte des 2ème et 3ème puce, sélectionnez "description de mon activité favorite", dans le menu Édition, choisissez Copier. Placez ensuite le curseur derrière "Intérêt 2 : ", et dans le menu Édition, choisissez Coller. Répétez l'opération pour la 3ème puce. Astuce : vous pouvez également utiliser les combinaisons de touche CTRL + C pour copier et CTRL + V pour coller. 8 - Enregistrez votre page, avant de continuer, en appuyant sur le bouton Enregistrer sur la barre d'outils. Votre page devrait maintenant ressembler à ceci : 1.7 Éditer la page Album Photo Dans cette troisième page, nous allons insérer 2 images. Les images et illustrations apportent décoration et personnalisation à vos pages Web. 1 - Dans le menu Fichier de l'éditeur FrontPage, choisissez Ouvrir. Dans la liste, sélectionnez la page Album Photo et validez par OK. Lorsque la page est affichée, vous remarquerez que les éléments de mise en page du Thème ont bien été appliqués. 2 - Entrez le texte suivant : "Voici 2 superbes photos extraites de la bibliothèque d'images FrontPage". Cliquez sur le bouton Centrer sur la barre d'outils. La phrase que vous venez de saisir est centrée. 3 - Dans le menu Insertion, choisissez Ligne horizontale et appuyez sur Entrée. Chabert - février 2000 U.P.S. Page 11/11

12 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. 4 - Pour importer les images sur la page, dans le menu Insertion, choisissez Image. La boîte de dialogue "Image" qui s'affiche vous permet de choisir l'emplacement d'où elles seront importées : votre site Web FrontPage actuel, votre disque dur, un autre serveur Web, depuis un scanneur ou la bibliothèque Microsoft Clip Gallery. 5 - Cliquez sur le bouton Fichier, qui vous permet de parcourir votre disque. 6 - Dans la boîte de dialogue "Sélectionner le fichier", déplacez-vous jusqu'au dossier où est installé FrontPage, par défaut "C:\Program Files\Microsoft FrontPage", et ouvrez le dossier "\tutorial". Sélectionnez-y l'image sunset.gif et cliquez OK. La première image est insérée. Appuyez sur Entrée pour créer une nouvelle ligne et répétez l'opération pour insérer l'image city.gif, situez dans le même dossier. Si elle n'y sont pas, téléchargez les deux fichiers avec les liens suivants, enregistrez les sur votre disque dur (en faisant attention où vous les placez) et recommencez le point 6 de cette page. 7 - Enregistrez votre page, avant de continuer, en appuyant sur le bouton Enregistrer sur la barre d'outils. Dans la boîte de dialogue "Enregistrer les fichiers incorporés", cliquez sur OK, pour enregistrer les images que vous avez insérées. Votre page devrait maintenant ressembler à ceci : 1.8 Éditer la page Favoris Dans cette quatrième page, nous allons insérer une courte liste de liens hypertexte (ou hyperliens) vers d'autres sites du World Wide Web. 1 - Dans la barre d'outils FrontPage, choisissez le bouton Ouvrir. Dans la liste, sélectionnez la page Favoris et validez par OK. Lorsque la page est affichée, vous remarquerez que les éléments de mise en page du Thème ont bien été appliqués. Page 12/12 U.P.S. Chabert - février 2000

13 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage 2 - Entrez le texte suivant : "Voici une liste de mes sites favoris sur le World Wide Web!". Cliquez sur le bouton Centrer sur la barre d'outils. La phrase que vous venez de saisir est centrée. 3 - Dans le menu Insertion, choisissez Ligne horizontale et appuyez sur Entrée. Pour enlever le Centré, Cliquez sur. Nous allons maintenant insérer des hyperliens. Ce sont des pointeurs à partir d'un texte ou d'une image vers d'autres pages ou d'autres types de fichiers sur le World Wide Web. Les hyperliens sont le principal moyen de navigation entre les pages des sites Web. Il est possible de les créer de 2 manières : depuis un texte descriptif ou automatiquement. (QWUH]OHWH[WHVXLYDQW$FDGpPLHGH7RXORXVHHWDSSX\H]VXU(QWUpH 5 - Sélectionnez avec votre souris les mots que vous venez de saisir, et dans le menu Insertion, choisissez Lien hypertexte. La boîte "Créer un lien hypertexte" s'affiche. Elle vous permet de définir la cible du lien, qui peut être une page ou un fichier de votre site Web FrontPage actuel, sur votre disque dur, sur un autre serveur Web, ou directement sur le World Wide Web. Vous pouvez également créer directement un lien vers une messagerie. Dans le champ URL, tapez et cliquez sur OK. " correspond à HyperText Transfer Protocol, le protocole Internet qui permet aux navigateurs Web de récupérer l'information sur les serveurs Web. est l'url du site Microsoft France, c'est-à-dire l'adresse unique du site sur le Web. 7 - Cliquez n'importe où dans votre page, pour désélectionner le texte. Vous remarquerez qu'il a changé de couleur et qu'il est maintenant souligné, pour indiquer que c'est un lien hypertexte. Lorsque la page sera affichée dans un navigateur Web, le fait de cliquer sur le lien conduira vers la page d'accueil du site Microsoft France. L'apparence du texte est tirée également du thème que vous avez appliqué précédemment dans cette leçon Créons maintenant un hyperlien automatique : 1 - Tapez directement sur la page par exemple, et appuyez sur Entrée. "Yahoo!" est l un des moteurs de recherche de l'internet, pour retrouver des informations en générant des requêtes à partir de mots-clés. Dès que vous avez validé par Entrée, le formatage du texte a changé, pour indiquer que FrontPage, tout comme le font les applications de la suite Office, avait reconnu un hyperlien. Comme une URL n'est pas forcément descriptive en soi, il est souvent préférable de la modifier pour le nom du site auquel elle se rapporte. Vous pouvez le faire directement, en remplaçant le texte, sans supprimer l'hyperlien. 2 - Avec votre souris, mettez en surbrillance l'url que vous venez de saisir, et tapez le mot Yahoo!, pour remplacer le texte. L'hyperlien pointe toujours sur la même URL, mais son "étiquette" est différente Créons maintenant un lien hypertexte à l'aide de votre navigateur Web : Cette méthode est des plus pratiques, puisque vous visitez effectivement la page vers laquelle vous désirez pointer. Remarque : si vous ne disposez pas d'accès Internet sur l'ordinateur d'où vous suivez ce didacticiel, passez directement à la section suivante. 1 - Positionnez votre curseur sur la ligne suivante, tapez "Microsoft FrontPage" et appuyez sur Entrée. Sélectionnez ensuite ce texte. 2 - Dans le menu Insertion, choisissez Lien hypertexte. La boîte "Créer un lien hypertexte" s'affiche. Chabert - février 2000 U.P.S. Page 13/13

14 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. 3 - Cliquez sur le bouton Navigateur. FrontPage lance alors votre navigateur Web. Lorsque vous visiterez la page vers laquelle doit pointer votre hyperlien, vous basculerez vers FrontPage, et l'adresse de la page cible s'inscrira dans le champ. 4 - Dans la zone adresse du navigateur, tapez : et appuyez sur Entrée. Le navigateur affiche la page d'accueil Microsoft FrontPage en Français, où vous pouvez trouver toutes les informations utiles sur ce produit. 5 - Sur votre clavier, appuyez simultanément sur ALT+TAB, ou cliquez sur l'icône de l'éditeur FrontPage dans la barre des tâches, pour revenir à la boîte de dialogue "Créer un lien hypertexte". L'URL de la page d'accueil Microsoft FrontPage a été entrée dans le champ URL. Cliquez OK. Cliquez n'importe où dans votre page, pour désélectionner le texte. 6 - Enregistrez votre page, en appuyant sur le bouton Enregistrer sur la barre d'outils. Votre page devrait maintenant ressembler à ceci : 1.9 Afficher votre site Web Maintenant que votre site est terminé, vous pouvez l'afficher dans votre navigateur, et ainsi en voir l'apparence et la mise en page. Vous pourrez également naviguer entre les pages et tester les liens hypertexte que vous avez créés. 1 - Dans l'éditeur FrontPage, cliquez sur le menu Fenêtre. La liste des pages créées s'affiche, pour autant que vous ne les ayez pas fermées. Sélectionnez la page d'accueil pour la passer au premier plan. Si vous l'aviez fermée, ouvrez-la. 2 - Dans le menu Fichier, choisissez Aperçu dans le navigateur, afin de prévisualiser la page courante dans votre navigateur. Vous verrez ainsi exactement comment s'affiche la page, avant de publier votre site Web FrontPage. Il faut qu'au moins un navigateur soit installé sur votre ordinateur. 3 - Dans la boîte de dialogue qui s'affiche, sélectionnez le navigateur que vous souhaitez utiliser, et cliquez Aperçu. Page 14/14 U.P.S. Chabert - février 2000

15 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage La page d'accueil est affichée dans le navigateur, vous pouvez cliquer sur la barre de navigation pour afficher les autres pages de votre site. Astuce : Il existe un moyen plus rapide d'afficher les pages en cours de création. Si vous disposez de Microsoft Internet Explorer sur votre système, vous pouvez immédiatement afficher les pages de votre site Web FrontPage, en sélectionnant l'onglet Aperçu dans l'éditeur FrontPage. 2 Leçon 2 FERMEZ VOTRE SITE WEB ET FRONTPAGE POUR PASSER À LA LEÇON Ouvrir un Site Web FrontPage Vous utiliserez le site Web FrontPage que vous avez créé dans la leçon 1, pour la suite des leçons. Avant de pouvoir ajouter la page "Pratique" à votre site Web personnel, vous devez tout d'abord ouvrir ce dernier dans l'explorateur FrontPage. Note : Si votre site Web personnel est déjà ouvert, passez les étapes suivantes et allez directement à la leçon 2.2. Chabert - février 2000 U.P.S. Page 15/15

16 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C Pour ouvrir un site Web FrontPage 1 - Cliquez sur le bouton "Démarrer" de Windows, pointez sur "Programmes", puis cliquez sur "Microsoft FrontPage". 2 - Quand FrontPage s'ouvre, sélectionnez "Ouvrir un site Web...". 3 - A partir de la liste des sites Web FrontPage, choisissez Votre site et cliquez "OK". Note : Note : Suivant le type de serveur Web et le système d'exploitation que vous utilisez, l'explorateur FrontPage peut afficher la boîte de dialogue "Nom et mot de passe requis". Si elle n'apparaît pas, passez les étapes ci-dessous et continuez à la prochaine section. 4 - Si vous êtes l'administrateur de ce site Web FrontPage, entrez votre nom d'administrateur dans le champ "Nom". Si vous êtes l'auteur de ce site Web FrontPage, entrez votre nom. Pour en savoir plus sur les autorisations pour les sites Web FrontPage, reportez-vous à l'aide en ligne. Dans l'index, entrez le texte "administrateurs, autorisation". 5 - Dans le champ "Mot de passe", tapez votre mot de passe, puis cliquez "OK". Le site Web FrontPage est affiché dans l'explorateur FrontPage. 2.2 Ajouter une page à un site Web FrontPage Votre site Web personnel se compose d'une page d'accueil et de trois pages liées. Vous avez appris comment ajouter ces pages à votre site, en utilisant l'affichage "Navigation" dans l'explorateur FrontPage. Maintenant, vous allez ajouter une nouvelle page, nommée "Pratique", en utilisant l'éditeur FrontPage. Cette page sera une page de mise en pratique, sur laquelle vous pourrez vous exercer librement pendant les exercices de cette leçon. Quand la page sera créée, vous l'enregistrerez sur votre site Web personnel Pour ajouter une nouvelle page 1 - Aller dans l'éditeur FrontPage. 2- Cliquer sur le bouton pour créer une nouvelle page qui s'appellera "Nouvelle page?". C'est une page blanche qui contient des éléments du thème commun et les bordures partagées. Le thème que vous avez appliqué à votre site Web personnel dans la leçon 1 est automatiquement appliqué aux nouvelles pages que vous créez dans l'éditeur FrontPage, de même que le contenu des bordures partagées. 3 - Dans le menu "Fichier" de l'éditeur FrontPage, choisissez "Enregistrer sous". La boîte de dialogue "Enregistrer sous" s'ouvre. 4 - Dans le champ "Titre de la page :" cliquez sur le bouton "modifier" et tapez "Pratique". 4 - Dans le champ "Nom de fichier :", changez le nom de fichier en "tutorial.htm". 5 - Cliquez sur "OK" pour enregistrer la page sur votre site Web FrontPage. Note : Bien qu'elle soit enregistrée dans votre site Web FrontPage, vous n'avez pas relié cette page aux autres pages dans la structure du site Web. La page Pratique sera utilisée comme une zone de travail provisoire pour cette leçon. Elle pourra être effacée quand vous aurez terminé avec succès le cours FrontPage. Comme cette page "Pratique" n'exige pas de navigation vers les autres pages du site Web, vous cacherez les bordures partagées avant de continuer avec les exercices de cette leçon. Page 16/16 U.P.S. Chabert - février 2000

17 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage Pour cacher les bordures partagées et les Barres de navigation 1 - Dans le menu "Format" de FrontPage, choisissez "Bordures partagées". La boîte de dialogue "Bordures partagées" est affichée. Dans cette boîte de dialogue vous pouvez désactiver sur cette page les paramètres de bordures par défaut pour le site Web en cours. 2 - Sélectionnez "Page en cours". 3 - Décochez les cases "En Haut" et "A Gauche" afin que les bordures ne soient plus sélectionnées, puis cliquez sur "OK". Les Bordures de page et les Barres de navigation sont maintenant cachées et seule l'image d'arrière-plan du thème reste visible. 2.3 Insérer des fichiers Dans la leçon 1, vous avez ajouté du texte à vos pages en le saisissant directement sur la page dans l'éditeur FrontPage. Il y aura pourtant sûrement des cas, où il sera plus facile de transférer dans vos pages Web le contenu d'autres documents. Avec l'éditeur FrontPage, vous pouvez insérer dans vos pages des fichiers texte dans les formats suivants : Texte ASCII (TXT), Rich Text Format (RTF), Hypertext Markup Language (HTM ou HTML), Traitement de texte (y compris Microsoft Word), Feuille de calcul (y compris Microsoft Excel). Le fichier que vous allez insérer dans cette leçon est un fichier texte standard Pour insérer un fichier texte dans la page La page "Pratique" étant encore ouverte dans l'éditeur FrontPage, assurez-vous que le point d'insertion est en haut à gauche de la page. 1 - Dans le menu "Insertion" de l'éditeur FrontPage, choisissez l'option "Fichier". La boîte de dialogue "Sélectionner un fichier" est affichée. Le fichier que vous voulez insérer se nomme "Tutorial". 2 - Sélectionnez dans la liste déroulante "Type" l'option "Fichiers texte (.txt)". 3 - Naviguez ensuite jusqu'au dossier C:\Program Files\Microsoft FrontPage\Tutorial\ 4 - Sélectionnez le fichier "Tutorial.txt", puis cliquez sur "Ouvrir". Si vous ne le trouvez pas dans ce dossier, cherchez le ailleurs. S'il n'est pas installé sur votre disque dur, téléchargez-le. en faisant bien attention où vous le placez, puis recommencez au 1- de cette page 5 - Dans la boîte de dialogue "Convertir le texte", sélectionnez l'option "Paragraphes Normaux avec sauts de lignes" et cliquez sur "OK". FrontPage importe le contenu du fichier texte et le place dans la page en cours. Chabert - février 2000 U.P.S. Page 17/17

18 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C Pour enregistrer la page en cours Dans le menu "Fichier" de FrontPage, choisissez "Enregistrer". La page est enregistrée sur le site Web en cours. 2.4 Recevoir des commentaires depuis votre site Dans la leçon 1, vous avez appris comment créer des hyperliens simples à partir de texte sur une page, qui pointe vers d'autres pages dans votre site Web. Mais au-delà de la connexion des pages à l'intérieur de votre site Web, un hyperlien peut aussi ouvrir des pages sur le World Wide Web ou interagir avec d'autres programmes tels qu'une application de courrier électronique ou un lecteur de News. Dans les étapes ci-dessous, vous créerez un hyperlien qui lance un formulaire de messagerie sur l'ordinateur de l'utilisateur, quand il clique ce lien dans son navigateur. Ce type d'hyperlien est utilisé pour demander leurs commentaires aux visiteurs de votre site Web, lorsqu'il est publié Pour créer un hyperlien 1 - Sur la page " Pratique", appuyez sur la touche "Entrée" pour créer un peu d'espace après le texte inséré précédemment. 2 - Saisissez "S'il vous plaît, envoyez-moi vos réactions sur mon site Web!". 3 - Double-cliquez le mot "réaction" pour le sélectionner. FrontPage supporte les raccourcis de sélection standards de Windows. Bouton Créer ou modifier un lien hypertexte 4 - Cliquez sur le bouton "Créer ou modifier un lien hypertexte" dans la barre d'outils de FrontPage. Les boutons de la barre d'outils offrent des raccourcis pratiques pour les commandes FrontPage. Bouton Créer un lien hypertexte d'envoi de message Page 18/18 U.P.S. Chabert - février 2000

19 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage 5 - Dans la boîte de dialogue "Créer un lien hypertexte", cliquez le bouton "Créer un lien hypertexte d'envoi de message ". 6 - Dans la boîte de dialogue correspondante, tapez votre adresse personnelle (par exemple : personne@toutatis.ups-tlse.fr). Votre adresse personnelle a été définie par votre fournisseur d'accès Internet, lorsque vous avez obtenu votre connexion à l'internet. 7 - Cliquez sur "OK". Le champ URL dans la boîte de dialogue "Créer un lien hypertexte" contient maintenant "Mailto:personne@toutatis.ups-tlse.fr (cet exemple est remplacé par votre adresse réelle sur votre écran). 8 - Cliquez "OK". Le mot "réaction" a changé de couleur de texte et est maintenant souligné pour indiquer qu'il s'agit d'un hyperlien. Plus tard, dans cette leçon, vous afficherez la page "Pratique" dans votre navigateur et vous pourrez tester l'hyperlien que vous venez de créer ici. Bien entendu, il n'est pas possible de tester le lien dans l'éditeur Pour enregistrer la page en cours Bouton Enregistrer Dans la barre d'outils de FrontPage, cliquez sur le bouton "Enregistrer". La page est enregistrée sur le site Web en cours. 2.5 Créer une Image Map Dans la première leçon, vous avez appris comme il est facile de placer des images dans les pages Web. Maintenant, vous créerez une image map, une image contenant un ou plusieurs hyperliens. Chabert - février 2000 U.P.S. Page 19/19

20 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. Quand une image est formatée en image map, un utilisateur peut cliquer sur certaines région de l'image et déclencher des "hotspots", c'est à dire des zones réactives. Ces hotspots lancent les hyperliens qui ont été ajoutés au HTML par l'éditeur FrontPage. Avant de créer une image map, vous devez tout d'abord insérer l'image que vous utiliserez Pour insérer une Image 1 - Appuyez sur la touche "Entrée" pour déplacer le point d'insertion à la ligne juste en dessous de l'hyperlien "réaction". 2 - Dans le menu "Insertion" de FrontPage, sélectionnez "Image". La boîte de dialogue "Image" s'affiche. Bouton Sélectionner un fichier stocké sur votre ordinateur 3 - Dans la boîte de dialogue "Image", cliquez le bouton "Sélectionner un fichier stocké sur votre ordinateur". Le fichier d'image que vous voulez insérer se nomme blackbrd.gif. 4 - Dans la boîte de dialogue "Sélectionner un Fichier", naviguez jusqu'au dossier C:\Program Files\Microsoft FrontPage\Tutorial\ 5 - Sélectionnez le fichier "blackbrd.gif", puis cliquez sur "OK". Si vous ne la trouvez pas à l'emplacement indiqué, téléchargez-la et enregistrez la sur votre disque dur en faisant bien attention où vous la placez. L'image d'une ardoise est affichée sur la page. Cette image a un arrière-plan noir, ce qui ne correspond pas avec l'arrière-plan clair du thème. Vous allez maintenant rendre la bordure transparente, afin qu'elle se mêle avec la couleur d'arrière-plan blanche de la page "Pratique" Pour rendre une couleur de l'image transparente 1 - Cliquez l'image de l'ardoise pour la sélectionner. Une image est sélectionnée quand elle est entourée avec des poignées rectangulaires. Quand vous sélectionnez une image, la barre d'outil Image est activée. Bouton Rendre transparent 2 - Maintenant, cliquez sur le bouton "Rendre transparent" sur la barre d'outils Image. 3 - Déplacez le pointeur de la souris sur l'image. Le pointeur se change en crayon-gomme. 4 - Cliquez sur le bouton gauche de la souris n'importe où sur l'arrière-plan noir derrière l'ardoise. L'arrière-plan de l'image est maintenant transparent, permettant à l'arrière-plan clair de la page d'être visible. Page 20/20 U.P.S. Chabert - février 2000

21 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage Maintenant, vous allez créer les hotspots sur l'image pour terminer l'image map Pour créer les Hotspots 1 - Cliquez l'image de l'ardoise pour la sélectionner. Bouton Zone Réactive Rectangulaire 2 - Maintenant, cliquez dans le bouton "Rectangle" sur la barre d'outils Image. Le bouton "Rectangle" crée un "hotspot" rectangulaire sur une image. Un hotspot est une zone d'une image qui contient un hyperlien. 3 - Déplacez le pointeur de la souris sur l'image. Le pointeur devient un crayon. 4 - Déplacez le crayon vers le coin gauche supérieur du texte "Centres d'intérêt". 5 - Cliquez et gardez le bouton gauche de la souris enfoncé, puis tirez le rectangle jusqu'à ce qu'il entoure le texte "Centres d'intérêt". Quand vous relâchez le bouton de la souris, la boîte de dialogue "Créer un lien hypertexte" s'affiche. Si vous avez relâché le bouton de la souris trop tôt, vous pourrez toujours ajuster la zone hotspot, après les étapes ci-dessous. Chabert - février 2000 U.P.S. Page 21/21

22 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. 6 - Dans la boîte de dialogue "Créer un lien hypertexte", sélectionnez le fichier "Intérêts.htm", puis cliquez sur "OK". Le texte "Centres d'intérêt" sur l'image de l'ardoise est maintenant un hyperlien. Astuce FrontPage : Les hotspots peuvent être redimensionnés. Si vous voulez ajuster la taille et la position d'un hotspot, déplacer la souris au-dessus des bordures du hotspot jusqu'à ce que vous voyiez le pointeur de redimensionnement (une flèche à deux-têtes). Vous pouvez alors cliquer et tirer les bordures du hotspot jusqu'au bon emplacement. L'hyperlien associé sera conservé. Expérimentez maintenant par vous-même et créez les liens hypertexte supplémentaires pour les deux lignes de texte restantes sur l'image de l'ardoise. Créez un hyperlien avec les mots "Album Photo" vers la page "album.htm", et un hyperlien pour les mots "Sites Web Favoris" vers la page "favoris.htm". Plus tard dans cette leçon, vous verrez la page "Pratique" dans votre navigateur Web, et vous pourrez tester votre image map. Avant de continuer, enregistrez votre travail. Vous avez importé l'image blackbrd.gif dans la page depuis votre disque local. FrontPage enregistrera l'image dans votre site Web, afin qu'elle soit disponible plus tard, quand vous publierez votre site Web personnel à la leçon Pour enregistrer la page et l'image en cours Bouton Enregistrer 1 - Dans la barre d'outils de FrontPage, cliquez sur le bouton "Enregistrer". 2 - Dans la boîte de dialogue "Enregistrer les fichiers incorporés", cliquez sur "OK" pour enregistrer l'image que vous avez insérée. Page 22/22 U.P.S. Chabert - février 2000

23 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage L'image de l'ardoise que vous avez placée sur votre page est ajoutée à votre site Web FrontPage et la page en cours est enregistrée. 2.6 Placer du texte sur une image Dans FrontPage, vous pouvez placer du texte formaté sur une image. Cette fonctionnalité est utile pour la création de bannières graphiques, d'étiquettes sur des boutons image et la création de texte sur des images maps Pour placer du texte sur une image 1 - Sur la page "Pratique", placez le point d'insertion après l'image de l'ardoise, puis appuyez deux fois sur la touche "Entrée". 2 - Dans le menu "Insertion" de l'éditeur FrontPage, sélectionnez "Image". La boîte de dialogue "Image" est affichée. 3 - Sélectionnez le fichier "sunset.gif", puis cliquez sur "OK". L'image sunset.gif a été ajoutée à votre site Web personnel lors de la leçon 1, donc vous pouvez l'insérer directement depuis votre site Web. 4 - Cliquez ensuite l'image "sunset" que vous venez d'insérer pour activer la barre d'outils Image. Bouton Texte 5 - Dans la barre d'outils Image, cliquez le bouton "Texte". Un champ texte avec des poignées et un curseur clignotant apparaît au centre de l'image. 6 - Tapez le mot "sunset". Le mot est centré dans le champ texte. La couleur du texte est trop foncée pour l'image que vous avez insérée. L'étape suivante permettra de faire ressortir le texte de l'image Pour formater le texte 1 - Double-cliquez le mot "sunset" pour le sélectionner. Bouton Couleur du texte 2 - Dans la barre d'outils Format, cliquez sur le bouton "Couleur du texte". La boîte de dialogue "Couleurs" apparaît. 3 - Cliquez sur une couleur claire pour le texte, telle que blanc, puis cliquez sur "OK". 4 - Dans le menu "Format", choisissez "Police". La boîte de dialogue "Police" apparaît. 5 - Dans le champ "Police", choisissez "Times New Roman". 6 - Dans le champ "Style de police", choisissez "Gras". Chabert - février 2000 U.P.S. Page 23/23

24 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. 7 - Dans le champ "Taille", choisissez "4 (14 points)", puis cliquez sur "OK" pour appliquer le changement de formatage. 8 - Pour que le texte tienne dans la boîte de texte, cliquez et tirez les poignées de redimensionnement jusqu'à ce que le mot "sunset" soit complètement affiché. Vous pouvez déplacer la boîte de texte au centre (ou n'importe où) de l'image en cliquant et déplaçant le mot avec la souris. Quand vous placez du texte formaté sur une image sur la page en cours, FrontPage ne modifie pas l'image originale. Quand vous enregistrez la page, FrontPage sauve une combinaison d'image et de texte dans un nouveau fichier d'image séparé. Si vous avez précédemment permis à FrontPage d'enregistrer l'image originale dans votre site Web FrontPage (en cliquant "Oui" dans la boîte de dialogue "Enregistrer les fichiers incorporés"), vous pourrez revenir à l'image originale ultérieurement. Avant de continuer, c'est une bonne idée d'enregistrer votre travail Pour enregistrer la page en cours Dans le menu "Fichier" de FrontPage, sélectionnez "Enregistrer". La page est enregistrée sur le site Web FrontPage en cours. 2.7 Créer une table (ou tableau) Les tables (ou tableaux) sont un ensemble de cellules organisées en lignes et en colonnes. Vous pouvez utiliser des tables pour grouper des informations de manière systématique, ou, en les formatant avec des bordures invisibles, pour organiser la disposition de la page. Page 24/24 U.P.S. Chabert - février 2000

25 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage Pour créer une table 1 - Dans la page "Pratique", placez le point d'insertion après l'image "sunset", puis appuyez deux fois sur la touche "Entrée" pour créer un peu d'espace. 2 - Dans le menu "Tableau", sélectionnez "Insérer un Tableau". La Boîte de dialogue "Insérer un Tableau" s'affiche. 3 - Dans le champ "lignes", entrez "6". 4 - Dans le champ "colonnes", entrez "2". 5 - Dans le champ "taille de la bordure", entrez "0". Vous conserverez les valeurs par défaut pour l'alignement, l'espacement des cellules, la marge interne des cellules et la largeur. Vous pouvez toujours modifier ces paramètres plus tard. 6 - Cliquez sur "OK". FrontPage crée une table avec six lignes et deux colonnes. Astuce FrontPage : Grille ou Bordures? Quand une table est insérée avec une bordure de taille zéro, l'éditeur FrontPage affiche une grille pour vous aider à concevoir la disposition de la table. Cette grille n'est qu'un guide. Quand la page est affichée dans un navigateur Web, la grille n'est pas affichée. Si vous voulez que la table apparaisse avec des bordures, cliquez avec le bouton droit de la souris n'importe où à l'intérieur de celle-ci dans l'éditeur FrontPage et sélectionnez "Propriétés du Tableau" dans le menu contextuel. Dans cette boîte de dialogue, vous pouvez augmenter la valeur de la taille de la bordure. 2.8 Entrer du texte dans une table Vous pouvez saisir du texte directement dans les cellules d'une table. Pour cet exercice, vous utiliserez la table que vous venez d'insérer pour créer une liste descriptive des pages de votre site Pour ajouter du texte dans une table 1 - Cliquez dans la cellule en haut à gauche de la table et tapez le titre de la première colonne : Noms des pages Web. 2 - Ensuite, tapez les noms de fichier des cinq pages de votre site Web dans les cellules de la colonne de gauche. Utilisez la touche "Flèche bas" pour aller à la cellule suivante, après avoir entré le nom de chaque fichier. index.htm, interets.htm, photo.htm, favoris.htm, tutorial.htm. Remarquez que pour les noms de fichiers, il vaut mieux éviter les majuscules, mais surtout NE JAMAIS utiliser de caractères accentués. Chabert - février 2000 U.P.S. Page 25/25

26 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. 3 - Cliquez dans la cellule en haut à droite de la table et tapez le titre de la seconde colonne : "Description de la page" 4 - Ensuite, tapez une brève description à côté de chacun des noms de fichiers. Utilisez la touche "Flèche bas" pour descendre vers la cellule suivante, après avoir saisi chaque description de fichier. La page de garde de mon site Web personnel. Une liste de mes centres d'intérêts. Quelques images superbes. Une liste de mes sites World Wide Web favoris. La page où je m'entraîne pour mes leçons FrontPage. 5 - Avec la souris, sélectionnez la première ligne de la table. Bouton Gras 6 - Dans la barre d'outils "Format", cliquez sur le bouton "Gras". Les colonnes d'en-tête sont formatées en gras. Il est ainsi plus facile de distinguer les étiquettes des colonnes avec les autres cellules. 7 - Ensuite, déplacez le pointeur de la souris vers le milieu de la table, là où les bordures verticales gauche et droite des colonnes se rejoignent. Le pointeur change en une flèche à double-tête horizontale. 8 - Cliquez le bouton gauche de la souris, gardez-le enfoncé et tirez la bordure de la colonne vers la gauche afin que les deux colonnes soient plus proches sur la page. Le redimensionnement dynamique des tables est facile à faire avec FrontPage et fonctionne avec les lignes et avec les colonnes. Maintenant, votre table doit ressembler à ceci : Page 26/26 U.P.S. Chabert - février 2000

27 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage Pour enregistrer la page en cours Bouton Enregistrer La page est enregistrée sur votre site Web. 2.9 Créer une liste Un autre moyen pour grouper et organiser l'information est d'utiliser des listes. Les pages Web peuvent avoir deux types de listes - numérotée ou à puces. Les listes numérotées contiennent du texte précédé par des numéros, comme les étapes de ce tutorial. Dans les listes à puces, le texte est précédé par des puces ou des images. Vous utilisez une liste à puces si les éléments n'ont pas besoin d'être listés dans un ordre particulier. Dans la leçon 1, vous avez créé des listes à puces sur les pages "Intérêts" et "Favoris". Créons maintenant une liste numérotée Pour créer une liste numérotée 1 - Sur la page "Pratique", placez le curseur après le texte "La page où je m'entraîne pour mes leçons FrontPage" dans la dernière cellule, puis appuyez sur CTRL + Entrée. La combinaison de touche CTRL + Entrée crée une nouvelle ligne au-dessous de la table. 2 - Appuyez sur la touche "Entrée" pour créer plus d'espace au-dessous de la table. 3 - Sélectionnez "Titre 2" dans la liste déroulante "Modifier le style" sur la barre d'outils de l'editeur FrontPage. Chabert - février 2000 U.P.S. Page 27/27

28 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. 4 - Ensuite, saisissez "Étapes pour utiliser FrontPage" sur cette ligne et appuyez sur "Entrée". Vous avez créé un paragraphe de style Titre 2. Bouton Liste numérotée 5 - Cliquez sur le bouton "Liste numérotée" sur la barre d'outils. FrontPage ajoute une nouvelle ligne avec un "1" au début. 6 - Saisissez "Lancer l'explorateur FrontPage" et appuyez sur la touche "Entrée". FrontPage ajoute une nouvelle ligne avec un "2" au début. 7 - Ensuite, saisissez les autres points de la liste et appuyez sur la touche "Entrée" après chacun : Créer ou ouvrir un site Web FronPage, Lancer l'editeur FrontPage, Créer ou éditer les pages de votre site Web FrontPage, Enregistrer les modifications, Publier le Web FrontPage de votre site Web. 8 - Appuyez deux fois sur la touche "Entrée" après la saisie du dernier point, ce qui termine la liste en cours. La liste que vous avez créée doit se présenter comme ceci : Pour enregistrer la page en cours Bouton Enregistrer Page 28/28 U.P.S. Chabert - février 2000

29 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage 2.10 Ajout un élément actif sur la page Avec FrontPage, vous pouvez ajouter des éléments actifs tels que boutons "sensitifs", texte défilant, compteurs de page et clips vidéo. Ces éléments peuvent rendre vos pages plus intéressantes et utiles. Dans cet exercice, vous ajouterez un texte défilant (marquee) à votre page courante. Un "marquee" est une zone sur la page qui affiche du texte "défilant" lorsqu'elle est visualisée dans un navigateur, tel que Microsoft Internet Explorer. Les marquees sont un moyen amusant pour créer du texte et des titres en mouvement sur votre page d'accueil. Ils peuvent être utilisés pour attirer l'attention sur des évènements Pour ajouter un marquee 1 - Dans la page "Pratique", appuyez deux fois sur la touche "Entrée" pour créer de l'espace au-dessous de la liste numérotée. 2 - Sélectionnez "Titre 1" dans la liste déroulante "Modifier le style" de la barre d'outils de FrontPage. 3 - Saisissez "Bienvenue sur mon site Web personnel!". 4 - Sélectionnez ce texte et cliquez le bouton "Couleur du texte" sur la barre d'outils Format. Choisissez une couleur claire, un orangé par exemple. Le formatage du texte du marquee doit être réalisé avant de le déclarer. Si le site Web FrontPage en cours dispose d'un thème, la couleur du texte, la taille et la police peut changer automatiquement. 5 - Dans le menu "Insertion", pointez sur "Composants", puis cliquez sur "Texte défilant". La boîte de dialogue "Propriétés du texte défilant" est affichée. Dans cette boîte de dialogue, vous pouvez modifier plusieurs propriétés comme la vitesse et la direction du mouvement, ainsi que la taille et la couleur d'arrière-plan. 6 - Dans la liste déroulante "Couleur d'arrière-plan", choisissez "Bleu foncé". 7 - Cliquez sur "OK". FrontPage ajoute une zone "marquee" à la page en cours. Chabert - février 2000 U.P.S. Page 29/29

30 Créer & gérer un site Web avec Frontpage Exercices C.F.A.T.I.C. Plus tard, dans cette leçon, vous afficherez la page "Pratique" dans un navigateur Web, vous pourrez ainsi voir le marquee que vous venez de créer Pour enregistrer la page en cours Bouton Enregistrer 2.11 Ajouter un formulaire de réaction Précédemment, vous avez appris comment fabriquer un hyperlien de messagerie à partir d'un texte. Cliquer sur l'hyperlien ouvre un formulaire sur l'ordinateur de l'internaute. Un autre moyen pour recevoir des commentaires depuis le World Wide Web est de placer un formulaire de réaction sur votre page. Il permet aux visiteurs de votre site de vous envoyer un commentaire sans ouvrir leur application de messagerie Pour ajouter un formulaire à votre page 1 - Sur la page "Pratique", appuyez sur la touche "Entrée" pour créer un peu d'espace au-dessous du marquee. 2 - Saisissez "S'il vous plaît, envoyez-moi vos commentaires sur mon site Web". 3 - Dans le menu "Insertion", sélectionnez "champ de formulaire", puis cliquez sur "Zone de texte déroulante". FrontPage insère un formulaire contenant une zone de texte déroulante et des boutons "Envoyer" et Effacer". Les propriétés par défaut d'un formulaire de réaction spécifient que les commentaires envoyés (les résultats du formulaire) sont enregistrés dans un fichier précis de votre site Web. Dans la prochaine section, vous afficherez la page "Pratique" dans votre navigateur, et vous pourrez tester ce formulaire et voir le résultat. Page 30/30 U.P.S. Chabert - février 2000

31 C.F.A.T.I.C.. Exercices Créer & gérer un site Web avec Frontpage Pour enregistrer la page en cours Bouton Enregistrer 2.12 Afficher la page "Pratique" dans votre navigateur Web Maintenant, il est temps de voir à quoi ressemble dans votre navigateur, la page "Pratique" que vous venez de créer Pour visualiser la page dans le navigateur Bouton Aperçu dans le navigateur 1 - Dans la barre d'outils de FrontPage, cliquez sur le bouton "Aperçu dans le navigateur". La page "Pratique" est affichée dans votre navigateur Web par défaut. 2 - Déplacez-vous vers le bas pour localiser "S'il vous plaît, envoyez-moi une réaction à propos de mon site Web!" et remarquez le mot "réaction". Le mot "réaction" est en couleur et souligné. Dès que vous déplacez la souris sur le mot, le pointeur se transforme en main, ce qui indique qu'il s'agit d'un hyperlien que vous pouvez cliquer. Si vous avez configuré correctement l'application de messagerie installée sur votre ordinateur, le fait de cliquer ce mot ouvrira la fenêtre d'envoi de nouvel , avec votre adresse personnelle dans la zone destinataire. Saisissez un message dans le formulaire et envoyez-le. Si aucune fenêtre n'apparaît, annulez l'opération et validez tout message qui pourrait apparaître. 3 - Ensuite, déplacez-vous vers le bas jusqu'à l'ardoise et cliquez sur "Centres d'intérêt". L'hyperlien que vous avez créé dans l'image map trouve et affiche la page de description de vos intérêts personnels. Chabert - février 2000 U.P.S. Page 31/31