Le tableau suivant récapitule les préconisations pour chaque critère d’ergonomie.
Axe Critère Description Préconisations
Organisation
Catégorisation Choix des différentes catégories.
Par exemple la catégorie association
regroupant les différentes associations dont le site web parle n'a pas l'air d'exister. Elle permettrait de présenter toutes les
associations de la même manière. D’autres catégories sont à rajouter.
Il faut repérer les différentes tâches effectuées sur le site et les répertorier sous l'organisation par tâche. Voir la Figure 18. Tâches les plus effectuées sur mines-saint-etienne.org
Il faut trouver tous les publics du site et les catégoriser. Un début de catégorisation peut être : « ELEVES », « ANCIENS », coexister mais il faut que leur séparation soit claire.
Les menus de navigation doivent bien séparer visuellement les différentes organisations. Le menu principal peut avoir plusieurs barres avec chaque barre de liens dédiée à un type d'organisation. Une séparation au niveau de la couleur de fond du menu peut aussi être efficace.
Structure hiérarchique
Les relations entre catégories sont-elles pertinentes ? La hiérarchie est-elle trop large et/ou trop profonde ?
Il faut repenser la hiérarchie en intégrant les nouvelles catégories. Etaler la structure sur les pages (la page d'accueil notamment) est aussi un bon moyen de permettre à l'utilisateur de voir rapidement où il veut aller.
Classification
Répartition du contenu dans les différentes catégories.
La nouvelle catégorisation se fera selon le contenu donc la bonne classification de celui-ci devrait en découler.
Lors de la nouvelle catégorisation il faudra choisir des noms pertinents et non ambigus.
S’inspirer d’autres sites.
Style
Style consistant : utilisation de majuscule, ponctuation, etc.
C'est principalement des décisions à prendre comme mettre tout en majuscule, utiliser des accents, etc. et appliquer ces règles de façon cohérente.
Présentation
La police de caractère, sa taille, couleurs. Le groupement visuel
pertinent de plusieurs noms Idem
Syntaxe
Utilisation de verbes, de nom ou de question. Cohérence de la
syntaxe. Idem
Granularité
Plusieurs noms qui se voient groupé doivent faire partie du
même niveau hiérarchique. Le design du menu doit refléter la hiérarchie.
Public
Le nommage est-il compris par tous les utilisateurs ? Certains termes sont-ils spécifiques à certains types de publics ?
Il faudra faire attention au niveau de la navigation par public au vocabulaire compris par chaque type de public.
Navigation
Globale
Même navigation sur toutes les pages. Liens vers l'accueil, présence de la fonction recherche.
Choisir les liens prépondérants en utilisant les données de la Figure 21. Sections du site les plus utilisées. Utiliser des icônes évocatrices.
Locale
Navigation adaptée à chaque section du site.
Peut être vraiment utile pour naviguer des grosses sections du site, plutôt que d'aller explorer le menu principal. Permet aussi d'alléger ce dernier.
Nicolas Girard 28 Contextuelle
Navigation à l'intérieur du contenu et liens qui ont une relation avec contenu.
Clarifier la cible des liens (interne/externe entre autre). Ne pas utiliser des liens de type
« cliquer ici »
Sitemap
Plan du site web permettant à l'utilisateur d'accéder rapidement aux quelques premiers niveaux
de la hiérarchie. Mettre le sitemap dans un « fat footer »
Repérage
L'utilisateur doit savoir où il se trouve dans le site à tout moment.
Breadcrumb plus visible. Utiliser les menus principaux et locaux en mettant en évidence dans quel onglet on se trouve. Donner un titre à chaque page. Donner une URL lisible par un humain.
Flexibilité
Possibilité de naviguer le site latéralement : de passer
directement d'une branche de la hiérarchie à une autre.
Si pertinent peut être utilisé et préciser la cible des liens (interne/externe entre autre). Ne pas utiliser des liens du type « cliquer ici »
Recherche
Contenu indexé
Quelle partie du site est-t-il possible de rechercher ? Qu'est ce qui est utilisé pour indexer un contenu ? (titre, date de
publication, tags, ...)
Les événements devraient être rajoutés à l’indexation.
Il peut être utile de modifier un peu ces champs de recherche par exemple pour
« pays » et « continents » Correction
orthographique
Permet une marge d'erreur de la part de l'utilisateur
Peut être utilisé pour le nom et le prénom de l'annuaire.
Algorithme phonétique
Permet par exemple lors de la rechercher d'un nom d'obtenir tous les noms se prononçant de
la même façon. Utiliser « Soundex » par exemple
Racinisation
Transformation des mots en leur radical pour une recherche plus large.
Elargir la recherche par ce moyen est toujours utile.
Vocabulaire contrôlé et Thésaurus
Permet d'ajouter des synonymes
dans la recherche. Idem
Liste d'options
Permettre de rechercher les options pour y accéder plus rapidement. Donner la possibilité de sélectionner plusieurs options.
Résultats représentatifs pour les utilisateurs qui savent ce qu’ils veulent. Résultats
descriptifs pour les autres. Mettre en évidence les termes recherchés dans les résultats permet de parcourir plus rapidement ceux-ci.
Ajouter la date des news dans les résultats.
Nombre de résultats
Le nombre de résultats à afficher sur une page doit être adapté à la situation (nombre de résultats total, taille de chaque résultat, taille de l'écran, etc.).
Etendre ce qui a été fait pour l'annuaire à toutes les fonctions de recherches.
Navigation
Navigation des résultats. Boutons
« suivant », « précédent », numéro actuel de la page, etc.
Ajouter ces fonctions à la recherche globale.
Permettre d'accéder directement à une page de résultat.
Ordre
L'ordre peut être déterminé par tri ou par classement.
Donner la possibilité de modifier l'ordre.
Possibilité aussi de filtrer les résultats, notamment pour la recherche globale.
Groupement
Les résultats peuvent être groupés selon un ou plusieurs critères pour faciliter leur navigation.
Donner la possibilité de modifier le
groupement. Etendre ce qui a été fait pour la recherche globale à toutes les fonctions de recherches.
Nicolas Girard 29 Autocomplétion
Donne des propositions
complétant le début de recherche
de l'utilisateur. Peut être implémenté sur le site.
Le formulaire disponible sur la page des résultats
Permet à l'utilisateur de modifier rapidement sa recherche et de savoir ce qu'il vient de rechercher et les options qu'il a choisi.
Disposer le formulaire en haut de la page et laisser défiler les résultats ensuite plutôt que de les mettre côte à côte.
Adaptabilité
Tailles de police lisibles
Une police trop petite peut rendre sa lecture difficile. La taille de police devrait aussi s'adapter à la taille de la fenêtre d'affichage.
Augmenter les tailles de polices et utiliser des unités relatives comme « em »
Taille du contenu adapté
La taille du contenu devrait être adaptée à la taille de la fenêtre d'affichage.
Mettre à jour le progiciel NetAnswer. Utiliser des règles CSS adaptées à chaque dimension de fenêtre d'affichage.
Dimensionnem ent des éléments tactiles
Les liens et boutons doivent être assez grands et espacés pour pouvoir cliquer dessus de
manière tactile. Grossir ces zones et les espacer.
Configuration de la fenêtre d'affichage
Cette configuration évite que les appareils mobiles génèrent la page comme sur un ordinateur de bureau mais la redimensionne à l'écran de l'appareil, ce qui rend le contenu très petit.
Mettre à jour le progiciel. Rajouter un tag meta du type « <meta name=viewport
content="width=device-width, initial-scale=1"> »
Figure 28. Tableau récapitulatif des préconisations
Nicolas Girard 30