Vous êtes sur la page 1sur 41

LES FONDAMENTAUX DU WEB ENFIN RUNIS DANS UN LIVRE!

Qualit web est le guide pratique des professionnels du Web. Il prsente la qualit
web et son rle dans lamlioration de lexprience utilisateur (ux). 226 bonnes
pratiques sont dtailles dans des fiches structures et illustres qui facilitent leur
comprhension et leur application. De nombreux outils oprationnels (checklists,
recommandations) viennent complter ces contenus pour faire de cet ouvrage un
outil indispensable au quotidien.
UNE 2 e DITION REVUE ET AUGMENTE
Cette nouvelle dition a t entirement actualise et augmente, avec une
centaine dillustrations supplmentaires, de nouveaux chapitres sur lvaluation
et les enjeux de la qualit web, une structure compltement revue et amliore, et
encore plus de checklists et doutils oprationnels pour monter en comptences et
amliorer les sites.

QUI SADRESSE CE LIVRE?


Aux chefs de projets web et managers qui orchestrent le travail
dquipes pluridisciplinaires.
Aux dveloppeurs, graphistes, ergonomes et designers ux qui
se dotent de comptences transversales.
Aux spcialistes seo qui amliorent le rfrencement naturel.
Aux contributeurs et rdacteurs web soucieux de la diffusion
de leurs contenus.
tous les professionnels du Web actuels et en devenir.
DIRECTEURS DOUVRAGE
lie Slom, prsident fondateur de la socit
Temesis et dOpquast (Open Quality standards), est consultant, auteur, formateur et
confrencier. Il est lorigine du modle VPTCS
et du concept de qualit web. Laurent Denis est
consultant, expert accessibilit et formateur.
Son exprience et ses connaissances encyclopdiques en font lun des meilleurs spcialistes
franais des standards web et de laccessibilit.

SOMMAIRE
Qualit web. Fondamentaux Bonnes pratiques
Usages Audit Suivi de production Cahier
des charges Mthodes dvaluation et amlioration continue Qualit web et accessibilit
Pilotage de parc Matrise des risques Enjeux
Bonnes pratiques. 226 fiches Recommandations Check-lists spcialises. Check-lists en
suivi de production Diffrentiel Opquast/WCAG
Annexes. Trousse outils Index

2e dition
augmente

QUALIT WEB

Accessibilit, rfrencement, performance, navigation, mobile, vido,


scurit... les bonnes pratiques du Web runies dans louvrage de
rfrence des professionnels du Web!

Sous la direction
dlie Slom & Laurent Denis

QUALIT WEB, 2e dition augmente

2e DITION AUGMENTE

Sous la direction dlie Slom & Laurent Denis


Prfaces dAmlie Boucher & Stphane Deschamps

QUALIT WEB
La rfrence des professionnels du Web

226 BONNES PRATIQUES

ISBN : 978-2-212-14433-8
Code diteur : G14433

36

BPQW_Couverture_001.indd Toutes les pages

05/07/2016 12:02

LES FONDAMENTAUX DU WEB ENFIN RUNIS DANS UN LIVRE!


Qualit web est le guide pratique des professionnels du Web. Il prsente la qualit
web et son rle dans lamlioration de lexprience utilisateur (ux). 226 bonnes
pratiques sont dtailles dans des fiches structures et illustres qui facilitent leur
comprhension et leur application. De nombreux outils oprationnels (checklists,
recommandations) viennent complter ces contenus pour faire de cet ouvrage un
outil indispensable au quotidien.
UNE 2 e DITION REVUE ET AUGMENTE
Cette nouvelle dition a t entirement actualise et augmente, avec une
centaine dillustrations supplmentaires, de nouveaux chapitres sur lvaluation
et les enjeux de la qualit web, une structure compltement revue et amliore, et
encore plus de checklists et doutils oprationnels pour monter en comptences et
amliorer les sites.

QUI SADRESSE CE LIVRE?


Aux chefs de projets web et managers qui orchestrent le travail
dquipes pluridisciplinaires.
Aux dveloppeurs, graphistes, ergonomes et designers ux qui
se dotent de comptences transversales.
Aux spcialistes seo qui amliorent le rfrencement naturel.
Aux contributeurs et rdacteurs web soucieux de la diffusion
de leurs contenus.
tous les professionnels du Web actuels et en devenir.
DIRECTEURS DOUVRAGE
lie Slom, prsident fondateur de la socit
Temesis et dOpquast (Open Quality standards), est consultant, auteur, formateur et
confrencier. Il est lorigine du modle VPTCS
et du concept de qualit web. Laurent Denis est
consultant, expert accessibilit et formateur.
Son exprience et ses connaissances encyclopdiques en font lun des meilleurs spcialistes
franais des standards web et de laccessibilit.

BPQW_Couverture_001.indd Toutes les pages

SOMMAIRE
Qualit web. Fondamentaux Bonnes pratiques
Usages Audit Suivi de production Cahier
des charges Mthodes dvaluation et amlioration continue Qualit web et accessibilit
Pilotage de parc Matrise des risques Enjeux
Bonnes pratiques. 226 fiches Recommandations Check-lists spcialises. Check-lists en
suivi de production Diffrentiel Opquast/WCAG
Annexes. Trousse outils Index

2 e dition
augmente

QUALIT WEB

Accessibilit, rfrencement, performance, navigation, mobile, vido,


scurit... les bonnes pratiques du Web runies dans louvrage de
rfrence des professionnels du Web!

Sous la direction
dlie Slom & Laurent Denis

QUALIT WEB, 2e dition augmente

2e DITION AUGMENTE

Sous la direction dlie Slom & Laurent Denis


Prfaces dAmlie Boucher & Stphane Deschamps

QUALIT WEB
La rfrence des professionnels du Web

226 BONNES PRATIQUES

05/07/2016 12:02

Qualite web_PDT.indd 2

04/07/2016 17:59

DITIONS EYROLLES
61, bd Saint-Germain
75240 Paris Cedex 05
www.editions-eyrolles.com

En application de la loi du 11 mars 1957, il est interdit de reproduire intgralement ou


partiellement le prsent ouvrage, sur quelque support que ce soit, sans lautorisation
de lditeur ou du Centre Franais dexploitation du droit de copie, 20 rue des Grands
Augustins, 75006 Paris.
Groupe Eyrolles, 2016, ISBN: 978-2-212-14433-8
Opquast, 2016

Crdits ET licence

Direction et conduite du projet


lie Slom est Prsident et fondateur de la socit Temesis Opquast (Open Quality standards). Il dirige le projet Opquast depuis
sa cration. Consultant, auteur, formateur et confrencier, il intervient dans de nombreuses manifestations, entreprises et cursus
de formation en France et ltranger. Expert de la cration de
rfrentiels ouverts, il a notamment travaill sur la production
des RGAA 1 et 2, des bonnes pratiques Opquast qualit web, SEO et
Open Data, et de nombreux autres rfrentiels publics ou privs.
Auteur de plus dune centaine darticles sur la qualit web, il fait
partie du collectif OpenWeb. il est galement lauteur du memento
Site web: les bonnes pratiques, et le prfacier des ouvrages CSS2 de
Raphal Goetter, Ergonomie Web par Amlie Boucher, Card Sorting
de Gautier Barrre et ric Mazzone, Intgration Web: les bonnes
pratiques de Corinne Schillinger, co-conception: les 115 bonnes
pratiques, par Frdric Bordage chez Eyrolles, et 60 rgles dor
pour russir son site web par Jean-Marc Hardy et Jacqueline Lo
Lesage (5e dition) chez Dunod. lie Slom fait partie du rseau
des Experts Google.
Laurent Denis est consultant, expert accessibilit et formateur
chez Temesis. Titulaire dun DEA dhistoire contemporaine en
Sorbonne, il a longtemps exerc comme enseignant. Rdacteur
en chef du projet OpenWeb, il a publi de trs nombreux articles
sur ces technologies. Sa connaissance et sa pratique des normes
et des spcifications en font lun des tous premiers spcialistes
francophones sur les standards du Web. Il est lun des auteurs des
Rfrentiels gnraux daccessibilit pour les administrations 1
et 2 (RGAA) et le prfacier de Russir son site web avec XHTML et CSS
par Mathieu Nebra et dIntgration Web: les bonnes pratiques de
Corinne Schillinger, dit chez Eyrolles.

Prfaces
Amlie Boucher est experte en UX Design. Elle pratique depuis
12 ans lexprience utilisateur web et mobile pour des missions
varies : e-commerce, ditorial, rseaux sociaux, logiciels et
applications mtier En 2003, son master dergonomie en poche,
elle lance le site Ergolab, prcurseur de lessor de la discipline
en France. Dans cette mme volont de faire connatre lUX

(Photo:
Christophe Goussard)

(Photo: lie Slom)

