3 - LES ÉLÉMENTS DE L'ARCHITECTURE
3.3 - Navigation intuitive et adaptée
• 3.3.2 - Où a-t-on rangé ma boussole ?
• 3.3.4 - Quelques services
• 3.3.5 - Les moteurs de recherche
• 3.3.6 - Oups, quel pavé cette page !
• 3.3.7 - Et si j'ai l'habitude de naviguer avec mon navigateur...
[ Cette section 3.3 est divisée en deux fichiers : lisez donc aussi son introduction dans la première partie ]
3.3.4 - Quelques services
Voyons maintenant les différents types de visiteur. Une navigation bien conçue permet de "servir" la même information de manière différente, par un accès personnalisé, adapté à chaque besoin. Les pages décrites ici ne sont pas à proprement parler des rubriques, mais plutôt des services rendus par votre site web pour faciliter l'accès à l'information qu'il contient : voilà pourquoi je ne les ai pas mentionnées précédemment.
Celui qui vient pour la première fois aura besoin d'un peu d'explications, sur vous mais aussi sur votre site. Proposez-lui d'entrée de jeu une visite guidée ou un sommaire commenté, sous la forme d'un texte accessible depuis la page d'accueil, qui décrit, en mots et en liens, le contenu du site. Commentez-y la division en grandes rubriques du site et de la barre de navigation : l'effort de compréhension de sa logique en favorisera les premiers efforts de mémorisation. D'autres associations proposent un plan de leur site, mais c'est plus difficile à réussir, et parfois assez incompréhensible : à mon avis, un tel plan est plus utile au lecteur connaissant le site et ayant oublié où il avait précédemment trouvé l'information qu'il cherche (23). De toutes façons, pour le néophyte comme pour le curieux, proposez un "retour au sommaire" dans votre navigation générique plutôt qu'un retour à la page d'accueil, si celle-ci n'est pas très parlante sur le contenu du site.
Vous pouvez élaborer au fil du temps une FAQ (frequently asked questions, ou "foire aux questions", pour les francophones) : c'est une liste des questions que vous voyez revenir souvent par le courrier électronique, et auxquelles vous décidez de répondre. Vous êtes libre de déterminer les thèmes abordés, qui peuvent concerner aussi bien le site que les activités de l'association.
D'autres lecteurs reviennent régulièrement pour profiter d'un service du site, pour consulter une rubrique mise à jour régulièrement comme celle votre journal, par exemple : il peut être judicieux de créer un lien direct vers cette rubrique, si vous attendez beaucoup de visiteurs ou voulez la mettre en valeur, soit depuis la page d'accueil, soit dans la navigation générique.
Une autre information qui intéressera sûrement les lecteurs récurrents, c'est la rubrique "Quoi de neuf ?", dans laquelle vous proposez les nouveautés du site classées de manière rétrochronologique (la plus récente en haut), avec un lien direct vers la page présentée. Attention, cette page est assez lourde à maintenir (il faut penser à elle souvent, et surtout ne pas la laisser dépérir).
Proposez votre liste de diffusion (avec un texte qui en précise le contenu, la fréquence, comment s'abonner et comment se désabonner), la page de contacts avec l'assocation (listes des adresses e-mails des différents responsables), la page de liens intéressants et, si votre association gère une liste de discussion, regroupez-en les archives sous la forme de pages web intégrées à votre site.
3.3.5 - Les moteurs de recherche
Ils ne sont pas indispensables : comme le sommaire, ils ne doivent pas pallier une navigation indigente, mais ils sont de plus en plus fréquents, sur les sites assez grands, et de plus en plus utilisés. C'est aussi un service : ils satisfont les lecteurs recherchant une information précise, dans le cas de sites très mobiles et souvent remis à jour, ou bien regorgeant d'informations pointues. Pour bien des questions posées par e-mail et résolues par des informations figurant sur votre site, vous pourrez renvoyer vos lecteurs au moteur de recherche. Si vous trouvez l'outil très utile, pensez à l'intégrer à la barre de navigation générique, ou à le mettre bien en évidence sur la page d'accueil.
Il vous faudra l'avis de votre fournisseur d'hébergement (il en a sans doute quelques-uns en réserve, parmi lesquels vous devrez sélectionner le plus adéquat) et l'aide d'un informaticien-web, si vous en connaissez, pour choisir le moteur de recherche, son interface, sa complexité, la formulation des résultats, les rubriques qu'il analyse, la méthode d'indexation (24). Le problème avec les moteurs de recherche consiste principalement, pour l'utilisateur, en formuler sa demande : proposez donc rapidement un texte simple et clair expliquant l'utilisation du moteur. Créez aussi une page spéciale pour le cas où la recherche ne donne aucun résultat : proposez alors une "autre recherche" et/ou une "aide à la recherche". Pensez enfin à "habiller" les pages de résultats et d'aide avec le graphisme de votre site, et n'oubliez pas d'y placer votre barre de navigation et autres signes distinctifs du site.
Pour en finir avec cette liste de services, la tendance actuelle (année 2001) consiste en proposer deux navigations clairement distinctes sur le plan graphique, l'une menant vers le contenu, l'autre vers les services.
3.3.6 - Oups, quel pavé cette page !
Si la page est longue (plusieurs écrans), proposez, en guise de navigation locale, un mini-sommaire de la page, tout en haut, avec des liens sous forme texte qui mènent directement ailleurs dans la même page (25). Insérez aussi, tous les 2 ou 3 paragraphes (espacer d'une hauteur de deux écrans, environ), des "retours" sous forme de petits pictos très légers :
ou 
,
par exemple,
qui mènent tout en haut de la page, à l'espace contenant la barre de navigation.
Rajoutez une barre de navigation en bas. L'utilisation de "frames" vous épargne cette peine, en laissant accessible la barre de navigation à tout moment de la consultation, mais ils ont quelques inconvénients expliqués plus loin, au par. 3.3.8.
3.3.7 - Et si j'ai l'habitude de naviguer avec mon navigateur...
Les navigateurs proposent des outils de navigation que vos lecteurs ont l'habitude d'utiliser. Sachez en profiter et les utiliser au mieux :
- deux "échelles" permettent de faire défiler la page horizontalement ou verticalement : dans le cas d'une page très longue, proposez en plus, de temps en temps (tous les deux écrans, par exemple) un lien qui permette de retourner directement au haut de la page, à la barre de navigation (voir les exemples donnés au par. précédent) ; on ne devrait par contre jamais avoir à utiliser l'échelle horizontale pour lire la fin de vos lignes, c'est que vous avez prévu trop large ;
- le bouton "back" ("précédent") vous fait revenir à la page visualisée antérieurement : si vous décidez d'utiliser des "frames" , il se peut que cette fonction ait des résultats tout à fait aléatoires (voir par. suivant) ;
- le menu "Aller" permet de retourner à une étape antérieure de la visite du site ou du web, en visualisant l'historique de la session grâce à la liste des titres des pages visitées ;
- les "signets" (bookmarks), eux, conservent le titre d'une page : soignez donc vos titres ! Une page = un titre, clair et pas trop long, entre 20 et 30 signes maximum ;
- le nom du fichier de destination s'affiche en bas de l'écran lorsque l'on passe le curseur sur un lien : on a vu un temps un Javascript remplacer cette indication par un texte fixe ou (pire) déroulant. Or, ce nom de fichier indique où l'on va (si l'on sort du site, par exemple, ou au contraire s'il s'agit d'une référence interne à la page) : c'est donc une indication utile sur le temps de chargement ;
- les liens sont de deux couleurs, selon leur état (visités ou non visités) : veillez à ce que celles-ci soient clairement distinctes (non seulement en teinte - rouge ou vert - mais aussi en luminosité - sombre ou claire).
3.3.8 - Les "frames"
Depuis la deuxième version de Netscape, vous avez la possibilité de diviser votre écran en frames ("multi-fenêtrage", en français, mais c'est un peu long). Certains navigateurs ne les reconnaissent pas, comme Netscape 1, Mosaic ou Lynx. Pendant un temps, cette innovation a fleuri sur le web : j'ai même vu un site avec sept frames différents sur une même page ! C'est une technique qui ne devrait être utilisée qu'à bon escient ; elle déconcerte les lecteurs peu habitués, occasionne des résultats incertains lorsqu'on utilise la commande "back", n'offre pas directement le code source du panneau visualisé, perturbe certains moteurs de recherche dans l'indexation de vos pages, gêne l'impression de la page affichée, empêche de placer des signets (ou favoris)... Lorsqu'on place un signet sur la page, ou lorsqu'un moteur de recherche référence le texte, seul le frame avec le texte concerné est rappelé à l'écran : du coup, le lecteur obtient une page sans navigation, puisque le lien avec le frame contenant celle-ci n'est pas inclus.
L'engouement semble un peu passé, actuellement. Les frames offrent certes une solution pratique pour la visualisation permanente de la barre de navigation : mais est-ce bien la peine de consacrer en permanence à celle-ci près d'un quart de l'écran ?
Certains sites sont aussi plus simples à organiser avec un frame. Si vous prévoyez par exemple de changer souvent les rubriques, il vaut mieux modifier une fois le panneau du sommaire, plutôt que de devoir rechercher et remplacer les barres de navigation sur toutes les pages. Dans les autres cas, réfléchissez soigneusement. Prenez en compte par exemple la ou les personnes qui seront chargées de tenir le site à jour : les frames sont un peu complexes et délicats à manier, pour des non-professionnels.
Les frames offraient également l'avantage de diviser clairement l'écran en espace de navigation et espace d'information. Vous pouvez reproduire cet effet en réalisant une barre de navigation verticale, près du bord gauche, avec de simples tables, et l'installer sur une bande de couleur, par exemple, l'isolant ainsi visuellement du reste de la page.
Pour en terminer avec cette approche de la navigation, un bon exercice : testez votre navigation en créant des profils de lecteur-type, dont vous avez déterminé les besoins, et vérifiez que chacun trouve rapidement son bonheur.
Complétez cette section :
- Pour plus de précisions sur le contenu d'une FAQ, cf. par. 4.4.2 - La FAQ
- Les listes de diffusion sont abordées dans le par. 2.6 - Les listes de diffusion et dans le par. 4.4 - Contact avec les lecteurs
- Ne créez pas un site web trop large pour l'écran ou l'imprimante de vos lecteurs : cf. par. 2.2 - Accès universel et par. 5.3.1 - Pour une impression efficace
- Pour rédiger vos "titles", voyez le par. 5.3.2 - Les titres
- Pour remplacer l'option des frames, dans le cas d'une navigation générique qui risque de changer, faites comme ce site, utilisez un pré-processeur (cf. par. 2.1.3 - Du côté de chez l'auteur).
- Pour approfondir la présentation de la navigation, voir, dans la partie sur le graphisme, le chapitre 5.1.3 - La hiérarchie.
Notes
(23) Le site du GISTI propose une visite guidée (picto du point d'interrogation, à droite de la barre de navigation), un plan du site simple et clair (proposé dans la barre de navigation de la rubrique "Bienvenue") et un moteur de recherche (picto de la loupe, à droite de la barre de navigation). Remarquez en passant que les deux pictos menant au moteur de recherche et à la visite guidée, sont clairement différenciés de la barre de navigation, par leur forme, tout en étant proches (voir par. 5.1.3 - La hiérarchie) :
http://www.gisti.org
(24) Pour ma part, j'utilise HTDIG, un logiciel libre et gratuit, parfait pour un petit site :
http://www.htdig.org
(25) Encore une jolie balade dans un musée, à Quimper cette fois. Un sommaire clair, en 2e page, puis une navigation locale sur les pages de rubrique, et une petite flèche pour remonter vers le haut. Dommage que le site soit conçu sur une trop grande largeur...
http://www.mairie-quimper.fr/musee/htdocs/home.htm