Passer au contenu

3 – Améliorez la navigation et l’ergonomie

Un site réussi dispose d’une bonne ergonomie, et ses visiteurs ne se perdent pas en naviguant.

1 – Réalisez des miniatures de vos images

Un site se visite d’autant plus facilement que ses pages ne mettent pas trop de temps à s’afficher ; ce qui dépend principalement de la taille des images qu’elles contiennent.Vous pouvez contourner le problème en n’affichant dans vos pages que des miniatures. En cliquant dessus, le visiteur ouvrira une nouvelle fenêtre dans laquelle s’affichera l’illustration en taille réelle. Pour mettre en place ce système, il faut tout d’abord créer la page isolée où se trouveront la photo puis la miniature à placer dans la page principale.

Ouvrez
FrontPage Express
, déroulez le menu Insertion puis Image. Dans la fenêtre, cliquez sur Parcourir puis sélectionnez votre photo. Sélectionnez ensuite Fichier puis Enregistrer et cliquez sur Fichier.
Nommez votre page (photo 1 par exemple). Dans la fenêtre Enregistrer dans, sélectionnez le dossier HTML que vous avez créé et cliquez sur Enregistrer. Fermez le fichier.Lancez votre logiciel de traitement d’images et ouvrez la photo originale. Dans le menu Image, sélectionnez Redimensionner ou Taille de l’image. Là, réglez le format à environ 200 x 200 points ou 2 x 2 cm. Sélectionnez Fichier puis Enregistrer sous et donnez un nouveau nom (photo_miniature, par exemple) à l’image.Revenez à
FrontPage Express
et ouvrez la page où sera placée la miniature de la photo. Placez votre curseur à l’endroit voulu et sélectionnez Insertion/Image. Cliquez sur Parcourir et sélectionnez votre image miniature. Dans votre page Web, cliquez sur cette image avec le bouton droit de la souris et sélectionnez Propriétés de l’imageDans la zone Lien par défaut, tapez l’adresse de la page où se trouve la photo en taille originale, par exemple html/photo1.htm. Ensuite, dans le champ Cadre de destination, tapez _new pour indiquer au navigateur de votre visiteur d’ouvrir la page dans une nouvelle fenêtre. Cliquez sur OK pour valider.Recommencez cette manipulation pour toutes les photos que vous souhaitez voir s’afficher sous forme de miniature sur votre site

2 – Répétez le sommaire en bas de chaque page

Il y a de fortes chances pour que le sommaire de votre site se trouve en haut de vos différentes pages. Il est donc invisible lorsque le visiteur est arrivé au bas de l’une d’entre elles. Voilà pourquoi il est judicieux de remettre à cet endroit une version du sommaire, mais présenté différemment : à l’horizontale.Placez le curseur de votre souris en bas de la page d’accueil et tapez la liste de vos rubriques principales en séparant les items par une barre horizontale (que vous obtenez en appuyant en même temps sur les touches Alt Gr et 6 de votre clavier).Sélectionnez l’ensemble de cette ligne et choisissez la police, sa taille et ses attributs à l’aide des boutons de la barre d’outils Mise en forme affichée en haut de l’écran. Utilisez de préférence la même police que pour le reste de votre site. Centrez ensuite le sommaire grâce au bouton approprié.Nous allons ensuite créer les liens de ce sommaire. Sélectionnez un élément et appuyez sur les touches Ctrl et K ou déroulez le menu Insertion, puis Lien. Cliquez sur l’onglet World Wide Web et, dans le champ URL, tapez le lien menant à la page souhaitée. Par exemple html/votrepage.htm Cliquez sur OK pour valider. Recommencez la même manipulation pour toutes les entrées de votre sommaire.Quand c’est fait, sélectionnez toute la ligne et copiez-la (en appuyant sur les touches Ctrl et C de votre clavier). Ouvrez une à une les pages de votre site et, en bas de chacune d’elles, recopiez votre sommaire (en appuyant sur les touches Ctrl et V).N’oubliez pas de vérifier et éventuellement de changer les liens si la page sur laquelle vous venez de recopiervotre sommaire n’était pas située dans le même dossier que les précédentes

3 – Créez des liens vers la page suivante et la page précédente

Toujours dans le but de faciliter la navigation de vos visiteurs, il est utile de mettre en bas de chaque page un lien vers la page suivante et un autre vers la page précédente.Pour cela, dans FrontPage Express, déroulez le menu Affichage puis cliquez sur HTML. Insérez le petit script ci-dessous dans votre page, à l’endroit souhaité :

Page précédente | Page Suivante

Pour obtenir le symbole | tapez Alt Gr et 6.
Ce script utilise l’historique du navigateur pour fonctionner.

4 – Ajoutez un lien vers votre boîte aux lettres

Pour créer sur votre page d’accueil un lien vers votre boîte aux lettres, ouvrez le fichier index.htm avec FrontPage Express.Placez le curseur de votre souris à l’endroit où vous souhaitez voir apparaître votre lien. Tapez Ecrivez-nous et sélectionnez ces deux mots. Appuyez sur les touches Ctrl et K pour créer un lien hypertexte. Dans la fenêtre qui s’affiche, sélectionnez mailto dans le menu déroulant Type de lien. Dans le champ URL, tapez votre adresse de courrier électronique après l’expression mailto :. Cliquez sur OK et enregistrez votre page.

5 – Créez un bouton vers la page d’accueil

Règle à ne surtout pas oublier : absolument toutes les pages de votre site doivent comporter au moins un lien vers la page d’accueil. La solution la plus simple consiste à placer ce lien en haut de votre sommaire, ou tout simplement sur le logo ou le titre de votre site, qui sera présent sur toutes les pages, au même endroit. Conservez votre page d’accueil (normalement il s’agit du fichier index.htm) ouverte dans FrontPage Express. Pour chaque page de votre site, répétez ensuite la même manoeuvre : ouvrez-la en sélectionnant Fichier/Ouvrir, puis en cliquant sur Parcourir pour retrouver cette page.Sélectionnez ensuite l’élément que vous souhaitez raccorder à votre page d’accueil. Appuyez simultanément sur les touches Ctrl et K de votre clavier pour ouvrir la boîte de dialogue régissant la création de liens hypertextes.Choisissez parmi les pages ouvertes qui vous sont proposées celle correspondant à votre page d’accueil (vous la repérerez par son titre) et cliquez sur OK pour valider.

🔴 Pour ne manquer aucune actualité de 01net, suivez-nous sur Google Actualités et WhatsApp.


Fabrice Auclert et Emmanuel Genty