tous ceux qui crent des services interactifs, elle est lauteur de
livres sur le sujet (Ergonomie web, Ergonomie web illustre et Exprience utilisateur mobile, ditions Eyrolles). Elle monte en 2013 avec
Nicolas Hess un studio de design: LUX sur le gteau (http:// www.
ux-surlegateau.com).
Stphane Deschamps est dveloppeur web client depuis 1999.
Il contribue depuis plusieurs annes promouvoir la qualit du
Web, et a t successivement membre du comit ditorial devolt,
co-administrateur de Pompage, puis fondateur et prsident de
Paris-Web. il a galement t co-directeur du collectif OpenWeb.
Stphane est actuellement expert technique pour le groupe
Orange en charge de questions daccessibilit et dinteroprabilit des sites web.

Conception graphique
Anne-Sophie Fradier a travaill depuis plusieurs annes sur le
design web et sur les spcificits de tous les supports de lcrit, du
papier la liseuse lectronique. Ses travaux concernent la faon
dont la typographie peut servir au mieux le texte et ses messages
dans tous ses avatars. Cest dans le cadre de cette recherche
quelle a t amene donner des confrences sur la typographie et la macrotypographie, notamment Paris-Web et au Kikk
de Namur. Elle est lauteur de Webgrids, Structure et typographie de
la page web, paru aux ditions Atelier Perrousseaux.
(Photo: Sabine Dufaux)

Remerciements
Le projet Open Quality Standards est un travail collaboratif de
longue haleine, qui a mobilis, et qui mobilise encore, un nombre
considrable de comptences et de soutiens.
Il est impossible de tous les citer, mais nous allons tout de
mme nous efforcer de rendre hommage un certain nombre
dentre eux.
Fabrice Bonny, dont la rencontre avec lie Slom en 2003 a donn
naissance au projet Opquast, et qui a contribu de manire dcisive tout au long de la vie du projet.
Muriel de Dona, qui a contribu lcriture, la relecture et la
mise au point de la premire dition de ce livre, et qui a jou un
rle important dans le dveloppement du projet et de la marque
Opquast.
Les salaris et associs passs et prsents de la socit TemesisOpquast qui ont travaill darrache-pied pour faire vivre et animer
ces contenus: ric Gateau, Aurlien Levy, Mickal Hoareau, Samuel
Martin, Alain Borri, Olivier Meunier, Jacques Slom, David Molire,
Ian Smallwood, Chlo Beghin, Franois Palaci, Lili MhentelCukier, Rgine Cukier, Maxime Grandchamp, Julie Morana.

IV // qualit web, la rfrence des professionnels du web

Irene Dafonte Riveiro, qui sait mieux que personne quun projet
comme Opquast a des hauts et des bas, et qui est toujours l,
pendant les hauts et pendant les bas.
Tristan Nitot, soutien indfectible du projet Opquast et pilier du
Web franais.
Les contributeurs et soutiens de la premire heure. Ils ont particip au projet et souvent discut avec passion de chaque mot,
de chaque tournure de phrase du rfrentiel. Parmi eux, citons
notamment: Denis Boudreau, Monique Brunel, Delphine Malassingne, Jrmie Patonnier, Karl Dubost, Harmen Christophe, Nicolas Hoffmann, Nicolas Hoizey, Olivier Keul, Carl-Stephan Parent,
Bertrand Matge. Beaucoup dautres contributeurs sont intervenus
diffrents moments du projet, la liste complte de ceux dentre
eux qui ont particip aux ateliers est propose plus loin.
Amlie Boucher et Stphane Deschamps, qui ont accept de
rdiger les prfaces de cet ouvrage.
Nicolas Hoffmann, pour la relecture attentive quil a effectue
sur les dernires preuves du livre, pour sa bienveillance et son
soutien indfectible.
Bruno Gonzalvez, qui nous a considrablement aids dans llaboration de la premire version de ce livre, en tant quditeur,
rdacteur et observateur bienveillant.
Les clients qui nous font confiance depuis plus de 15 ans sur la
qualit et laccessibilit web, qui font avancer le Web et contribuent directement ou indirectement financer lnorme investissement que suppose ce projet.
Les agences web partenaires du projet Opquast et les membres
de leurs quipes et notamment Agns Passault, Olivier Porrachia,
Nicolas Chagny, Frdric Bon, Olivier Keul, Mathieu Delemme,
Audrey Vittecoq-Laporte, Yann Doussot, Malo Gaudry, Matthieu
Domain, Alexis Mons, Manuel Diaz, David Lafon, Andr Agid,
Sbastien Priollet, Lela Ayoub, Christophe Clouzeau, Benot Thieffry, Adrien Duquesne, Vronique Lefebvre-Toussaint, Jean-Luc
Renaud, Yann Olive, Amanda Martinez, Jean-Christophe Mallet.
Les coles partenaires dOpquast, leurs tudiants et les membres
de leurs quipes et notamment ric Combalbert, Pierre-Emmanuel Schmidt, Elvire Akl, Alain Assouline, Sylviane Peretz, Yohan
Quetand, Marie-Jos Cornille, Hlne Desliens de Francet, Franois
Moraud, Stphane Bitton, Marie-Hlne Madilian, Marie-Isabelle
Agopian, Alexia Moity, Tiffany Assouline, Daniel Villa Monteiro,
Bruno Faure, Pascale Neveu, Stphanie de Kerdrel, Christophe
Ondrejec, Eva Garraud, Stphanie Blain, Sandro Micalizzi.
Philippe Bruno, Jacques Peyrondet, Eric Snchal, toujours fidles
et vigilants.

Crdits et licence // V

David Lavaud, Jess Porlier, Emmanuel Clment, Christophe Goussard, Mathieu Drouet et Francis Chouquet qui ont mis leur plume
ou leur objectif au service dOpquast.
Ils ont jou un rle essentiel diffrents moments du projet:
Stphanie Leduc, Stphane Pineau, Florian Hatat, Lionel Gangloff,
Dominique Ferrand, Anabelle Matigot, Stphanie Troeth, Stphane
Seyer, Sophie Pne, les quipes de ParisWeb, du Centre de
Recherche Publique Henri Tudor, dAccessibilitWeb, de RBS,
Inovagora et Emakina, la rgion Aquitaine, la BPI France Aquitaine,
Miguel Diaz Cacho, Michel Eimer, Vronique Castevert, Jean-Paul
Chiron, Jean-Christophe Elineau, Sylvain Bergeon, Pascal Romain,
Christophe Bigot, Marie-Laure Leglu, Anne Cavalier, Benot
Dequick, Rmi Parmentier, Bertrand Binois, Pierre Benayoun,
Frdric Bordage, Jean-Marc Hardy, Raphal Gotter, Rodolphe
Rimel, Laure-Gabrielle Chatenet, Jean-Michel Lacroix, Philippe
Mtayer, Arnaud Malon, Bertrand Laot, Bertrand Matge, Olivier
Fredon, Christophe Libert, Bndicte Roullier, Eve Demange,
Laurent Jouanneau, Frdric Bordage, Daniel Glazman.
Les membres du collectif Openweb.
Les ditions Eyrolles, et notamment ric et Alexandre qui ditent
cette nouvelle version, mais aussi Muriel, Sandrine et Karine qui
ont largement contribu faire connatre les bonnes pratiques
qualit web travers leur travail sur les versions successives du
mmento: Sites Web les bonnes pratiques.

Liste des contributeurs Opquast


Opquast version 3 (2015) Olivier Keul Vincent Valentin Vincent
Aniort Eric Gateau Vincent Jrmie Patonnier Delphine Malassingne Bertrand Matge Nicolas Hoizey Nicolas Hoffmann
Nicolas Gallet Carl-Stephan Parent Aurlien Levy Vronique
Lapierre Bastien Gatellier Gal Poupard Yann Olive JeanLuc Gay Jean-Pierre Vincent Fabrice Bonny Fabrice Bournisien
Arnaud Malon Charles-douard Coste Emmanuel Clment
Christophe Clouzeau Valery-Xavier Lentz Claire Bizingre
Sophie Drouvroy Boris Shapira Thomas Beduneau Damien
Jubeau Julie Mathiau Franois D. Dario Spagnolo Frdric
Kayser Nathalie Arnaud Malon Guillaume Verstraete Yvain
Liechti Daniel Roch Nathalie Rosenberg Monique Brunel
Opquast version 2 (2010) Delphine Malassingne Nicolas Le Gall
Martin Supiot Jrmie Patonnier Nicolas Gallet Carl-Stphan
Parent Florent Verschelde Nicolas Hoizey Mathias Poujol- Rost
Vincent Valentin Nathalie Rosenberg Thierry Rgagnon
Pascale Lambert-Charreteur Ghislain Sillaume Armand Abric
Vincent Aniort Leo Ludwig Corinne Schillinger Claire Bizingre
Jean-Paul Chiron David Lafon Vronique Lapierre Frank
Taillandier Marie Destandau Matthieu Blondel Sbastien

VI // qualit web, la rfrence des professionnels du web

