FrontPage Support d apprentissage septembre 2000

Transcription

1 FrontPage Support d apprentissage septembre 2000

2 Table des matières Notions de base... 1 Le langage HTML... 1 Les éditeurs HTML... 1 Le navigateur... 1 Le transfert de fichiers... 1 L enregistrement des pages... 2 Particularités d une page Web... 2 Les tags ou commandes HTML... 2 Les points communs à toutes les pages... 2 Créer un nouveau site web... 4 Ouvrir un site Web... 5 Renommer un site Web... 7 Les outils Importants... 7 Page de démarrage... 7 Les barres d outils... 7 La typographie... 8 Quel est le problème de la police?... 8 Mise en forme du texte... 9 Texte et paragraphes... 9 Définir la police d'un texte... 9 Ajouter des bordures à un texte Ajouter une trame à un texte Supprimer la mise en forme d'un texte Les barres d outils Les propriétés de la page Les propriétés de la page Onglet Général Le titre d'un fichier Onglet Arrière plan Onglet Marges Définir les marges d'une page Validation à l aide des navigateurs Afficher l'aperçu d'une page dans un navigateur Web...16 Ajouter un navigateur Web à la liste d'aperçu Concevoir un site Web pour des navigateurs spécifiques Concevoir un site Web pour des serveurs spécifiques Les images... 20

3 Insérer une image Redimensionner une image Positionnement d une image Définir les propriétés d'une image GIF ou JPEG Convertir une image au format GIF, JPEG ou PNG Définir les propriétés de bordure d'une image Les principales fonctions de la barre d outils image Faire pivoter une image Retourner une image Modifier le contraste des couleurs dans une image Modifier la luminosité d'une image Rogner une image Définir une couleur comme transparente dans une image Convertir une image en noir et blanc Ajouter une bordure en relief à une image Rééchantillonner une image Rétablir une image Impact des graphismes sur votre site Web Augmentation de la taille du site Web Pages dont le téléchargement est particulièrement lent Les liens hypertextes L URL L affichage des liens hypertextes Changer le nom d'un fichier et déplacer des fichiers dans votre site Web Tester et réparer des liens hypertextes rompus Insérer un liens Modifier un lien Les signets Navigation avec FrontPage Les Tableaux Comment utiliser les tableaux Insérer un tableau Propriétés d'un tableau Propriétés des cellules Insérer des lignes et des colonnes Le transfert de la page sur le serveur Le transfert de fichier FTP Le logiciel WS FTP La procédure de transfert... 41

4 1 N OTIONS DE BASE Le langage HTML Les pages Web sont créées avec un langage appelé HTML (Hypertext Marked Language). Il est essentiel d utiliser ce langage pour la production de pages Web. Ce langage, un peu particulier, peut se faire avec n importe quel éditeur de texte, même le plus simple comme le Bloc-Notes, utilitaire de Windows. Peu importe le logiciel de traitement de texte, il est possible de concevoir des pages Web. Cependant, il existe des outils spécialisés tels que FrontPage, WebExpert, PageMill, etc. qui peuvent faciliter le travail. En l absence de tels outils, le Bloc-Notes peut convenir. Les éditeurs HTML Voici une brève description de quelques éditeurs HTML : FrontPage : Ce logiciel de Microsoft permet de produire des pages Web et aussi de gérer un site. On dit que la version 1998 générait des codes inutiles. Cependant, il semble que la version 2000 soit améliorée. FrontPage occupe beaucoup d espace sur le disque dur. Cet outil peut être acheté avec les logiciels Office 2000 de Microsoft. WebExpert : Ce logiciel permet de faire des pages Web mais ne possède pas d outils de gestion du site Web. Il n occupe pas beaucoup d espace sur le disque et il est facile à utiliser. PageMill : Cet outil est très facile à utiliser puisque les commandes HTML se génère automatiquement. Cependant, on dit de ce logiciel qu il génère des codes HTML supplémentaires, ce qui peut causer plusieurs problèmes lors de la réalisation de pages Web. Ces codes peuvent toutefois être consultés et corrigés manuellement. Hotdog et BBedit : Deux petits logiciels faciles à utiliser et gratuits. Ils ont cependant moins de fonctions que les autres. Le navigateur Le logiciel de traitement de texte servira à produire la page; cependant pour vérifier cette page, il faut utiliser un navigateur tel que Netscape ou Explorer. En effet, les pages HTML doivent être ouvertes avec un logiciel de navigation afin de vérifier l aspect de la nouvelle page. Il est souhaitable que chaque page soit vérifiée à l aide du navigateur, ainsi les pages sont vues telles que les Internautes les visualiseront. Le transfert de fichiers Lorsque la conception des pages est terminée, il faut les rendre accessibles sur Internet puisque les ordinateurs ne sont pas tous des serveurs et qu il est essentiel, pour que les Internautes puissent accéder aux pages, qu elles soient hébergées sur un serveur. Ainsi, les pages doivent être déposées sur un serveur afin de les rendre accessibles sur Internet. Cette opération peut se faire en utilisant un logiciel de transfert de fichiers FTP (File Transfert Protocol). Il faut, pour

5 2 procéder à cette opération, obtenir du gestionnaire du serveur des autorisations d accès. La procédure de transfert est décrite un peu plus loin dans le document. L enregistrement des pages Chaque page HTML n est rien d autre qu un fichier de texte. Ce fichier doit être enregistré avec une extension afin que votre navigateur puisse le reconnaître. Cette extension est htm ou html. De plus, la structure du site doit être bien organisée afin de retrouver les pages et d'effectuer les corrections. Chaque page possède son identification, soit le nom du fichier de la page Web. En conséquence, la hiérarchie des répertoires, les noms significatifs des fichiers ainsi que l emplacement lors de l enregistrement, deviennent extrêmement importants. Aussi, la gestion des fichiers doit être bien maîtrisée. P ARTICULARITÉS D UNE PAGE W EB Les tags ou commandes HTML Le langage HTML représente du texte codifié et il est impératif de respecter sans erreur les codes de ce langage. Les commandes HTML sont appelées tags. Une commande HTML est placée entre les deux caractères < et >. Lorsqu une commande se termine, elle est répétée avec une barre oblique / (slash). D une façon plus générale, les codes se présentent de cette façon : <BODY> au début et </BODY> à la fin pour indiquer qu il s agit de la zone du corps de la page. Les tags BODY indiquent où commence le texte et à quel endroit il se termine. Ainsi entre les deux tags <BODY> et </BODY> est placé le texte de la page Web et, lors de l ouverture du fichier avec un navigateur, il sera possible de voir le texte. Les points communs à toutes les pages Quelques commandes HTML doivent être présentes sur toutes les pages de votre site Web. Ainsi chaque fichier HTML est bâti selon la structure suivante : <HTML> En-tête <HEAD> <TITLE> </TITLE> </HEAD> Corps <BODY> </BODY> </HTML>

6 3 La page commence par <HTML> et se termine par </HTML> indiquant clairement qu il s agit bien d une page HTML. Entre les deux tags HTML, est placée une zone d en-tête encadrée par les commandes HTML <HEAD> et </HEAD>. Il est alors possible d entrer du texte pour obtenir un en-tête pour la page Web. Dans l en-tête il peut y avoir le titre de la page qui sera placé entre les deux tags <TITLE> et </TITLE>. L en-tête est suivi du corps encadré par <BODY> et </BODY> où le texte de la page est placé. Il n est pas nécessaire que les codes HTML soient en capitales; d ailleurs même les formes hybrides telles que <HtmL> fonctionnent tout à fait bien. Mais il est conseillé de s en tenir aux capitales pour des raisons de lisibilité.

7 4 C RÉER UN NOUVEAU SITE W EB Lorsqu on démarre un nouveau site web, il est préférable d utiliser la fonction nouveau site Web afin d être en mesure d utiliser toutes les fonctions offertes par FrontPage. Ainsi, il faut procéder de la façon suivante : 1. Dans le menu Fichier Nouveau Site Web. 2. Dans la liste Sites Web, sélectionnez le modèle ou l'assistant que vous souhaitez utiliser pour créer le nouveau site Web. Le plus utilisé est le Site Web normal. 1. Par défaut, le site Web sera enregistré dans C: \Mes Documents\Mes sites Web\monsiteweb1. Selon la quantité de sites créés auparavant, le répertoire monsiteweb aura un numéro correspondant à cette quantité. 2. Lorsque vous créez un site Web, FrontPage crée automatiquement deux répertoires et un fichier : _private : il s agit d un dossier caché pour stocker les résultats de formulaire. Ce dossier caché créé par FrontPage ne peut être affiché par les visiteurs parcourant votre site. Si vous voulez que d'autres dossiers soient cachés, vous pouvez créer des sous-dossiers sous le dossier _private. Si vous créez un dossier et que vous faites précéder son nom d'un tiret bas (par exemple, _base de données), le dossier est caché uniquement avec les affichages Microsoft FrontPage. Ces dossiers sont utiles pour les fichiers que ne nécessitent pas d'être affichés dans FrontPage; cependant, le contenu du dossier peut être

