ANNEXES
Annexe 1 - Comment marche l'Internet ?
Annexe 2 - Qui fait quoi dans l'Internet ?
Annexe 3 - Ergonomie sur le web
• 1 - Introduction
• 2 - Recommandations
Annexe 4 - Document de conception-réalisation de ce site
Annexe 5 - Accès des sites web aux handicapés
Annexe 3
Ergonomie sur le web
Ergonomie sur le web
Introduction
Je présente ci-dessous ma version résumée des résultats de recherches effectuées à l'INRIA (1), en 1998, sur l'ergonomie des sites web.
L'ergonomie est la science qui étudie comment faciliter, grâce à une conception judicieuse, l'utilisation par l'humain d'objets manufacturés, de machines. Les exemples désopilants développés par Donald A. Norman (2) montrent qu'elle se niche au plus profond de notre quotidien : une porte qui refuse de s'ouvrir parce qu'on persiste à la tirer au lieu de la pousser, un robinet d'hôtel qui ébouillante parce qu'on ne comprend pas comment ajouter de l'eau froide, un téléphone aux fonctions aussi multiples qu'obscures, un magnétoscope qui refuse obstinément d'enregistrer, à la bonne heure, le programme de la bonne chaîne... Autant d'objets quotidiens qui ont été mal conçus, créant par là un rapport à l'utilisateur semé pour ce dernier d'incertitudes, d'incompréhension voire de rancœur...
Encore heureux qu'aucun publicitaire n'ait jamais songé à vous vendre ce magnétoscope en vous promettant une relation intuitive et interactive avec l'engin ! Or, c'est la ligne adoptée pour la promotion de l'Internet, afin de minimiser l'appréhension du commun des mortels face à l'ordinateur, bien compréhensible pour tous ceux qui ont eu à s'en servir, sans formation et sans soutien, dans le cadre de leur profession. Je persiste à affirmer, pour ma part, que l'utilisation fructueuse de l'Internet est loin d'être simple, et qu'elle nécessite, comme tout apprentissage d'une technique complexe, aide, conseils, explications, tâtonnements et expérience. Et puis, sur le web, il y a de bons sites, clairs et accueillants, et d'autres où une chatte ne retrouverait pas ses petits.
Ceci étant posé, vous comprenez pourquoi il vous faut être particulièrement vigilant : votre site, pour pouvoir être visité sans peine et avec le maximum de profit, doit posséder un certain nombre de qualités, qui toutes concourrent à ce que sa découverte soit, pour votre lecteur, la plus simple, la plus sûre et la plus bénéfique possible, en terme d'acquisition d'informations.
Dans cette perspective, les qualités, ou les défauts, d'un site web sont mesurables grâce à une série de critères. Certains d'entre eux proviennent de vingt années d'études sur les ordinateurs et leurs logiciels (vous trouvez que le succès est plutôt mitigé, en terme de convivialité avec l'engin qui occupe la moitié de votre bureau ?). D'autres sont spécifiques au web, et se basent sur l'étude, souvent empirique, du comportement du visiteur face à un nouveau site. Le panel de testeurs constitué tient bien sûr compte des différents niveaux de connaissance et de pratique du web, et des variations d'équipement (machine, logiciels, connexion). Les ergonomes pratiquent plusieurs types de tests, dont les deux suivants qui me semblent faciles à réaliser :
- "l'exploration libre commentée" : le visiteur se promène à son gré sur le site, et exprime à voix haute ses plaisirs et déceptions. On peut aussi envisager une balade à deux, avec une discussion plus naturelle entre les deux utilisateurs. Dans tous les cas, l'auteur du site doit se situer un peu en retrait, pour ne jamais interférer dans la navigation et pouvoir prendre note des appréciations et des suggestions. Au mieux, il pourra demander à l'utilisateur ce qu'il pense trouver derrière telle icône de navigation ou tel lien.
- l'exécution de tâches réelles : l'auteur demande à son testeur de trouver une information précise sur le site. Il mesure combien de temps et d'actions sont nécessaires, note quelles erreurs et quelles difficultés ralentissent la recherche, et si celle-ci est couronnée de succès.
Les critères qui suivent sont donc autant de recommandations à l'aune desquelles vous mesurerez l'efficacité de votre site. Lisez sans inquiétude : l'ergonomie est une science de la vie quotidienne, qui vient à la rescousse de l'utilisateur en expliquant que c'est l'objet qui est mal conçu, et non l'humain irrémédiablement obtus et maladroit. Vous serez certainement surpris par l'aspect "bon sens" des recommandations, et pourtant... Si tous les sites "professionnels" obéissaient à ces conseils, la visite du web serait réellement le jeu d'enfant qu'on nous promet, et non l'appréhension du labyrinthe visité sans fil ni Ariane.
J'ai repris ici la classification de l'INRIA, et, pour chacun des critères, j'ai résumé son but et ses moyens. Les applications pratiques qui en découlent sont déjà intégrées aux divers chapitres de cet ouvrage, mais il m'a semblé intéressant de les regrouper en une annexe à part, afin qu'elles vous fournissent, lorsque votre site est déjà bien avancé, un tableau synthétique de vérification, un filtre différent d'appréciation. A vous de juger si certaines de ces recommandations ne s'appliquent pas de manière plus spécifique à votre site et aux performances que vous tenez à proposer à vos lecteurs.
2 - Recommandations
1. Guidage
Ce terme regroupe l'ensemble des moyens mis en œuvre pour conseiller, orienter, informer le lecteur et l'inciter à effectuer certaines actions. En effet, pour être à l'aise, le lecteur doit savoir à tout moment où il est, ce qu'il peut faire et quelles sont les conséquences de ses actions, sans avoir à mémoriser trop d'informations liées à la structure du site. Il doit également pouvoir demander de l'aide. La mission du concepteur consiste en guider le lecteur vers des actions spécifiques, lui indiquer les choix possibles propres à lui faire découvrir l'information, lui éviter perte de temps et sensation d'égarement.
A ce premier groupe de recommandations appartiennent :
- la présence obligatoire, sur chaque page, d'un certain nombre d'informations : le nom du site ou de l'association, le nom de la rubrique visitée (titre de la page), la barre de navigation, un accès au sommaire, à la page d'accueil, les crédits, un e-mail pour prendre contact ; penser à proposer, si nécessaire, une brève table des matières de la rubrique visitée ;
- la rigueur dans l'utilisation des liens : choix judicieux des mots qui les proposent, bonne intégration de ces mots dans le texte, redondance entre ces mots, et le titre et le contenu de la page obtenue lorsqu'on clique sur le lien ; penser à indiquer le poids du fichier de destination, s'il est volumineux ;
- une judicieuse rédaction des titres (titles) des pages, afin que le lecteur puisse les utiliser pour se repérer dans l'historique de sa consultation ;
- des explications limpides pour l'utilisation du moteur de recherche ;
- l'organisation visuelle des informations : le graphisme soutient et renforce les distinctions entre les informations, car il permet d'en rapprocher ou au contraire d'en séparer les éléments en utilisant des critères de localisation (proches/éloignés), de format (grand/petit ; rond/carré), d'apparence (semblables/différents) ;
- la lisibilité : pas de sentiment de confort sans une lecture facile pour l'œil. Eviter les italiques et les majuscules pour le texte ; soigner le contraste entre la couleur de celui-ci et celle du fond ; éviter les lignes de texte trop longues, les textes clignotants ou défilants...
2. Charge de travail
Plus les éléments présentés à l'écran sont compréhensibles, plus l'attention nécessaire pour comprendre et maîtriser la navigation est réduite, plus l'interaction avec le site est rapide et efficace, et moins il y a de risques d'erreur ou d'égarement.
Parmi les critères réduisant la charge de travail :
- la concision : soignez les noms de rubrique, réduisez le nombre d'éléments d'une liste, organisez vos textes en paragraphes courts (un paragraphe = une idée)...
- la brièveté des opérations menant à un résultat : évitez à votre lecteur d'avoir à redimensionner les frames ou la fenêtre, permettez-lui de trouver des pages informatives à deux (maximum trois) clics de la page d'accueil, aidez-le avec une navigation locale dans les pages longues...
- la densité d'information ne doit être ni trop élevée, ni trop basse : évitez les informations inutiles ou distrayantes, l'accumulation de liens, les pages trop longues ou vides d'informations...
3. Contrôle
Le lecteur doit garder le contrôle de ses actions. Il ne faut pas, dans le but d'accélérer l'exécution des tâches, que vous cherchiez à anticiper ses choix pour les réaliser à sa place. Laissez-lui une marge de décision. Par exemple, conservez l'option "annuler" sur les formulaires, indiquez le poids d'un fichier à charger, surtout s'il est lourd, permettez-lui d'arrêter le défilement d'une animation, de couper la petite musique...
4. Adaptabilité
C'est la capacité du site à répondre aux besoins, aux préférences et au niveau d'expérience de différents types de lecteurs. Il faut travailler à proposer plusieurs modes d'accès aux mêmes informations, prévoir une démarche pour les nouveaux venus (explication du site, "visite guidée") et une autre pour les habitués (rubrique type "quoi de neuf sur le site", raccourci menant directement, depuis la page d'accueil, vers une info intéressante...).
5. Gestion des erreurs
Si certaines actions sur votre site peuvent entraîner des fautes de manipulation, pensez à rédiger avec soin les messages d'erreur. Ils doivent être clairs, indiquer une solution possible, et ne pas décourager le lecteur. Evitez donc de l'insulter... Vous pouvez avoir à rédiger ces messages lorsque votre site utilise des frames, et que le navigateur de votre lecteur ne peut les gérer : il faut alors aiguiller ce dernier avec tact vers la version "no frame". Idem pour les javascripts, que certaines versions des navigateurs ne reconnaissent pas. Autre exemple : si votre lecteur lance une recherche et n'obtient aucune réponse, votre moteur doit pouvoir lui proposer une nouvelle recherche, une lecture attentive de son mode d'emploi, un lien vers le plan du site ou son sommaire. De votre côté, réduisez les risques d'erreur : vérifiez périodiquement la validité des liens que vous proposez vers d'autres sites, soignez les redirections si les URLs de vos pages ont changé. Et prévenez vos lecteurs avec une page d'explication, si vous décidez de fermer votre site.
6. Cohérence
Afin de faciliter l'apprentissage du fonctionnement, veillez à la stabilité de la structure des pages, tant au niveau du graphisme que du contenu. Les choix graphiques et conceptuels doivent être maintenus tout au long du site. Autrement dit : dans le même contexte de recherche ou de navigation, une série d'actions effectuées sur un même type de page donnera les mêmes résultats. Par exemple, toutes les rubriques s'ouvrent sur une page explicative, de navigation, qui mène vers des pages informatives, à contenu. La mise en page aussi doit être stable, tout particulièrement en ce qui concerne la formulation et l'emplacement de la navigation, mais c'est également valable pour les repères de localisation (où suis-je ?) et pour la présentation du texte. Autre exemple : le logo de votre association, placé en haut à gauche et qui ramène vers la page d'accueil, sera à cet endroit sur toutes les pages et aura toujours la même fonction de retour à la même page. D'où l'intérêt de créer rapidement un gabarit par type de page, qui servira à la réalisation de toutes les pages du même groupe.
7. Simplicité des codes
Les symboles, quels qu'ils soient, doivent être compréhensibles afin de ne pas ralentir la compréhension du site, la mémorisation de sa structure et l'acquisition de l'information. Soignez le choix des icônes, le nom des rubriques ; évitez les abréviations, les termes techniques peu familiers au grand public. Pensez aux titles qu'on garde dans les signets, et aux noms de fichiers qui apparaissent lorsque le curseur passe sur un lien : tous doivent être signifiants (ce n'est pas toujours possible pour les noms de fichiers sans qu'ils soient trop longs, mais faites un effort).
8. Compatibilité
Elle est de deux types :
- site/lecteur
- site/autres applications, environnement informatique.
Dans le premier cas, pensez aux caractéristiques spécifiques du lecteur (ses habitudes, son âge, ses attentes, ses facultés), telles que vous avez pu les cerner.
- Certains sont daltoniens : vérifiez que le contraste entre vos couleurs est suffisant, en passant votre écran en noir et blanc. Prenez en compte les détails techniques permettant aux handicapés visuels de naviguer sur votre site.
- D'autres désactivent le chargement d'image, pour aller plus vite.
- Dans le moteur de recherche, proposez de n'effectuer la recherche que sur une partie du site.
- Pour l'impression, proposez une version intégrale du texte, et non morcelée en plusieurs pages : c'est plus lourd à télécharger (vous indiquerez le poids du fichier), mais plus simple d'imprimer un seul document qu'une multitude de pages. Votre gabarit, si vous utilisez des tables de mise enpage à colonnes fixes, aura évidemment une taille permettant son impression (535 pixels de largeur).
Dans le deuxième cas, il s'agit de veiller à ce que votre site s'adapte à tout type d'environnement (petit écran ; impression du texte sur une petite imprimante en noir et blanc ; connexion de mauvaise qualité ou très onéreuse ; avant-dernière version du système d'exploitation...).
Notes
(1) Ces recherches m'ont aimablement été communiquées par Dominique Scapin, directeur du laboratoire de psychologie ergonomique pour l'informatique de l'INRIA (Institut national de recherche en informatique et automatique). Vous en trouverez un excellent résumé dans le cours de l'INRIA : "Créer et maintenir un service Web" (voir en bibliographie > Conception > Ergonomie).
(2) Voir en bibliographie > Conception > Ergonomie.