Delorme Gilles Rouyer Sbastien Billard Romain Gervois


Serge Boujo.
Opquast version 1 (2004) Ned Baldessin Vincent Bnard Christophe Bonnet Jrmie Bouillon Michel Brack Frdric Cavazza
Mathieu Charrier Jean-Paul Chiron Antoine Chopin Emmanuel Clment ric Daspet Olivier de Segonzac Jean-Marc
Fontaine Frdric Frances Mathieu Froidure Pierre Goiffon
Julien Heberte Nicolas Hoffmann Stphane Huc Olivier Jeannet Pascal Kuczynski Normand Lamoureux Sylvain Machefert
Richard Moret Willy Morin Jean-Franois Nogier Franois
Nonnenmacher Bruno Patri Guy- Philippe Uberos Stphane
Villatte Philippe Worontzof.

Licence
Le modle VPTCS, les libells de bonnes pratiques et leur regroupement sous forme de checklists sont placs sous licence CC BY-SA
4.0 dite Attribution Partage dans les mmes conditions 4.0 .
Les explications, objectifs, moyens de mise en uvre, moyens de
contrle et avis de lexpert sont placs sous licence CC BY-NC-SA
4.0 dite Attribution Pas dutilisation commerciale Partage
dans les mmes conditions 4.0 .
Le reste de louvrage est la proprit de la socit Opquast.
Creative Commons, de quoi sagit-t-il?
Simples utiliser et intgres dans les standards du Web, ces autorisations
non exclusives permettent aux titulaires de droits dautoriser le public
effectuer certaines utilisations, tout en ayant la possibilit de rserver
les exploitations commerciales, les uvres drives ou le degr de libert
(au sens du logiciel libre).
Source: http://fr.creativecommons.org/

Crdits et licence // VII

Prfaces

Non seulement faire, mais bien faire. Avoir des exigences. Cela ressemble
lge de raison: celui o, dpassant limpulsion, on accde la rationalisation, lautocritique. Cette envie de bien faire est la premire chose
qui ma frappe dans ce livre et les travaux de ses auteurs. Bien sr, il ne
sagit pas uniquement de vouloir bien faire, mais aussi de sen donner les
moyens. Et lorsquon commence rflchir au thme de la qualit web,
on comprend que lentreprise qui a fait natre ce livre ntait pas simple.
Jai longtemps dout de son ralisme. Il est difficile pour un spcialiste
daccepter que sa comptence puisse tre simplifie en rgles applicables
par tous. Je mtais toujours refuse y souscrire, partant du principe
que tout est affaire de contexte, et quil nexiste pas ou peu de principes
intangibles qui puissent tenir lpreuve du rel. Puis, jai rencontr lie.
Au fil des annes, je dcouvrais que ce quil appelait des bonnes pratiques
fonctionnait: produits du consensus dun groupe dexperts, aucune ne
paraissait rfutable, elles sappliquaient dans des environnements trs
divers, tmoignaient dun caractre rptable, bref, ressemblaient une
solution pour juger de la qualit dune exprience utilisateur sans forcment tre expert dans ce domaine.
Limpressionnant ici, cest que ce que jai fini par accepter pour lergonomie, les auteurs lont mis en place pour chacune des spcialits qui
font le Web. En a, ce livre est prcieux. Parce quil est infiniment utile,
parce quil nest que la surface dun travail de titan, mais surtout parce
quil nous permet de dessiner lavenir dun Internet de qualit. Un qui
ne se satisferait pas de simplement produire, mais qui se donnerait
soi-mme des objectifs et des critres dcisionnels pour sauto-valuer.
Car nous en avons grand besoin. On produit, certes. On sattache aussi
maintenant sentourer dexperts, faire grandir nos comptences. Mais
la qualit, la vraie, celle qui est gnraliste, qui mesure, qui contrle ?
Celle qui touchera, par dfinition, lutilisateur final ? Nous sommes encore
loin de la prendre en compte, parfois mme dy penser.
Il est difficile pour moi davouer quavec cet ouvrage, les auteurs sont
finalement plus proches des internautes que nous autres, ergonomes,
pourrions penser ltre. Car rendre un site rellement utile, trouvable,
accessible, rapide, respectueux, est une affaire de qualit globale, et pas
seulement dergonomie. Mme si jaimerais y croire, et que dans certaines
acceptions de la discipline ou manires de faire leur mtier, certains
dentre nous partagent cette vision holistique de lInternet.
Jaime lide dun livre-outil, qui serve la fois duquer et accompagner la dcouverte dun champ de connaissances, mais qui soit aussi
actionnable. Les auteurs de ce livre donnent toutes les cls pour lancer
le mouvement. Il doit tre complt par la mise en pratique elle-mme,

(Photo: droits rservs)

celle du qualiticien. Qui aujourdhui en France na pas forcment ce


titre, mais peut assurer des missions intimement lies la qualit. Ce
sera souvent le chef de projet, le webmaster voire lditeur du site luimme; peut-tre vous, qui lisez ce livre aujourdhui. Limportant est que
quelquun passe lacte.
En crivant cette prface, jespre remercier les auteurs de ce livre
pour ce quils nous y offrent. Avec cette joie incroyable de partager avec
eux et la communaut du Web franais lamour du travail bien fait. Avec
limpression de dtenir l quelque chose de rare.
Amlie Boucher,
Ergonome et architecte de linformation

X // qualit web, la rfrence des professionnels du web

Pendant un bon moment, je me suis concentr dans mon activit professionnelle sur des questions daccessibilit du Web. Permettez-moi de
rappeler deux classiques de laccessibilit, dont on vous a sans aucun
doute dj rebattu les oreilles:
1. Une image, si elle a du sens, doit comporter un texte alternatif.
2. Une vido doit a minima tre sous-titre ou faire lobjet dune
retranscription au format texte.
On fait souvent malgr soi dans le misrabilisme pour illustrer ces
simples exemples, en convoquant le pauvre utilisateur handicap, ici
aveugle, l sourd. Mais y regarder de plus prs
Nous recevons tous des newsletters mal conues, inaccessibles, qui
par exemple ne contiennent que des images sans que leur metteur ait
une seconde pens que notre client mail nest pas forcment en mesure
de les tlcharger (et donc de les afficher) pour diverses raisons de configuration ou de confidentialit.
Quant la vido rappelons-nous lanecdote, cite par Jrmie
Patonnier, de ce film destination du rseau interne dune entreprise,
non sous-titr alors que les postes de travail ne comportaient pas de
hauts-parleurs1!
On peut multiplier les exemples lenvi, mais retenons simplement
ce constat: la situation de handicap est une situation universelle. Au
sens large, cest une dficience ou une incapacit effectuer certaines
actions, quelle quen soit la cause.
Nous comprenons assez facilement travers ces quelques lignes que,
ne serait-ce quempiriquement, nous devrions tre mme de faire une
liste de ce quil convient de faire ou ne pas faire pour limiter les situations de handicap devant loutil informatique: cest la dfinition mme
de laccessibilit numrique.
Toutes ces situations impliquent des questionnements sur ce quil est
bon ou mauvais de faire; malheureusement il est arriv plus souvent que
ce soient des constats dchec a posteriori, sur lair don-ne-ly-prendraplus. Pour viter cet tat de fait, la solution est pourtant simple. Il faut
des rfrentiels pour laccessibilit.
Dans le mme temps, des experts dautres domaines ont eu la mme
dmarche, qui pour la performance des sites web, qui pour leur rfrencement, qui pour la qualit de sa relation avec ses clients, etc. Chaque
spcialit a donc rdig son rfrentiel, et na souvent vu le Web qu
travers le prisme dformant de ce quelle connaissait le mieux.
Prenons du recul et mettons ces ides en commun: cest la motivation
qui a gouvern la cration des bonnes pratiques Opquast contenues
dans ce livre.
Ce qui ma amen aux bonnes pratiques Opquast, cest avant tout
une rencontre: la conviction et lnergie dlie Slom lorsque nous avons
organis la premire dition de Paris Web2 ma forc (si ce ntait pas dj

(Photo:
Matthias Dugu)

1. Les standards du Web en entreprise : lexemple de BNP Paribas Personal


Finance, confrence Paris Web, 2008, http://www.paris-web.fr/2008/-vendredi-14-novembredecideurs-.html.
2. Confrence francophone annuelle, http://www.paris-web.fr/.

Prfaces // XI

le cas) mintresser Open Quality Standards au passage, chacun de