8 5 affiché par les visiteurs parcourant le site Web. Si vous voulez qu'un dossier s'affiche dans FrontPage procédez de la façon suivante : Menu Outils Propriétés du site Web Onglet Options avancées et sélectionnez la case à cocher Afficher les documents dans les dossiers cachés. Images : le dossier Images pour le stockage des photos, vidéos et autres images ; FrontPage crée une nouvelle page d'accueil nommée Index.htm ou Default.htm, en fonction du type de serveur utilisé pour le site. O UVRIR UN SITE W EB Si on veut ouvrir un site déjà existant, il faut procéder de la façon suivante : Menu Fichier Ouvrir un site Web, puis effectuez l'une des opérations suivantes : Pour ouvrir un site Web sur votre ordinateur local, entrez dans la zone Nom du dossier, le chemin d'accès au dossier contenant le site Web puis cliquez sur Ouvrir. Par exemple, pour ouvrir un site Web nommé Formation, situé sur le lecteur C sous le dossier Mes sites Web, entrez C:\Mes sites Web\Formation. Vous pouvez également utiliser la zone Regarder dans pour naviguer dans le dossier Mes sites Web (ou tout autre dossier contenant des pages Web). Dans la liste des sites Web, sélectionnez le site souhaité puis cliquez sur Ouvrir.

9 6 Remarques Pour ouvrir un site Web récemment ouvert, au menu Fichier Ouvrir un site Web, cliquez sur la flèche déroulante située à droite de la zone Nom du dossier, sélectionnez le site Web que vous souhaitez et enfin, cliquez sur Ouvrir. Si la boîte de dialogue Ouvrir un site Web n'est pas ouverte, vous pouvez également utiliser la fonction suivante : au menu Fichier Sites Web récents. Pour ouvrir automatiquement le dernier site Web sur lequel vous avez travaillé chaque fois que vous démarrez FrontPage au menu Outils cliquez sur Options, puis sélectionnez la case à cocher Ouvrir le dernier site Web utilisé au démarrage de FrontPage.

10 7 R ENOMMER UN SITE W EB Lorsque vous renommez un site Web, Microsoft FrontPage met automatiquement à jour tous les liens hypertextes internes et autres paramètres du site avec le nouveau nom du site. 1. Dans le menu Outils Paramètres du site Web Onglet Général. 2. Dans la zone Nom du site Web, entrez un nouveau nom pour le site. L ES OUTILS I MPORTANTS Page de démarrage Les barres d outils Styles de paragraphe et polices de caractères. Attributs des caractères. Ces outils ont pour effet de les mettre en gras, en italique, de les souligner, d'en fixer la couleur.

11 8 Alignement horizontal du texte. Listes numérotées ou à puces, et diminution ou augmentation du retrait du texte. Nouveau, Ouvrir, Sauvegarder (menu Fichier). Impression et Aperçu avant impression. Couper, Coller et Copier. Annuler la dernière action ou refaire celle qui vient d'être annulée. Insérer un objet, composant WebBot, tableau ou image. Dans le cas de l'insertion d'un tableau on clique sur l'icône et, sans relâcher le bouton gauche, on glisse la souris pour fixer le nombre de lignes et de colonnes. Insérer un lien. Suppose une sélection préalable de l'objet devant contenir ce lien, sinon le titre ou l'adresse de la page pointée s'inscrit au point d'insertion. Outils de navigation. Passer à la page précédente, ou à la suivante, recharger la page courante, arrêter le chargement. Visualisation des caractères et éléments cachés, aide contextuelle. L A TYPOGRAPHIE Quel est le problème de la police? Lorsque le navigateur de votre visiteur accède à vos pages Web, il ne peut afficher que les polices qui se trouvent sur son propre système. Que se passe-t-il alors lorsque la police choisie n'est pas disponible sur la machine du visiteur? La page s'affiche avec la police par défaut du navigateur (généralement le Times New Roman sur les systèmes Windows et le Times sur les systèmes MacOS). Il n'y a pas dix mille solutions à ce problème. Pour les pages Web utilisez des polices dont il est à peu près certain qu'elles seront disponibles chez tous les visiteurs.

12 9 De plus, la configuration du navigateur peut aussi modifier l aspect des pages. En effet, si le navigateur utilise ses polices par défaut plutôt que celle prévues par la page, l affichage sera bien différent. M ISE EN FORME DU TEXTE Dans Microsoft FrontPage, vous pouvez mettre le texte en forme comme avec un logiciel de traitement de texte, pour le structurer et renforcer son impact visuel. Vous pouvez changer la police et modifier sa taille, son style et sa couleur, modifier l'espacement et la position verticale du texte, ainsi qu'ajouter des effets comme le soulignement. Vous pouvez également contrôler l'espacement et les retraits, ajouter des puces et des numéros, et définir l'alignement. Par exemple, vous pouvez mettre en forme le corps du texte normal avec la police Times New Roman 10 points et, pour les titres de page, choisir la police en gras Arial 16 points et le centrage sur la page. Texte et paragraphes La mise en forme que vous appliquez peut affecter les mots sélectionnés ou tout un paragraphe. Les propriétés de police s'appliquent au texte sélectionné et les propriétés de paragraphe (y compris les puces, la numérotation, les bordures et la trame) affectent des paragraphes entiers. Par exemple, vous pouvez mettre en italique un seul mot d'un paragraphe, mais si vous essayez d'aligner le mot à droite, le paragraphe entier sera aligné. Un paragraphe est un bloc de texte séparé d'un autre par une marque de paragraphe : ou des lignes de texte séparées par des sauts de ligne forment un seul paragraphe. Pour obtenir la marque de paragraphe, utilisez la touche Retour. Pour obtenir le saut de ligne utilisez les touches Majuscule+Retour. Vous pouvez afficher les marques de paragraphe et les sauts de ligne en cliquant sur le bouton Afficher tout. Définir la police d'un texte Vous pouvez définir la police du texte sélectionné en choisissant le nom, le style, la taille et la couleur de la police. Vous pouvez également appliquer divers effets au texte, comme le barré et les petites majuscules. 1. En mode Page, sélectionnez le texte à mettre en forme de la façon suivante : Menu Format Police. 2. Dans l'onglet Police, mettez le texte en forme en sélectionnant des options dans les zones Police, Style de police, Taille et Couleur. Vous pouvez aussi sélectionner une ou plusieurs options sous Effets. La zone Aperçu montre à quoi ressemble le texte avec vos paramètres.

13 10 Ajouter des bordures à un texte Vous pouvez ajouter des bordures à un texte, puis définir des propriétés comme le style, la couleur, le remplissage et la largeur de la bordure. Par exemple, le style de la bordure de ce paragraphe est double. Quand vous ajoutez une bordure, elle est appliquée à un paragraphe entier. Par exemple, si vous appliquez une bordure à un mot sélectionné, elle est appliquée à tout le paragraphe. Si vous sélectionnez deux paragraphes puis que vous appliquez une bordure, chaque paragraphe aura une bordure. Si le texte est séparé par des sauts de ligne plutôt que par des marques de paragraphe, le texte est traité comme un seul paragraphe et n'aura qu'une bordure. 1. En mode Page, sélectionnez les paragraphes auxquels vous voulez ajouter une bordure. 2. Dans le menu Format Bordure et trame.

14 11 Pour ajouter une bordure à quatre côtés, sous Type, cliquez sur Encadré. Définissez les propriétés de la bordure en cliquant sur des options des zones Style, Couleur et Largeur. Pour créer une bordure personnalisée, sous Type, cliquez sur Personnalisé. Une bordure personnalisée peut avoir des bordures sur certains côtés, et chaque côté peut avoir un style, un couleur et une largeur différents. Dans la zone Style, cliquez sur un Style de bordure. Vous pouvez aussi cliquer sur des options des zones Couleur et Largeur. Sous Aperçu, appliquez la bordure à un ou plusieurs côtés en cliquant sur les côtés du diagramme ou sur les boutons. Pour spécifier les marges intérieures (la distance entre le texte et sa bordure), entrez une valeur en points sous Marges, dans les zones Haut, Bas, Gauche et Droite. Ajouter une trame à un texte Vous pouvez ajouter une trame à un texte. À l'instar de l'arrière-plan d'une page, une trame peut être une couleur ou une image. Ainsi, vous pouvez ajouter une trame pour mettre un paragraphe en valeur comme dans l'exemple. Quand vous ajoutez une trame, elle est appliquée à un paragraphe entier. Par exemple, si vous appliquez une trame à un mot sélectionné, elle sera appliquée à la totalité du paragraphe. Le

