Amis créas, à quelles guidelines vous fiez-vous ?

17 octobre 2012,
par Romy Têtue

Mots-clefs associés à cet article :

À quoi se référer pour créer un site ergonomique et accessible ? Quels principes adopter en phase de création graphique pour préserver l’ergonomie et l’accessibilité de l’interface web ? Quels exemples suivre ? Quelles consignes communiquer à nos amis créas ?

C’est une question qui me taquine depuis longtemps, puisque j’avais commencé à lister, dès 2007, quelques fondamentaux à garder en mémoire dans la conception d’une maquette de site dans cet article : Memo de la maquette web, qui traite des éléments de l’interface web (hyperliens, textes, formulaires, etc.) en s’appuyant sur quelques consignes de référence en la matière.

Cinq ans après, je vous invite à un atelier pratique sur le même sujet, samedi prochain à Paris Web : Petit florilège de bonnes pratiques graphiques. Pour le préparer, commençons par lister les ressources existantes et voyons celles que vous utilisez.

Quels référentiels pour la conception web ?

Il existe quantité de ressources graphiques sur le Web et je fais confiance à mes amis créas pour savoir où chercher l’inspiration. Rappelons seulement cet article incontournable du designer Douglas Bowman, qui nous partage le cheminement d’une création de design web : Les coulisses d’un design (2003).

Après quoi nous avons été plusieurs à rédiger des conseils à l’intention des graphistes web pour « éviter de se retrouver avec des charniers inexploitables en intégration, chose qui arrive encore un peu trop souvent » :

Mais cela concerne surtout la constitution du livrable, essentiellement PSD, alors qu’il pourrait être HML/CSS/JS, et ne traite pas vraiment la phase de conception. Ce n’est pas suffisant.

Bref, quelles lignes directrices suivre pour pour préserver l’ergonomie et l’accessibilité de l’interface web ? Il existe des documents de référence, des listes de critères et bonnes pratiques, plus ou moins connus.

Commençons par les bonnes pratique qualité :

Pour l’ergonomie on utilisera :

Pour l’accessibilité, c’est assez simple puisque nous disposons des guidelines du W3C, utilisables sous la forme de plusieurs documents :

Lequel de ces référentiels utilisez-vous ?

Mais tous ces documents, essentiellement textuels, sont peu maniables voire parfaitement assommants. Peu visuels, ils ne me semblent pas adaptés pour les profils créas. Lesquels utilisez-vous réellement ? Vous pouvez répondre en commentant ci-après et en participant au sondage (terminé) dont les résultats sont affichés ci-dessous :

  1. Photoshop Etiquette, évidemment !
    42 % (8 votes)
  2. Les principes ergo : loi de Fitts, Gestalt, etc.
    37 % (7 votes)
  3. Les bonnes pratiques design d’Opquast
    37 % (7 votes)
  4. Notice d’accessibilité pour la conception graphique
    21 % (4 votes)
  5. Nul besoin de cela !
    16 % (3 votes)
  6. Autres : « Emil Ruder », « Et les principes d’UX aussi ! »
    11 % (2 votes)
{#TITRE,#URL_ARTICLE,#INTRODUCTION}

Vos commentaires