ces trois mots a son importance et nest pas choisi par hasard.
Ce rfrentiel formalise lide confuse qui nous motivait lors de la
cration de Paris Web: la qualit web est un tout, qui va de laccessibilit
au design en passant par une approche oriente standards (standardsoriented) du code, sans oublier, comme on vient de le dire, les autres
spcialits.
Les bonnes pratiques Opquast ont le mrite de proposer une dmarche
constructive, ds lamont de la conception dun service en ligne. Avant
elles, on navait au mieux quune vue morcele de ce qui tait bon pour
un site: chacun dfendait sa chapelle, quitte tre plus ou moins nocif
lautre.
Elles rassemblent en un seul endroit des rgles minimales, indiscutables, dans un consensus qui nest pas un consensus mou, mais un
vritable consensus dcid, rflchi, discut pied pied par des acteurs
varis dfendant chacun sa spcialit et ayant pour elle lexigence la
plus haute possible.
Un bon site web est le rsultat dune transaction entre chaque corps
de mtier du Web, chacun devant respecter les besoins des autres
domaines. On la vu il y a quelques annes lors dune discussion qui
mettait aux prises des rfrenceurs un peu radicaux et des gens frus
de qualit au sens plus large,3 il ne sert rien, sous peine davoir un
site insatisfaisant, de ninsister que sur tel ou tel aspect de lexpertise
web: de mme quun site trs accessible peut fort bien comporter une
esthtique douteuse, un site trs bien rfrenc pourra se rsumer par
le design est accessoire. Triste pitaphe.
La dcision finale qui a gouvern lexistence de ces 226 bonnes
pratiques est le rsultat dune approche pragmatique et de la capacit
dimplmentation de chacune de ces bonnes pratiques: si tous les contributeurs aux bonnes pratiques ntaient pas unanimes, alors la pratique
tait rejete.
Cest lensemble de tous ces critres qui fait quon a envie dutiliser
un site, quon a la capacit de le faire, et quon a envie de revenir sur ce
site: cest exactement ce quoi semploie depuis plusieurs annes toute
la communaut qui sest fdre autour des bonnes pratiques Opquast.
Stphane Deschamps,
Expert technique web chez Orange,
fondateur du cycle de confrences Paris-Web, co-directeur du
collectif OpenWeb

3. http://wdfriday.com/blog/2012/03/webdesign-et-referencement-naturel/

XII // qualit web, la rfrence des professionnels du web

Table des matires


Avant-propos

Partie 1 // Qualit web


1 Les fondamentaux de la qualit web

2 Les bonnes pratiques Opquast

17

3 Un rfrentiel, des usages

27

4 Audit qualit dun site web en ligne

33

5 Audits en cours de production

41

6 Consolider le cahier des charges

47

7 Mthodes dvaluation et amlioration continue

55

8 Qualit web et accessibilit

65

9 Piloter et amliorer la qualit dun parc de sites

77

10 Matrise des risques et certification des comptences

83

11 Enjeux de la qualit web

91

Partie 2 // Bonnes pratiques


Mode demploi des bonnes pratiques

104

Table des bonnes pratiques

106

Alternatives

119

Code

137

Contact

159

Contenus

167

E-Commerce

177

Espaces publics

211

Fichiers etmultimdia

217

Formulaires

229

Hyperliens

257

Identification

271

Internationalisation

285

Mobile

295

Navigation

305

Newsletter

333

Prsentation

341

Scurit et confidentialit

353

Serveur et performances

375

Syndication

389

Tableaux

395

Recommandations

403

Partie 3 // Checklists
Checklists en suivi de production

415

Vrification en phases de prototypage et de design 

416

Vrification en phases dintgration et de dveloppement

420

Vrification en phase de production ditoriale 

426

Opquast website

429

Checklist de labellisation Opquast website 

430

Diffrentiel Opquast qualit web et WCAG

435

Bonnes pratiques Opquast qualit web et conformit WCAG  436


Checklists spcialises

447

SEO 

449

Web mobile

453

Performance

455

Premier pas vers WCAG 2.0

457

Second pas vers WCAG 2.0

460

OpenData

462

Partie 4 // Annexes
Bote outils

469

Glossaire

475

Bibliographie

489

URL des figures

493

Index

XIV // qualit web, la rfrence des professionnels du web

497

Avant-propos

qui sadresse ce livre ?


Ce livre sadresse tous les professionnels du Web et ceux qui
aspirent le devenir, quelle que soit leur spcialit ventuelle.
Alors que les mtiers du Web (ergonomes, dveloppeurs, webdesigners, chefs de projets... ) sont aujourdhui fortement spcialiss,
nous avons choisi dtre les plus transversaux possibles. Notre
volont est de donner tous les acteurs dun projet web une
culture commune oriente vers un objectif partag : la qualit
des services en ligne.

Pourquoi cet ouvrage ?


1. Parce que les mtiers du Web semblent simples et sont en
ralit trs complexes.
2. Parce que le secteur de la production de sites est de moins en
moins artisanal et de plus en plus industriel.
3. Parce que lvidence est la premire chose que lon oublie :
mme les meilleurs professionnels dun secteur dactivit ne
peuvent pas tout savoir et penser tout.
4. Parce que certaines bonnes pratiques ne sont pas forcment
faciles comprendre et quil est ncessaire de les expliquer.
5. Parce que la connaissance de rgles de base est un lment
incontournable de la formation et de la communication entre
les mtiers du Web.
6. Parce que les rfrentiels qualit sont dexcellents outils dindustrialisation, quils soient respects la lettre ou outrepasss en toute connaissance de cause.
7. Parce quil est temps de professionnaliser le secteur et den
matriser les risques.
Au-del des raisons numres ci-dessus, ce sont nos clients,
amis et tudiants qui nous ont pousss crire ce livre. Ils souhaitaient voir les bonnes pratiques de la qualit web recenses et
explicites dans un mme ouvrage, dans le but de rpondre
cette question :
Comment valuer, grer et garantir la qualit dun site Internet ?
Fin 1999, lorsque nous nous sommes pos cette question pour
la premire fois, le secteur tait encore pratiquement vierge sur
cette approche globale. Nous avons donc choisi de constituer un

annuaire de sites et darticles sur la qualit web. Cet annuaire a


progressivement t enrichi puis class par thmatiques dont le
nombre a trs vite augment: rfrencement, traduction, localisation, contenus, juridique, logistique, mesure daudience
En 2001, lie Slom et ric Gateau ont regroup ces diffrentes
thmatiques et nous avons obtenu un classement en cinq secteurs
couvrant lensemble des ressources sur la qualit web: le modle
VPTCS (visibilit, perception, technique, contenus, services), expliqu en dtail dans la premire partie de cet ouvrage.
Dbut 2004, nous avons souhait aller plus loin en dclinant
ce modle sous forme oprationnelle: cela nous a conduits la
cration dune liste de bonnes pratiques qualit web.
Cest enfin dans le but de rendre ces bonnes pratiques accessibles et comprhensibles par tous, sous la forme de fiches explicatives dtailles, que nous avons dcid de rdiger cet ouvrage.

Comment lire ce livre ?


Cet ouvrage est conu comme un support de formation, de sensibilisation et dinitiation aux diffrents mtiers du Web. Tout au
long de sa conception, nous avons veill non seulement ce
que vous puissiez accder facilement un ensemble de bonnes
pratiques, mais aussi vous permettre de les comprendre en
profondeur. Il est divis en quatre parties :
La premire partie prsente les bases de la qualit web et de
son management. Elle vous familiarise avec ces concepts et
propose diffrents usages des bonnes pratiques en conception,
en production et en cours de vie du site.
La deuxime partie est constitue de fiches ddies chacune
des 226 bonnes pratiques (qui constituent le rfrentiel
Opquast bonnes pratiques qualit web) prcdes de leur
mode demploi. Chaque rgle est explique et dtaille, aussi
bien du point de vue de son objectif, de sa mise en uvre que
de sa vrification. En fin de partie, nous proposons plusieurs
checklists de vrification en cours de production ainsi que des
recommandations supplmentaires.
La troisime partie prsente les checklists spcialises issues
des diffrents ateliers Opquast. Vous y trouverez notamment
des checklists ddies au SEO, la performance, au mobile,
lopen data.
La quatrime partie est une bote outils pour tous les professionnels du Web. Vous y trouverez des outils, un glossaire,
et de nombreux lments pour travailler au quotidien sur la
qualit des sites
Nous esprons que ce livre continuera de faire merger des
responsables qualit web et des chefs de projets vritablement
polyvalents. Ces derniers ne seront peut-tre pas les plus pointus sur tel ou tel aspect technique, mais ils sauront jouer un rle
fondamental dans la dtection et la rsolution de dfauts. Lapproche transversale adopte ici les aidera communiquer de
faon fluide avec tous les acteurs du projet web.
2 // qualit web, la rfrence des professionnels du web

Les dix commandements du qualiticien web


a y est vous tes prt vous doter dune culture qualit web.
Alors, cest parti, plongez-vous dans ce livre et noubliez pas ces
quelques rgles, elles vous viteront bien des msaventures.
1. Les contenus et services au cur de ta dmarche tu mettras.
2. Du jugement de valeur, par ta tolrance tu te garderas.
3. Lamlioration continue au tout et tout de suite, tu prfreras.
4. Le contexte jamais tu noublieras.
5. Le spcialiste dans la transversalit tu replaceras.
6. Sur les standards et les normes disponibles, tu tappuieras.
7. Lexprience des personnels de terrain tu couteras.
8. Les risques pour fixer tes objectifs tu valueras.
9. De la surqualit toujours tu te mfieras.
10. Des rgles absolues en cas de ncessit tu taffranchiras.1