15 12 texte séparé par des sauts de ligne plutôt que par des marques de paragraphe est traité comme un seul paragraphe. 1. En mode Page, sélectionnez les paragraphes auxquels vous voulez ajouter une trame. 2. Dans le menu Format Bordure et trame, puis sur l'onglet Trame de fond. 3. Pour définir une couleur d'arrière-plan pour le texte sélectionné, choisissez une couleur dans la zone Couleur d'arrière-plan. 4. Pour définir la couleur du texte sélectionné, sélectionnez une couleur dans la zone Couleur de premier plan. 5. Pour définir une image d'arrière-plan pour le texte sélectionné, tapez le nom et l'emplacement de l'image dans la zone Image d'arrière-plan ou cliquez sur Parcourir pour localiser et sélectionner l'image. 6. Définissez les propriétés de l'image d'arrière-plan : Pour spécifier la position verticale et horizontale de l'image dans le paragraphe sélectionné, cliquez sur les options appropriées des zones Position verticale et Position horizontale.

16 13 Dans la zone Répétition, cliquez sur une option pour spécifier comment vous voulez placer l'image sous le texte sélectionné. Par exemple, pour la placer horizontalement, cliquez sur Horizontale. Dans la zone Attachement, cliquez sur une option pour indiquer si l'image d'arrièreplan doit être fixe par rapport à la fenêtre du navigateur, ou si elle doit défiler avec le document. Supprimer la mise en forme d'un texte Vous pouvez supprimer rapidement la mise en forme que vous avez appliquée au texte. Cette opération entraîne le rétablissement des paramètres par défaut du style du texte. 1. En mode Page, sélectionnez le texte. 2. Dans le menu Format Supprimer la mise en forme. L ES BARRES D OUTILS On détermine, avec les options du menu Affichage, quelles sont les barres d'outils à afficher. Il est possible de déplacer, à l'aide de la souris, une barre d'outils. Celle-ci prend alors la forme d'une fenêtre et peut être placée en un endroit quelconque de l'écran.

17 14 L ES PROPRIÉTÉS DE LA PAGE On accède à la boîte de dialogue Propriétés de la page par le menu Fichier Propriétés ou par le menu contextuel. Les propriétés seront appliquées à la page entière. Onglet Général Adresse : Titre : Adresse de base : Fond sonore : rappel de l'adresse de la page. titre de la page. Ce titre n'est pas affiché par le navigateur, mais il est souhaitable de placer ici une suite de mots clés significatifs quant au contenu de la page. De plus, FrontPage identifie les pages par leur titre et non par le nom de fichier. chemin d'accès par défaut (facultatif). il est possible de donner ici l'adresse d'un fichier son (wav, midi,...), audible dès chargement de la page (navigateurs Microsoft uniquement). Le titre d'un fichier Le titre d'un fichier non pas son nom s'affiche dans la barre de titre de la plupart des navigateurs Web. Il est aussi important pour les Favoris et les Signets des navigateurs. Il est possible de modifier le titre d'un fichier sans modifier son nom.

18 15 1. Dans le menu Fichier Propriétés Onglet Général. 2. Dans la zone Titre, tapez le titre de fichier que vous souhaitez afficher dans la barre de titre des navigateurs. Onglet Arrière-plan Dans l onglet arrière-plan, la couleur du fond, du texte et des liens peuvent être modifiés, et cela pour l ensemble de la page. Image d'arrière-plan : adresse d'une image qui se reproduira en mosaïque sur l'arrière-plan de la page, si la case est cochée. Si la case Statique est également cochée, l'image d'arrière-plan restera fixe lorsque la page défilera (navigateurs Microsoft uniquement). Arrière-plan : couleur de fond de page, l'option Par défaut signifie que la couleur sera déterminée par les paramètres courants du navigateur. Texte, Lien, Lien visité, Lien actif : couleurs du texte et des liens suivant leur état.

19 16 Onglet Marges Définir les marges d'une page Vous pouvez définir la taille des marges supérieure et gauche d'une page. 1. Cliquez sur l'onglet Marges de la fenêtre Propriétés de la page. 2. Pour définir une marge supérieure, activez la case à cocher Spécifier la marge supérieure, puis entrez la hauteur de la marge en pixels. 3. Pour définir une marge de gauche, activez la case à cocher Spécifier la marge de gauche, puis entrez la largeur de la marge en pixels. Cette fonction sera visible seulement sur le navigateur Explorer et pas avec Netscape. Ainsi, pour corriger cette situation il faut ajouter des codes de marge. Voici les codes à ajouter : MARGINWIDTH=80 MARGINHEIGHT=80 où 80 est le nombre de pixels. V ALIDATION À L AIDE DES NAVIGATEURS Afficher l'aperçu d'une page dans un navigateur Web Si vous avez installé Microsoft Internet Explorer version 3.0 ou ultérieure sur votre ordinateur, vous pouvez afficher rapidement un aperçu de la page en cours en cliquant sur l'onglet Aperçu en mode Page. Si vous n'avez pas installé Microsoft Internet Explorer version 3.0 ou ultérieure sur votre ordinateur, FrontPage n'affiche pas l'onglet Aperçu. Vous devez alors cliquer sur Aperçu dans le navigateur en mode Page.

20 17 Ajouter un navigateur Web à la liste d'aperçu Vous pouvez afficher un aperçu de vos pages dans tout navigateur Web installé sur votre ordinateur. Microsoft FrontPage introduit automatiquement tous vos navigateurs dans la liste des navigateurs dont vous disposez pour afficher un aperçu de pages. Pour ajouter manuellement un navigateur à cette liste, utilisez la procédure suivante : 1. En mode Page, ouvrez la page à visualiser. Au menu Fichier Aperçu dans le navigateur. 2. Si le navigateur que vous souhaitez utiliser pour cet aperçu ne figure pas dans la liste Navigateur, cliquez sur Ajouter. 3. Dans la zone Nom, tapez le nom du navigateur tel que vous voulez le voir apparaître dans la liste d'aperçu. 4. Dans la zone Commande, tapez le nom et le chemin d'accès du fichier exécutable du navigateur, ou cliquez sur Parcourir pour retrouver l'emplacement de ce fichier. 5. Pour supprimer un navigateur Web de la liste, sélectionnez-le puis cliquez sur Supprimer. C ONCEVOIR UN SITE W EB POUR DES NAVIGATEURS SPÉCIFIQUES Microsoft FrontPage vous permet de préparer votre site Web de manière à garantir sa compatibilité avec des navigateurs et des technologies spécifiques. Par exemple, vous pouvez concevoir un site Web qui sera compatible tant avec Microsoft Internet Explorer qu'avec Netscape Navigator, ou bien avec tous les navigateurs de version 3.0. Si vous créez un site Web pour qu'il soit compatible avec des technologies ou des versions de navigateurs spécifiques, certaines commandes que ces technologies ou versions ne prennent pas en charge ne seront pas disponibles (elles apparaîtront en grisé) dans les menus de FrontPage au cours des opérations. 1. Dans le menu Outils Options de page et cliquez sur l'onglet Compatibilité.

21 18 2. Dans la zone Navigateurs, sélectionnez les navigateurs souhaités. 3. Dans la zone Versions de navigateur, sélectionnez les versions de navigateur voulues. Pour orienter votre site Web vers des technologies ou des fonctionnalités plutôt que vers des navigateurs, cliquez sur Personnaliser puis, dans la zone Technologies, sélectionnez ou non les cases à cocher relatives aux technologies ou fonctionnalités spécifiques que vous voulez activer ou désactiver. Le tableau à la page suivante répertorie les technologies et fonctionnalités prises en charge par défaut pour chaque navigateur. Si vous choisissez de passer outre ces paramètres et activez une technologie ou une fonctionnalité non prise en charge par un type ou une version de navigateur, le contenu de vos pages risque de ne pas s'afficher correctement ou de contenir des erreurs.

