Utilisabilité et objectifs utilisateurs

L’utilisabilité est la capacité d’un système à permettre à un utilisateur de réaliser efficacement ses objectifs ; elle revêt différentes réalités. Un site difficile à utiliser se traduit par des pertes d’activité. Les différents points abordés servent de base à la réflexion pour améliorer l’expérience Web.

Une bonne ergonomie aboutit à une expérience satisfaisante à différents niveaux :

• La recherche simple et avancée
• L’organisation de l’information et la navigation
• La typographie et la lisibilité
• L ’écriture web
• La présentation d’un contenu informatif
• La présentation des éléments de la page
• La technologie et les besoins des utilisateurs

Il y a plusieurs éléments à prendre en compte qui seront différents en fonction du site, de la cible et des objectifs.

1. La recherche simple et avancée

La recherche est une fonctionnalité qui doit être disponible sur un site qui compte plus de 100 pages.
La recherche est utile pour les personnes qui savent exactement ce qu’elles cherchent et utilisent les termes de recherches appropriés.

L’interface de saisie de la recherche simple :

• Champ de saisie de 30 caractères.
• Bouton “rechercher” pour lancer la recherche.
• Localisation du champ de saisie en haut à droite de la page et répétition du champ de saisie sur chaque page du site.

La recherche avancée :

• La recherche avancée est souvent cause d’échec, car peu de personnes l’utilisent correctement : faut-il l’intégrer ?
• La recherche avancée est présentée sur une page différente avec toutes les explications d’utilisation.
• L’utilisation des guillemets pour faire une recherche sur une chaîne de texte littérale est la seule fonctionnalité avancée pratiquée correctement.

La page de résultats ou SERP (Search Engine Result Page) :

• La liste de résultats s’affiche sur une nouvelle page par ordre de priorité.
• Chaque résultat de recherche commence par un titre cliquable riche en mots clés.
• Le titre est suivi d’un résumé de 2 ou 3 lignes qui développe le titre sans le répéter.
• Les résultats ne sont pas numérotés ni suivis de taux de pourcentage de pertinence.
• La requête de l’utilisateur est répétée dans la case de recherche standard du site en haut à droite de sorte que l’utilisateur puisse reformuler sa requête.
• La page de résultats peut également proposer une fonction de vérification de l’orthographe sous forme de lien du style “essayez avec cette orthographe” ; elle se situe en tête des résultats.
• Si aucun résultat ne correspond à la requête, une page d’informations s’affiche :
  1. La page mentionne qu’aucun résultat n’a été trouvé.
  2. Elle répète la requête et propose à l’utilisateur de la modifier.
  3. Une explication suggère des modifications ou donne des conseils explicites pour corriger les erreurs courantes.
  4. Elle propose un lien de correction orthographique du type de Google : essayez avec cette orthographe.

2. L’organisation de l’information et la navigation

L’organisation du contenu ou l’architecture de l’information doit répondre aux besoins de l’utilisateur et non de la sociét :

• La structure de l’information répond aux attentes du clienten termes de :
  1. schéma de navigation,
  2. réalisation des objectifs,
  3. langage et termes de recherche.
• La navigation est cohérente, prévisible, standard et non redondante.
• Les intitulés des liens sont informatifs, ils débutent par des mots clés.
• Les liens sont facilement identifiables et respectent les conventions.
• Les menus déroulants sont utilisés avec parcimonie.
• La page d’accueil propose des raccourcis vers les 4 ou 5 fonctions les plus utilisées par les utilisateurs.

3. La typographie et la lisibilité

Pour être lu, un texte doit être lisible.
Comment véhiculer une information intelligible :

• Police traditionnelle de 10 points au minimum – 12 à 14 pour les sites destinés aux seniors.
• Police standard (Verdana, Arial, etc.) au format normal : l’italique se lit difficilement.
• Police sans sérif – les bâtons sont sans empattements – pour une lecture plus rapide : Verdana par exemple.
• 3 polices différentes au maximum.
• 4 couleurs différentes au maximum sur une page.
• Disponibilité de la fonction d’agrandissement pour la taille de police dans le navigateur.
• Contraste entre la couleur de la police et le fond : le texte noir sur fond blanc offre le meilleur contraste.
• Fond clair.
• Evitement de graphiques mobiles et de texte déroulant.
• Pas de texte sous forme graphique :
  1. la recherche ne fonctionne pas sur des éléments graphiques,
  2. les graphiques augmentent la taille des fichiers,
  3. l’accessibilité est réduite ne permettant pas l’augmentation de la taille du texte ni la lecture audio,
  4. le texte ne peut pas être sélectionné et recopié dans un nouveau fichier.
• Respect de la casse en évitant l’utilisation excessive de la majuscule, car un texte en majuscule est difficilement lisible (recours aux majuscules uniquement pour des textes courts).
• Aération des textes pour une lecture rapide et une meilleure lisibilité.
• Présentation d’un texte concis et mis en relief : les informations secondaires peuvent éventuellement adopter une police plus petite ou être reléguées à des pages secondaires sous forme de lien hypertexte.