1. Ces dix commandements gagnent normment tre psalmodis.

Avant-propos //  3

Premire partie

Qualit web

Chapitre 1

Les fondamentaux
de La Qualit web

1.1 Ya du boulot !
Expliquez un utilisateur dInternet que vous tes un professionnel de la qualit web et il vous rpondra invariablement:
Il y a du boulot! Internet est dune utilit immense depuis de
nombreuses annes. Il nous donne accs une quantit norme
de contenus et de services. Le Web daujourdhui est infiniment
plus riche que celui dil y a quelques annes. Pourtant la perception globale de la qualit web nest pas si bonne que cela pour les
utilisateurs. Alors quen est-il exactement?
Il y a quelques annes, et notamment en 2012, lorsque la prcdente version de cet ouvrage est sortie, un internaute habitu
frquenter les grands sites web de presse, de-commerce ou
dautres sites renomms et frquents pouvait avoir limpression
que la qualit tait plutt bonne. Les gros dfauts taient assez
rares. Ces grands sites fonctionnaient plutt bien, ils taient utiles,
utiliss et souvent apprcis. Inversement, les petits sites dots de
moyens nettement moins importants contenaient de nombreux
dfauts beaucoup plus visibles (gif anims, boutons passer lintro, sons dclenchs automatiquement).
Que sest-il pass depuis cinq ans?
Le dbit des connexions est bien meilleur quil y a quelques

annes.

La compatibilit, qui tait une grande difficult, est devenue

beaucoup plus simple grer notamment avec le responsive


design1.
Le-commerce a continu de se dvelopper et il a prouv sa
rentabilit.
La production des contenus et lexprience utilisateur sont
maintenant des sujets connus et pratiqus.
De nouvelles technologies universelles (UTF-8, HTML5, etc.) ont
remplac des technologies qui ltaient moins (Flash).

1. State of the Web 2016: https://mobiforge.com/newscomment/thestateoftheweb2016

Figure 1
En 2016, la consultation de nombreux sites de presse ncessite pas moins de
5clics avant de pouvoir naviguer.

Au vu de ces quelques observations, la qualit de ces sites, et


mme de tous les sites, aurait d considrablement samliorer.
Alors, oui, cest sans doute le cas pour les petits sites (associations, freelances, clubs sportifs, miniboutiques). Ils partaient
de trs bas et des erreurs grossires taient trs frquentes. Mais
depuis, les systmes de gestion de contenu et la culture web se
sont dmocratiss.
En revanche, la qualit des grands sites sest notre sens considrablement dgrade. Voici quelques observations qui rsument
ce qui sest pass au cours des cinq dernires annes.
La quantit de publicit sur les sites est devenue considrable,
insupportable pour beaucoup.
Les pratiques publicitaires sont devenues extrmement
invasives.
Les sites envoient des quantits de donnes normes, suprieures 2 mgaoctets en moyenne2.
Les sites pratiquent le suivi , voire lespionnage des internautes
grande chelle.
La gestion des cookies en Europe a impos un clic supplmentaire au niveau dun continent.
La promotion des applications mobiles a elle aussi provoqu
des retards de navigation.
Le respect de rgles minimales daccessibilit nest toujours
pas assur.
Finalement, et alors que nous publions une nouvelle version de
ce livre ddi lamlioration du Web, il semble que la mise en
application de son contenu soit plus que jamais dactualit. Alors,
oui, il y avait du boulot, il y a du boulot, et il y aura certainement
du boulot pendant encore quelques annes.

2. The Web is Doom: https://mobiforge.com/researchanalysis/thewebisdoom

8 // qualit web, la rfrence des professionnels du web

1.2 Une dfinition


Depuis 2004, nous vous proposons une dfinition de la qualit web
inspire de celle qui est propose dans la norme ISO 8402 (1994)3 :
La qualit web reprsente laptitude dun service en ligne satisfaire
des exigences explicites ou implicites.
Cette dfinition est trs riche denseignements.
Tout dabord, elle va nous conduire dterminer, de la faon

la plus prcise possible, les attentes et exigences telles quelles


sont formules par les utilisateurs.
Elle va galement nous conduire aller au-del de lexplicite
en nous demandant quelles sont les bonnes pratiques que
les utilisateurs ne savent pas forcment formuler (exigences
implicites) mais qui nen sont pas moins pertinentes.
Pour finir, elle va nous aider dfinir le management de la
qualit web, qui regroupe lensemble des activits permettant
dvaluer, damliorer et de garantir la qualit web.

1.3 Qualit et management de la qualit


Le prsent ouvrage sappelle Qualit web, mais il aurait tout aussi
bien pu sappeler Assurance qualit web. En ralit, il existe une
confusion frquente entre la notion de qualit, qui est subjective
et qui varie suivant les interlocuteurs et le point de vue, et les
oprations damlioration et de management de la qualit, qui
sont quant elles tout fait objectives.
Vous savez par exprience quil est trs difficile de se prononcer de manire formelle sur la qualit dun site web. Pour un
mme site et un mme scnario dutilisation, certains utilisateurs
auront une exprience trs positive, dautres trs ngative, et ce
pour des raisons qui sont souvent trs personnelles. Certains
utilisateurs accorderont de limportance certains aspects qui
seront totalement ignors par dautres. Il suffit parfois dun petit
dtail pour transformer une exprience russie en chec complet.
Dun point de vue professionnel, nous ne pouvons pas nous
poser la question de cette manire. En pratique, nous allons donc
devoir passer dune notion subjective, la qualit, un ensemble
doprations les plus objectives possible, qui nous permettront
de lapprhender: le management de la qualit. Cela va nous
conduire :
mesurer, valuer et estimer le niveau de qualit;
le grer, lamliorer et le mettre sous contrle;
garantir, certifier et assurer la qualit.
Les bonnes pratiques sont particulirement adaptes pour lvaluation dun site web. Cette mthode est intressante, surtout
pour une estimation des risques fondamentaux, mais elle est
3. Cette dfinition a volu depuis. La norme ISO9000:2015 la dfinit comme laptitude dun ensemble de caractristiques intrinsques [dun objet] satisfaire des
exigences.

Qualit Web // Les fondamentaux de La Qualit web // 9

trs largement insuffisante pour valuer proprement la qualit


dun site. Vous aurez besoin dautres mthodes dvaluation en
complment; nous avons choisi de vous en proposer quelquesunes.
Vous natteindrez pas LA qualit web, car cet objectif ne peut
pas tre atteint, et cest tant mieux. Cela signifie que mme
lorsque vous aurez fait tout ce que vous pouviez, il restera
toujours dautres moyens pour satisfaire encore mieux les utilisateurs (si daventure vous rencontrez un site web qui ne peut
pas tre amlior, cest sans doute que vous regardez mal). Vous
avez donc du travail pour quelques annes.
La qualit web est un objectif qui ne peut pas tre atteint, mais
ce livre est un guide qui vous permettra de vous en approcher.
partir de maintenant, lorsque lon vous demandera si un site
est bon ou mauvais, vous refuserez de rpondre et vous expliquerez votre interlocuteur quil est de toute faon possible de
lamliorer. Vous viterez ainsi les dbats sans rponse sur la
qualit dun site web et poserez efficacement la question de son
management.

1.4 VPTCS: un modle pour la qualit web


Il est difficile de rsumer ce quest la qualit web en quelques
motstant elle touche des secteurs varis et des thmatiques
nombreuses. Cest pourtant ce qulie Slom et ric Gateau ont
fait en 2001: ils ont conu un modle qui synthtise les attentes
des utilisateurs finaux, qui explique trs simplement les qualits attendues dans un site et qui fournit une vision transversale
de lensemble des mtiers contribuant la qualit web. Cest le
modle VPTCS (pour visibilit, perception, technique, contenus et
services).
Figure 2
Infographie produite par
Delphine Malassingne
partir du modle VPTCS
dlie Slom et ric
Gateau

La visibilit dsigne laptitude dun site tre rencontr par ses

utilisateurs potentiels.

La perception4 reprsente son aptitude tre utilisable et correc-

tement peru par ses utilisateurs.

La technique concerne son aptitude fonctionner correctement.


Les contenus recouvrent laptitude dlivrer de linformation de

qualit.

4. Les auteurs ont envisag de remplacer le terme Perception par le terme de Prsentation, qui conviendrait galement dcrire au moins partiellement lutilisabilit, la
cohrence graphique, la qualit visuelle de linterface, le contenu tant trait ailleurs.

10 // qualit web, la rfrence des professionnels du web

Et enfin, les services dterminent son aptitude proposer,

accompagner, et/ou gnrer la ralisation de services de