22 19 Navigateur Version de navigateur Contrôles ActiveX VBScript JavaScript Applets Java HTML dynamique Cadres CSS 1.0 CSS 2.0 Internet Explorer 4.0 et ultérieure activé activé activé activé activé activé activé activé Internet Explorer 3.0 et ultérieure activé activé activé activé désactivé activé activé désactivé Netscape Navigator 4.0 et ultérieure désactivé désactivé activé activé activé activé activé activé Netscape Navigator 3.0 et ultérieure désactivé désactivé activé activé désactivé activé désactivé désactivé Internet Explorer et Navigator 4.0 et ultérieure désactivé désactivé activé activé activé activé activé activé Internet Explorer et Navigator 3.0 et ultérieure désactivé désactivé activé activé désactivé activé désactivé désactivé Si vous choisissez Netscape Navigator, les commandes et les paramètres indiqués ci-dessous ne seront pas disponibles : Texte défilant (menu Insertion, sous-menu Composant) Vidéo (menu Insertion, sous-menu Image) Image d'arrière-plan d'un tableau (menu Tableau, sous-menu Propriétés, commande Tableau) Arrière-plan et bordures d'une cellule (menu Tableau, sous-menu Propriétés, commande Cellule) Case à cocher Clignotant (menu Format, commande Police) C ONCEVOIR UN SITE W EB POUR DES SERVEURS SPÉCIFIQUES Microsoft FrontPage vous permet de préparer votre site Web de manière à garantir sa compatibilité avec des serveurs spécifiques. Par exemple, vous pouvez concevoir un site Web qui sera compatible avec Microsoft Internet Information Server version 3.0 ou toute version ultérieure. Si vous créez un site Web pour qu'il soit compatible avec un serveur spécifique, les commandes qui ne sont pas prises en charge par ce serveur ne seront pas disponibles (elles apparaîtront en grisé) dans les menus de FrontPage au cours des opérations d'auteur. 1. Dans le menu Outils, Options de page puis cliquez sur l'onglet Compatibilité.

23 20 2. Dans la zone Serveurs, sélectionnez le serveur souhaité. 3. Si vous choisissez serveur Apache, les pages ASP sont désactivées par défaut. 4. Pour orienter votre site Web vers un serveur utilisant les extensions serveur FrontPage, sélectionnez la case à cocher Activé avec les extensions serveur de Microsoft FrontPage. Si votre serveur n'utilise pas les extensions serveur FrontPage et si vous désactivez cette case à cocher, les commandes ci-dessous ne seront pas disponibles : L ES IMAGES Insérer une image Compteur d'accès (menu Insertion, sous-menu Composant) Formulaire de recherche (menu Insertion, sous-menu Composant) Champ de confirmation (menu Insertion, sous-menu Composant) Vous pouvez ajouter une image issue d'un de vos fichiers situés sur le disque dur. Les images peuvent provenir de fichiers aux formats suivants : GIF (standard et animé), JPEG (standard et progressif), BMP (Windows et OS/2), TIFF, TGA, RAS, EPS, PCX, PNG, PCD (Kodak Photo CD) et WMF. Au moment d'enregistrer la page, Microsoft FrontPage vous invite à enregistrer l'image sur votre site Web. Si cette image n'est pas au format GIF ou JPEG, elle est convertie en GIF (si elle comporte moins de 256 couleurs) ou en JPEG (si elle comporte plus de 256 couleurs). 1. En mode Page, placez le point d'insertion à l'endroit où vous souhaitez insérer l'image. 2. Cliquez sur Insérer une image ou au menu Insertion image à partir du fichier.

24 21 3. Recherchez le fichier de l'image souhaitée dans votre arborescence de fichiers en local puis sélectionnez-le. Vous pouvez spécifier le type du fichier recherché dans la zone Type de fichier. Redimensionner une image Tous les types de graphismes, que ce soient des images, des images GIF animées ou des séquences vidéo, peuvent être redimensionnés. Il suffit de changer leurs propriétés de hauteur et de largeur, ou de les redimensionner directement sur la page. Le redimensionnement d'une image modifie les balises HTML qui indiquent au navigateur Web comment afficher l image ; le fichier physique de l image reste inchangé. Envisageons la situation où vous cherchez à réduire le temps de téléchargement d'une page contenant une image très volumineuse. Si vous vous contentez de redimensionner l'image, elle s'affichera dans une zone plus petite à l'écran de l'internaute, mais la taille du fichier image et le temps de téléchargement ne seront pas pour autant réduits. Pour diminuer la taille du fichier et le temps nécessaire au téléchargement de l'image, vous devez rééchantillonner l'image, que nous verrons plus tard, après l'avoir redimensionnée. Il est possible de redimensionner une image directement à l'écran en cliquant dessus pour voir ses poignées de redimensionnement et les faire glisser. Pour conserver les proportions du graphisme, faites glisser une des poignées d'angle. Si vous faites glisser une poignée latérale, le graphisme est inévitablement déformé. Il est aussi possible de modifier l image à partir des propriétés de la façon suivante : 1. En mode Page, cliquez sur l image avec le bouton droit, cliquez sur Propriétés de l'image dans le menu contextuel puis sur l'onglet Apparence. 2. Activez la case à cocher Spécifier la taille. 3. Si vous souhaitez conserver les proportions (rapport entre la largeur et la hauteur), activez la case à cocher Conserver les proportions. Si vous activez cette case à cocher puis entrez une valeur en pixels dans la zone Largeur ou Hauteur, Microsoft FrontPage change automatiquement la valeur dans la zone non renseignée pour conserver les proportions du graphisme.