Remarques :
Ne pas utiliser la fonction de lissage ou anticrénelage pour lisser les bords découpés des formes et du texte vectoriels lors de la conception. Le lissage génère du texte flou et alourdit les fichiers.
Priorité à l’accessibilité : l’utilisation de valeurs relatives pour le texte permet d’accroître l’accessibilité en augmentant la taille du texte, on utilisera par exemple 100% au lieu de 10 points.

4. L’écriture web

L’utilisateur cherche de l’information et des réponses.
Devant l’abondance des sites, les utilisateurs optimisent leur temps en parcourant les pages en diagonale à la recherche de contenu utile.
La lecture sur le Web se fait par butinage, il faut adapter l’écriture à ce comportement de lecture.
Comment adopter une écriture en ligne ?

• Rédaction adaptée à la cible.
• Vocabulaire simple (éviter le jargon, les jeux de mots, les acronymes, le verbiage).
• Contenu sensé, factuel par opposition au discours marketing.
• Pyramide inversée : les deux premières phrases d’une page doivent résumer la page, il faut commencer par la conclusion et développer ensuite l’information.
• Mise en forme du texte pour plus de lisibilité:
  1. résumé ou chapeau en 2 lignes,
  2. titres concis et descriptifs commençant par des mots clés,
  3. paragraphes courts (5 lignes) monothématiques,
  4. mots clés en gras,
  5. listes à puces ou numérotées.

5. La présentation d’un contenu informatif

L’information doit être claire, précise, détaillée et complète.

• Un site de commerce électronique doit afficher le prix et mentionner les suppléments : taxes, frais de port, frais de dossier, assurance.
• Le produit est accompagné d’une fiche descriptive détaillée, compréhensible et orientée utilisateur.
• Le visuel représente fidèlement le produit : niveau de détail élevé, angle de vue objectif et pertinent, taille relative, coloris, etc.
• Il est important de hiérarchiser l’informationen présentant les points importants et des liens hypertextes pour aller plus en détail et prendre sa décision d’achat en toute confiance:
  1. détail des produit,
  2. photos, démonstrations, schémas,
  3. foires aux questions,
  4. témoignages,
  5. distinction(s),
  6. garantie,
  7. service après-vente ou maintenance et réparation,
  8. accessoires,
  9. promotions,
  10. disponibilité,
  11. frais supplémentaires et frais de port,
  12. site du fabricant ou coordonnées,
  13. etc.

Un contenu de qualité favorise les ventes si l’on intègre dans ces pages d’informations des publicités ou des liens qui permettent d’acheter des produits ou services utiles.
Pourquoi publier des articles informatifs ?

• L’information à haute valeur ajoutée crée un climat de confiance, apporte crédibilité et démontre sa compétence.
• Un contenu descriptif contient des mots clés qui améliorent la visibilité dans les moteurs de recherche et donc le trafic sur le site.
• La compréhension de l’information aide à la décision du client et donc à l’achat.
• La meilleure compréhension d’un produit ou service permet de déterminer la plus-value par rapport à des produits alternatifs.

6. La présentation des éléments de la page

La page doit présenter beaucoup d’informations dans un espace restreint.

• L’internaute ne fait généralement pas défiler l’écran et ignore souvent le bas d’écran.
  Mieux vaut éviter de faire défiler l’écran à moins de pratiquer la pyramide inversée, soit la présentation de l’information essentielle en introduction.
• Il est préférable de scinder un contenu très long en plusieurs pages HTML et de les relier à l’aide de liens hypertextes.
• L’utilisateur adopte une lecture sélective, il veut optimiser son temps sur le net.
• Eviter :
  1. Les pages surchargées où l’information est noyée.
  2. La présentation non standard de l’information.
  3. Les interactions complexes sans accompagnement.
  4. Les fonctions qu’il ne reconnaît pas et ne sait pas interpréter.
  5. Les processus non linéaires où il se sent perdu.
• L’information doit être regroupée en familles par fonction, type d’activité, produit, etc.
• Le recours à l’espace blanc permet de mettre des éléments en avant et donne une impression d’ordre et de structure en attirant l’œil du visiteur.
• Le site doit répondre aux attentes du visiteur en lui présentant les informations dont il a besoin là où il s’attend à les trouver.

Remarque :
Mieux vaut avoir 4 clics qui mènent l’utilisateur directement à son objectif que les 3 clics prescrits qui impliqueraient une navigation obscure et non intuitive.

7. La technologie et les besoins des utilisateurs

Le multimédia doit être au service de l’utilisateur et s’adapter à celui-ci :

• Respect des normes d’accessibilité.
• Compatibilité des équipements.
• Adaptation à la vitesse de connexion et indication de la progression du téléchargement.
• Présentation d’un contenu alternatif au contenu multimédia pour permettre l’accès au contenu par un large public.
• Rationalisation du recours au multimédia : apporte-t-il une valeur ajoutée, est-il adapté à ma cible ?
• Présentation d’un contenu texte alternatif pour une bonne indexation des moteurs de recherche.
• Respect de l’espace privé de travail: ne prenez pas le contrôle sur l’ordinateur de l’utilisateur en lui imposant votre schéma de navigation et votre technologie.
• Présentation de vidéo interactives, de courte durée (moins d’une minute)
• Simplicité : les visuels doivent apporter une valeur ajoutée au contenu, les éléments conceptuels doivent faciliter la compréhension du contenu.

La simplicité répond aux objectifs de votre public et le site doit répondre à ses attentes.