qualit.

1.5 Un outil de communication


Formuls en termes encore plus simples, cest--dire en adoptant le point de vue dun utilisateur final, cela nous conduit aux
formulations suivantes:
Je veux trouver facilement le site, je veux une navigation agrable, je
veux que le site fonctionne correctement, et je veux des contenus et des
services de bonne qualit.
Le modle VPTCS na pas pour vocation de dcrire la ralit avec
prcision: il sagit simplement de modliser de manire synthtique les enjeux des sites Internet et des services en ligne. Le
modle doit tre utilis comme un outil de communication qui
permet dexpliquer rapidement ce quest un site et quoi il sert.
Voici quelques utilisations classiques du modle.
Expliquer un acheteur de site les diffrents mtiers qui seront
impliqus dans la production de son site et les sujets qui
devront tre traits pour servir correctement ses utilisateurs.
Dfinir la rpartition des responsabilits entre, dune part, un
prestataire qui assure la matrise duvre (MOE) et prend ce
titre des responsabilits sur la visiblit, la perception et la technique (VPT), et, dautre part, un acheteur de site qui est matre
douvrage (MOA) et doit en thorie assumer les responsabilits
en matire de contenus et services (CS).
Faire une revue de conception pour vrifier que lensemble des
points ont t traits y compris dans leurs implications (par
exemple, cela peut tre la dfinition du rle et de la charge
associe la production de contenus, ou la revue des moyens
consacrer la visibilit sur trois ans).
Rappel ou explication certains acteurs de leur rle dans le
processus (cration de valeur ajoute Contenus et Services ou
mise disposition de la valeur ajoute Visibilit, Contenus et
Perception).
Le modle VPTCS est particulirement adapt pour expliquer et
traiter les sujets dun site web de manire synthtique. Mais il
savre insuffisant lorsquil faut descendre de manire prcise
dans les spcifications de qualit. Dans ce cas, les bonnes
pratiques qualit sont nettement plus adaptes.

1.6 Transversalit
La premire particularit de ce modle rside tout dabord dans sa
transversalit. Il ne sagit pas de privilgier une approche spcifiquement technique, ergonomique, ditoriale ou ddie au rf-

Qualit Web //Les fondamentaux de La Qualit web // 11

rencement. Il sagit de traiter tous ces aspects de faon quilibre


et mesure.
Sur le plan des activits web, voici certains des secteurs ou
activits que peut recouvrir chacune des 5 rubriques du modle:
Figure 3
Le modle VPTCS permet
de classer une grande
partie des mtiers du
Web.

*En ralit, laccessibilit aux personnes handicapes telle quelle est dcline
dans les standards internationaux regroupe des critres ergonomiques, techniques
et ditoriaux. Ce sujet devrait donc tre prsent dans les colonnes P, T et C. Par
ailleurs, les notions de visibilit et de service ne sont pas prises en compte dans
ces standards, qui traitent essentiellement la question de linterface. Opquast
permet de compenser ce manque.
**QoS: Quality of Service, qualit de service.

1.7 Un modle ux et ui
La qualit web, ce nest pas seulement la qualit de linterface
web. Il y a une vie avant et aprs linterface. La qualit web perue
par les internautes cest aussi:
ce qui se passe avant la visite: notamment travers la visibilit
du site dans les supports en ligne (sites externes, moteurs
de recherche, outils de syndication) ou hors ligne (publicits,
cartes de visite);
ce qui se passe aprs la visite: par exemple lorsque linternaute a
pass une commande ou envoy une demande de renseignements et a ensuite quitt le site. Lenvoi de la commande et la
rponse la demande de renseignements auront un impact
important sur la perception qua lutilisateur de la qualit du site.
Figure 4
Qualit web: perception
globale du site

Le site web nexiste que lorsquil est compris dans un processus


qui inclut des phases en amont et en aval. La phase daccs
linterface peut tre tout fait limite. Cest le cas de certaines
applications qui ne sont utilises que trs brivement dans le
courant dun processus qui comporte des phases trs longues en
amont ou en aval.

12 // qualit web, la rfrence des professionnels du web

Le modle VPTCS est galement trs pratique pour comprendre


la diffrence entre lexprience utilisateur (ux), qui prend en
compte la totalit de lexprience VPTCS, et linterface utilisateur
(ui) qui se limite aux aspects ergonomiques, techniques et ditoriaux de linterface. La perception, la technique et les contenus
sont des constructions qui correspondent la vision des crateurs de sites. Lutilisateur peroit ces trois lments la fois,
de manire globale. Pour lui, le site web est un mlange dinterface visuelle, de fonctionnement technique et de contenus. Cette
dernire observation montre que les graphistes, les dveloppeurs
et les producteurs de contenu nont dautre choix que de travailler
ensemble pour produire des sites web de qualit. Graphiquement,
le modle permet de discerner trs simplement la diffrence entre
linterface utilisateur (user interface, UI) compose dlments lis
la perception la technique et aux contenus, et lexprience utilisateur (user eXperience, ux) qui intgre tout ce qui se passe avant
le passage sur linterface (la visibilit) et tout ce qui se passse
aprs (les services).
Figure 5
Le modle VPTCS permet
de diffrencier trs
clairement lexprience
utilisateur (UX) de
linterface utilisateur
(UI).

Contrairement la quasi-totalit des autres modles ux, celui-ci


ne se penche pas sur les motions (plaisir, attachement, gratitude) mais seulement sur le succs de missions de base. Cest
dailleurs la raison pour laquelle le modle VPTCS na pas pour
finalit latteinte de lexcellence.
Le modle VPTCS est un modle exprience utilisateur ux non motionnel. Il permet de diffrencier lexprience utilisateur (ux) de linterface
utilisateur (ui).

1.8 Un modle de comprhension


de la valeur ajoute
Le modle VPTCS permet galement de mettre en vidence la
valeur ajoute dun site web pour ses utilisateurs. Cette valeur
ajoute se concentre essentiellement sur deux aspects : les
contenus (C) et les services (S). Les autres attentes (V, P, T) sont
la fois fondamentales et secondaires. Fondamentales, car sans
elles le site natteindra pas ses objectifs. Secondaires, car ce qui
compte par-dessus tout, ce sont les contenus et les services. Dune
certaine manire, les critres de visibilit, de perception et de
Qualit Web //Les fondamentaux de La Qualit web // 13

technique nont dimportance qu travers leur capacit mettre


en valeur les contenus et services du site. Autrement dit, sans
contenus ou services de qualit, le site nest quune coquille vide.
Figure 7
Au cur de la cration
de valeur : les contenus
et services

Les contenus et services sont au cur de la qualit web. Ils sont la raison
principale pour laquelle les utilisateurs se rendent sur le site, sen servent
et y retournent.
Pour vous convaincre de la primaut des contenus et des services sur
les autres aspects de la qualit web, passez en revue les sites que vous
utilisez au quotidien: sont-ils les plus russis au niveau graphique? Avezvous eu vous poser la question de leur rfrencement, de leurs performances? Probablement pas. En rgle gnrale, ils rpondent des besoins
lmentaires. Ils vous permettent de trouver des contenus ou de raliser
simplement des tches bien prcises (acheter, commander, tlcharger,
consulter). Ils font ce que les utilisateurs leur demandent.
Concentrez-vous sur les contenus et services, et dduisez-en le ncessaire en
matire de visibilit, de perception et de technique.

1.9 Un modle de gouvernance


et de comprhension du secteur
Le modle VPTCS permet de discerner trs clairement les mtiers
classiques de la matrise duvre (ceux qui sont pays pour
produire des sites) et de la matrise douvrage (ceux qui sont pays
pour concevoir et produire des contenus et services). Le schma
ci-dessous montre cette sparation.
Figure 6
Mtiers et acteurs du
Web

14 // qualit web, la rfrence des professionnels du web

Quelques observations
La reprsentation graphique prcdente ne reflte pas de manire
stricte le mtier de chaque acteur prsent, mais son mtier dorigine ou sa principale sensibilit thorique. En pratique, les mtiers
et acteurs ne sont videmment pas dans des cases, ils en sortent,
pour le meilleur et pour le pire.
Les DSI et SSII ont une forte coloration technique. Progressivement, elles ont d intgrer des comptences graphiques et
ergonomiques.
Les agences web et agences de publicit ont historiquement
de bonnes comptences visuelles et ergonomiques. Elles ont d
intgrer progressivement des comptences techniques.
Les points de frottement se situent souvent entre matrise
duvre et matrise douvrage, notamment sur la question de
la production des contenus. Voyant que certains clients avaient
peu dexpertise sur les contenus, voire sur les services, certains
matres duvre ont commenc proposer des prestations dordre
ditoriales, puis mme de stratgie digitale, qui recouvrent lensemble des points du modle VPTCS.

Qualit Web //Les fondamentaux de La Qualit web // 15

Chapitre 2

Les bonnes
pratiques
Opquast