25 22 4. Indiquez si vous souhaitez changer la taille en pixels ou en pourcentage et entrez des valeurs dans les zones Largeur et Hauteur. Positionnement d une image Voici les principaux éléments que l on retrouve dans la boîte de dialogue Propriétés de l image pour le positionnement : Haut : Milieu : Bas : Gauche : Droite Espacements : le texte se place en haut de l image l image se place au milieu du texte le texte se place en bas de l image le texte se place à gauche le texte se place à droite a pour effet de réserver un espace autour de l'image dans lequel aucun texte ne sera inscrit Une image se comporte comme un caractère quelconque, il est donc possible de définir son alignement horizontal avec les outils de la barre d outils Mise en forme. Définir les propriétés d'une image GIF ou JPEG Vous pouvez choisir les propriétés à appliquer aux images GIF et JPEG. Pour une image GIF, vous pouvez autoriser la définition d'une couleur transparente ou choisir que l'image soit entrelacée (c'est-à-dire qu'elle s'affiche avec le maximum de détails au fur et à mesure de son téléchargement). Pour une image JPEG, vous pouvez choisir la qualité et le nombre de passes progressives. Plus vous choisissez un niveau de qualité bas, plus vos images seront compressées et plus la taille des fichiers image sera réduite. Le nombre de passes progressives désigne le nombre de passes qu'un navigateur Web effectue pour afficher complètement une image au cours de son téléchargement. 1. En mode Page, effectuez l'opération suivante : 2. Pour définir les propriétés d'une image, cliquez sur l'image puis sur Propriétés de l'image dans le menu contextuel.

26 23 3. Dans l'onglet Général, effectuez l'une des opérations suivantes : 4. Si l'image est au format GIF, vous pouvez spécifier si l'image peut être entrelacée en sélectionnant Entrelacé. Si une couleur transparente a été définie, la case à cocher Transparent est activée (vous pouvez supprimer cette couleur transparente en désactivant cette case à cocher). 5. Si l'image est au format JPEG, vous pouvez spécifier la qualité de l'image JPEG en entrant une valeur comprise entre 1 et 100 dans la zone Qualité. Dans la zone Passes progressives, entrez le nombre de passes progressives que vous voulez que les navigateurs Web effectuent. Certains navigateurs Web ne prennent pas en charge les passes progressives. Pour définir les propriétés d'une image d'arrière-plan, cliquez sur la page avec le bouton droit et cliquez sur Propriétés de la page dans le menu contextuel, puis cliquez sur l'onglet Arrière-plan et sur Propriétés. Pour définir les propriétés d'une image d'arrière-plan figurant dans un tableau ou une cellule, cliquez dessus avec le bouton droit puis sur Propriétés du tableau ou Propriétés de la cellule dans le menu contextuel et enfin sur Propriétés.

27 24 Convertir une image au format GIF, JPEG ou PNG Vous pourrez être amené à convertir une image au format GIF, JPEG ou PNG. Par exemple, pour définir une couleur comme transparente dans une image JPEG, vous devrez d'abord convertir l'image au format GIF. 1. En mode Page, cliquez sur l'image avec le bouton droit, puis cliquez sur Propriétés de l'image dans le menu contextuel. 2. Dans l'onglet Général, effectuez l'une des opérations suivantes : Pour convertir l'image au format GIF, cliquez sur GIF. Si vous souhaitez afficher une image la plus détaillée possible au fur et à mesure de la progression de son téléchargement, sélectionnez Entrelacé. Vous ne pouvez pas définir de couleur transparente dans cette boîte de dialogue, mais vous pouvez désactiver la case à cocher Transparent si vous ne voulez pas créer de couleur transparente dans l'image. Pour convertir l'image au format JPEG, cliquez sur JPEG. Vous pouvez aussi spécifier la qualité de l'image JPEG en entrant une valeur comprise entre 1 et 100 dans la zone Qualité. Plus la valeur est élevée, moins le taux de compression est élevé et plus la

28 25 taille du fichier reste grande. Dans la zone Passes progressives, vous pouvez indiquer le nombre de passes qu'un navigateur Web effectue pour afficher complètement une image au cours de son téléchargement. 3. Pour convertir l'image au format PNG, cliquez sur PNG. Définir les propriétés de bordure d'une image Vous êtes libre d'ajouter une bordure à une image, une image GIF animée, un clipart ou une vidéo. Si un lien hypertexte est associé par défaut à une image, Microsoft FrontPage ajoute automatiquement une bordure à une image pour indiquer aux visiteurs du site qu'ils peuvent cliquer sur ce graphisme. Vous pouvez choisir l'épaisseur de la bordure, ou si vous ne souhaitez pas faire apparaître de bordure du tout, vous pouvez la supprimer. Par défaut, la bordure est de couleur noire. Toutefois, si le graphisme comporte un lien hypertexte par défaut, la bordure reprendra les couleurs spécifiées pour les liens hypertexte (ces couleurs sont définies dans la boîte de dialogue Propriétés de la page). 1. En mode Page, cliquez sur le graphisme avec le bouton droit, cliquez sur Propriétés de l'image dans le menu contextuel puis cliquez sur l'onglet Apparence. 2. Dans l'onglet Épaisseur de bordure, entrez une valeur indiquant l'épaisseur de la bordure en pixels. Pour supprimer toute bordure, tapez la valeur 0.

29 26 Les principales fonctions de la barre d outils image Lors de l insertion d une image la barre d outils images apparaît immédiatement et lors de la sélection d une image elle réapparaît automatiquement. Si elle n apparaît pas il est possible de l afficher au menu Affichage Barres d'outils Images. Pour déplacer une barre d'outils vers un autre emplacement de votre espace de travail, cliquez sur le titre de la barre concernée puis faites-la glisser vers son nouvel emplacement. Voici les principales fonctions se retrouvant sur la barre d outils : Faire pivoter une image Vous pouvez faire pivoter une image de 90 degrés dans le sens des aiguilles d'une montre ou dans le sens inverse des aiguilles d'une montre. 1. En mode Page, cliquez sur l'image. Si vous voulez faire pivoter l'image placée en arrièreplan, il n'est pas nécessaire de la sélectionner au préalable. 2. Dans la barre d'outils Image, cliquez sur Faire pivoter à gauche pour faire pivoter l'image de 90 degrés dans le sens inverse des aiguilles d'une montre. Cliquez sur Faire pivoter à droite pour la faire pivoter de 90 degrés dans le sens des aiguilles d'une montre. Retourner une image Vous pouvez retourner entièrement une image dans le sens horizontal (l'image est ainsi renversée) ou dans le sens vertical (l'image apparaît comme dans un miroir). 1. En mode Page, cliquez sur l'image. Si vous voulez retourner l'image placée en arrièreplan, il n'est pas nécessaire de la sélectionner au préalable. 2. Dans la barre d'outils Image, cliquez sur Retournement vertical pour renverser l'image. Cliquez au contraire sur Retournement horizontal pour obtenir une image miroir. Modifier le contraste des couleurs dans une image Vous pouvez facilement augmenter ou diminuer le contraste d'une couleur dans une image pour la rendre plus nette par exemple. 1. En mode Page, cliquez sur l'image. Si vous voulez changer le niveau de contraste de l'image placée en arrière-plan, il n'est pas nécessaire de la sélectionner au préalable. 2. Dans la barre d'outils Image, cliquez sur Augmenter le contraste pour accroître le contraste de l'image. Cliquez sur Diminuer le contraste pour, au contraire, diminuer le niveau de contraste.

30 27 Modifier la luminosité d'une image Il vous est possible d'augmenter ou de diminuer la luminosité d'une image. 1. En mode Page, cliquez sur l'image. Si vous voulez changer le degré de luminosité de l'image placée en arrière-plan, il n'est pas nécessaire de la sélectionner au préalable. 2. Dans la barre d'outils Image, cliquez sur Augmenter la luminosité pour accroître la luminosité de l'image. Cliquez sur Diminuer la luminosité pour, au contraire, réduire la luminosité. Rogner une image En procédant au rognage d'une image, vous pouvez supprimer les parties de l'image qui ne vous intéressent pas. Le rognage permet aussi de changer les proportions de l'image, en la rendant plus étroite par exemple. 1. En mode Page, cliquez sur l'image. 2. Cliquez sur Rogner dans la barre d'outils Image. Un cadre de rognage apparaît sur l'image. 3. En cliquant sur le cadre et en faisant glisser ses poignées, redimensionnez le cadre de façon à n'y inclure que la partie de l'image que vous souhaitez conserver. Pour dessiner le cadre de rognage vous-même, cliquez en dehors du cadre mais à l'intérieur de l'image et dessinez le cadre. 4. Cliquez de nouveau sur Rogner pour supprimer la partie visible en dehors du cadre de rognage. Définir une couleur comme transparente dans une image Vous pouvez choisir une couleur de l'image et la définir comme transparente, ainsi chaque fois que cette couleur sera utilisée, elle laissera voir l'arrière-plan par transparence. Une seule couleur transparente peut être définie pour chaque image. Si vous choisissez une couleur transparente pour une image dans laquelle une couleur transparente est déjà définie, cette couleur transparente initiale perd sa qualité de transparence. Au moment de l'enregistrement de la page, Microsoft FrontPage vous invite à enregistrer l'image au format GIF (même si l'image d'origine est au format JPEG car le format JPEG ne prend pas en charge la transparence). Si FrontPage convertit l'image à partir d'un format d'image différent du format JPEG, le nombre de couleurs contenues dans l'image risque d'être réduit et la taille du fichier correspondant risque d'augmenter. 1. En mode Page, cliquez sur l'image. 2. Dans la barre d'outils Image, cliquez sur Définir la couleur comme transparente. 3. Cliquez sur la couleur de l'image que vous souhaitez définir comme transparente.

31 28 Convertir une image en noir et blanc Vous pouvez simplement convertir une image en noir et blanc (en niveaux de gris). 1. En mode Page, cliquez sur l'image. Si vous voulez convertir les couleurs de l'image placée en arrière-plan, il n'est pas nécessaire de la sélectionner au préalable. 2. Dans la barre d'outils Image, cliquez sur Noir et blanc. Ajouter une bordure en relief à une image Il peut être utile d'ajouter une bordure en relief à une image pour lui donner un aspect tridimensionnel. Cette fonctionnalité convient particulièrement aux images que vous souhaitez utiliser en guise de boutons sur la page. 1. En mode Page, cliquez sur l'image. Si vous voulez appliquer un relief à l'image d'arrièreplan, il n'est pas nécessaire de la sélectionner au préalable. 2. Dans la barre d'outils Image, cliquez sur Relief. Rééchantillonner une image Le rééchantillonnage d'une image consiste à changer la taille de ses pixels pour la faire correspondre à la taille de l'affichage en cours. Par exemple, si vous redimensionnez une image à 50 % de sa taille d'origine, l'image apparaît plus petite sur la page, mais la taille du fichier image n'est pas modifiée. Un tel redimensionnement revient seulement à changer les balises HTML qui indiquent au navigateur Web comment afficher l'image. En revanche, le rééchantillonnage de l'image permet de réduire la taille du fichier image en conséquence. Avant de rééchantillonner une image, vous devez la redimensionner. 1. En mode Page, cliquez sur l'image que vous avez redimensionnée. 2. Dans la barre d'outils Image, cliquez sur Échantillon. Rétablir une image Si vous n'êtes pas complètement satisfait des résultats des différentes modifications que vous avez effectuées (que vous ayez rogné, redimensionné ou fait pivoter l'image, par exemple), vous pouvez annuler toutes ces modifications et revenir à la dernière version enregistrée de l'image ou à l'image telle qu'elle se présentait lorsque vous l'avez ajoutée à la page. 1. En mode Page, cliquez sur l'image. Si vous cherchez à rétablir la version initiale de l'image en arrière-plan, il n'est pas nécessaire de la sélectionner au préalable. 2. Dans la barre d'outils Image, cliquez sur Restaurer.

32 29 I MPACT DES GRAPHISMES SUR VOTRE SITE W EB Augmentation de la taille du site Web Au fur et à mesure que vous ajoutez des graphismes tels que des images, animations ou vidéos aux pages de votre site Web, la taille du site augmente en conséquence. La taille, la qualité, le type et le nombre de graphismes sont aussi des éléments déterminants si votre fournisseur d'accès Internet a posé des limites à l'espace offert pour l'hébergement de votre site Web. Voici comment obtenir des fichiers images moins volumineux : Réduisez la taille d'une grande image en la redimensionnant et en la rééchantillonnant. Le redimensionnement d'une image revient seulement à modifier son mode d'affichage dans le navigateur de la personne en visite sur le site. Ainsi, si vous redimensionnez une image de grande dimension pour qu'elle puisse être affichée dans une plus petite taille, cette opération ne changera pas la taille du fichier image. Pour diminuer la taille du fichier, vous devez rééchantillonner l'image après son redimensionnement. Convertissez l'image au format JPEG et choisissez un niveau de qualité plus bas. Plus ce paramètre est bas, plus la compression est élevée et la taille du fichier réduite. Dans le cas d'une image en haute résolution, effectuez une copie de l'image puis appliquez-lui une résolution plus faible à l'aide d'un programme graphique. Pages dont le téléchargement est particulièrement lent Le téléchargement de certains graphismes peut s'avérer très long, notamment pour les internautes équipés de connexions Internet peu rapides. Voici quelques conseils qui faciliteront le téléchargement des pages chargées de graphismes : Redimensionnez et rééchantillonnez les images volumineuses. Créez une miniature. Une miniature est une version réduite d'une image qui a l'avantage de pouvoir être téléchargée très rapidement. La visualisation d'une miniature sur un site suffit à choisir le téléchargement ou non de la version grandeur nature de cette image. Utilisez la fonctionnalité Miniature qui permet de créer automatiquement une miniature et un lien hypertexte vers l'image d'origine. Affichez une version en basse résolution d'un graphisme pendant que la version finale est en cours de téléchargement. Dans un programme graphique, créez une version en basse résolution d'une image, vidéo, ou GIF animé. Puis, configurez Microsoft FrontPage de manière à ce qu'il affiche cette version pendant le temps de téléchargement de l'image d'origine. Même si cette option ne réduit pas le temps de téléchargement du graphisme, l'internaute de passage sur votre site ne voit pas un écran blanc tout le temps du téléchargement.

33 30 Affichez le texte ALT. On désigne par texte ALT le texte qui figure à la place des graphismes au cours du téléchargement et permet aux visiteurs du site d'avoir un aperçu des éléments qu'ils ne voient pas encore complètement. L ES LIENS HYPERTEXTES Un lien hypertexte établit une connexion d'une page vers une autre destination, qu'il s'agisse d'une autre page ou d'un autre emplacement sur la même page. Le plus souvent, la destination est une autre page Web, mais il peut aussi s'agir d'une image, d'une adresse de messagerie, d'un fichier ou encore d'un programme. Un lien hypertexte peut se présenter sous la forme d'un texte ou d'une image. Lorsqu'un internaute clique sur le lien hypertexte, la destination s'affiche dans le navigateur Web, s'ouvre ou s'exécute selon son type. Par exemple, le lien hypertexte vers un fichier AVI ouvre le fichier dans un lecteur multimédia tandis que le lien hypertexte vers une page affiche la page dans la fenêtre du navigateur Web. L URL Lorsque vous créez un lien hypertexte, sa destination est codée sous forme d'url (Uniform Resource Locator), c'est-à-dire une adresse de la forme ou file://computername/sharedfolder/filename.htm. Un URL se compose d'un serveur Web ou d'un emplacement réseau, d'un chemin d'accès et d'un nom de fichier. Un URL sert aussi à identifier le protocole qui permettra de gérer le fichier, par exemple le protocole HTTP, FTP ou FILE : protocole serveur Web chemin d accès nom de fichier Un lien hypertexte peut être absolu ou relatif : Un URL absolu contient une adresse complète. Un URL relatif comporte une ou plusieurs parties manquantes. Les informations manquantes sont extraites de la page contenant l'url. Par exemple, si le protocole et le domaine sont manquants, le navigateur Web utilise le protocole et le domaine de la page en cours. Il est fréquent que les pages d'un site Web utilisent des URL relatifs ne contenant qu'une partie d'un chemin d'accès ou d'un nom de fichier. Si les fichiers sont déplacés sur un autre serveur, tous les liens hypertextes continueront de fonctionner correctement pourvu que les positions relatives des pages n'aient pas été modifiées. Par exemple, le lien hypertexte de la page Produits.htm pointe vers une page située dans le même dossier, si les deux pages sont déplacées vers le même dossier sur un autre serveur, l'url du lien hypertexte sera toujours correct. Lorsque vous créez des liens hypertextes dans FrontPage, il ne vous est pas indispensable de connaître l'url de destination. Vous pouvez simplement parcourir une page ou un fichier sur un

34 31 site Web, dans une arborescence de fichiers ou sur un site du World Wide Web. FrontPage fournira automatiquement l'url approprié. Lorsque vous créez un lien hypertexte ayant une destination sur le même site Web, FrontPage créera un URL relatif. Si vous renommez ou déplacez un fichier sur un site Web, FrontPage procédera à la mise à jour de toutes les URL pointant vers ce fichier. En générant des URL relatifs, FrontPage vous fait gagner un temps précieux et garantit la portabilité de votre site Web. L affichage des liens hypertextes Un lien hypertexte de texte est un simple texte contenant un mot ou une phrase auquel a été associé un URL de destination. Un lien hypertexte d'image est une image à laquelle un URL de destination a été associé. L'ensemble de l'image peut être associé à un lien hypertexte. Dans ce cas, l'internaute peut cliquer sur une partie de l'image afin d'afficher sa destination. Un bouton est un exemple typique d'image avec un lien hypertexte par défaut. Les liens hypertextes peuvent apparaître de différentes façons à l'écran. Les navigateurs Web soulignent généralement les liens hypertextes de texte et les affichent dans une couleur distincte soit le bleu. Vous pouvez aussi y associer des effets de manière à ce que les liens hypertextes changent d'aspect lorsque le curseur de la souris passe sur ces liens (ils s'affichent dans une autre police, par exemple). Les liens hypertextes ajoutés à une image ne sont pas toujours visibles. Mais il est facile de voir rapidement si une image comporte un lien hypertexte en plaçant le curseur de la souris audessus. Si le curseur change de forme et représente une main pointant l'index, ceci signifie qu'il existe un lien hypertexte. Navigation sur votre site Web. Lorsqu'un internaute ouvre votre page d'accueil, il est essentiel qu'il trouve facilement le moyen de parcourir les autres pages de votre site Web. La plupart des sites utilisent des jeux de boutons ou des liens hypertextes de texte qui permettent d'accéder aux principales pages du site : Accueil *** Actualités *** Table des matières *** Recherche Vous pouvez aussi créer une table des matières de votre site Web en générant une liste des liens hypertextes pointant vers les pages principales. Liens vers d'autres pages, fichiers ou documents. Vous pouvez utiliser les liens hypertextes pour établir des liens avec d'autres pages ou même des images, des fichiers et des documents Microsoft Office. Par exemple, il est facile de créer un lien hypertexte pour afficher une image ou donner accès à une liste de liens hypertextes pointant vers vos sites favoris sur le Web. Création d'un courrier électronique. Vous pouvez créer un lien hypertexte qui ouvrira une fenêtre d'écriture de courrier à l'adresse électronique spécifiée. Par exemple, si vous souhaitez recevoir les commentaires des personnes qui ont pris le temps de visiter votre site, créez un lien qui ouvrira une fenêtre de message adressée à l'administrateur de votre site Web.

35 32 Changer le nom d'un fichier et déplacer des fichiers dans votre site Web À chaque fois que vous renommez un fichier de votre site Web, FrontPage vérifie si le fichier comporte des liens hypertextes. Si tel est le cas, FrontPage met à jour les liens hypertextes en fonction du nouveau nom de fichier. Si vous déplacez un fichier dans votre site Web (vers un sous-dossier par exemple), FrontPage met automatiquement à jour les liens hypertextes du fichier en fonction de son nouvel emplacement. Tester et réparer des liens hypertextes rompus Avant de publier un site Web, il est fortement conseillé de vérifier qu'aucun lien hypertexte n'est rompu et de tester les destinations externes de tous les liens hypertextes. Un lien hypertexte est considéré comme rompu lorsqu'en cliquant dessus, le navigateur Web affiche un message d'erreur indiquant que l'url de destination est incorrect. Vérifiez que l'url a été correctement orthographié ou qu'il ne pointe pas vers une page que vous avez supprimée de votre site Web. Si la destination est une autre page accessible sur le Web, il est aussi possible que cette page ait été déplacée ou supprimée. Pour gérer les liens hypertextes d'un site Web, FrontPage peut servir d'outil de test des liens hypertextes et de compte-rendu de leur état. FrontPage permet aussi de réparer et de mettre à jour rapidement les liens hypertexte rompus. I NSÉRER UN LIEN Avant d'insérer un lien on doit sélectionner un objet de la page, texte, image ou autre, qui supportera ce lien. Sinon le titre ou l'adresse de la page pointée s'inscrira en clair et sera le support du lien. Un support étant sélectionné, on insère un lien avec l'outil ou on fait appel au menu Insertion Lien hypertexte... On obtient alors cette boîte de dialogue :

36 33 Parcourez le site Web à la recherche de la page ou du fichier de destination voulu puis sélectionnez la page ou le fichier. Si la page ou le fichier de destination est situé sur le site en cours, cliquez dessus dans la liste des dossiers, puis faites-le glisser sur la page ouverte dans laquelle vous voulez insérer le lien hypertexte. S il s agit d un lien vers un autre site Web, tapez l adresse dans la zone URL. Les boutons suivants permettent d'accéder à différentes adresses : Le premier bouton permet de sélectionner une page ou un fichier à l'aide de votre navigateur Web; Le deuxième bouton permet de sélectionner un fichier stocké sur votre ordinateur; Le troisième permet de créer un lien hypertexte d'envoi d'un courrier électronique; le quatrième peut créer une nouvelle page web et un lien hypertexte vers celle-ci. Signet : on indique éventuellement ici une ancre de destination. La liste des signets est fonction de la page sélectionnée.

37 34 Modifier un lien Pour modifier un lien, la méthode la plus immédiate est de faire un clic droit sur l'objet supportant ce lien et de choisir Propriétés du lien dans le menu contextuel. Une autre méthode consiste à sélectionner l'objet et à faire appel à l'option Lien hypertexte... du menu Insertion. Dans les deux cas, si le support est une image, celle-ci doit auparavant être sélectionnée de telle sorte qu'elle apparaisse en inversion vidéo. L ES SIGNETS Un signet est un emplacement ou un ensemble de caractères que vous avez repéré sur une page. Vous pouvez utiliser un signet comme destination d'un lien hypertexte, par exemple, dans le cas où vous voulez fournir aux visiteurs de votre site un lien vers un paragraphe spécifique d'une autre page du site. Si vous vous contentez de créer un lien hypertexte vers cette page, le début de la page s'affichera dans le navigateur Web et l'internaute devra lui-même repérer le paragraphe recherché. Pour éviter cela, insérez un signet au début du paragraphe et associez un lien hypertexte au signet. La page s'affiche alors en faisant directement apparaître le paragraphe en haut de la fenêtre du navigateur. Vous pouvez aussi utiliser un signet pour retrouver rapidement un emplacement dans une page au cours de son édition. Par exemple, si vous avez inséré un signet devant chaque titre d'une longue page, vous pourrez facilement y repérer un titre particulier lors de l'édition en recherchant le signet correspondant. Les signets peuvent aussi servir à créer la table des matières d'une longue page. Il suffit de créer un signet pour chaque titre de section de la page. Puis, au début de la page, créez une liste de liens hypertextes pointant vers ces signets. Dans la terminologie de FrontPage une ancre est nommée Signet. Pour insérer une ancre dans une page, on sélectionne une portion de texte, une image, ou on place le point d'insertion à l'endroit voulu, et on appelle l'option Signet... du menu Insertion. S'ouvre une boîte de dialogue dans laquelle on donne un nom à l'ancre à insérer (en évitant les lettres accentuées et les caractères particuliers). La présence de l'ancre dans la page est signalée par du texte souligné en pointillés ou par un petit drapeau. Par contre, rien ne signale l'ancre si elle est attachée à une image. C'est également à cette boîte de dialogue à laquelle il faut faire appel pour effacer une ancre ou se placer dans la partie de la page la contenant.

38 35 N AVIGATION AVEC F RONTP AGE Une connexion Internet étant active, il est possible de consulter un site quelconque. Mais, dans FrontPage contrairement aux autres navigateurs, aucune main avec index levé ne permet d'activer un lien pour charger une autre page. Pour cela il faut, après un clic droit soit sur le lien, soit à gauche de l'image supportant le lien, choisir l'option Suivre le lien... du menu contextuel. Cependant, la façon la plus rapide de vérifier les liens c'est d'utiliser la touche CTRL et de cliquer sur le lien. Pour naviguer dans Front Page : CTRL + clic À noter qu'une page extérieure ainsi chargée peut être modifiée et enregistrée localement, FrontPage proposant alors d'enregistrer également les images. Attention : l'outil recharge la page afin de l'actualiser. L ES T ABLEAUX Comment utiliser les tableaux Un tableau est constitué de lignes et de colonnes de cellules dans lesquelles vous insérez du texte et des graphismes. Vous pouvez utiliser des tableaux dans Microsoft FrontPage de diverses façons. Utiliser des tableaux pour présenter des informations dans un format de tableau Utilisez un tableau pour présenter des informations dans un format de grille, comme des emplois du temps, des informations de produits, des tarifs, etc. Chambre Les tarifs d'hôtel par nuit Hors saison (Jan - Avr) Haute saison (Mai - Déc) Simple Simple + bain Double Double + bain Vous pouvez personnaliser vos tableaux pour les rendre plus attrayants et faciles à lire. Vous pouvez décider de l'apparence du texte dans chaque cellule en sélectionnant l'alignement et la police de caractères, vous pouvez décider de l'espacement entre chaque colonne et chaque ligne dans le tableau, et vous pouvez également définir les couleurs et la trame de fond des bordures. Utiliser les tableaux pour présenter le texte et les graphismes dans un tableau Lorsque vous présentez du texte et des graphismes dans une page, vous pouvez utiliser un tableau afin de les disposer. Les tableaux sont reconnus par pratiquement tous les navigateurs Web et sont faciles à présenter sur vos pages.

39 36 Voici un exemple d'utilisation d'un tableau pour présenter votre page. Ce tableau contient deux rangées et deux colonnes, avec une trame différente afin de pouvoir voir les limites. En utilisant les tableaux de cette manière, vous pouvez facilement présenter du texte et des graphismes dans des colonnes. En utilisant des rangées multiples, vous pouvez faire en sorte que chaque graphisme soit aligné avec un texte d'accompagnement. Quand vous utilisez des tableaux pour la présentation d'une page, vous pouvez éviter que les visiteurs du site voient le tableau en masquant les bordures. Vous pouvez également utiliser des bordures partagées, des cadres et des positionnements en deux dimensions pour présenter vos pages. Chacune de ces fonctions comporte des avantages différents : Les bordures partagées sont utiles lorsque vous voulez que les mêmes articles apparaissent sur chaque page. Par exemple, si vous voulez que le logo de votre entreprise apparaisse en haut de chaque page dans tout votre site Web, vous pouvez utiliser une bordure partagée, en haut de la page, contenant le logo. Cependant, si vous voulez afficher le logo sur une page uniquement, vous pouvez utiliser un tableau à la place. Utiliser les tableaux sans bordures La fonction première des tableaux est la mise en forme de tables de valeurs. Mais ils sont le plus souvent utilisés pour gérer la mise en page : on dispose les éléments dans les cellules d'un tableau aux bordures invisibles, chaque cellule pouvant contenir tout type d'objet. Texte Un tableau peut contenir du texte, des images, des tableaux... Texte Le même tableau, mais dont les bordures ont été rendues invisibles (Taille=0). Insérer un tableau Pour insérer un tableau on clique sur l'outil puis, sans relâcher le bouton, on glisse la souris pour définir visuellement la taille du tableau ou au menu Tableau Insérer Tableau.

40 37 On peut alors fixer les principaux paramètres d'un tableau, tels que le nombre de lignes et de colones, la taille et l'alignement, les attributs de bordure, etc. 1. Dans la zone Lignes, entrez le nombre de lignes désiré. 2. Dans la zone Colonnes, entrez le nombre de colonnes désiré. 3. Dans la zone Alignement, sélectionnez la position du tableau sur une page. 4. Dans la zone Taille de la bordure, entrez la largeur que vous souhaitez pour la bordure du tableau, en pixels. Si vous ne voulez pas de bordure, tapez Pour changer la marge intérieure des cellules du tableau (l'espace entre la bordure d'une cellule et le contenu), entrez un nombre dans la zone Marge intérieure des cellules. 6. Pour changer l'espacement des cellules du tableau (l'espace entre les cellules), entrez un nombre dans la zone Espacement entre les cellules. 7. Pour changer la largeur du tableau, appliquez une des options suivantes : Sélectionnez En pixels, puis tapez la largeur souhaitée pour votre tableau en pixels. Sélectionnez En pourcentage, puis tapez un pourcentage de la largeur de l'écran souhaitée pour votre tableau. Si le tableau doit apparaître dans un cadre, spécifiez un pourcentage de la largeur du cadre. Les propriétés que vous spécifiez pour le nouveau tableau seront utilisées par défaut la prochaine fois que vous créerez un tableau.

41 38 Propriétés d'un tableau La boîte de dialogue Propriétés du tableau s'obtient soit par le menu contextuel après un clic droit dans le tableau, soit par l'option correspondante du menu Tableau si le point d'insertion se trouve dans une de ses cellules. On peut alors définir l'alignement horizontal du tableau, la taille de la bordure, des marges et espacements, et éventuellement diverses couleurs et une image d'arrière-plan (navigateurs Microsoft uniquement). Propriétés des cellules On sélectionne une cellule en plaçant le point d'insertion à l'intérieur. On sélectionne des cellules consécutives en les balayant avec la souris, bouton gauche enfoncé. On sélectionne une ou plusieurs colonnes, ou une ou plusieurs lignes, en plaçant le pointeur de la souris au-dessus, ou à gauche. Dès que le pointeur prend la forme d'une flèche noire, on appuie sur le bouton gauche de la souris, et on la déplace éventuellement. On peut également sélectionner la ligne, la colonne, ou le tableau contenant la cellule courante, avec les options Sélectionner du menu Tableau. Après sélection d'une ou plusieurs cellules, on peut en définir les paramètres dans la boîte de dialogue Propriétés de la cellule, obtenue au menu Tableau Propriétés Cellules.

42 39 Largeur minimum : il s'agit d'une valeur relative à la largeur du tableau. C'est un minimum en deçà duquel le navigateur ne peut réduire la cellule, mais elle peut être plus large si son contenu l'impose. Pour obtenir une disposition précise des cellules d'une ligne, il est nécessaire de fixer la largeur minimum de chacune d'elles, de telle sorte que la somme des valeurs soit égale à 100 % ou à la largeur en pixels du tableau. <Largeur minimum :50% <30%> <20%> Tableau de 400 pixels de large Alignements : c'est l'alignement, horizontal ou vertical, du contenu de la cellule relativement à celle-ci. Cet alignement est indépendant de celui des paragraphes se trouvant dans la cellule. Les attributs Cellule d'en-tête et Pas de renvoi à la ligne, sont interprétés différemment par les navigateurs, à faire attention. Arrière-plan et Couleurs (navigateurs Microsoft uniquement) : les couleurs ne sont pas toujours prises en compte par les navigateurs. L'image d'arrière-plan est reproduite en mosaïque dans la cellule.

43 40 Insérer des lignes et des colonnes Insérer lignes ou colonnes : la ligne ou la colonne s insère à la position du point d'insertion. Positionner le point d insertion et au menu Tableau Insérer Lignes ou colonnes. Insérer cellule : l'effet est immédiat, la cellule insérée se place à droite du point d'insertion. L E TRANSFERT DE LA PAGE SUR LE SERVEUR Le transfert de fichier FTP Le service FTP (File Transfer Protocol) permet de transférer un ou des fichiers d'un ordinateur à un autre en appliquant le protocole du même nom. FTP est donc un service permettant de consulter l'ensemble des fichiers d'un autre ordinateur et d'aller en déposer ou en chercher certains. Chaque ordinateur accessible est appelé un site FTP. Certains sites «FTP anonymes» sont des appareils servant à la diffusion de fichiers et au partage des outils informatiques existant pour tout domaine d'intérêt. Il est ainsi permis d y entrer sans autorisation d accès, soit de façon anonyme. D autres sont accessibles uniquement avec des autorisations d accès fournies par l administrateur du serveur. Le logiciel WS FTP WS_FTP (Windows Sockets FTP Client Application) est un logiciel pour Windows permettant d'effectuer des tâches de transfert de fichiers entre deux ordinateurs distants. Il s'agit d'un logiciel du domaine public recommandé par le SIT. On peut se procurer la toute dernière version sur le site FTP anonyme de l'université Laval (FTP.ulaval.ca) dans le répertoire pc/ftp/ws_ftp ou à l adresse Service en ligne Téléchargement.

44 41 La procédure de transfert Au démarrage du logiciel de connexion FTP, la fenêtre ci-dessous apparaît. La première étape consiste à se relier à l'ordinateur distant. Pour ce faire, il faut d'abord en connaître l'adresse. On peut aussi bien utiliser la forme numérique ( ) que la forme textuelle (FTP.ulaval.ca) de cette adresse. Il s'agit maintenant de compléter l'information demandée. À partir de la figure ci-contre, et en suivant les étapes énumérées ci-dessous vous pouvez vous relier au site FTP anonyme de l'université Laval Voici la description des champs à compléter : Profile Name: c'est un nom descriptif que l'on donne à la configuration utilisée pour se connecter à l'ordinateur distant, information très utile si l'on désire s y relier fréquemment. Il permettra en effet d'éviter de saisir toutes les informations à chaque fois. Le nom peut contenir des espaces, des lettres accentuées, etc. Host Name/Address: c'est l'adresse de l'ordinateur distant. Tel que mentionné précédemment, cette adresse peut être inscrite sous l'une ou l'autre de ces formes : FTP.ulaval.ca ou Host Type: User ID: c'est le type de machine que constitue l'ordinateur distant puisqu il existe différentes sortes d ordinateurs pouvant servir de serveur FTP. Généralement, on laisse le logiciel s'ajuster au bon type d'ordinateur. Pour ce faire, on s'assure que le choix Automatic detect est sélectionné. on doit y saisir le numéro d'utilisateur que l'on possède sur l'ordinateur distant. Si cet ordinateur est un FTP anonyme, c'est-à-dire pour lequel il n'est pas nécessaire d'avoir un numéro d'utilisateur, on peut s'y relier en utilisant le nom d'usager (User ID) anonymous. On doit noter que la majorité des ordinateurs FTP anonymes ne donnent accès qu'à un certain nombre de répertoires, et bien souvent seulement en mode lecture. C'est donc sur ce type de site que l'on retrouve les principaux partagiciels.

45 42 Password: Anonymous : on doit y taper le mot de passe qui correspond au numéro d'utilisateur que l'on possède sur l'ordinateur distant. Si ce dernier est un ordinateur FTP anonyme, on doit entrer notre adresse de courrier électronique, par exemple: [email protected]. cette option doit être cochée lorsqu on désire se relier à un ordinateur FTP anonyme. Il n est pas nécessaire de remplir les options Account : et Comment : Une fois tous les paramètres entrés, appuyez sur le bouton OK afin de lancer la connexion. Lorsqu elle est établie, on aperçoit dans la partie droite de la fenêtre initiale les noms des fichiers et les répertoires situés sur l'ordinateur distant, comme dans la figure ci-dessous. L'écran principal se divise en deux parties : Remote System (partie de droite) : Voici la signification des boutons situés à droite de chacune de ces parties et utiles pour effectuer certaines commandes. ChgDir MkDir permet de se déplacer dans un répertoire précis. permet de créer un répertoire.

46 43 RmDir. permet de détruire un répertoire.* View permet de visualiser le contenu d'un fichier texte. Exec même fonction que la commande Exécuter... du Gestionnaire de fichier de Windows. On peut ainsi décompresser automatiquement un fichier (.ZIP) en le transférant. Rename permet de renommer un ou des fichiers.* Delete permet de détruire un ou des fichiers. * * Cette commande peut souvent être restreinte ou même interdite en ce qui concerne l'ordinateur-cible dans le cas où le site FTP n'offre qu'un accès limité. Rappelons que le transfert de fichiers peut s'effectuer dans les deux sens si les privilèges sur l'ordinateur distant le permettent sinon on ne peut que récupérer l'information. Pour ce faire, il s'agit de suivre les étapes suivantes. Déterminez dans quel sens s'effectuera le transfert de fichiers. On appelle ordinateursource l'ordinateur contenant les fichiers qui seront transférés et ordinateur-cible celui sur lequel on désire transférer le ou les fichiers. Sur l'ordinateur-cible déplacez-vous dans le répertoire où vous désirez recevoir les fichiers. Il s'agit de se déplacer dans le répertoire approprié à l'aide de la souris en double-cliquant sur les noms des répertoires situés dans la fenêtre. Sur l ordinateur-source, sélectionnez les fichiers que vous désirez transférer. Pour sélectionner un ou des fichiers, les commandes de Windows sont fonctionnelles. Sélectionnez le mode de transfert. Les différents modes de transfert sont situés immédiatement sous Local System et Remote System (voir la figure précédente). Il est très important de bien choisir celui qui correspond au type de fichier à transférer. Ainsi, dans le cas d'un transfert de fichier ASCII (fichier texte sans accents), cocher le mode ASCII. Dans le cas de fichiers compressés ou codés, de programmes ou autres, cochez le mode Binary (transfert binaire). C'est d'ailleurs le mode le plus utilisé. Si le type de fichier est inconnu, il est possible d utiliser l option Auto. Afin de lancer le transfert, cliquez sur la flèche située au centre de la fenêtre, qui va de l ordinateur-source vers l'ordinateur-cible.