2.1 Traduire le modle sur le terrain


Quest-ce quun site web de bonne qualit ? Posez cette question innocente un professionnel du Web, quil soit administrateur de site, dveloppeur ou producteur de contenus. Il y a de
fortes chances quil vous rponde que cest un site ergonomique,
pratique, intuitif, efficace. Dans le meilleur des cas, il vous expliquera quil sagit dun site bien rfrenc, accessible, qui fonctionne correctement ou conformment aux standards du Web.
Allez, soyons ambitieux, et gageons quil aura entendu parler du
modle VPTCS dlie Slom et ric Gateau. Dans ce cas, il vous dira
synthtiquement que le site est visible, utilisable, quil fonctionne
et dlivre des contenus et services dans de bonnes conditions.
Dans un contexte dexplication ou de simplification, il nest pas
choquant quun professionnel du Web synthtise les exigences
de qualit sous forme dattentes gnriques orientes utilisateur
(par exemple: le site sera performant). En revanche, un professionnel du Web doit pouvoir adapter sa faon de communiquer
lorsquil change avec ses pairs.
Le degr dindustrialisation dun secteur professionnel peut se
mesurer la capacit de ses membres communiquer de manire
prcise et dtaille sur des attentes, notamment en employant des
termes connus de tous. Pour ce qui est du secteur Web, on peut
dire quil est encore au dbut de son processus dindustrialisation.
Dans un contexte professionnel, les attentes gnriques sont
largement insuffisantes. Par exemple, de nombreux cahiers des
charges contiennent des phrases comme Le site devra tre ergonomique ou La navigation devra tre intuitive. Ce type
de mentions nest pas utile et tend laisser systmatiquement
les professionnels donner leur propre interprtation de ce quest
lergonomie ou une navigation intuitive. En consquence, chacun
interprte ces exigences sa propre faon, et la qualit du rsultat vis reste trs subjective. Il faut donc changer de registre et
sentendre sur des mthodes, des pratiques, des outils et des
exigences vrifiables et quantifiables. Cest le travail que nous

avons men lorsque nous avons conu la liste de bonnes pratiques


Opquast qualit web. Dans la suite de ce chapitre, nous allons
vous expliquer comment nous procdons pour tablir les rfrentiels Opquast.
Illustration
titre dexemple, partons de lexigence ergonomie ou utilisabilit.
Cela donnerait:

Le prestataire devra veiller ce que la navigation sur le site soit ergonomique et intuitive.

Dans le contexte dune explication un utilisateur final, les termes utiliss


ci-dessus conviennent trs bien. Mais lors dun change entre professionnels du Web, cette exigence devra se traduire de la faon suivante:

Le prestataire mettra en place un retour laccueil sur chaque page


du site.
Le prestataire mettra en place un fil dAriane pour aider se reprer.
Le prestataire veillera ce que les liens soient visibles et faciles
identifier.
Le prestataire mettra en place un moteur de recherche.
Etc.

La dclinaison dexigences gnriques sous forme de rgles individuelles permet ainsi de rechercher une srie dexigences induites
beaucoup plus nombreuses mais beaucoup moins subjectives.

2.2 Ateliers qualit web prsentiels


Au premier abord, dans un secteur aussi mouvant que le numrique, il semble quasi impossible de produire des bonnes pratiques
invariables. Cest lun des principaux cueils auxquels nous avons
t confronts lors du lancement dOpquast. Nous avons donc
commenc en organisant des ateliers auprs dtudiants et de
professionnels1.
Le dbut dun tel atelier commence par quelques minutes
de rflexion au cours desquelles lanimateur pose la question
suivante:
Pour vous, quest-ce quun site de bonne qualit?
Cette question conduit pratiquement toujours des rponses trs
personnelles. Les rponses sont souvent, mais pas systmatiquement, influences par le profil professionnel de la personne qui
rpond. Celles qui reviennent le plus souvent sont du mme ordre
que le modle VPTCS. Certaines parleront dun site ergonomique,
intuitif, clair. Dautres, moins frquents, insisteront plutt sur la
pertinence des contenus, dautres enfin parleront de laffichage
1. Nous continuons effectuer ce type dateliers dans nos formations et sensibilisations sur la qualit web.

18 // qualit web, la rfrence des professionnels du web

correct dans tous les contextes. Le fait que le site soit bien rfrenc est parfois cit, et le fait que la livraison ou les services se
droulent correctement nest quant lui presque jamais cit.
La suite de latelier consiste creuser ce que cache telle ou
telle attente. Par exemple, lanimateur demande lassistance ce
quelle a not. Si un participant rpond quil a not navigation
intuitive, lanimateur posera la question: Quentendez-vous par
navigation intuitive?
Ces changes permettent de lister les rgles qui font consensus
dans lassistance. Si lassistance ne produit pas de rgles vrifiables, lune des astuces consiste remettre les personnes de
laudience dans leur position dutilisateurs de sites. Cela peut
consister demander par exemple Que faites-vous sur un site
lorsque vous tes perdus? ou encore Mais quest-ce qui fait
que vous jugez solides des contenus web? ou Quelles sont les
questions que vous vous posez avant une commande sur un site
de-commerce?.
Au fur et mesure de lavancement de cet atelier, les participants dgagent un certain nombre de rgles vrifiables. Ces rgles
sont collectes par lanimateur et places dans cinq colonnes
non nommes. lissue de latelier les participants sont invits
nommer les colonnes et retrouvent ainsi les exigences fondamentales du modle VPTCS.

2.3 Ateliers Opquast en ligne


Les listes de critres produites dans les ateliers qualit web ne
sont pas utilisables en ltat. Il est donc ncessaire de les passer
en revue et de les formuler sous forme de phrases.
Figure 8
Le site des ateliers
Opquast

Voici le mode opratoire que nous avons retenu: nous avons


tabli une liste de phrases affirmatives (la forme interrogative
induisant trop le contexte spcifique de laudit), puis nous avons
ouvert un forum de discussion par bonne pratique.
Qualit Web //Les bonnes pratiques Opquast // 19

La premire version de latelier en ligne, lance en 2004, comportait dj un grand nombre de propositions de bonnes pratiques.
Un formulaire permettait en plus de proposer des suggestions
de bonnes pratiques. Trs rapidement, des conventions se sont
mises en place.
Quelques semaines plus tard, aprs des discussions passionnes, nous avons analys les premires suggestions. Nous avons
alors tabli de manire empirique ce que nous considrions
comme des bonnes pratiques recevables ou, au contraire, des
bonnes pratiques carter.
Voici une liste de critres qui dfinissent a priori ce quest une
bonne pratique recevable pour Opquast.
Elle est vrifiable en ligne.
Elle a une valeur ajoute dmontrable pour les utilisateurs.
Elle est raliste sur les sites web ou services en ligne.
Elle est valable au niveau international.
Elle ne comporte pas de rfrence une valeur numrique.
Son libell ne fait pas rfrence une solution technique.
Son libell ne fait pas rfrence une norme ou un standard
regroupant des exigences multiples.
Bien entendu, il nous arrive de faire des exceptions. Le cas chant,
nous devons tre en mesure de les argumenter solidement.
Les rgles respecter lors de la conception des bonnes
pratiques ont t synthtises dans un billet en forme de guide
du jeune padawan de latelier qualit web. Ce billet, intitul Le
ct Opquast de la force, a t publi en 2005. En voici lessentiel:
1. Des bonnes pratiques vrifiables en ligne tu proposeras
La liste des bonnes pratiques Opquast est, depuis sa cration, un outil
oprationnel dont lun des objectifs est de viser une mesure de conformit. Ce choix initial exclut du champ actuel de nos recherches les bonnes
pratiques de gouvernance, cest--dire les oprations que les administrateurs mettent en place pour assurer la qualit des sites sur la dure.
Par exemple, il est possible de dire Le site est exempt de liens morts ,
mais il nest pas possible de dire Les liens sont vrifis chaque semaine.
La deuxime proposition possde certes une valeur ajoute, mais elle
nest pas vrifiable lexamen du site, et cest pourquoi nous ne la
retiendrions pas.
2. Lvaluation de la conformit tu anticiperas
Chaque bonne pratique doit tre vrifiable et les ambiguts lors de lvaluation doivent tre vites. Cest pourquoi le contributeur consciencieux
vitera au maximum dcrire des libells tels que Le serveur envoie une
page derreur 404 et une page derreur 403 . En locurrence, lvaluateur
serait en difficult si lune des deux conditions tait respecte mais pas
lautre. Nous nhsiterons donc pas, en pareil cas, crer deux bonnes
pratiques en donnant chacune un objectif unique.

20 // qualit web, la rfrence des professionnels du web

3. La formulation de chaque bonne pratique tu soigneras


La liste de bonnes pratiques devrait idalement pouvoir sappliquer sur
tous les services en ligne dans le monde entier. Cet objectif est certainement une utopie, mais en pratique il nous oblige rechercher la clart, la
prcision, la simplicit, la comprhension par tous et toutes, de quelque
origine que ce soit, et avec quelques capacits que ce soit. Il importe donc
de tendre vers cette universalit. Dailleurs, chaque fois que vous oublierez cette rgle, un autre contributeur Opquast viendra vous le signaler ou
oprera les modifications ncessaires pour mieux lappliquer.
4. Tout rfrence une lgislation nationale sans piti tu rejeteras
Les lgislations nationales sont ncessaires et nul nest cens les mconnatre. En revanche, il arrive frquemment que, sous prtexte quune
bonne pratique est prsente sous telle ou telle forme dans une lgislation
nationale, des contributeurs souvent ressortissants du pays correspondant
proposent lajout de cette bonne pratique dans Opquast. Lacceptation de
ce type de demande conduirait introduire dans le rfrentiel la somme
de toutes les exigences contenues dans les lgislations nationales. Cela
ferait dOpquast un rfrentiel dordre juridique, ce quil nest videmment pas.
5. Les bonnes pratiques innovantes avec circonspection tu soutiendras
Il arrive frquemment que des nouvelles technologies apportent un
vrai gain de qualit aux utilisateurs et aux administrateurs. Cest mme
souvent pour cette raison quelles rencontrent le succs. En revanche, ce
nest pas parce quune pratique mergente est lvidence une bonne
pratique quelle doit forcment tre exige ds maintenant. Dans certains
cas, il faudra accepter de repousser sa mise en place. Ce peut tre tout
simplement parce que des tapes sont ncessaires aux utilisateurs pour
arriver la mettre en place ou parce que leffort de formation serait trop
important. Mais cest aussi, et surtout, parce que la pratique ne peut tre
valide avec certitude que lorsquelle est dj raliste et mise en place
sur un nombre considrable de sites.
6. Les bonnes pratiques non consensuelles de ct tu accepteras de
laisser
Certaines bonnes pratiques sont par nature non consensuelles, car le
fait de les noncer comme bonnes pratiques pour un certain ensemble
dutilisateurs conduira leur perception comme mauvaise pratique pour
tous les autres. la date daujourdhui, le meilleur exemple de pratique
non consensuelle est louverture de liens dans une nouvelle fentre:
nous avons des utilisateurs qui sont pour parce quils adorent a et des
utilisateurs qui sont contre parce quils dtestent a. Les arguments des
uns et des autres sont parfaitement valables. Alors que faire dans ce cas?
Rien. Cette bonne pratique nentre pas dans le rfrentiel, ce qui permet
chacun de faire son choix en conscience, voire mme dinventer des solutions pertinentes. Opquast na pas pour objectif de recenser le maximum
de bonnes pratiques mais que chacune dentre elles fasse consensus.

Qualit Web //Les bonnes pratiques Opquast // 21

7. Les critiques de lexistant par des propositions constructives tu


remplaceras
Lensemble des contenus dOpquast fait discussion. Chaque contributeur
Opquast a accept de jouer le jeu en proposant et quelquefois en opposant
ses ides en public. Toute critique portant sur un contenu doit toujours
donner lieu une contre-proposition constructive.
8. Lintrt des bonnes pratiques pour les utilisateurs toujours lesprit
tu garderas
Une bonne pratique doit avoir un intrt vrifiable pour tous les utilisateurs, et ventuellement pour les administrateurs du site. Ce principe
doit rester prsent votre esprit pour toutes vos propositions de bonnes
pratiques.
9. la mise en application pratique par tous les sites de tes contributions toujours tu penseras
Il y a un foss considrable entre la pertinence dune bonne pratique sur
un site individuel et sa mise en application sur lensemble des services
en ligne. La grande difficult rside dans le fait danticiper les cas limites,
les difficults de mise en application. Ne soyez pas tonns si certains
lments qui vous semblent vidents pour votre site sont contests parce
quils ne seraient pas toujours valables. Ne tombez pas non plus dans
lexcs inverse: tous les cas particuliers ne peuvent tre envisags dans
un libell de bonne pratique. Et quelques fois, il sera ncessaire de faire
des compromis sur la prcision et lexhaustivit au profit de lutilisabilit
des bonnes pratiques.

2.4 Appropriation du rfrentiel et durabilit


des bonnes pratiques
Notre hypothse est la suivante: la prsence dans une checklist
ou dans un rfrentiel dune seule rgle rejete par celui qui va
utiliser le rfrentiel est suffisante pour provoquer le rejet du
rfrentiel dans sa globalit. Or, notre objectif nest pas de dgager la totalit des informations ncessaires pour pratiquer un
mtier, mais de dgager un socle minimal de bonnes pratiques
permettant de lexercer dans des conditions de matrise correcte.
Lensemble dexigences que nous tablissons ne peut devenir
un rfrentiel utile, utilisable et donc adopt par le plus grand
nombre qu la condition que chaque rgle soit explicite, universelle, raliste, objective et vrifiable.
Toutes les rgles irralistes ou non vrifiables nuisent lappropriation du rfrentiel ou de la checklist constitue par
lensemble des rgles.
De mme, toutes les rgles qui ne font pas consensus nuisent
galement lappropriation.
Toutes les rgles non valables au niveau international nuisent
lappropriation.

22 // qualit web, la rfrence des professionnels du web

Toutes les rgles contenant des valeurs numriques peuvent

tre contestes sans fin, celles-ci tant presque toujours arbitraires et variables dans le temps.
Toutes les rgles faisant rfrence une technologie sont
susceptibles de devenir obsoltes ds la disparition de ladite
technologie ou lapparition dune technologie plus intressante
ou plus la mode.
Et enfin, toute rgle non vrifiable pourra donner lieu des
dbats sans fin.
Le rfrentiel Opquast bonnes pratiques qualit web est un moinsdisant. Lobjectif nest pas de lister un maximum de rgles, mais
de ne lister que ce qui a du sens. Un rfrentiel comme celui qui
est prsent dans cet ouvrage ne se prononce pas sur tout. Il na
pas vocation se substituer la loi, ni au savoir-faire des diffrents acteurs impliqus.
Les rfrentiels Opquast sont fait pour durer. Une revue rapide
de celui de 2004 montre que les bonnes pratiques Opquast ne
bougent pas ou trs peu. Il est toujours ncessaire de prvoir
des pages derreurs, des pages de succs ou dchec aprs vos
formulaires, toujours ncessaire de faire connatre votre politique
concernant les cookies, etc.
Le rfrentiel prsent dans ce livre a une dure de vie prvue
pour au moins cinq ans. Lavenir nous dira si cet objectif est
atteint.
Figure 9
Extrait de la version1
de la checklist de bonnes
pratiques Opquast
(2004). Comme on le
voit, ces critres sont
encore pertinents
aujourdhui.

Qualit Web //Les bonnes pratiques Opquast // 23

2.5 Transversalit, socle fondamental


et excellence
Aucun des rfrentiels de bonnes pratiques Opquast nest fait
pour viser lexcellence. Ils se veulent un socle gnraliste et des
briques complmentaires permettant de traiter des risques fondamentaux du projet web.
Chaque sujet abord dans le schma suivant (seo, Webperf,
Scurit) peut tre trait de manire quasiment infinie. Le
travail mener sur un site est sans limites.
Les bonnes pratiques Opquast qualit web sont un premier
socle transversal permettant de traiter des risques fondamentaux.
Les bonnes pratiques Opquast seo, Webperf, Steps permettent
daborder des points trs spcifiques certains sujets.
Une norme quantit dactions doptimisation reste possible
sur tous ces sujets, et cest le rle des spcialistes de chaque
sujet de les mener en cas de besoin, tout en se mfiant en
permanence de la surqualit.
Figure 10
Les bonnes pratiques
Opquast servent
identifier
et prvenir les risques
fondamentaux.

2.6 Le projet Opquast: un cosystme


pour la qualit du Web
Ds 2005, nous avons pu nous rendre compte que le simple fait de
proposer un rfrentiel de bonnes pratiques qualit tait insuffisant pour faire avancer la qualit web. La question de lvaluation
des sites sest immdiatement pose. De manire globale, nous
pensons que les spcialistes de la qualit web ont besoin dun
ensemble dapplications et doutils trs varis pour amliorer la
qualit des sites. Opquast (Open Quality Standards) est un ensemble
doutils et de briques, un framework, qui permet damliorer la
qualit web.

24 // qualit web, la rfrence des professionnels du web

Les rfrentiels Opquast et leur positionnement


Il existe plusieurs rfrentiels de bonnes pratiques Opquast:
qualit web;
seo;
Web mobile;
Open Data;
co-conception;
Webperf (performances);
Steps (accessibilit).
Nous proposons galement une checklist supplmentaire ddie
la labellisation de sites. Elle est compose de critres essentiels
choisis par les agences partenaires Opquast parmi la checklist
Opquast bonnes pratiques qualit web.

Qualit Web //Les bonnes pratiques Opquast // 25