{"1":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter aux utilisateurs plac\u00e9s dans des contextes o\u00f9 les images ne sont pas perceptibles (navigateur texte, lecteur d\u2019\u00e9cran, navigateur avec images d\u00e9sactiv\u00e9es) d\u2019\u00eatre perturb\u00e9s par des informations sur des images qui leur sont inutiles<\/li><li>Fournir aux robots d\u2019indexation uniquement des informations pertinentes<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>D\u2019une mani\u00e8re g\u00e9n\u00e9rale, si un code (un attribut HTML, par exemple) est pr\u00e9vu pour l\u2019alternative, il doit \u00eatre pr\u00e9sent, mais en restant vide<\/li><li> Pour les cas les plus courants :Donner \u00e0 chaque \u00e9l\u00e9ment img d\u00e9coratif un attribut alt vide (alt=\"\")<\/li><li>Donner \u00e0 chaque \u00e9l\u00e9ment area d\u00e9coratif un attribut alt vide<\/li><li>Laisser vide le contenu de chaque \u00e9l\u00e9ment object concern\u00e9 (entre les balises &lt;object&gt; et &lt;\/object&gt;<\/li><li>Laisser vide le contenu de chaque \u00e9l\u00e9ment canvas concern\u00e9<\/li><li>Ne donner \u00e0 chaque \u00e9l\u00e9ment svg concern\u00e9 aucun attribut ARIA qui lui conf\u00e8re un label (aria-labelledby, aria-describedby, etc)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette v\u00e9rification s\u2019effectue dans le code HTML g\u00e9n\u00e9r\u00e9 \u00e0 l\u2019aide d\u2019un inspecteur de code ou d\u2019une barre d\u2019outils d\u00e9di\u00e9e :Tester au pr\u00e9alable la pr\u00e9sence des attributs alt en v\u00e9rifiant la validit\u00e9 du code HTML g\u00e9n\u00e9r\u00e9, par exemple avec le validateur du W3C (le validateur HTML signale les images priv\u00e9es d\u2019alternative) : chaque image d\u00e9corative doit avoir un attribut alt (pr\u00e9sent mais vide)<\/li><li>V\u00e9rifier que chaque image img ne v\u00e9hiculant pas d\u2019information n\u00e9cessaire \u00e0 la compr\u00e9hension du contenu a bien un alt vide<\/li><li>V\u00e9rifier les \u00e9ventuels autres objets graphiques du type object, canvas dont le contenu (entre les balises ouvrantes et fermantes) doit \u00eatre vide<\/li><li>V\u00e9rifier les \u00e9ventuels autres \u00e9l\u00e9ments du type svg susceptibles de recevoir une alternative via un attribut ARIA<\/li><\/ul>","2":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs plac\u00e9s dans des contextes o\u00f9 les images ne sont pas perceptibles (navigateur texte, lecteur d\u2019\u00e9cran, navigateur avec images d\u00e9sactiv\u00e9es) de comprendre le sens des liens pr\u00e9sents sur des images qu\u2019ils ne peuvent voir<\/li><li>Permettre aux robots d\u2019exploiter l\u2019information v\u00e9hicul\u00e9e par les images-liens (pour le r\u00e9f\u00e9rencement, l\u2019indexation, la traduction automatique des alternatives d\u2019images-texte)<\/li><li>Permettre l\u2019affichage d\u2019un texte pertinent pendant le chargement des images<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Les images-liens sont ais\u00e9es \u00e0 identifier (elles sont le seul contenu qui est plac\u00e9 entre des balises &lt;a&gt; et &lt;\/a&gt;)<\/li><li> Il faut toutefois penser aussi aux liens g\u00e9n\u00e9r\u00e9s avec JavaScript sur d\u2019autres \u00e9l\u00e9ments<\/li><li>D\u2019une mani\u00e8re g\u00e9n\u00e9rale, il faut :donner \u00e0 chaque \u00e9l\u00e9ment img concern\u00e9 un attribut alt indiquant la cible ou le r\u00f4le du lien ;donner \u00e0 chaque \u00e9l\u00e9ment area concern\u00e9 un attribut alt indiquant la cible ou le r\u00f4le du lien ;indiquer la cible ou le r\u00f4le du lien dans le contenu de chaque \u00e9l\u00e9ment object concern\u00e9 ;indiquer la cible ou le r\u00f4le du lien dans le contenu de chaque \u00e9l\u00e9ment canvas concern\u00e9<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier que l\u2019attribut alt de chaque \u00e9l\u00e9ment img concern\u00e9 indique la cible ou le r\u00f4le du lien<\/li><li>V\u00e9rifier que l\u2019attribut alt de chaque \u00e9l\u00e9ment area concern\u00e9 indique la cible ou le r\u00f4le du lien<\/li><li>V\u00e9rifier que le contenu de chaque \u00e9l\u00e9ment object concern\u00e9 indique la cible ou le r\u00f4le du lien<\/li><li>V\u00e9rifier que le contenu de chaque \u00e9l\u00e9ment canvas concern\u00e9 indique la cible ou le r\u00f4le du lien<\/li><li>V\u00e9rifier le libell\u00e9 textuel de tout autre \u00e9l\u00e9ment ayant le r\u00f4le d\u2019un lien<\/li><\/ul>","3":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs plac\u00e9s dans des contextes o\u00f9 les  images ne sont pas perceptibles (navigateur texte, lecteur d'\u00e9cran, navigateur  avec images d\u00e9sactiv\u00e9es) de comprendre le sens des images qu'ils ne peuvent  voir<\/li><li>Permettre aux robots d'exploiter l'information v\u00e9hicul\u00e9e par  les images (r\u00e9f\u00e9rencement, indexation, traduction automatique des alternatives  d'images-texte)<\/li><li>  Permettre l'affichage d'un texte pendant le chargement des  images<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Donner \u00e0 chaque \u00e9l\u00e9ment img concern\u00e9 un attribut alt reproduisant l\u2019information<\/li><li>Donner \u00e0 chaque \u00e9l\u00e9ment area concern\u00e9 un attribut alt reproduisant l\u2019information<\/li><li>Reproduire l\u2019information dans le contenu de chaque \u00e9l\u00e9ment object concern\u00e9<\/li><li>Reproduire l\u2019information dans le contenu de chaque \u00e9l\u00e9ment canvas concern\u00e9<\/li><li>Reproduire l\u2019information dans un libell\u00e9 textuel associ\u00e9 \u00e0 chaque \u00e9l\u00e9ment svg concern\u00e9 par le biais de son attribut aria-label ou de la balise desc<\/li><li>Dans le cas d\u2019une image complexe qui ne peut \u00eatre r\u00e9sum\u00e9e de mani\u00e8re concise dans une alternative textuelle, le d\u00e9tail de l\u2019information doit \u00eatre apport\u00e9 en compl\u00e9ment \u00e0 l\u2019aide d\u2019une description \u00e9tendue :soit via l\u2019attribut longdesc de l\u2019image indiquant l\u2019URL de la description,soit via un lien adjacent \u00e0 l\u2019image jouant le m\u00eame r\u00f4le,soit dans le contenu de la page, dans le contexte imm\u00e9diat de l\u2019image<\/li><li> Dans ce dernier cas, l\u2019alternative peut signaler la pr\u00e9sence de cette description et y renvoyer<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier que l\u2019attribut alt de chaque \u00e9l\u00e9ment img concern\u00e9 reproduit l\u2019information port\u00e9e par l\u2019image<\/li><li>V\u00e9rifier que l\u2019attribut alt de chaque \u00e9l\u00e9ment area concern\u00e9 reproduit l\u2019information port\u00e9e par l\u2019image<\/li><li>V\u00e9rifier que le contenu de chaque \u00e9l\u00e9ment object concern\u00e9 reproduit l\u2019information port\u00e9e par l\u2019image<\/li><li>V\u00e9rifier que le contenu de chaque \u00e9l\u00e9ment canvas concern\u00e9 reproduit l\u2019information port\u00e9e par l\u2019image<\/li><li>V\u00e9rifier que chaque \u00e9l\u00e9ment svg concern\u00e9 est associ\u00e9 \u00e0 un libell\u00e9 textuel reproduisant l\u2019information port\u00e9e par l\u2019image par le biais de son attribut aria-label ou de la balise desc<\/li><li>V\u00e9rifier la pr\u00e9sence et la pertinence de la description \u00e9tendue le cas \u00e9ch\u00e9ant<\/li><\/ul>","4":"<p><strong>Objectif<\/strong><\/p><ul><li>Fournir un acc\u00e8s \u00e0 l'information pour les utilisateurs dont le navigateur ou la plateforme ne supporte pas l'inclusion d'objets ou les technologies utilis\u00e9es dans les objets inclus<\/li><li>Faciliter l'exploitation de ces contenus par les robots (r\u00e9f\u00e9rencement en particulier)<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer l'alternative des objets inclus via l'une des solutions suivantes :  Le contenu de l'\u00e9l\u00e9ment HTML object ;  \t\t\t\t\tLe contenu de l'\u00e9l\u00e9ment HTML noembed ;  \t\t\t\t\tUn contenu pr\u00e9sent imm\u00e9diatement avant ou apr\u00e8s l'objet ;  \t\t\t\t\tUn lien vers une page fournissant le contenu alternatif, plac\u00e9 imm\u00e9diatement avant ou apr\u00e8s l'objet<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette v\u00e9rification n\u00e9cessite la d\u00e9tection des \u00e9l\u00e9ments object et embed, en tenant compte de leur \u00e9ventuelle g\u00e9n\u00e9ration via Javascript<\/li><li> Pour chaque page contenant un de ces \u00e9l\u00e9ments&nbsp;:   D\u00e9sactiver le support des technologies tierces dans le navigateur (Flash en particulier)<\/li><li>  \t\t\t\t\tS'assurer que l'information alternative est pr\u00e9sente et affich\u00e9e, ou qu'elle est accessible gr\u00e2ce \u00e0 un lien pr\u00e9sent dans le contexte imm\u00e9diat de chaque objet<\/li><\/ul>","5":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs plac\u00e9s dans des contextes o\u00f9 les styles  ne sont pas restitu\u00e9s (navigateur texte, lecteur d'\u00e9cran, navigateur avec styles  d\u00e9sactiv\u00e9s) d\u2019acc\u00e9der \u00e0 l\u2019information pr\u00e9sente sous forme de contenus g\u00e9n\u00e9r\u00e9s  en CSS (images d\u2019arri\u00e8re-plan notamment)<\/li><li>    Permettre aux robots d'exploiter l'information v\u00e9hicul\u00e9e par  les styles CSS (r\u00e9f\u00e9rencement, indexation, traduction automatique des  alternatives)<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir un contenu masqu\u00e9 \u00e0 l\u2019affichage via CSS :\n\npour chaque information port\u00e9e par les propri\u00e9t\u00e9s CSS background-image ou content ;pour chaque information affich\u00e9e via un pseudo-\u00e9l\u00e9ment CSS :before ou :after ;et plus g\u00e9n\u00e9ralement, pour chaque information absente par ailleurs de la page et dont la restitution d\u00e9pend du support des styles<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Examiner directement le code CSS et comparer visuellement l\u2019affichage normal de la page avec son rendu apr\u00e8s d\u00e9sactivation des images d\u2019arri\u00e8re-plan<\/li><li> Pour chaque page :Afficher les feuilles de styles gr\u00e2ce \u00e0 une barre d\u2019outils d\u00e9di\u00e9s et v\u00e9rifier que les propri\u00e9t\u00e9s et \u00e9l\u00e9ments cit\u00e9s dans le paragraphe \u00ab Solution technique \u00bb sont absents des CSS ou ne sont pas utilis\u00e9s pour produire une information par ailleurs absente du code HTML<\/li><li>D\u00e9sactiver les images d\u2019arri\u00e8re-plan CSS avec une barre d\u2019outils d\u00e9di\u00e9e<\/li><li>Contr\u00f4ler l\u2019absence de perte d\u2019information, en comparant l\u2019affichage avec et sans images d\u2019arri\u00e8re-plan<\/li><\/ul>","6":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs plac\u00e9s dans des contextes o\u00f9 les polices  CSS utilis\u00e9es pour afficher des pictogrammes ne sont pas restitu\u00e9es (navigateur  texte, lecteur d'\u00e9cran, navigateur avec styles d\u00e9sactiv\u00e9s) de comprendre le  sens de ces pictogrammes<\/li><li>Permettre aux robots d'exploiter l'information v\u00e9hicul\u00e9e par ces  pictogrammes (r\u00e9f\u00e9rencement, indexation, traduction automatique des alternatives)<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir un contenu masqu\u00e9 \u00e0 l\u2019affichage via CSS pour chaque information port\u00e9e par le recours \u00e0 une police de caract\u00e8res sp\u00e9cifique<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Examiner directement le code pour v\u00e9rifier que chaque ic\u00f4ne affich\u00e9e via une police de caract\u00e8res est dot\u00e9e d\u2019une alternative dans le contenu HTML<\/li><\/ul>","7":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs qui ne peuvent acc\u00e9der au son ou \u00e0 l\u2019image propos\u00e9s d\u2019acc\u00e9der \u00e0 une transcription textuelle servant d\u2019alternative<\/li><li>Permettre aux utilisateurs qui ne peuvent acc\u00e9der au son d\u2019acc\u00e9der \u00e0 l\u2019information contenue dans la vid\u00e9o<\/li><li>Permettre l\u2019exploitation de l\u2019information par des robots pour am\u00e9liorer son indexation et son r\u00e9f\u00e9rencement, ou encore pour permettre sa traduction par des outils linguistiques en ligne<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Accompagner chaque contenu audio ou vid\u00e9o d'une transcription :  Soit int\u00e9grale (contenant les paroles et une description des sons et \u00e9l\u00e9ments visuels n\u00e9cessaires \u00e0 la compr\u00e9hension) ;&nbsp;\nSoit synth\u00e9tique (mais refl\u00e9tant la totalit\u00e9 de l'information)<\/li><li>\n\nLa transcription peut :  Figurer dans la page o\u00f9 se trouve le contenu vid\u00e9o ou audio ;  \t\t\t\t\tOu \u00eatre imm\u00e9diatement accessible par un lien pr\u00e9sent dans la page o\u00f9 se trouve le contenu vid\u00e9o ou audio<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Identifier chaque page comportant un contenu multim\u00e9dia et, dans le contexte imm\u00e9diat de chaque contenu audio ou vid\u00e9o, s\u2019assurer de la pr\u00e9sence d\u2019une transcription ou d\u2019un lien y donnant imm\u00e9diatement acc\u00e8s<\/li><\/ul>","8":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre l\u2019acc\u00e8s \u00e0 l\u2019information pour les utilisateurs dont le navigateur, la plate-forme, l\u2019aide technique ou encore le handicap (comme le daltonisme) ne permettent pas de visualiser ou de diff\u00e9rencier les couleurs<\/li><li>Rendre l\u2019information accessible aux robots d\u2019indexation<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir un compl\u00e9ment \u00e0 la couleur pour v\u00e9hiculer l\u2019information qu\u2019elle porte<\/li><li> Ce compl\u00e9ment, ind\u00e9pendant de la couche de mise en forme CSS, peut \u00eatre de plusieurs ordres :\n\npr\u00e9voir un balisage s\u00e9mantique (strong, em, etc) ;ajouter des mentions textuelles (ast\u00e9risque signalant un champ obligatoire) ;ajouter des hachures, motifs, bordures, etc dans les cartes et les graphiques<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>La v\u00e9rification n\u00e9cessite de comparer visuellement deux versions de la page : la version normale et une version o\u00f9 les couleurs seront d\u00e9sactiv\u00e9es<\/li><li> Elle est donc plus ais\u00e9e \u00e0 mener avec un double \u00e9cran<\/li><li> Pour chaque page examin\u00e9e :\n\nD\u00e9sactiver le support de la couleur via votre barre d\u2019outils de test puis passer les images en niveau de gris<\/li><li>V\u00e9rifier par comparaison si la version sans couleurs pr\u00e9sente des pertes d\u2019information<\/li><li> Ce sera par exemple le cas dans un menu de navigation o\u00f9 la rubrique en cours ne se diff\u00e9rencie que par sa couleur, ou encore dans une carte dont les zones sont de simples aplats de couleur sans bordure ni motifs<\/li><li>\n\nAttention : l\u2019information peut parfois \u00eatre pr\u00e9sente ind\u00e9pendamment de la couleur dans un attribut title, provoquant l\u2019apparition d\u2019une infobulle au survol du contenu<\/li><li> L\u2019acc\u00e8s \u00e0 l\u2019infobulle depuis le clavier n\u2019\u00e9tant \u00e0 ce jour pas possible par d\u00e9faut dans tous les navigateurs, cette solution doit \u00eatre \u00e9cart\u00e9e<\/li><\/ul>","9":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter l\u2019acc\u00e8s aux contenus ou services prot\u00e9g\u00e9s par des captchas pour les utilisateurs ne pouvant exploiter les captchas graphiques<\/li><li>Faciliter l\u2019utilisation des captchas audio<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir un lien permettant de t\u00e9l\u00e9charger le captcha audio<\/li><li>\n\nMettre \u00e0 disposition le captcha audio via un player permettant de le rejouer \u00e0 volont\u00e9<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Identifier les formulaires utilisant un captcha audio, et pour chacun de ces formulaires :\n\ns\u2019assurer que le captcha audio peut \u00eatre rejou\u00e9 ;v\u00e9rifier que le contenu correspond toujours \u00e0 la saisie attendue<\/li><\/ul>","10":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs qui ont des difficult\u00e9s \u00e0 passer les tests des captchas, en particulier graphiques, d\u2019acc\u00e9der par un autre moyen aux contenus ou services prot\u00e9g\u00e9s<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Accompagner chaque captcha, en particulier graphique (image \u00e0 lire ou \u00e0 reconna\u00eetre) :\n\nd\u2019un captcha logique (une question du type \u00ab Quelle est la couleur du cheval blanc d\u2019Henri IV ? \u00bb, une op\u00e9ration arithm\u00e9tique dont il faut donner la solution, etc) ;d\u2019un captcha audio (fichier son \u00e9non\u00e7ant un mot que l\u2019utilisateur doit alors saisir dans le champ correspondant du formulaire) ;ou d\u2019un moyen de contact (t\u00e9l\u00e9phone, e-mail, etc) permettant de r\u00e9aliser diff\u00e9remment l\u2019op\u00e9ration souhait\u00e9e (une cr\u00e9ation de compte sur demande, etc)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Identifier les formulaires contenant des captchas et, pour chacun de ces formulaires :\n\nS\u2019assurer de la pr\u00e9sence d\u2019au moins une solution alternative propos\u00e9e dans le m\u00eame formulaire ou accessible depuis un lien pr\u00e9sent dans celui-ci<\/li><li>V\u00e9rifier \u00e9galement le bon fonctionnement des captchas audio ou logiques jusqu\u2019\u00e0 la soumission r\u00e9ussie du formulaire<\/li><\/ul>","11":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la validation du code source<\/li><li>Favoriser un rendu pr\u00e9visible quel que soit le navigateur (des versions de navigateurs encore en circulation sont susceptibles de s\u2019appuyer sur la syntaxe pr\u00e9cise de la DTD pour adopter un mode de rendu CSS)<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Placer la DTD en d\u00e9but de code source (elle ne doit \u00eatre pr\u00e9c\u00e9d\u00e9e par aucun commentaire ou balisage)<\/li><li>\n\nUtiliser uniquement soit la DTD HTML5, soit l\u2019une des DTD recommand\u00e9es dans http:\/\/www&#x2e;w3&#x2e;org\/QA\/2002\/04\/valid-dtd-list&#x2e;html<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Examiner le code source des pages, par exemple via un inspecteur de code ou en l\u2019affichant \u00e0 l\u2019aide des menus du navigateur<\/li><li> Pour chaque page, v\u00e9rifier la pr\u00e9sence au d\u00e9but du code source d\u2019une DTD telle que recommand\u00e9e par http:\/\/www&#x2e;w3&#x2e;org\/QA\/2002\/04\/valid-DTD-list&#x2e;html<\/li><li>\n\nOutre l\u2019absence de DTD, une erreur courante est l\u2019utilisation d\u2019une DTD abr\u00e9g\u00e9e, c\u2019est-\u00e0-dire sous la forme &lt;!DOCTYPE html PUBLIC \"-\/\/ W3C\/\/Dtd XHTML 1&#x2e;0 Strict\/\/EN\" \"Dtd\/xhtml1-strict&#x2e;dtd\"&gt;&#x2e;\n\nEn HTML5 en revanche, la DTD doit \u00eatre : &lt;!doctype html&gt;<\/li><li>\n\n\u00c0 l\u2019exception du HTML5, la forme correcte doit pr\u00e9senter une URI compl\u00e8te, du type &lt;!DOCTYPE html PUBLIC \"-\/\/W3C\/\/Dtd XHTML 1&#x2e;0 Strict\/\/EN\" \"http:\/\/www&#x2e;w3&#x2e;org\/TR\/xhtml1\/Dtd\/ xhtml1-strict&#x2e;dtd\"&gt;&#x2e;\n\nOn rencontre parfois \u00e9galement des syntaxes erron\u00e9es suite \u00e0 la modification du tag de langue (ici, FR au lieu du EN attendu) : &lt;!DOCTYPE html PUBLIC \"-\/\/W3C\/\/Dtd XHTML 1&#x2e;0 Strict\/\/ FR\" \"http:\/\/www&#x2e;w3&#x2e;org\/TR\/xhtml1\/Dtd\/xhtml1-strict&#x2e;dtd\"&gt;&#x2e;<\/li><\/ul>","12":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter les erreurs de restitution du contenu ou d\u2019interaction via les scripts<\/li><li>Limiter les risques d\u2019interpr\u00e9tation hasardeuse du Document Object Model (DOM) par des agents utilisateurs diff\u00e9rents<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>La solution la plus radicale consiste \u00e0 s\u2019assurer de la validit\u00e9 compl\u00e8te du code source des pages, \u00e0 l\u2019aide d\u2019un validateur tel que http:\/\/validator&#x2e;w3&#x2e;org<\/li><li> Cette solution conduit cependant \u00e0 tenir compte de l\u2019ensemble des erreurs de validation du code source qui n\u2019entrent pas dans le champ de cette bonne pratique<\/li><li> Pour s\u2019en tenir au seul champ de cette bonne pratique, on veillera \u00e0 \u00e9viter toute valeur dupliqu\u00e9e d\u2019un attribut ID dans une m\u00eame page HTML<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Soumettre la page au validateur HTML du W3C (validator&#x2e;w3&#x2e;org) et v\u00e9rifier que chaque valeur d\u2019attribut id est unique dans la page<\/li><\/ul>","13":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs qui le souhaitent de visualiser la structure du contenu de la page et d\u2019y naviguer<\/li><li>Permettre aux machines et aux outils d\u2019indexation d\u2019extraire le plan de chaque page<\/li><li>Am\u00e9liorer le r\u00e9f\u00e9rencement en facilitant l\u2019interpr\u00e9tation du contenu par les robots d\u2019indexation<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Structurer le document en titres et sous-titres \u00e0 l\u2019aide des \u00e9l\u00e9ments HTML h1 \u00e0 h6<\/li><li>\n\nVeiller \u00e0 ce que la structure ne comporte pas de \u00ab trous \u00bb : un titre de niveau h2 ne doit pas \u00eatre suivi d\u2019un titre h4, h5 ou h6, par exemple<\/li><li>\n\nVeiller \u00e0 ce que chaque page comporte au moins un titre de niveau 1 avec l\u2019\u00e9l\u00e9ment h1<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque page, contr\u00f4ler successivement :\n\nla pr\u00e9sence d\u2019au moins un \u00e9l\u00e9ment h1 correspondant au titre de la section principale du contenu de la page ;la pr\u00e9sence de sous-titres h2 \u00e0 h6 (si n\u00e9cessaire) correspondant aux titres des sous-sections de contenu principal de la page ;l\u2019absence d\u2019interruption dans la succession descendante des titres h1 \u00e0 h6, c\u2019est-\u00e0-dire par exemple l\u2019absence de titre h1 suivi d\u2019un titre h3<\/li><li>\n\nLa v\u00e9rification doit s\u2019effectuer en tenant compte d\u2019\u00e9ventuels \u00e9l\u00e9ments de titres masqu\u00e9s \u00e0 l\u2019affichage ou bien de titres g\u00e9n\u00e9r\u00e9s par JavaScript<\/li><li> On peut, \u00e0 cet effet, utiliser la fonction d\u2019affichage de la table des mati\u00e8res de la page disponible dans une barre &nbsp;d'outil comme la Web Developer Toolbar (Information &gt; Plan du document)<\/li><li> Cette fonction respecte ces deux contraintes et signale automatiquement les interruptions dans la succession des niveaux de titres<\/li><li>\n\nUn double affichage c\u00f4te \u00e0 c\u00f4te de la page et de la table des mati\u00e8res cr\u00e9\u00e9e par la Web Developer Toolbar facilitera la d\u00e9tection de sections de contenus d\u00e9nu\u00e9es de titre ou mal hi\u00e9rarchis\u00e9es<\/li><\/ul>","14":"<p><strong>Objectif<\/strong><\/p><ul><li><lipermettre aux=\"\" utilisateurs=\"\" de=\"\" conserver=\"\" la=\"\" ma\u00eetrise=\"\" leur=\"\" environnement=\"\" travail<\/li><li><=\"\" p=\"\">\n\n\u00c9viter des coupures ou des pertes d\u2019information en cours de lecture, notamment pour les utilisateurs \u00e9quip\u00e9s de lecteurs d\u2019\u00e9cran qu\u2019un rafra\u00eechissement ou une redirection temporis\u00e9e interromprait lors de la consultation<\/li><li>\n\nNe pas p\u00e9naliser la consultation du contenu en mobilit\u00e9 lorsque la qualit\u00e9 du r\u00e9seau est variable sur une courte \u00e9chelle de temps<\/li><li>Permettre \u00e0 l\u2019utilisateur d\u2019\u00e9viter un surcro\u00eet non d\u00e9sir\u00e9 de co\u00fbt d\u2019utilisation des donn\u00e9es mobiles<\/li><li><\/lipermettre><\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas utiliser l\u2019\u00e9l\u00e9ment meta http-equiv=\"refresh\"<\/li><li>\n\nFournir \u00e0 l\u2019utilisateur un moyen de d\u00e9sactiver les \u00e9ventuels rafra\u00eechissements automatiques et les redirections cr\u00e9\u00e9es :\n\nen JavaScript ;via un \u00e9l\u00e9ment object, embed ou applet ;ou via un en-t\u00eate HTTP refresh<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque page examin\u00e9e :\n\nV\u00e9rifier, \u00e0 l\u2019aide d\u2019un inspecteur de code, l\u2019absence de l\u2019\u00e9l\u00e9ment meta http-equiv=\"refresh\"<\/li><li>V\u00e9rifier que la consultation de la page ne r\u00e9v\u00e8le aucun rafra\u00eechissement automatique ni aucune redirection c\u00f4t\u00e9 client qui ne soient d\u00e9sactivables auparavant via l\u2019interface du site (sans devoir faire appel \u00e0 une \u00e9ventuelle fonctionnalit\u00e9 propre au navigateur)<\/li><li>\n\nLa d\u00e9tection de l\u2019\u00e9l\u00e9ment meta http-equiv=\"refresh\" est ais\u00e9e en observant le code source de la page<\/li><li> En revanche, la diversit\u00e9 des dispositifs JavaScript de rafra\u00eechissement automatique impose de proc\u00e9der \u00e9galement \u00e0 un contr\u00f4le via la consultation de la page dans le navigateur<\/li><li> Ce contr\u00f4le peut \u00eatre facilit\u00e9 si le navigateur offre une option interdisant certains de ces rafra\u00eechissements, comme c\u2019est le cas dans Firefox, qui affiche alors un bandeau d\u2019alerte<\/li><li> Mais seule l\u2019observation de la page permet une d\u00e9tection \u00e0 coup s\u00fbr<\/li><\/ul>","15":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter aux utilisateurs les risques de m\u00e9prise sur le sens d\u2019une date<\/li><li>Faciliter la compr\u00e9hension et la r\u00e9utilisation des contenus concern\u00e9s<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>S\u2019assurer que le mois est \u00e9crit en toutes lettres (\u00ab d\u00e9cembre \u00bb) ou en abr\u00e9g\u00e9 (\u00ab d\u00e9c<\/li><li> \u00bb), mais pas au format num\u00e9rique<\/li><li>\n\nIndiquer les 4 chiffres de l\u2019ann\u00e9e<\/li><li>\n\nCette exigence doit \u00eatre pr\u00e9vue dans les syst\u00e8mes de gestion de contenu o\u00f9 la datation est automatis\u00e9e<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Identifier les pages comportant des dates, et pour chacune des dates trouv\u00e9es :\n\nV\u00e9rifier que le mois n\u2019est pas indiqu\u00e9 dans un format num\u00e9rique, par exemple 12\/12\/2012<\/li><li>V\u00e9rifier que l\u2019ann\u00e9e est indiqu\u00e9e sur quatre chiffres et non deux, par exemple 12\/12\/12<\/li><li>\n\nLes dates saisies par l\u2019utilisateur final dans les formulaires ne sont pas concern\u00e9es par cette bonne pratique : leur format est consid\u00e9r\u00e9 comme suffisamment explicite, d\u00e8s lors que la saisie s\u2019effectue via un datepicker ou bien manuelle et que le format attendu est indiqu\u00e9<\/li><\/ul>","16":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la m\u00e9morisation de l\u2019organisation des pages et de la navigation pour les utilisateurs de lecteurs d\u2019\u00e9cran ou pour ceux qui naviguent au clavier<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser un syst\u00e8me de gabarits de page et veiller \u00e0 respecter un ordre constant des principaux blocs de navigation et des contenus dans l\u2019ensemble des gabarits<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque page examin\u00e9e :\n\nComparer le code source des pages affich\u00e9es<\/li><li>V\u00e9rifier que l\u2019emplacement des blocs de navigation ne varie pas<\/li><li>\n\nSeule la v\u00e9rification du code g\u00e9n\u00e9r\u00e9 permet de contr\u00f4ler enti\u00e8rement le respect de cette bonne pratique (un menu ou un contenu peuvent parfois \u00eatre enti\u00e8rement g\u00e9n\u00e9r\u00e9s via JavaScript : l\u2019examen de la source statique ne suffit donc pas)<\/li><li>\n\nUne erreur typique est la pr\u00e9sence, sur certaines pages, du menu principal de navigation plac\u00e9 avant le contenu principal dans l\u2019ordre du code, alors qu\u2019il appara\u00eet apr\u00e8s ce dernier sur d\u2019autres pages<\/li><\/ul>","17":"<p><strong>Objectif<\/strong><\/p><ul><li>Recourir \u00e0 un jeu de caract\u00e8res international<\/li><li>Pr\u00e9venir les d\u00e9fauts d\u2019affichage<\/li><li>Faciliter la manipulation des contenus par les utilisateurs et les d\u00e9veloppeurs<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Configurer le serveur et les bases de donn\u00e9es de mani\u00e8re \u00e0 utiliser UTF-8<\/li><li>\n\nChoisir des outils (logiciels de d\u00e9veloppement, frameworks, CMS, outils de production de contenu) compatibles avec UTF-8<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette v\u00e9rification s\u2019effectue en trois temps<\/li><li> Pour chaque page examin\u00e9e :\n\nV\u00e9rifier l\u2019indication du jeu de caract\u00e8res donn\u00e9e par l\u2019en-t\u00eate HTTP content-type envoy\u00e9e par le serveur, par exemple \u00e0 l\u2019aide de la fonctionnalit\u00e9 En-t\u00eates HTTP (dans le menu Information) de la Web Developer Toolbar dans Firefox<\/li><li>V\u00e9rifier, le cas \u00e9ch\u00e9ant, la conformit\u00e9 \u00e0 cet en-t\u00eate de l\u2019\u00e9l\u00e9ment meta http-equiv=\"Content-Type\" dans le code HTML des pages, par exemple \u00e0 l\u2019aide de Web Developer Toolbar dans Firefox (menu Voir source)<\/li><li>V\u00e9rifier que le contenu des pages est effectivement encod\u00e9 en UTF-8 (absence de caract\u00e8res inattendus ou erron\u00e9s), par exemple en soumettant la page \u00e0 une validation HTML aupr\u00e8s du validateur du W3C (validator&#x2e;w3&#x2e;org)<\/li><li>\n\nL\u2019outil Internationalization Checker du W3C (validator&#x2e;w3&#x2e;org\/i18n-checker\/) permet de combiner ces trois \u00e9tapes<\/li><\/ul>","18":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre un affichage hors ligne correct des pages en indiquant au navigateur quel est le jeu de caract\u00e8res utilis\u00e9<\/li><li>Pr\u00e9venir le risque de probl\u00e8mes d\u2019affichage de caract\u00e8res li\u00e9 \u00e0 un fonctionnement parfois hasardeux des m\u00e9canismes de rattrapage des navigateurs quand ils ne disposent pas de l\u2019information n\u00e9cessaire via l\u2019en-t\u00eate HTTP content-type<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>L\u2019\u00e9l\u00e9ment meta est renseign\u00e9 en fonction de l\u2019encodage effectif du document et de son type MIME sous la forme :\n\n&lt;meta http-equiv=\"Content-Type\" content=\"text\/html; charset=ISO-8859-1\"&gt; en HTML ;&lt;meta charset=\"utf-8\"&gt; en HTML5 ;&lt;meta http-equiv=\"Content-Type\" content=\"text\/ html; charset=ISO-8859-1\" \/&gt; ou &lt;meta http- equiv=\"Content-Type\" content=\"application\/xhtml+xml; charset=ISO-8859-1\" \/&gt; en XHTML<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Ce crit\u00e8re peut \u00eatre v\u00e9rifi\u00e9 par l\u2019examen du code source, par exemple \u00e0 l\u2019aide de Firebug ou bien de la fonctionnalit\u00e9 Voir les informations Meta de la Web Developer Toolbar dans Firefox (menu Informations)<\/li><li> Pour chaque page :\n\nV\u00e9rifier la pr\u00e9sence de l\u2019\u00e9l\u00e9ment meta http-equiv=\"Content- Type\" ou charset<\/li><li>V\u00e9rifier la pertinence du jeu de caract\u00e8res indiqu\u00e9 dans son attribut content ou charset<\/li><\/ul>","19":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre une restitution correcte des contenus masqu\u00e9s qui doivent \u00eatre lus par les lecteurs d\u2019\u00e9cran<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Sauf si le contenu concern\u00e9 est destin\u00e9 \u00e0 \u00eatre rendu visible et perceptible sur action de l\u2019utilisateur (onglets, menus d\u00e9roulants, etc) :\n\nNe pas utiliser les propri\u00e9t\u00e9s display et visibility pour masquer le contenu<\/li><li>Ne pas utiliser l\u2019attribut HTML hidden pour masquer le contenu<\/li><li>Ne pas donner au contenu un attribut ARIA aria-hidden=\"true\"<\/li><li>Ne pas utiliser le param\u00e8tre wmode d\u2019un objet Flash avec les valeurs transparent ou opaque<\/li><li>\n\nUtiliser :les propri\u00e9t\u00e9s CSS permettant de positionner le contenu en dehors de la zone d\u2019affichage du navigateur (position, text- indent) ou de le rogner (clip) ;les propri\u00e9t\u00e9s ARIA permettant d\u2019associer un libell\u00e9 \u00e0 un contenu (aria-label, aria-labelledby, aria-describedby) ;ou, dans le cas d\u2019une \u00e9tiquette de champ de formulaire, l\u2019attribut title de celui-ci<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le code g\u00e9n\u00e9r\u00e9 et dans les feuilles de styles CSS des pages examin\u00e9es :\n\nD\u00e9tecter, \u00e0 l\u2019aide d\u2019un inspecteur de code, des contenus qui seraient masqu\u00e9s \u00e0 l\u2019affichage (en dehors de ceux destin\u00e9s \u00e0 \u00eatre rendus visibles sur action de l\u2019utilisateur)<\/li><li>V\u00e9rifier qu\u2019aucun de ces contenus n\u2019utilise les techniques indiqu\u00e9es dans la mise en \u0153uvre s\u2019ils sont destin\u00e9s \u00e0 \u00eatre restitu\u00e9s dans un lecteur d\u2019\u00e9cran<\/li><\/ul>","20":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre la compr\u00e9hension des contenus par les utilisateurs dont le navigateur n\u2019appliquera pas les feuilles de styles du site ou dont le mode d\u2019acc\u00e8s n\u2019est pas visuel<\/li><li>S\u00e9parer rigoureusement les contenus de la pr\u00e9sentation pour favoriser leur interop\u00e9rabilit\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Dans l\u2019usage de CSS (y compris via JavaScript), veiller \u00e0 conserver la coh\u00e9rence des contenus pour les pr\u00e9senter dans le m\u00eame ordre avec ou sans mise en forme CSS<\/li><li> On \u00e9vitera ainsi de se retrouver, par exemple, avec un menu coup\u00e9 en deux si les feuilles de styles sont d\u00e9sactiv\u00e9es<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Comparer visuellement les pages avec et sans application des styles CSS<\/li><li> L\u2019op\u00e9ration n\u00e9cessite de recourir, pour chaque page, \u00e0 l\u2019ensemble de ces m\u00e9thodes :\n\nD\u00e9sactiver les styles CSS via, par exemple, la fonctionnalit\u00e9 D\u00e9sactiver tous les styles de la Web Developer Toolbar (menu CSS)<\/li><li>V\u00e9rifier l\u2019absence de perte d\u2019informations dont la cause peut alors \u00eatre confirm\u00e9e en examinant les styles appliqu\u00e9s \u00e0 l\u2019\u00e9l\u00e9ment concern\u00e9 \u00e0 l\u2019aide d\u2019un inspecteur de code<\/li><li>V\u00e9rifier que les contenus restent lisibles, par exemple dans le cas d\u2019une image HTML transparente dont la lisibilit\u00e9 d\u00e9pendra de la couleur d\u2019arri\u00e8re-plan appliqu\u00e9e avec la propri\u00e9t\u00e9 background-color<\/li><li>V\u00e9rifier la coh\u00e9rence du contenu affich\u00e9 sans CSS, qui doit rester logiquement organis\u00e9 et parfaitement compr\u00e9hensible<\/li><li> Par exemple, un organigramme constitu\u00e9 de diff\u00e9rents blocs de texte mis en forme via des propri\u00e9t\u00e9s CSS de positionnement (position: absolute, etc) appara\u00eetra comme une succession de blocs de texte d\u00e9nu\u00e9e de sens en l\u2019absence de CSS<\/li><\/ul>","21":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre l\u2019identification des listes par les navigateurs et les aides techniques et donc leur restitution appropri\u00e9e afin de faciliter leur compr\u00e9hension par les utilisateurs<\/li><li>Am\u00e9liorer la s\u00e9mantique du contenu des pages et sa r\u00e9utilisabilit\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Soit utiliser les \u00e9l\u00e9ments HTML appropri\u00e9s :\n\nul et li pour les listes non ordonn\u00e9es ;ol et li pour les listes ordonn\u00e9es ;dl, dt et dd pour les listes de d\u00e9finitions ou de descriptions<\/li><li>\n\nSoit recourir aux attributs ARIA permettant de donner la s\u00e9mantique d\u2019une liste non ordonn\u00e9e ou ordonn\u00e9e \u00e0 un contenu balis\u00e9 de mani\u00e8re plus g\u00e9n\u00e9rique :\n\ndonner au conteneur de la liste un attribut role=\"list\" ;donner \u00e0 chaque \u00e9l\u00e9ment de la liste un attribut role=\"listitem\" ;(il n\u2019existe pas d\u2019\u00e9quivalent aux listes de d\u00e9finitions via un r\u00f4le ARIA)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque page contenant une liste :\n\nContr\u00f4ler le code source des contenus pr\u00e9sent\u00e9s sous forme de liste (caract\u00e9ris\u00e9s par la pr\u00e9sence de retours \u00e0 la ligne et de marqueurs de listes tels que des puces ou des num\u00e9ros) \u00e0 l\u2019aide d\u2019un inspecteur de code<\/li><li>V\u00e9rifier si le code source de ces listes apparentes comporte bien les \u00e9l\u00e9ments HTML correspondant au type de liste concern\u00e9 : ul li pour une liste non ordonn\u00e9e (liste \u00e0 puces), ol li pour une liste ordonn\u00e9e (liste num\u00e9rot\u00e9e) et dl dt dd pour une liste de d\u00e9finitions ou, \u00e0 d\u00e9faut, les r\u00f4les ARIA list et listitem<\/li><\/ul>","22":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter l\u2019adaptation du rendu au media (mobile ou autre) ou aux besoins de l\u2019utilisateur (agrandissement de la taille des caract\u00e8res, modification des couleurs, de la police, de la graisse, de la justification, etc)<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser des textes HTML mis en forme \u00e0 l\u2019aide des styles CSS (et en particulier les polices de caract\u00e8res t\u00e9l\u00e9chargeables, ou Web fonts)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette v\u00e9rification n\u00e9cessite l\u2019examen visuel des pages pour identifier les images ne contenant que du texte et \u00e9valuer si une mise en forme via CSS aurait permis d\u2019obtenir un rendu \u00e9quivalent<\/li><li> Pour chaque page contenant des textes mis en images :\n\nPasser en revue les images (images HTML et \u00e9ventuelles images d\u2019arri\u00e8re-plan CSS utilis\u00e9es pour simuler un contenu \u00e9ditorial dans un \u00e9l\u00e9ment vide)<\/li><li>V\u00e9rifier que les textes mis en image correspondent uniquement \u00e0 des mises en forme ne pouvant \u00eatre obtenues via les styles CSS<\/li><li>\n\nSont exclus de cette exigence : les logos, les banni\u00e8res publicitaires et les \u00e9l\u00e9ments graphiques de promotion<\/li><\/ul>","23":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l\u2019utilisateur d\u2019acc\u00e9der rapidement \u00e0 la signification d\u2019un sigle<\/li><li>Permettre l\u2019exploitation du contenu par un robot (pour l\u2019\u00e9tablissement d\u2019un index des sigles)<\/li><li>Favoriser le r\u00e9f\u00e9rencement du contenu<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Au minimum, lors de la premi\u00e8re apparition d\u2019un sigle, acronyme ou abr\u00e9viation dans la page, il s\u2019agira de veiller \u00e0 recourir \u00e0 l\u2019une des m\u00e9thodes ci-dessous :\n\nExpliciter sa signification au sein m\u00eame du texte, par exemple : \u00ab une DTD (d\u00e9claration de type de document) \u00bb<\/li><li>Fournir un lien donnant acc\u00e8s \u00e0 sa signification dans une page de glossaire ou via un affichage dynamique (bulle d\u2019aide JavaScript)<\/li><li>Baliser avec l\u2019\u00e9l\u00e9ment HTML appropri\u00e9, abbr ou acronym, et renseigner l\u2019attribut title de celui-ci pour indiquer sa signification<\/li><li>La bonne pratique ne fait cette exigence que pour la premi\u00e8re occurence dans la page : cela peut \u00eatre fait ou non pour les suivantes<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque page examin\u00e9e, identifier visuellement chaque sigle (abr\u00e9viation ou acronyme) pr\u00e9sent dans la page, puis v\u00e9rifier, pour sa premi\u00e8re occurence dans la page, la pr\u00e9sence&nbsp;:\n\nde sa signification imm\u00e9diatement indiqu\u00e9e dans le contexte, par exemple entre parenth\u00e8ses ;d\u2019un lien sur le sigle donnant acc\u00e8s \u00e0 sa signification, par exemple dans un glossaire ;ou de l\u2019\u00e9l\u00e9ment abbr (ou \u00e9ventuellement acronym si la page n\u2019est pas en HTML5) dot\u00e9 d\u2019un attribut title explicitant sa signification, ce qui peut se contr\u00f4ler, par exemple, \u00e0 l\u2019aide d\u2019un inspecteur de code<\/li><\/ul>","24":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre l\u2019exploitation pertinente du code source par les agents utilisateurs (les navigateurs, les robots d\u2019indexation des moteurs de recherche, les plages brailles, etc)<\/li><li>All\u00e9ger le code source en d\u00e9portant la mise en forme dans les CSS<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser les \u00e9l\u00e9ments HTML en respectant leur r\u00f4le s\u00e9mantique<\/li><li>\n\nUtiliser exclusivement les styles CSS pour obtenir des effets de mise en forme<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>La v\u00e9rification de cette bonne pratique couvre un tr\u00e8s large \u00e9ventail d\u2019erreurs potentielles, parfois inattendues<\/li><li> Pour chaque page examin\u00e9e, il faudra v\u00e9rifier que chaque balise a \u00e9t\u00e9 choisie suivant le sens s\u00e9mantique pr\u00e9vu par la grammaire utilis\u00e9e<\/li><li> Pour cela, deux m\u00e9thodes sont possibles :\n\nV\u00e9rifier, dans le code source de la page ou \u00e0 l\u2019aide de Firebug, que chaque \u00e9l\u00e9ment HTML est utilis\u00e9 conform\u00e9ment \u00e0 la DTD indiqu\u00e9e pour le document<\/li><li>Afficher la page sans styles CSS (par exemple \u00e0 l\u2019aide de la Web Developer Toolbar)<\/li><li> Cela vous permettra de rep\u00e9rer imm\u00e9diatement les textes qui apparaissent avec une mise en forme particuli\u00e8re (taille importante, mise en gras, indentation, etc)<\/li><li> Vous pourrez \u00e9galement contr\u00f4ler que l\u2019application des balises qui entra\u00eene cette mise en forme est justifi\u00e9e (par exemple, s\u2019il s\u2019agit bien d\u2019un titre balis\u00e9 avec un \u00e9l\u00e9ment de titrage h1 ou d\u2019une citation balis\u00e9e avec un \u00e9l\u00e9ment block-quote)<\/li><\/ul>","25":"<p><strong>Objectif<\/strong><\/p><ul><li>Favoriser l\u2019adaptation de la mise en forme des contenus par les agents utilisateurs, selon les besoins de l\u2019utilisateur<\/li><li>R\u00e9duire le poids du code source des pages, en incitant \u00e0 mutualiser et \u00e0 externaliser les informations de mise en forme gr\u00e2ce \u00e0 CSS<\/li><li>Faciliter la r\u00e9utilisation du contenu sans contraintes li\u00e9es \u00e0 sa mise en forme initiale<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas utiliser les \u00e9l\u00e9ments et attributs de pr\u00e9sentation HTML<\/li><li>\n\nUtiliser syst\u00e9matiquement les styles CSS \u00e9quivalents<\/li><li> Le d\u00e9veloppement du code sous une DTD XHTML, HTML stricte ou HTML5 facilite le contr\u00f4le de l\u2019absence d\u2019\u00e9l\u00e9ments et attributs de pr\u00e9sentation<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque page audit\u00e9e :&nbsp;\n\nProc\u00e9der \u00e0 une validation HTML de la page \u00e0 l'aide du validateur HTML du W3C (http:\/\/validator&#x2e;w3&#x2e;org) en for\u00e7ant celle-ci sous la DTD HTML ou XHTML strict dans la cas du HTML4 ou du XHTML1&#x2e;0<\/li><li> Ou, pour du HTML5, en proc\u00e9dant \u00e0 la validation HTML de la page sans autre formalit\u00e9<\/li><li>\n\nRep\u00e9rer les \u00e9l\u00e9ments et attributs de pr\u00e9sentation d\u00e9tect\u00e9s par le validateur en tant qu'erreurs<\/li><li> Dans le d\u00e9tail, cela revient \u00e0 v\u00e9rifier :\n\nDans tous les cas, l'absence des \u00e9l\u00e9ments marquee et blink<\/li><li>\n\nEn HTML4&#x2e;01 et en XHTML1&#x2e;0, l'absence des \u00e9l\u00e9ments suivants&nbsp;: basefont, blink, center, font, s, strike, tt et u<\/li><li>\n\nEn HTML4&#x2e;01 et en XHTML1&#x2e;0, l'absence des attributs suivants&nbsp;:    align pour les \u00e9l\u00e9ments caption, applet, iframe, img, input, object, legend, table, hr, div, h1, h2, h3, h4, h5, h6, p<\/li><li>  \t\t\t\t\t  alink, link, text et vlink pour l'\u00e9l\u00e9ment body<\/li><li>  \t\t\t\t\t  background pour l'\u00e9l\u00e9 ment body<\/li><li>  \t\t\t\t\t  bgcolor pour les \u00e9l\u00e9ments table, tr, td, th et body<\/li><li>  \t\t\t\t\t  border pour les \u00e9l\u00e9ments img et object<\/li><li>  \t\t\t\t\t  clear pour l'\u00e9l\u00e9ment br<\/li><li>  \t\t\t\t\t  compact pour les \u00e9l\u00e9ments dir, dl, menu, ol et ul    \t\t\t\t\t  height pour les \u00e9l\u00e9ments td, th et applet    \t\t\t\t\t  hspace et vspace pour les \u00e9l\u00e9ments applet, img, object    \t\t\t\t\t  noshade pour l'\u00e9l\u00e9ment hr    \t\t\t\t\t  nowrap pour les \u00e9l\u00e9ments td et th    \t\t\t\t\t  size pour l'\u00e9l\u00e9ment hr    \t\t\t\t\t  type pour les \u00e9l\u00e9ments li, ul et ol    \t\t\t\t\t  value pour l'\u00e9l\u00e9ment li    \t\t\t\t\t  width pour les \u00e9l\u00e9ments hr, th, td, applet et pre\n\nEn HTML5, l'absence des \u00e9l\u00e9ments suivants : basefont, big, center, font, strike, tt\n\nEn HTML5, l'absence des attributs suivants :    align pour les \u00e9l\u00e9ments caption, iframe, img, input, object, legend, table, hr, div, h1, h2, h3, h4, h5, h6, p, col, colgroup, tbody, td, tfoot, th, thead et tr<\/li><li>  \t\t\t\t\talink, link, text et vlink pour l'\u00e9l\u00e9ment body<\/li><li>  \t\t\t\t\tbackground pour l'\u00e9l\u00e9ment body<\/li><li>  \t\t\t\t\tbgcolor pour les \u00e9l\u00e9ments table, tr, td, th et body<\/li><li>  \t\t\t\t\tborder pour l'\u00e9l\u00e9ment object<\/li><li>  \t\t\t\t\t  cellpadding et cellspacing pour l'\u00e9l\u00e9ment table<\/li><li>  \t\t\t\t\t  char et charoff pour les \u00e9l\u00e9ments col, colgroup, tbody, td, tfoot, th, thead et tr<\/li><li>  \t\t\t\t\tclear pour l'\u00e9l\u00e9ment br<\/li><li>  \t\t\t\t\tcompact pour les \u00e9l\u00e9ments dl, menu, ol et ul<\/li><li>  \t\t\t\t\t  frame pour l'\u00e9l\u00e9ment table<\/li><li>  \t\t\t\t\t  frameborder pour l'\u00e9l\u00e9ment iframe<\/li><li>  \t\t\t\t\theight pour les \u00e9l\u00e9ments td et th<\/li><li>  \t\t\t\t\thspace et vspace pour les \u00e9l\u00e9ments img et object<\/li><li>  \t\t\t\t\t  marginheight et marginwidth pour l'\u00e9l\u00e9ment iframe<\/li><li>  \t\t\t\t\tnoshade pour l'\u00e9l\u00e9ment hr<\/li><li>  \t\t\t\t\tnowrap pour les \u00e9l\u00e9ments td et th<\/li><li>  \t\t\t\t\t  rules pour l'\u00e9l\u00e9ment table<\/li><li>  \t\t\t\t\t  scrolling pour l'\u00e9l\u00e9ment iframe<\/li><li>  \t\t\t\t\tsize pour l'\u00e9l\u00e9ment hr<\/li><li>  \t\t\t\t\t  type pour les \u00e9l\u00e9ments li, ol et ul<\/li><li>  \t\t\t\t\tvalign pour les \u00e9l\u00e9ments col, colgroup, tbody, td, tfoot, th, thead et tr<\/li><li>  \t\t\t\t\twidth pour les \u00e9l\u00e9ments hr, table, td, th, col, colgroup et pre<\/li><\/ul>","26":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter le retour d\u2019information de la part des utilisateurs<\/li><li>Favoriser la confiance en garantissant d\u2019entr\u00e9e de jeu \u00e0 l\u2019utilisateur la possibilit\u00e9 d\u2019un recours en cas de difficult\u00e9s<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer, au minimum, l\u2019adresse e-mail de l\u2019auteur et\/ou du webmestre ou mettre en place un formulaire permettant de les contacter<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le site examin\u00e9 :\n\nV\u00e9rifier qu\u2019un mode de contact est propos\u00e9 sur au moins une page du site<\/li><li>V\u00e9rifier qu\u2019il est effectivement possible de joindre l\u2019auteur et\/ou le webmestre via les modes de contact propos\u00e9s<\/li><\/ul>","27":"<p><strong>Objectif<\/strong><\/p><ul><li>Optimiser les possibilit\u00e9s de retour d\u2019information de la part des utilisateurs<\/li><li>\u00c9viter de mettre l\u2019utilisateur en difficult\u00e9 en cas d\u2019indisponibilit\u00e9 ou de probl\u00e8mes d\u2019utilisation de l\u2019un des moyens de contact<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Par exemple, indiquer l\u2019adresse postale ou le num\u00e9ro de t\u00e9l\u00e9phone de l\u2019auteur et\/ou du webmestre et mettre en place un formulaire permettant de les contacter<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans l\u2019ensemble du site :\n\nV\u00e9rifier la pr\u00e9sence d\u2019au moins deux modes de contact<\/li><li>V\u00e9rifier qu\u2019il est possible de joindre effectivement l\u2019auteur et\/ou le webmestre via les modes de contact propos\u00e9s<\/li><\/ul>","28":"<p><strong>Objectif<\/strong><\/p><ul><li>Favoriser l\u2019identification de l\u2019entit\u00e9 responsable des contenus et des services<\/li><li>Fournir un moyen de contact alternatif<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Les coordonn\u00e9es postales et t\u00e9l\u00e9phoniques peuvent \u00eatre indiqu\u00e9es tout aussi bien :\n\nsur une page unique de type Mentions l\u00e9gales, \u00c0 propos ou Contact ;de mani\u00e8re r\u00e9p\u00e9t\u00e9e et syst\u00e9matique dans les pieds de page du site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le site audit\u00e9, et plus particuli\u00e8rement dans les pages d\u2019accueil, de contact, des mentions l\u00e9gales ou \u00c0 propos, contr\u00f4ler la pr\u00e9sence d\u2019au moins une mention des coordonn\u00e9es postales et t\u00e9l\u00e9phoniques de la repr\u00e9sentation locale ou du si\u00e8ge social de la soci\u00e9t\u00e9 ou de l\u2019organisation concern\u00e9e<\/li><\/ul>","29":"<p><strong>Objectif<\/strong><\/p><ul><li>Informer les utilisateurs de la prise en compte de leur demande<\/li><li>Permettre aux utilisateurs d\u2019obtenir une confirmation archivable de la bonne r\u00e9ception de leur demande d\u2019information<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Faire en sorte que la validation de chaque formulaire de contact ou de demande d\u2019information d\u00e9clenche l\u2019envoi d\u2019un accus\u00e9 de r\u00e9ception \u00e0 l\u2019attention de l\u2019envoyeur<\/li><li> Cela suppose bien entendu de rendre obligatoire le champ de saisie de l\u2019adresse e-mail dans chaque formulaire<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Via un formulaire de contact ou via le canal de contact mail indiqu\u00e9 :Adresser une demande d\u2019information fictive en utilisant une adresse e-mail r\u00e9elle<\/li><li>Contr\u00f4ler qu\u2019un accus\u00e9 de r\u00e9ception est bien re\u00e7u \u00e0 cette adresse<\/li><\/ul>","30":"<p><strong>Objectif<\/strong><\/p><ul><li>Informer les utilisateurs sur les d\u00e9lais chiffr\u00e9s de r\u00e9ponse<\/li><li>Limiter les risques de relance de la part des utilisateurs<\/li><li>Rassurer sur la capacit\u00e9 \u00e0 prendre en compte les demandes<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer le d\u00e9lai chiffr\u00e9 de r\u00e9ponse pr\u00e9vu pour chaque formulaire de demande d'information<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans toute page comportant un formulaire de contact, v\u00e9rifier qu'une indication chiffr\u00e9e de d\u00e9lai de r\u00e9ponse est pr\u00e9sente<\/li><li>\n\nNi le d\u00e9lai en lui-m\u00eame ni son respect effectif ne font l'objet d'une validation&nbsp;: seule la pr\u00e9sence de sa mention est contr\u00f4l\u00e9e<\/li><\/ul>","31":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter l'identification de l'entit\u00e9 ou de la personne responsable des contenus ou des services<\/li><li>Permettre \u00e0 des utilisateurs de s'assurer qu'ils sont bien sur le bon site et non sur un site de phishing, par exemple<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Solution 1&nbsp;: Lorsque cela est possible, modifier les donn\u00e9es contenues dans le Whois de fa\u00e7on \u00e0 ce qu'au moins l'un des contacts soit directement reli\u00e9 au propri\u00e9taire du site<\/li><li>\nSolution 2&nbsp;: Modifier le site (les mentions l\u00e9gales, par exemple) de fa\u00e7on \u00e0 ce que l'un des contacts du Whois soit mentionn\u00e9<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le Whois du site obtenu \u00e0 l'aide d'un outil comme http:\/\/whois&#x2e;net\/ pour le nom de domaine concern\u00e9 :   V\u00e9rifier que l'un des trois contacts fournis contient directement le nom du propri\u00e9taire du site ;   \t\t\t\t\tOu, \u00e0 d\u00e9faut, v\u00e9rifier qu'au moins l'un des noms indiqu\u00e9s est cit\u00e9 dans le site, par exemple, au sein des mentions l\u00e9gales<\/li><\/ul>","32":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier imm\u00e9diatement le site dans les onglets, les favoris, dans la fen\u00eatre du navigateur ou encore dans les lecteurs d'\u00e9cran<\/li><li>Am\u00e9liorer le r\u00e9f\u00e9rencement du site et sa pr\u00e9sentation dans les moteurs de recherche<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>R\u00e9diger le contenu de l'\u00e9l\u00e9ment title de chaque page de mani\u00e8re \u00e0 y indiquer le nom du site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque page du site, v\u00e9rifier que le nom du site est pr\u00e9sent dans le titre (\u00e9l\u00e9ment title) de page<\/li><li>\n\nLe contr\u00f4le peut \u00eatre effectu\u00e9 de mani\u00e8re exhaustive si l'on dispose d'un outil permettant de dresser la liste compl\u00e8te des titres de toutes les pages (c'est le cas, par exemple, de Xenu's Link Sleuth)<\/li><li> Il peut \u00e9galement \u00eatre effectu\u00e9 \u00e0 partir d'une v\u00e9rification des templates utilis\u00e9s par le CMS ou d'un \u00e9chantillon de pages-types repr\u00e9sentatives de ceux-ci<\/li><li> Dans tous les cas, on veillera \u00e0 prendre en compte tout particuli\u00e8rement les pages d\u00e9pendant de services tiers, o\u00f9 la bonne pratique risque davantage de ne pas avoir \u00e9t\u00e9 prise en compte<\/li><\/ul>","33":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier imm\u00e9diatement la nature des contenus de chaque page dans les onglets, les favoris, dans la fen\u00eatre du navigateur ou encore dans les lecteurs d'\u00e9cran<\/li><li> Am\u00e9liorer le r\u00e9f\u00e9rencement des pages et leur pr\u00e9sentation dans les moteurs de recherche<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>R\u00e9diger le contenu de l'\u00e9l\u00e9ment title de chaque page de mani\u00e8re \u00e0 ce qu'il d\u00e9crive, de la fa\u00e7on la plus concise possible, le contenu ou la fonction de la page , y compris \u00e0 la suite d'une requ\u00eate Ajax modifiant de mani\u00e8re essentielle le contenu de la page<\/li><li>\n\nPr\u00e9ciser quelle est l'\u00e9tape en cours d'un processus dans l'\u00e9l\u00e9ment title des pages<\/li><li> Par exemple, inscrire \u00ab&nbsp;\u00c9tape 3 de votre inscription&nbsp;\u00bb dans l'\u00e9l\u00e9ment title de la page correspondant \u00e0 la troisi\u00e8me \u00e9tape d'un formulaire d'inscription<\/li><li>\n\nPr\u00e9ciser, dans le cas de l'affichage d'une s\u00e9rie de r\u00e9sultats de recherche, quel est l'intervalle de r\u00e9sultats affich\u00e9 dans la page courante<\/li><li> Par exemple, \u00ab R\u00e9sultats 10 \u00e0 19 de la recherche sur \u201cFoo\u201d&nbsp;\u00bb<\/li><li>\n\nPr\u00e9ciser l'\u00e9tat dans le titre d'une page de demande de confirmation ou d'annulation lors de la soumission d'un formulaire (exemple : \u00ab&nbsp;Demande de confirmation de suppression - Mes documents&nbsp;\u00bb)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans toutes les pages du site, y compris dans les pages d'un processus ou d'une s\u00e9rie de r\u00e9sultats de recherche, ou encore dans les pages dont le contenu peut \u00eatre modifi\u00e9 de mani\u00e8re majeure via Ajax :  V\u00e9rifier que chaque titre de page (\u00e9l\u00e9ment title) permet d'identifier le contenu ou la fonction de la page<\/li><\/ul>","34":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre une identification imm\u00e9diate des contenus publicitaires ou sponsoris\u00e9s<\/li><li>\u00c9viter les confusions entre contenus r\u00e9dactionnels et publicitaires<\/li><li>Pr\u00e9venir les risques associ\u00e9s aux conflits d'int\u00e9r\u00eat<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Signaler les publicit\u00e9s par une mention permettant de les identifier (publicit\u00e9, pub, partenariats\u2026)<\/li><li>\n\nDans la mesure du possible, s\u00e9parer graphiquement la publicit\u00e9 du reste du contenu<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Au sein du site examin\u00e9 :  Identifier les contenus publicitaires, ce qui peut \u00eatre simplifi\u00e9 par l'examen des templates (particuli\u00e8rement dans le cas du recours \u00e0 une r\u00e9gie publicitaire)<\/li><li>   \t\t\t\t\tV\u00e9rifier que tous les espaces d\u00e9di\u00e9s \u00e0 la publicit\u00e9 comportent une mention permettant de les identifier sans ambigu\u00eft\u00e9&nbsp;: typiquement, la mention \u00ab&nbsp;publicit\u00e9&nbsp;\u00bb affich\u00e9e au dessus ou en dessous du contenu concern\u00e9<\/li><\/ul>","35":"<p><strong>Objectif<\/strong><\/p><ul><li>Informer les utilisateurs sur les conditions sous lesquelles sont publi\u00e9s les contenus<\/li><li>\n\nInformer les utilisateurs sur les conditions de copie et de r\u00e9utilisation<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer les droits de copie et de r\u00e9utilisation des divers \u00e9l\u00e9ments du site sur chaque page ou via un hyperlien pointant vers une page sp\u00e9cifique<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Au sein de chacune des pages ou \u00e0 partir des templates du site, v\u00e9rifier la pr\u00e9sence de la mention compl\u00e8te des droits de copie et de r\u00e9utilisation ou d'un lien donnant directement acc\u00e8s \u00e0 la mention des droits de copie et de r\u00e9utilisation<\/li><\/ul>","36":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier imm\u00e9diatement les nouveaux contenus ou services en ligne<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Les diff\u00e9rentes solutions ci-dessous peuvent \u00eatre d\u00e9ploy\u00e9es seules ou conjointement&nbsp;:   Publier un flux RSS des actualit\u00e9s du site ;  \t\t\t\t\tPublier une rubrique du type \u00ab&nbsp;Actualit\u00e9s du site&nbsp;\u00bb ou \u00ab&nbsp;Quoi de neuf ?&nbsp;\u00bb ;  \t\t\t\t\tIndiquer un compte de type Twitter, Facebook ou autre, o\u00f9 sont publi\u00e9es les actualit\u00e9s concernant le site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans l'ensemble du site, v\u00e9rifier que les nouveaux contenus ou services sont accessibles gr\u00e2ce \u00e0 un canal d'information interne au site (flux RSS des actualit\u00e9s, rubrique du type \u00ab&nbsp;Actualit\u00e9s du site&nbsp;\u00bb, etc) ou via un canal externe lui-m\u00eame accessible depuis le site (obligatoirement via sa page d'accueil) tel qu'un compte Twitter par exemple<\/li><\/ul>","37":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre l'archivage des contenus cr\u00e9\u00e9s par l'utilisateur<\/li><li>\u00c9viter \u00e0 l'utilisateur d'\u00e9ventuelles saisies redoubl\u00e9es en cas de r\u00e9utilisation des contenus<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir une solution d'exportation des contenus dans un format bureautique courant, dans un format XML courant ou dans un format dont les sp\u00e9cifications sont publiques<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque espace personnel au sein duquel il est possible de saisir ou cr\u00e9er des images, documents ou toute autre donn\u00e9e :  Saisir ces diff\u00e9rents types de contenus ;   \t\t\t\t\tPuis, v\u00e9rifier qu'il est possible d'exporter les contenus personnellement saisis ou cr\u00e9\u00e9s dans un format standard<\/li><\/ul>","38":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de comprendre les contenus sectoriels ou \u00e0 caract\u00e8re technique<\/li><li>Faciliter l'utilisation d'un service<\/li><li>Am\u00e9liorer le r\u00e9f\u00e9rencement sur des mots-cl\u00e9s ou expressions techniques<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pour mettre en \u0153uvre cette bonne pratique, il s'agira de fournir :  Une section, une page ou une s\u00e9rie de pages de glossaire explicitant le vocabulaire technique ou sectoriel utilis\u00e9 dans le contenu du site<\/li><li> Ce glossaire devra \u00eatre accessible directement depuis chaque page du site<\/li><li>  \t\t\t\t\tOu bien un m\u00e9canisme permettant \u00e0 l'utilisateur d'acc\u00e9der \u00e0 la d\u00e9finition des termes du vocabulaire technique ou sectoriel, depuis au moins leur premi\u00e8re occurrence dans chaque page du site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque page contenant du vocabulaire sp\u00e9cifique, contr\u00f4ler qu'il est possible d'acc\u00e9der&nbsp;:   \u00c0 une section jouant le r\u00f4le de glossaire dans chaque page concern\u00e9e ;   \t\t\t\t\t\u00c0 une page ou une s\u00e9rie de pages de glossaire accessibles via les menus de navigation ;  \t\t\t\t\tOu directement \u00e0 la d\u00e9finition des termes depuis au moins leur premi\u00e8re occurrence dans chaque page du site via un lien ou un tooltip<\/li><\/ul>","39":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l\u2019acheteur de commander imm\u00e9diatement<\/li><li>Lever la barri\u00e8re de la cr\u00e9ation de compte<\/li><li>Augmenter le taux de conversion<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Proposer deux options lors de la commande : commande sans cr\u00e9ation de compte et commande avec cr\u00e9ation d\u2019un compte (ou avec un compte existant)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>D\u00e9marrer une commande et contr\u00f4ler si celle-ci peut \u00eatre men\u00e9e \u00e0 terme sans cr\u00e9ation de compte sur le site<\/li><\/ul>","40":"<p><strong>Objectif<\/strong><\/p><ul><li>Laisser \u00e0 l'utilisateur le contr\u00f4le de sa commande<\/li><li>Ne pas compromettre la relation de confiance avec l'utilisateur<\/li><li>\u00c9viter toute forme de vente forc\u00e9e<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>N'inclure dans le panier de l'utilisateur que des produits ou services qu'il a explicitement s\u00e9lectionn\u00e9s<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site de e-commerce, dans la page affichant le panier, v\u00e9rifier qu'une commande finalis\u00e9e ne donne pas lieu \u00e0 des ajouts au panier de produits ou services non s\u00e9lectionn\u00e9s<\/li><li>\n\nCe contr\u00f4le gagne \u00e0 s'effectuer de pair avec celui des bonnes pratiques 105 sur l'envoi d'un courriel indiquant la r\u00e9f\u00e9rence de la transaction et 106 sur l'indication finale de la r\u00e9f\u00e9rence de la transaction<\/li><\/ul>","41":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre d'anticiper d'\u00e9ventuelles difficult\u00e9s et une augmentation du d\u00e9lai de livraison<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer avant la commande et sur le formulaire r\u00e9capitulatif la disponibilit\u00e9 des produits s\u00e9lectionn\u00e9s<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans les pages produits et dans le formulaire r\u00e9capitulant la commande&nbsp;:   Contr\u00f4ler que les informations relatives \u00e0 la disponibilit\u00e9 des produits s\u00e9lectionn\u00e9s sont bien disponibles avant de d\u00e9buter la commande et apr\u00e8s validation (sur le formulaire r\u00e9capitulatif<\/li><li>\n\nCe contr\u00f4le gagne \u00e0 s'effectuer de pair avec la v\u00e9rification des bonnes pratiques 105 sur l'envoi d'un courriel indiquant la r\u00e9f\u00e9rence de la transaction, 106 sur l'indication finale de celle-ci, 104 sur la disponibilit\u00e9 de deux moyens de paiement, 107 sur l'indication des conditions de d\u00e9bit ou d'encaissement, 14 sur le d\u00e9lai de livraison estim\u00e9, 22 sur le sous-total d\u00e9taill\u00e9 et 21 sur la possibilit\u00e9 de changer les quantit\u00e9s command\u00e9es<\/li><\/ul>","42":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier la date r\u00e9elle \u00e0 laquelle le bien command\u00e9 sera effectivement en leur possession<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer, sur le r\u00e9capitulatif de la commande et avant validation d\u00e9finitive, les informations relatives aux d\u00e9lais de livraison estim\u00e9s<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans la page pr\u00e9sentant le r\u00e9capitulatif de la commande, v\u00e9rifier la pr\u00e9sence, avant validation d\u00e9finitive de la commande, des informations relatives aux d\u00e9lais de livraison estim\u00e9s<\/li><li>\n\nCe contr\u00f4le gagne \u00e0 s'effectuer de pair avec le contr\u00f4le des bonnes pratiques 105 sur l'envoi d'un courriel indiquant la r\u00e9f\u00e9rence de la transaction, 106 sur l'indication finale de celle-ci, 104 sur la disponibilit\u00e9 de deux moyens de paiement, 107 sur l'indication des conditions de d\u00e9bit ou d'encaissement, 18 sur la disponibilit\u00e9 des produits, 22 sur la pr\u00e9sence d'un sous-total d\u00e9taill\u00e9 et, enfin 21 sur la possibilit\u00e9 de changer les quantit\u00e9s command\u00e9es<\/li><\/ul>","43":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l\u2019utilisateur d\u2019anticiper les conditions et les moyens d\u2019acc\u00e8s au service ou au bien d\u00e9mat\u00e9rialis\u00e9<\/li><li>\u00c9viter les d\u00e9ceptions et le traitement de r\u00e9clamations<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pr\u00e9ciser dans la fiche produit ou dans une page d\u00e9di\u00e9e accessible avant le d\u00e9but de la commande par quel moyen l\u2019utilisateur acc\u00e9dera-t-il au bien concern\u00e9 : d\u00e9lai, dur\u00e9e de disponibilit\u00e9, format, canal (e-mail, t\u00e9l\u00e9chargement, acc\u00e8s en ligne, etc)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Contr\u00f4ler manuellement la pr\u00e9sence des informations sur les modalit\u00e9s de r\u00e9cup\u00e9ration du produit, accessibles avant le d\u00e9but de la commande<\/li><\/ul>","44":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur de modifier facilement sa commande<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Proposer \u00e0 l'utilisateur une option sp\u00e9cifique sur le formulaire de commande lui permettant de modifier les quantit\u00e9s command\u00e9es mais aussi d'annuler ou d'ajouter un article avant validation de la commande<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site de vente en ligne :   Faire une commande de test ;  \t\t\t\t\tV\u00e9rifier la possibilit\u00e9 de changer les quantit\u00e9s command\u00e9es avant la validation<\/li><\/ul>","45":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier pr\u00e9cis\u00e9ment la nature et les sp\u00e9cifications des produits propos\u00e9s<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer sur le site les informations relatives \u00e0 la nature ainsi qu'aux caract\u00e9ristiques des produits et services propos\u00e9s<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans les pages produits, ou dans la page d'accueil, ou la page des mentions l\u00e9gales, la page d'aide ou encore dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente :  V\u00e9rifier la pr\u00e9sence d'informations relatives \u00e0 la nature et aux caract\u00e9ristiques des produits et services propos\u00e9s<\/li><\/ul>","46":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier la p\u00e9riode au cours de laquelle ils peuvent b\u00e9n\u00e9ficier des offres propos\u00e9es<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer sur le site les informations relatives \u00e0 la p\u00e9riode et aux conditions de validit\u00e9 des offres sp\u00e9ciales et des promotions propos\u00e9es<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans les pages produits, ou dans la page d'accueil, ou dans la page des mentions l\u00e9gales, la page d'aide, ou encore dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente :  V\u00e9rifier la pr\u00e9sence des informations relatives \u00e0 la p\u00e9riode et aux conditions de validit\u00e9 des offres sp\u00e9ciales et de promotions propos\u00e9es<\/li><\/ul>","47":"<p><strong>Objectif<\/strong><\/p><ul><li>Fournir aux utilisateurs une indication v\u00e9rifiable de l'existence officielle de la structure qui propose les contenus ou le service<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer le num\u00e9ro d'immatriculation d\u00e9livr\u00e9 \u00e0 la soci\u00e9t\u00e9 ou association au terme des proc\u00e9dures l\u00e9gales d'enregistrement en vigueur dans son pays<\/li><li> Cette bonne pratique ne s'applique pas aux personnes physiques, sauf si elles sont constitu\u00e9es en entit\u00e9 juridique (freelances, auto-entrepreneurs, etc)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Sur la page d'accueil, ou sur la page des mentions l\u00e9gales, la page d'\u00e0 propos, de contact, ou encore dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente&nbsp;:   V\u00e9rifier que le num\u00e9ro d'immatriculation d\u00e9livr\u00e9 \u00e0 la soci\u00e9t\u00e9 ou association au terme des proc\u00e9dures l\u00e9gales d'enregistrement en vigueur dans son pays est indiqu\u00e9<\/li><\/ul>","48":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur de conna\u00eetre le d\u00e9tail du montant de sa commande<\/li><li>Lever un frein \u00e0 la validation d'une commande<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer sur le formulaire r\u00e9capitulatif de la commande et avant validation, le sous-total d\u00e9taill\u00e9 du co\u00fbt du produit ou service command\u00e9<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site de vente en ligne :   Entreprendre une commande de test ;  \t\t\t\t\tV\u00e9rifier la pr\u00e9sence du sous-total d\u00e9taill\u00e9 (quantit\u00e9s, montants, frais, assurances, etc) avant la validation<\/li><li>\n\nCette v\u00e9rification gagne \u00e0 s'effectuer de pair avec le contr\u00f4le des bonnes pratiques 105 sur l'envoi d'un courriel indiquant la r\u00e9f\u00e9rence de la transaction, 106 sur l'indication finale de celle-ci, 104 sur la disponibilit\u00e9 de deux moyens de paiement, 107 sur l'indication des conditions de d\u00e9bit ou d'encaissement, 14 sur le d\u00e9lai de livraison estim\u00e9, 18 sur la disponibilit\u00e9 des produits et 21 sur la possibilit\u00e9 de changer les quantit\u00e9s command\u00e9es<\/li><\/ul>","49":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur d'identifier le montant total qu'il aura \u00e0 payer et les diff\u00e9rentes composantes de ce montant<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer dans le site les conditions de financement des cr\u00e9dits propos\u00e9s aux clients<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans la page d'accueil ou dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente ou toute autre page du site&nbsp;:   V\u00e9rifier la pr\u00e9sence d'informations relatives aux conditions de financement des cr\u00e9dits propos\u00e9s aux clients<\/li><\/ul>","50":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de conna\u00eetre les conditions d'assistance en cas de difficult\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer, dans les conditions g\u00e9n\u00e9rales, les informations relatives aux conditions de fonctionnement du service apr\u00e8s-vente<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans la page d'accueil, la page des mentions l\u00e9gales, la page d'aide ou encore dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente&nbsp;:  V\u00e9rifier la pr\u00e9sence des informations relatives aux conditions de fonctionnement du service apr\u00e8s-vente<\/li><\/ul>","51":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier pr\u00e9cis\u00e9ment les conditions de l'encaissement<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer dans le processus de commande et de gestion du panier les conditions de d\u00e9bit ou d'encaissement avant la validation de celui-ci<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site de vente en ligne&nbsp;:  Entreprendre une proc\u00e9dure de commande ;   \t\t\t\t\tPuis, v\u00e9rifier que les conditions de d\u00e9bit ou d'encaissement sont affich\u00e9es ou disponibles avant la validation d\u00e9finitive du panier<\/li><li>\n\nCette v\u00e9rification gagne \u00e0 s'effectuer de pair avec le contr\u00f4le des bonnes pratiques 105 sur l'envoi d'un courriel indiquant la r\u00e9f\u00e9rence de la transaction, 106 sur l'indication finale de celle-ci, 104 sur la disponibilit\u00e9 de deux moyens de paiement, 14 sur le d\u00e9lai de livraison estim\u00e9, 18 sur la disponibilit\u00e9 des produits, 22 sur le sous-total d\u00e9taill\u00e9 et 21 sur la possibilit\u00e9 de changer les quantit\u00e9s command\u00e9es<\/li><\/ul>","52":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier pr\u00e9cis\u00e9ment la nature des services associ\u00e9s et leur co\u00fbt<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer dans les conditions g\u00e9n\u00e9rales disponibles sur le site, les informations relatives aux conditions de garantie appliqu\u00e9es<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site de vente en ligne et notamment dans la page d'accueil, ou dans la page des mentions l\u00e9gales, la page d'aide ou encore dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente :   V\u00e9rifier la pr\u00e9sence des informations relatives aux conditions de garanties appliqu\u00e9es<\/li><\/ul>","53":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre un acc\u00e8s facile et permanent \u00e0 toutes les conditions de r\u00e9alisation du service<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Faire figurer sur toutes les pages un lien pointant vers la page sp\u00e9cifique pr\u00e9sentant les conditions de vente et\/ou d'utilisation<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans l'ensemble des pages du site, v\u00e9rifier la pr\u00e9sence d'un lien pointant vers la page pr\u00e9sentant les conditions de vente et\/ou d'utilisation<\/li><li>\n\nCette v\u00e9rification peut s'effectuer manuellement au fil des autres contr\u00f4les<\/li><li> Elle peut \u00e9galement s'effectuer \u00e0 partir des templates du site, sous r\u00e9serve de services tiers n'impl\u00e9mentant pas compl\u00e8tement ceux-ci<\/li><\/ul>","54":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter une navigation et des commandes inutiles, voire une perte de temps pour l'utilisateur ainsi que pour la structure qui propose les biens ou les services<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Les informations relatives \u00e0 la zone de livraison doivent \u00eatre les suivantes&nbsp;:  Lieu du \u00ab&nbsp;d\u00e9p\u00f4t final&nbsp;\u00bb ;  \t\t\t\t\tHeure d'ouverture du \u00ab&nbsp;d\u00e9p\u00f4t final&nbsp;\u00bb ;  \t\t\t\t\tMoyen de contact (t\u00e9l\u00e9phone, fax, e-mail)<\/li><li>\n\nCette information doit \u00eatre pr\u00e9sente \u00e0 3 moments distincts : avant paiement, apr\u00e8s paiement et sur l'e-mail r\u00e9capitulatif de la commande<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site de e-commerce, notamment au sein de la page d'accueil, ou la page des mentions l\u00e9gales, la page d'aide, ou encore dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente&nbsp;:   V\u00e9rifier la pr\u00e9sence des informations relatives \u00e0 la zone de livraison couverte pour les produits et les services<\/li><\/ul>","55":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'anticiper le mode et les conditions de paiement et de v\u00e9rifier avant la commande s'ils pourront la mener \u00e0 son terme<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer dans le site les informations sur les modes de paiement accept\u00e9s ainsi que les proc\u00e9dures correspondantes<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site de vente en ligne, notamment dans la page d'accueil, ou dans la page des mentions l\u00e9gales, ou la page d'\u00e0 propos, d'aide, ou encore dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente&nbsp;:   V\u00e9rifier que les informations sur les moyens de paiement accept\u00e9s ainsi que les proc\u00e9dures correspondantes sont disponibles<\/li><\/ul>","56":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de conna\u00eetre les services mis \u00e0 leur disposition et leur fonctionnement<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer les horaires et tarifs de fonctionnement des services mis \u00e0 la disposition des utilisateurs<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans au moins une des pages suivantes&nbsp;: la page d'accueil, la page consacr\u00e9e aux mentions l\u00e9gales, la page d'aide ou encore dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente&nbsp;:  V\u00e9rifier que les horaires et tarifs de fonctionnement des services mis \u00e0 la disposition des utilisateurs sont indiqu\u00e9s<\/li><\/ul>","57":"<p><strong>Objectif<\/strong><\/p><ul><li>Rassurer l'internaute avant l'achat<\/li><li>Donner \u00e0 l'acheteur toutes les informations li\u00e9es \u00e0 son achat, que celui-ci se passe bien ou non<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer les recours en cas de litige dans les conditions de vente et\/ou d'utilisation<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente&nbsp;:   V\u00e9rifier la pr\u00e9sence d'informations relatives aux recours possibles en cas de litige<\/li><\/ul>","58":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'anticiper d'\u00e9ventuelles difficult\u00e9s d'utilisation et\/ou de fonctionnement du bien ou du service propos\u00e9<\/li><li> R\u00e9duire le nombre de sollicitations du service client<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer, au moins dans les conditions g\u00e9n\u00e9rales de vente, les informations relatives aux conditions de retour des produits vendus (adresse, prise en charge des frais d'envoi, type de colis attendu)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans au moins une des pages suivantes : les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente, la page d'accueil, la page des mentions l\u00e9gales, la page produit, la page d'\u00e0 propos ou encore la page d'aide :  V\u00e9rifier la pr\u00e9sence d'informations relatives aux conditions de retour des produits vendus (adresse, de retour prise en charge des frais d'envoi, type de colis attendu)<\/li><\/ul>","59":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de comprendre ou d'anticiper d'\u00e9ventuelles difficult\u00e9s sur le site ou lors de la transaction<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer, dans les conditions g\u00e9n\u00e9rales de vente, par exemple, la proc\u00e9dure de d\u00e9p\u00f4t et de traitement des r\u00e9clamations<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans au moins une des pages suivantes : les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente, la page d'accueil, la page des mentions l\u00e9gales, la page d'\u00e0 propos, la page produit ou encore la page d'aide&nbsp;:   V\u00e9rifier la pr\u00e9sence des informations relatives \u00e0 la proc\u00e9dure de d\u00e9p\u00f4t et de traitement des r\u00e9clamations<\/li><li>\n\nLa nature de la proc\u00e9dure en question n'est pas \u00e9valu\u00e9e ici : seule sa pr\u00e9sence est contr\u00f4l\u00e9e<\/li><\/ul>","60":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier pr\u00e9cis\u00e9ment les pi\u00e8ces n\u00e9cessaires en cas de n\u00e9cessit\u00e9 de retour du produit<\/li><li>Anticiper d'\u00e9ventuels probl\u00e8mes en cas de demande de remboursement r\u00e9alis\u00e9e apr\u00e8s le d\u00e9lai l\u00e9gal<\/li><li>Diminuer le nombre de d\u00e9marches inutiles et le nombre de demandes au support client<\/li><li>Augmenter le taux de transformation d'un site e-commerce<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer, au minimum dans les conditions g\u00e9n\u00e9rales de vente, les informations relatives aux conditions de remboursement&nbsp;: d\u00e9lais, frais et justificatifs exig\u00e9s<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans au moins une des pages suivantes&nbsp;: les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou de vente, la page d'accueil, la page des mentions l\u00e9gales, la page produit, la page d'\u00e0 propos ou encore la page d'aide&nbsp;:  V\u00e9rifier la pr\u00e9sence d'informations relatives aux conditions de remboursement<\/li><\/ul>","61":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l\u2019utilisateur d\u2019anticiper les conditions et les moyens d\u2019utilisation du service<\/li><li>Limiter les r\u00e9clamations<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir les informations n\u00e9cessaires dans la page produit, ou \u00e0 l\u2019aide d\u2019un lien \u00e0 partir de celle-ci, ou via une page de support disponible avant la finalisation de la commande<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Contr\u00f4ler manuellement que les informations n\u00e9cessaires sont pr\u00e9sentes dans la page produit, ou fournies \u00e0 l\u2019aide d\u2019un lien \u00e0 partir de celle-ci, ou via une page de support disponible avant la finalisation de la commande<\/li><\/ul>","62":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier pr\u00e9cis\u00e9ment et avant l'achat le montant total qu'ils auront \u00e0 payer<\/li><li>Permettre aux utilisateurs d'identifier pr\u00e9cis\u00e9ment les montants d\u00e9ductibles et les diff\u00e9rentes imputations<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer sur le formulaire r\u00e9capitulatif de la commande, ainsi que sur la facture envoy\u00e9e au client, le d\u00e9tail de toutes les taxes int\u00e9gr\u00e9es au co\u00fbt des produits et services propos\u00e9s<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le formulaire r\u00e9capitulatif de la commande et au sein de la facture envoy\u00e9e au client, v\u00e9rifier la pr\u00e9sence du d\u00e9tail de toutes les taxes int\u00e9gr\u00e9es au co\u00fbt des produits et services propos\u00e9s<\/li><li>\n\nCe contr\u00f4le gagne \u00e0 s'effectuer de pair avec celui des bonnes pratiques 105 sur l'envoi d'un courriel indiquant la r\u00e9f\u00e9rence de la transaction et 106 sur l'indication finale de la r\u00e9f\u00e9rence de la transaction<\/li><\/ul>","63":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de faire livrer un achat sur le lieu de leur choix<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Proposer au client, sur le formulaire r\u00e9capitulatif de la commande, la possibilit\u00e9 d'indiquer une adresse de livraison diff\u00e9rente de l'adresse de facturation<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site de vente en ligne&nbsp;:   Entreprendre une proc\u00e9dure de commande ou modifier les donn\u00e9es d'un compte client (\u00e0 l'aide d'un compte de test ou compte r\u00e9el cr\u00e9\u00e9 pour l'occasion) ;  \t\t\t\t\tPuis, v\u00e9rifier la possibilit\u00e9 de saisir une adresse de livraison diff\u00e9rente de l'adresse de facturation<\/li><\/ul>","64":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de choisir le mode de paiement qui leur convient le mieux dans leur contexte<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Informer le client le plus t\u00f4t possible, avant la fin de la commande, qu'il dispose de deux moyens de paiement<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site de e-commerce :  Entreprendre une proc\u00e9dure de commande et la poursuivre au moins jusqu'\u00e0 l'\u00e9tape du paiement ;  \t\t\t\t\tV\u00e9rifier qu'au moins deux moyens de paiement sont effectivement disponibles<\/li><li>\n\nLa v\u00e9rification de cette bonne pratique ne se limite pas \u00e0 une d\u00e9duction du nombre de moyens de paiement accept\u00e9s, comme demand\u00e9 par la bonne pratique 23, mais elle n\u00e9cessite d'entreprendre r\u00e9ellement une proc\u00e9dure de commande<\/li><li>\n\nElle gagne \u00e0 s'effectuer de pair avec le contr\u00f4le des bonnes pratiques 105 sur l'envoi d'un courriel indiquant la r\u00e9f\u00e9rence de la transaction, 106 sur l'indication finale de celle-ci, 107 sur l'indication des conditions de d\u00e9bit ou d'encaissement, 14 sur le d\u00e9lai de livraison estim\u00e9, 18 sur la disponibilit\u00e9 des produits, 22 sur le sous-total d\u00e9taill\u00e9 et 21 sur la possibilit\u00e9 de changer les quantit\u00e9s command\u00e9es<\/li><\/ul>","65":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'afficher et \u00e9ventuellement d'imprimer une trace de leur commande<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer la r\u00e9f\u00e9rence de la transaction sur l'e-mail de confirmation de commande envoy\u00e9 au client apr\u00e8s validation d'un achat en ligne<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site de e-commerce :  Mener \u00e0 terme une proc\u00e9dure de commande ;  \t\t\t\t\tV\u00e9rifier que la r\u00e9f\u00e9rence de la transaction est bien indiqu\u00e9e sur la page de confirmation de commande affich\u00e9e apr\u00e8s validation d'un achat en ligne<\/li><li>\n\nCe contr\u00f4le gagne \u00e0 s'effectuer de pair avec celui des bonnes pratiques 104 sur la disponibilit\u00e9 de deux moyens de paiement, 105 sur l'envoi d'un courriel indiquant la r\u00e9f\u00e9rence de la transaction, 107 sur l'indication des conditions de d\u00e9bit ou d'encaissement, 14 sur le d\u00e9lai de livraison estim\u00e9, 18 sur la disponibilit\u00e9 des produits, 22 sur le sous-total d\u00e9taill\u00e9 et 21 sur la possibilit\u00e9 de changer les quantit\u00e9s command\u00e9es<\/li><\/ul>","66":"<p><strong>Objectif<\/strong><\/p><ul><li>Donner un acc\u00e8s imm\u00e9diat \u00e0 l'utilisateur pour lui permettre de comprendre de quoi il s'agit<\/li><li>Permettre \u00e0 l'utilisateur de v\u00e9rifier par lui-m\u00eame l'information<\/li><li>Accro\u00eetre le degr\u00e9 de confiance ou de cr\u00e9dibilit\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir pour chaque mention concern\u00e9e un lien explicite vers la source de r\u00e9f\u00e9rence<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans toutes les pages o\u00f9 il est fait r\u00e9f\u00e9rence \u00e0 l'une de ces mentions, v\u00e9rifier la pr\u00e9sence, pour chaque mention concern\u00e9e, d'un lien explicite vers la source de r\u00e9f\u00e9rence du standard concern\u00e9<\/li><li>\n\nLe contr\u00f4le de cette bonne pratique est similaire \u00e0 celui de la bonne pratique 190 sur les mentions du respect d'un standard<\/li><\/ul>","67":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur d'identifier imm\u00e9diatement et sans confusion possible les produits indisponibles<\/li><li>\u00c9viter l'effet de d\u00e9ception si un utilisateur d\u00e9bute une proc\u00e9dure de commande et s'aper\u00e7oit tardivement de l'indisponibilit\u00e9 du produit d\u00e9sir\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pr\u00e9ciser, dans le contenu pr\u00e9sentant chaque produit, une mention textuelle ou graphique du type \u00ab&nbsp;indisponible&nbsp;\u00bb ou \u00ab&nbsp;disponible&nbsp;\u00bb<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans les pages produits :   V\u00e9rifier la pr\u00e9sence d'une mention textuelle sur la disponibilit\u00e9 des produits ;   \t\t\t\t\tOu contr\u00f4ler la pr\u00e9sence d'une indication graphique diff\u00e9renciant les produits disponibles de ceux qui ne le sont pas (ic\u00f4ne, couleur, etc)<\/li><\/ul>","68":"<p><strong>Objectif<\/strong><\/p><ul><li>Donner \u00e0 l'utilisateur une confirmation des informations relatives \u00e0 la commande<\/li><li>Permettre \u00e0 l'utilisateur de conserver un historique de la transaction ailleurs que dans le site<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser ou d\u00e9velopper des outils de gestion du caddie qui envoient automatiquement une confirmation contenant le r\u00e9capitulatif des donn\u00e9es de la commande<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site de e-commerce :  Mener \u00e0 terme une proc\u00e9dure de commande ;  \t\t\t\t\tV\u00e9rifier, \u00e0 l'issue de cette derni\u00e8re, que le courriel contenant la r\u00e9f\u00e9rence de la transaction et les donn\u00e9es de la commande parvient effectivement au destinataire<\/li><li>\n\nCe contr\u00f4le gagne \u00e0 s'effectuer de pair avec celui des bonnes pratiques 104 sur la disponibilit\u00e9 de deux moyens de paiement, 106 sur l'indication finale de la r\u00e9f\u00e9rence de la transaction, 107 sur l'indication des conditions de d\u00e9bit ou d'encaissement, 14 sur le d\u00e9lai de livraison estim\u00e9, 18 sur la disponibilit\u00e9 des produits, 22 sur le sous-total d\u00e9taill\u00e9 et 21 sur la possibilit\u00e9 de changer les quantit\u00e9s command\u00e9es<\/li><\/ul>","69":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur d'obtenir une confirmation de sa demande en-dehors du contexte de la navigation sur le site<\/li><li> \u00c9viter au service client de recevoir plusieurs demandes concernant une m\u00eame r\u00e9clamation<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>D\u00e9finir une proc\u00e9dure de gestion de l'envoi d'un e-mail accusant r\u00e9ception d'une r\u00e9clamation<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Via le canal de contact de r\u00e9clamation indiqu\u00e9&nbsp;:  Adresser une r\u00e9clamation fictive ;  \t\t\t\t\tContr\u00f4ler l'envoi par le service d'un accus\u00e9 de r\u00e9ception<\/li><\/ul>","70":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de s'adresser ou d'adresser directement leurs r\u00e9clamations au bon interlocuteur<\/li><li> Rassurer les internautes sur le fait qu'ils pourront facilement interagir avec le service des r\u00e9clamations en cas de probl\u00e8me<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer dans la page d'accueil, ou au sein de la page des mentions l\u00e9gales, dans la page d'\u00e0 propos, d'aide, ou encore dans les conditions g\u00e9n\u00e9rales, un moyen de contacter (e-mail, t\u00e9l\u00e9phone, fax\u2026) le responsable des r\u00e9clamations<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans au moins une des pages suivantes&nbsp;: la page d'accueil, la page des mentions l\u00e9gales, la page d'\u00e0 propos, d'aide, ou encore dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales de vente ou d'utilisation&nbsp;:  V\u00e9rifier la pr\u00e9sence d'informations permettant d'entrer en contact (e-mail, t\u00e9l\u00e9phone, fax\u2026) avec le responsable des r\u00e9clamations<\/li><li>\n\nLa nature du moyen de contact en question n'est pas \u00e9valu\u00e9e ici&nbsp;: seule sa pr\u00e9sence et sa mention sont contr\u00f4l\u00e9es<\/li><li>\n\nPour optimiser le temps d'audit, cette v\u00e9rification pourra se faire conjointement avec celle de la bonne pratique 174 sur l'envoi par le service des r\u00e9clamations d'un accus\u00e9 de r\u00e9ception<\/li><\/ul>","71":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de contacter le mod\u00e9rateur pour demander une correction, poser une question ou signaler des abus<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Par exemple, indiquer l'adresse e-mail du mod\u00e9rateur ou mettre en place un formulaire permettant de le contacter<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque espace public du site (zone de commentaire, forum, etc) ou, \u00e0 d\u00e9faut, dans une page g\u00e9n\u00e9rique telle que la page des mentions l\u00e9gales, la page contact, la rubrique d'aide ou encore dans les conditions d'utilisation :  Identifier un moyen de contacter le mod\u00e9rateur ;   \t\t\t\t\tV\u00e9rifier qu'il est effectivement possible de contacter le mod\u00e9rateur via le(s) mode(s) de contact propos\u00e9(s)<\/li><li>\n\nCette v\u00e9rification va de pair avec le contr\u00f4le des bonnes pratiques 110 sur la mention des conditions de mod\u00e9ration et 111 sur la pr\u00e9sence d'un moyen de signaler les abus<\/li><\/ul>","72":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter le signalement de contenus ill\u00e9gaux ou inappropri\u00e9s<\/li><li>Acc\u00e9l\u00e9rer la d\u00e9tection de ces contenus<\/li><li>Limiter les risques de consultation de contenus ill\u00e9gaux ou inappropri\u00e9s<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Par exemple, faire figurer un lien \u00ab&nbsp;Signaler un abus&nbsp;\u00bb \u00e0 proximit\u00e9 de chaque contenu publi\u00e9 par les internautes, qui m\u00e8ne vers un formulaire permettant de pr\u00e9ciser les raisons du signalement<\/li><li> \u00c0 d\u00e9faut, indiquer l'adresse e-mail du mod\u00e9rateur<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque espace public (zone de commentaire, forum etc) ou \u00e0 d\u00e9faut, dans la page Contact ou celle des Mentions l\u00e9gales o\u00f9 figureraient les conditions de mod\u00e9ration&nbsp;:  V\u00e9rifier qu'il existe une proc\u00e9dure permettant de signaler facilement un abus<\/li><li>\n\nCette v\u00e9rification va de pair avec le contr\u00f4le des bonnes pratiques 29 sur la possibilit\u00e9 plus g\u00e9n\u00e9rale de contacter le mod\u00e9rateur et 110 sur la mention des conditions de mod\u00e9ration<\/li><\/ul>","73":"<p><strong>Objectif<\/strong><\/p><ul><li>Expliquer aux utilisateurs pour quelles raisons et dans quelle mesure leurs publications peuvent \u00eatre mod\u00e9r\u00e9es<\/li><li>Limiter le nombre de r\u00e9clamations des utilisateurs ne voyant pas leur publication appara\u00eetre<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer les conditions de mod\u00e9ration des espaces publics<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Id\u00e9alement, dans chaque espace public du site n\u00e9cessitant mod\u00e9ration (zone de commentaire, forum etc) ou, \u00e0 d\u00e9faut, dans une page g\u00e9n\u00e9rique telle que la page des mentions l\u00e9gales, la rubrique d'aide ou dans les conditions d'utilisation :  V\u00e9rifier que les conditions de mod\u00e9ration des espaces publics sont indiqu\u00e9es<\/li><\/ul>","74":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur de v\u00e9rifier sa saisie en contexte et, si n\u00e9cessaire, de la corriger avant envoi<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Mettre en place une pr\u00e9visualisation des informations saisies avant la soumission d\u00e9finitive du formulaire, avec possibilit\u00e9 de les modifier<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque espace public du site (zone de commentaire, forum, page personnelle publique, avatar, portfolio de documents, etc)&nbsp;:  Saisir des informations destin\u00e9es \u00e0 \u00eatre rendues publiques telles que des images associ\u00e9es \u00e0 un compte ou un commentaire ;   \t\t\t\t\tV\u00e9rifier que la soumission d\u00e9finitive du formulaire de saisie est pr\u00e9c\u00e9d\u00e9e d'une \u00e9tape permettant, si l'utilisateur le souhaite, de contr\u00f4ler et de modifier le r\u00e9sultat de sa saisie avant publication<\/li><li>\n\nLe contr\u00f4le de cette bonne pratique peut \u00eatre associ\u00e9 \u00e0 celui de la bonne pratique 176 sur la pr\u00e9visualisation des contenus dans leur aspect final<\/li><\/ul>","75":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur de v\u00e9rifier et de corriger si n\u00e9cessaire sa saisie en tenant compte de la pr\u00e9sentation finale du contenu concern\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Mettre en forme le contenu pr\u00e9visualis\u00e9 en utilisant la m\u00eame feuille de style que celle des espaces publics<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans les espaces publics (zone de commentaire, forum, page personnelle publique, avatar, portfolio de documents, etc)&nbsp;:   Saisir des informations destin\u00e9es \u00e0 \u00eatre rendues publiques ;   \t\t\t\t\tV\u00e9rifier que la soumission d\u00e9finitive du formulaire est pr\u00e9c\u00e9d\u00e9e d'une \u00e9tape, \u00e9ventuellement facultative, permettant de pr\u00e9visualiser le r\u00e9sultat de la saisie dans sa mise en forme finale<\/li><li>\n\nLa v\u00e9rification de cette bonne pratique va de pair avec celle de la bonne pratique 109 qui en est la condition pr\u00e9alable<\/li><\/ul>","76":"<p><strong>Objectif<\/strong><\/p><ul><li>Informer l'utilisateur afin qu'il puisse d\u00e9cider en connaissance de cause de consulter ou de t\u00e9l\u00e9charger ou non le contenu concern\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Accompagner chaque contenu vid\u00e9o ou audio, \u00e0 t\u00e9l\u00e9charger ou \u00e0 consulter en ligne, de la mention de sa dur\u00e9e<\/li><li> Celle-ci peut \u00eatre \u00e9ventuellement indiqu\u00e9e de mani\u00e8re g\u00e9n\u00e9rique, sous forme d'un ordre de grandeur commun \u00e0 un ensemble de contenus<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque page comportant un contenu multim\u00e9dia :  V\u00e9rifier que la dur\u00e9e de chaque contenu audio ou vid\u00e9o est indiqu\u00e9e avant la consultation de celui-ci, c'est-\u00e0-dire dans le contexte imm\u00e9diat du player<\/li><li>   \t\t\t\t\tContr\u00f4ler que la dur\u00e9e indiqu\u00e9e correspond \u00e0 la dur\u00e9e r\u00e9elle, ou qu'il s'agit d'un ordre de grandeur suffisant<\/li><li>\n\nUn outil du type Xenu's Link Sleuth peut \u00eatre utilis\u00e9 pour d\u00e9tecter les pages comportant des contenus multim\u00e9dias car il permet d'identifier des types d'URI sp\u00e9cifiques<\/li><li> Cette v\u00e9rification va de pair avec le contr\u00f4le des bonnes pratiques 31 sur les contenus multim\u00e9dias d\u00e9clench\u00e9s automatiquement et 155 sur la pr\u00e9sence de leur transcription<\/li><\/ul>","77":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de savoir en temps utile si leurs outils les autorisent \u00e0 consulter les fichiers propos\u00e9s en t\u00e9l\u00e9chargement<\/li><li>R\u00e9duire la charge serveur en \u00e9vitant les t\u00e9l\u00e9chargements inutiles<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Au minimum, pr\u00e9voir une page d'aide indiquant le format des fichiers propos\u00e9s s'il est unique<\/li><li>\n\nAu mieux, indiquer le format pour chaque lien permettant de t\u00e9l\u00e9charger un fichier<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque lien de t\u00e9l\u00e9chargement, v\u00e9rifier qu'il est possible d'en conna\u00eetre le format via&nbsp;:  Une information g\u00e9n\u00e9rique donn\u00e9e dans une page d'aide ;  \t\t\t\t\tUne information donn\u00e9e dans le contexte du lien&nbsp;: paragraphe ou \u00e9l\u00e9ment de liste li o\u00f9 il est inclus, titre de section qui le pr\u00e9c\u00e8de, cellule d'en-t\u00eate de tableau associ\u00e9e \u00e0 celle o\u00f9 il est pr\u00e9sent ;  \t\t\t\t\tL'attribut title du lien reprenant et compl\u00e9tant le libell\u00e9 de celui-ci ;  \t\t\t\t\tUne information donn\u00e9e dans le libell\u00e9 du lien ;  \t\t\t\t\tUne ic\u00f4ne dot\u00e9e d'un texte alternatif indiquant le format du fichier<\/li><li>\n\nLa v\u00e9rification de cette bonne pratique est simple en elle-m\u00eame, mais n\u00e9cessite d'identifier chaque lien de t\u00e9l\u00e9chargement<\/li><li> Pour cela, il est possible d'utiliser un outil tel que Xenu's Link Sleuth pour recenser les pages contenant des liens de t\u00e9l\u00e9chargement de fichiers dans des formats potentiellement utilis\u00e9s (PDF, DOC, XLS, ZIP, ODT, etc)<\/li><li> La v\u00e9rification sera \u00e9videmment facilit\u00e9e par la connaissance pr\u00e9alable des formats utilis\u00e9s dans le site et des rubriques susceptibles de contenir de tels liens<\/li><li>\n\nLes bonnes pratiques 78 sur l'indication de la taille et 79 sur l'indication de la langue gagnent \u00e0 \u00eatre v\u00e9rifi\u00e9es de pair avec celle-ci<\/li><\/ul>","78":"<p><strong>Objectif<\/strong><\/p><ul><li>Informer de fa\u00e7on pr\u00e9ventive les utilisateurs sur la quantit\u00e9 de donn\u00e9es \u00e0 t\u00e9l\u00e9charger<\/li><li>Permettre aux utilisateurs de diff\u00e9rer le t\u00e9l\u00e9chargement en connexion bas d\u00e9bit ou mobile<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Au minimum, pr\u00e9voir une page d'aide indiquant le poids moyen ou maximum pour l'ensemble des fichiers propos\u00e9s<\/li><li>\n\nAu mieux, indiquer le poids lors de chaque lien permettant de t\u00e9l\u00e9charger un fichier<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque lien de t\u00e9l\u00e9chargement, v\u00e9rifier qu'il est possible d'en conna\u00eetre le poids&nbsp;:  Via une information g\u00e9n\u00e9rique donn\u00e9e dans une page d'aide ;   \t\t\t\t\tVia une information donn\u00e9e dans le contexte du lien&nbsp;: paragraphe ou \u00e9l\u00e9ment de liste li o\u00f9 il est inclus, titre de section qui le pr\u00e9c\u00e8de, cellule d'en-t\u00eate de tableau associ\u00e9e \u00e0 celle o\u00f9 il est pr\u00e9sent ;   \t\t\t\t\tVia l'attribut title du lien reprenant et compl\u00e9tant le libell\u00e9 de celui-ci ;   \t\t\t\t\tOu via une information donn\u00e9e dans le libell\u00e9 du lien<\/li><li>\n\nTout comme le pr\u00e9cise la fiche de la bonne pratique 33 sur l'indication du format, il est possible de recenser les pages contenant des liens de t\u00e9l\u00e9chargement \u00e0 l'aide d'un outil tel que Xenu's Link Sleuth<\/li><li>\n\nLes bonnes pratiques 33 sur l'indication du format et 195 sur l'indication de la langue gagnent \u00e0 \u00eatre v\u00e9rifi\u00e9es de pair avec celle-ci<\/li><\/ul>","79":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter aux utilisateurs des t\u00e9l\u00e9chargements inutiles<\/li><li>Informer les utilisateurs sur les fichiers t\u00e9l\u00e9charg\u00e9s<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer la langue du contenu du document&nbsp;:  Soit dans le libell\u00e9 du lien ;  \t\t\t\t\tSoit via l'attribut title du lien<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque lien de t\u00e9l\u00e9chargement menant \u00e0 un document r\u00e9dig\u00e9 dans une autre langue que celle de la page concern\u00e9, v\u00e9rifier qu'il est possible de conna\u00eetre la langue du fichier \u00e0 t\u00e9l\u00e9charger&nbsp;:  Via une information donn\u00e9e dans le libell\u00e9 du lien ;   \t\t\t\t\tVia l'attribut title du lien reprenant et compl\u00e9tant le libell\u00e9 de celui-ci ;  \t\t\t\t\tVia une information donn\u00e9e dans le contexte du lien&nbsp;: paragraphe ou \u00e9l\u00e9ment de liste li o\u00f9 il est inclus, titre de section qui le pr\u00e9c\u00e8de, cellule d'en-t\u00eate de tableau associ\u00e9e \u00e0 celle o\u00f9 il est pr\u00e9sent ;   \t\t\t\t\tOu via une information g\u00e9n\u00e9rique donn\u00e9e dans une page d'aide<\/li><li>\n\nEn pr\u00e9alable \u00e0 cette v\u00e9rification, il est possible d'identifier chaque lien de t\u00e9l\u00e9chargement \u00e0 l'aide d'un outil tel que Xenu's Link Sleuth en lui pr\u00e9cisant quels sont les formats de fichiers potentiellement utilis\u00e9s dans le site et quelles sont les rubriques susceptibles de contenir de tels liens<\/li><li>\n\nLes bonnes pratiques 33 sur l'indication du format et 113 sur l'indication du poids gagnent \u00e0 \u00eatre v\u00e9rifi\u00e9es de pair avec celle-ci<\/li><\/ul>","80":"<p><strong>Objectif<\/strong><\/p><ul><li>Laisser \u00e0 l'utilisateur le contr\u00f4le des animations lors de la consultation du contenu<\/li><li>Ne pas perturber l'attention en imposant des \u00e9l\u00e9ments pouvant g\u00eaner celle-ci<\/li><li>Permettre la consultation pas \u00e0 pas d'animations s\u00e9quentielles ou de contenus sonores<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>D\u00e8s lors qu'une animation visuelle a une dur\u00e9e de plus de 5 secondes ou qu'un son a une dur\u00e9e de plus de 3 secondes, doter syst\u00e9matiquement l'objet multim\u00e9dia des moyens de contr\u00f4le n\u00e9cessaires&nbsp;: d\u00e9marrage, arr\u00eat, muet ou volume<\/li><li>\n\nNe pas utiliser de graphismes anim\u00e9s non contr\u00f4lables, ou encore partiellement contr\u00f4lables par l'utilisateur (images gif anim\u00e9es en particulier)<\/li><li>\n\nNe pas incorporer dans la page d'\u00e9l\u00e9ments d\u00e9clenchant la lecture d'un son non contr\u00f4lable en arri\u00e8re-plan (bgsound)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque page contenant une animation visuelle d'une dur\u00e9e de plus de 5 secondes ou un son d'une dur\u00e9e de plus de 3 secondes&nbsp;:  Contr\u00f4ler la possibilit\u00e9 de stopper l'animation, le son ou le clignotement (pause, red\u00e9marrage, volume sonore le cas \u00e9ch\u00e9ant)<\/li><li>\n\nIl existe une grande vari\u00e9t\u00e9 de moyens techniques permettant d'inclure une animation dans une page : balisage, propri\u00e9t\u00e9 CSS, images anim\u00e9es, Flash, Javascript, SVG, etc La v\u00e9rification de cette bonne pratique n\u00e9cessite donc un examen au cas par cas de chaque page concern\u00e9e<\/li><\/ul>","81":"<p><strong>Objectif<\/strong><\/p><ul><li>Fournir aux utilisateurs un acc\u00e8s direct et imm\u00e9diat aux contenus, m\u00eame lorsque l'administrateur du site d\u00e9cide de proposer une animation ou une publicit\u00e9 pr\u00e9alable<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>En cas d'animation propos\u00e9e dans un splash screen, celle-ci doit comporter un lien permettant d'acc\u00e9der directement aux contenus sans devoir attendre la fin de l'animation<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque page dont l'acc\u00e8s est pr\u00e9c\u00e9d\u00e9 par une animation&nbsp;:   V\u00e9rifier qu'il est possible d'outrepasser l'animation sans devoir attendre la fin de son d\u00e9roulement, soit par le biais d'un lien d'acc\u00e8s direct au site, soit par un contr\u00f4le permettant son arr\u00eat<\/li><li>\n\nCette bonne pratique concerne, en r\u00e8gle g\u00e9n\u00e9rale, la page d'accueil du site mais elle peut \u00e9galement \u00eatre en jeu dans des pages internes : pour les d\u00e9tecter, il est possible d'utiliser un outil du type Xenu's Link Sleuth qui permet d'identifier des types d'URI sp\u00e9cifiques correspondant aux fichiers des animations<\/li><li>\n\nCette v\u00e9rification peut s'associer \u00e0 celle de la bonne pratique 138 qui impose un acc\u00e8s imm\u00e9diat aux contenus<\/li><\/ul>","82":"<p><strong>Objectif<\/strong><\/p><ul><li>Laisser \u00e0 l'utilisateur le contr\u00f4le de l'interface sonore et visuelle lors de la consultation du site<\/li><li>Ne pas surprendre l'utilisateur par la diffusion inattendue d'un contenu audio<\/li><li>Ne pas imposer \u00e0 l'utilisateur le d\u00e9clenchement d'un contenu anim\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas mettre en place des contenus audio ou vid\u00e9o dont le d\u00e9marrage est automatique et sans action explicite de l'utilisateur en ce sens<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque page comportant un contenu multim\u00e9dias :   V\u00e9rifier l'absence de contenus vid\u00e9o ou audio activ\u00e9s automatiquement au chargement de la page ;  \t\t\t\t\tV\u00e9rifier l'absence de contenus vid\u00e9os ou audio activ\u00e9s de mani\u00e8re impr\u00e9visibles suite \u00e0 une action de l'utilisateur<\/li><li>\n\nUn outil du type Xenu's Link Sleuth peut \u00eatre utilis\u00e9 pour d\u00e9tecter les pages comportant des contenus multim\u00e9dias car il permet d'identifier des types d'URI sp\u00e9cifiques<\/li><li>\n\nCette v\u00e9rification va de pair avec le contr\u00f4le des bonnes pratiques 30 sur l'indication de la dur\u00e9e des contenus multim\u00e9dias et 155 sur la pr\u00e9sence de leur transcription<\/li><\/ul>","83":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre le r\u00e9f\u00e9rencement des contenus des documents PDF<\/li><li>Faciliter la manipulation et la r\u00e9utilisation du contenu des documents PDF<\/li><li>Garantir la lisibilit\u00e9 des contenus des documents PDF<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas diffuser de PDF issus de la num\u00e9risation de documents initiaux mais uniquement des documents convertis au format num\u00e9rique (par OCR le cas \u00e9ch\u00e9ant)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque document PDF interne publi\u00e9 dans le site&nbsp;:   Afficher ou ouvrir le document   \t\t\t\t\tV\u00e9rifier que le texte affich\u00e9 est imm\u00e9diatement s\u00e9lectionnable \u00e0 l'\u00e9cran ou bien qu'il peut \u00eatre consult\u00e9 dans un lecteur d'\u00e9cran<\/li><li>\n\nLa bonne pratique 179 concernant le balisage des documents PDF interne peut \u00eatre contr\u00f4l\u00e9e simultan\u00e9ment<\/li><\/ul>","84":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d\u2019acc\u00e9der directement \u00e0 diff\u00e9rentes sections d\u2019un document PDF<\/li><li>Fournir une structure de titres aux utilisateurs qui en ont besoin<\/li><li>Permettre la consultation d\u2019un PDF via une aide technique<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Lorsque le document PDF est issu d\u2019une suite bureautique telle que Word ou OpenOffice, il faut utiliser les styles et formatages propos\u00e9s par le logiciel de mani\u00e8re \u00e0 g\u00e9n\u00e9rer un PDF structur\u00e9, en appliquant les styles de texte tels que Titre 1, Titre 2, Titre 3 pour les diff\u00e9rents niveaux de titre<\/li><li>\nCes styles peuvent ensuite \u00eatre modifi\u00e9s pour les adapter \u00e0 la pr\u00e9sentation souhait\u00e9e<\/li><li> Enfin, l\u2019option Exporter en PDF balis\u00e9 ou tagu\u00e9 doit \u00eatre activ\u00e9e au moment de l\u2019export PDF<\/li><li> Pour plus d\u2019informations, consulter http:\/\/www&#x2e;adobe&#x2e;com\/fr\/accessibility\/<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque document PDF interne, v\u00e9rifier la pr\u00e9sence des \u00e9l\u00e9ments de structure de titre :\u00e0 l\u2019aide d\u2019un outil d\u2019inspection du code ;en ouvrant le document dans un lecteur PDF permettant d\u2019afficher les signets (par exemple Foxit Reader) ;ou en consultant le document dans un lecteur d\u2019\u00e9cran<\/li><\/ul>","85":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la compr\u00e9hension des donn\u00e9es attendues dans les formulaires<\/li><li>Permettre aux aides techniques d'accessibilit\u00e9 de restituer les champs de formulaires en les associant syst\u00e9matiquement \u00e0 une \u00e9tiquette indiquant leur r\u00f4le et la nature de la saisie attendue<\/li><li>Faciliter la saisie en permettant de s\u00e9lectionner le champ via un clic sur son \u00e9tiquette aussi bien que sur le champ lui-m\u00eame (particuli\u00e8rement en cas de case \u00e0 cocher ou de case radio)<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Donner \u00e0 chaque champ de formulaire une \u00e9tiquette qui lui soit explicitement associ\u00e9e&nbsp;:  si l'\u00e9tiquette est visible, sous la forme d'un \u00e9l\u00e9ment label dot\u00e9 d'un attribut for reprenant la valeur de l'attribut id affect\u00e9 au champ, par exemple :\n\n&lt;label for=\"nom1\"&gt;Nom de famille&nbsp;:&lt;\/label&gt;\n\n&lt;input id=\"nom1\" type=\"text\" name=\"nom\"&gt;  si l'affichage de l'\u00e9tiquette n'est pas souhait\u00e9e, sous la forme d'un attribut title du champ lui-m\u00eame<\/li><li>\n\nLe recours \u00e0 une \u00e9tiquette &lt;label for=\"\u2026\"&gt; masqu\u00e9e via les styles CSS est d\u00e9conseill\u00e9 au profit de l'attribut title du champ<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque champ de formulaire&nbsp;:   V\u00e9rifier, en regardant le code source ou \u00e0 l'aide de Firebug, que l'attribut for, propre \u00e0 l'\u00e9l\u00e9ment label, ainsi que l'attribut id du champ ont exactement le m\u00eame contenu<\/li><li> Si les valeurs de ces deux attributs sont effectivement identiques, l'\u00e9tiquette (label) est bien associ\u00e9e au champ (input)<\/li><li>   \t\t\t\t\tDans le cas o\u00f9 aucune \u00e9tiquette n'est visible dans le site, v\u00e9rifier que chaque champ de formulaire est dot\u00e9 d'un attribut title<\/li><li>\n\nDans les deux cas, v\u00e9rifier enfin que l'\u00e9tiquette d\u00e9crit effectivement le r\u00f4le du champ ou la nature de l'information qui doit y \u00eatre saisie<\/li><li> Cette bonne pratique ne peut donc \u00eatre automatis\u00e9e mais n\u00e9cessite un examen manuel de chaque formulaire\n\nLorsqu'une \u00e9tiquette label est pr\u00e9sente mais masqu\u00e9e \u00e0 l'affichage avec les propri\u00e9t\u00e9s CSS display ou visibility, la bonne pratique 139 exigeant que les contenus n\u00e9cessaires aux lecteurs d'\u00e9cran ne leur soient pas dissimul\u00e9s est, du coup, invalid\u00e9e<\/li><\/ul>","86":"<p><strong>Objectif<\/strong><\/p><ul><li>Optimiser le rendu dans les lecteurs d\u2019\u00e9cran en permettant d\u2019expliciter les \u00e9tiquettes des champs de formulaire<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Associer explicitement dans le code source chaque information venant compl\u00e9ter une \u00e9tiquette de champ de formulaire, ou venant informer l\u2019utilisateur en cas d\u2019erreur de saisie :soit \u00e0 l\u2019aide d\u2019un regroupement de champ fieldset et de l\u2019\u00e9l\u00e9ment legend ;soit \u00e0 l\u2019aide de l'attribut ARIA aria-describedby<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier dans le code source que chaque information venant compl\u00e9ter une \u00e9tiquette de champ de formulaire, ou venant informer l\u2019utilisateur en cas d\u2019erreur de saisie :est associ\u00e9e au champ en \u00e9tant balis\u00e9e par un \u00e9l\u00e9ment legend inclus dans un \u00e9l\u00e9ment fieldset regroupant les champs concern\u00e9s ;ou est associ\u00e9e au champ via un attribut ARIA aria-describedby<\/li><\/ul>","87":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de savoir \u00e0 l'avance si un champ est obligatoire<\/li><li>Pr\u00e9venir les erreurs avant qu'elles ne surviennent<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer le caract\u00e8re obligatoire de la saisie dans l'\u00e9tiquette associ\u00e9e au champ<\/li><li> Si l'indication est faite avec un symbole graphique (ast\u00e9risque par exemple), faire pr\u00e9c\u00e9der le formulaire d'une l\u00e9gende explicitant ce symbole<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque formulaire :\n\nV\u00e9rifier que l\u2019\u00e9tiquette associ\u00e9e \u00e0 chaque champ en indique le caract\u00e8re obligatoire, si besoin en contr\u00f4lant, avec un inspecteur de code, que l\u2019information est bien pr\u00e9sente dans l\u2019\u00e9l\u00e9ment label, dans l\u2019attribut title ou dans un attribut aria-label, ou bien qu\u2019elle est reli\u00e9e au champ via un attribut aria-labelledby ou aria-describedby<\/li><li>V\u00e9rifier que les champs dont l\u2019\u00e9tiquette ne donne aucune information sur leur caract\u00e8re obligatoire sont bien facultatifs, en validant le formulaire sans les remplir<\/li><li> Si un message d\u2019erreur indique qu\u2019ils doivent \u00eatre remplis ou si le formulaire ne peut \u00eatre valid\u00e9 ainsi, la bonne pratique est invalid\u00e9e<\/li><\/ul>","88":"<p><strong>Objectif<\/strong><\/p><ul><li>Limiter le risque d'erreurs de saisie<\/li><li>Limiter les risques associ\u00e9s \u00e0 l'envoi de donn\u00e9es erron\u00e9es ou impossibles \u00e0 exploiter<\/li><li> \u00c9viter que l'utilisateur ne renonce \u00e0 poursuivre faute d'information sur la saisie attendue<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer quel est le format de saisie attendue via l'\u00e9tiquette associ\u00e9e au champ<\/li><li> Par exemple : &lt;label for=\"mail\"&gt;Adresse email (du type mail@exemple&#x2e;com)&lt;\/label&gt;<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque formulaire&nbsp;:Soumettre diff\u00e9rentes erreurs possibles dans chaque formulaire : non-respect d\u2019un format demand\u00e9 ou pr\u00e9visible (format d\u2019adresse e-mail, de date, etc), afin de d\u00e9tecter les champs pour lesquels un format de saisie sp\u00e9cifique est impos\u00e9<\/li><li>V\u00e9rifier, \u00e0 l\u2019aide d\u2019un inspecteur de code, que l\u2019\u00e9tiquette associ\u00e9e \u00e0 chaque champ concern\u00e9 en indique le format attendu dans l\u2019\u00e9l\u00e9ment label ou dans l\u2019attribut title du champ, ou encore via un attribut ARIA<\/li><\/ul>","89":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter le risque d'erreur et donc \u00e9viter \u00e0 l'utilisateur de devoir remplir plusieurs fois un m\u00eame champ<\/li><li>\u00c9viter l'incompr\u00e9hension de l'utilisateur qui pense avoir rempli correctement le champ et qui le voit signal\u00e9 en erreur<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Si la saisie attendue est sensible \u00e0 la casse, pr\u00e9ciser dans l'\u00e9tiquette associ\u00e9e au champ qu'elle doit \u00eatre r\u00e9alis\u00e9e en majuscules ou en minuscules selon le cas<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque formulaire&nbsp;:  D\u00e9tecter les champs dont la saisie est sensible \u00e0 la casse en inscrivant le texte demand\u00e9 en majuscules puis en minuscules et contr\u00f4ler si, dans l'un des deux cas, la saisie est rejet\u00e9e ;  \t\t\t\t\tEn cas de rejet de la saisie \u00e0 cause de sa casse, v\u00e9rifier que l'\u00e9tiquette associ\u00e9e \u00e0 chaque champ, via l'\u00e9l\u00e9ment label ou dans l'attribut title, informe l'utilisateur de cette sensibilit\u00e9<\/li><li>\n\nCe contr\u00f4le gagne \u00e0 \u00eatre men\u00e9 de pair avec ceux des bonnes pratique 36 sur l'indication des donn\u00e9es rejet\u00e9es en cas d'erreur et 39 sur l'indication des champs obligatoires mais aussi 115 et 117 et encore avec celui de la bonne pratique 119 sur l'indication du format de saisie attendu<\/li><li> Il peut \u00eatre facilit\u00e9 en ayant r\u00e9alis\u00e9 au pr\u00e9alable la v\u00e9rification de la bonne pratique 35 sur la pr\u00e9sence et le balisage de l'\u00e9tiquette des champs de formulaire<\/li><\/ul>","90":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter \u00e0 l'utilisateur de saisir un mot de passe qui ne correspond finalement pas \u00e0 celui qu'il a souhait\u00e9 ou m\u00e9moris\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Proposer, apr\u00e8s le champ de saisie du mot de passe, un champ de confirmation o\u00f9 le mot de passe doit \u00eatre saisi \u00e0 nouveau et v\u00e9rifier que les deux saisies sont effectivement identiques lors de la soumission<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le cas d'une cr\u00e9ation de mot de passe&nbsp;:  V\u00e9rifier qu'un m\u00e9canisme de double saisie des mots de passe, g\u00e9n\u00e9ralement pr\u00e9sent sous la forme de deux champs successifs, est syst\u00e9matiquement pr\u00e9sent<\/li><\/ul>","91":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la saisie des mots de passe, notamment sur les claviers virtuels des terminaux mobiles<\/li><li>Pr\u00e9venir les erreurs<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Afficher un bouton associ\u00e9 \u00e0 un script qui bascule la valeur de l\u2019attribut type du champ de saisie entre les valeurs \u00ab password \u00bb et \u00ab text \u00bb<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Contr\u00f4ler manuellement la possibilit\u00e9 d\u2019afficher le mot de passe en clair via un dispositif inclus dans la page<\/li><\/ul>","92":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier sans ambigu\u00eft\u00e9 les champs de formulaire et la nature des informations \u00e0 saisir<\/li><li>Pr\u00e9venir les erreurs de saisie<\/li><li>Faciliter et acc\u00e9l\u00e9rer l'usage du formulaire<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Veiller \u00e0 ce que l'\u00e9tiquette visible de chaque champ de formulaire soit affich\u00e9e \u00e0 proximit\u00e9 imm\u00e9diate du champ concern\u00e9, afin que le rapport entre ceux-ci puisse \u00eatre per\u00e7u sans ambigu\u00eft\u00e9<\/li><li>\n\n\u00c9viter les mises en forme de formulaire entra\u00eenant la pr\u00e9sence d'un espace vide important entre un champ et son \u00e9tiquette, ou un positionnement inhabituel de l'\u00e9tiquette telle qu'une \u00e9tiquette plac\u00e9e en-dessous du champ, ou une \u00e9tiquette de case \u00e0 cocher plac\u00e9e \u00e0 gauche de celle-ci dans une page en fran\u00e7ais<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque formulaire&nbsp;:  S'assurer que chaque \u00e9tiquette de formulaire est affich\u00e9e \u00e0 proximit\u00e9 imm\u00e9diate du champ concern\u00e9 ;  \t\t\t\t\tV\u00e9rifier que l'\u00e9tiquette occupe une position pr\u00e9visible&nbsp;: au-dessus ou \u00e0 gauche d'un champ sauf pour les champs input type radio et checkbox o\u00f9 elle doit se trouver \u00e0 droite du champ<\/li><li>\n\nLa proximit\u00e9 imm\u00e9diate est une mesure \u00e0 pr\u00e9ciser selon le contexte mais elle est de l'ordre d'une trentaine de pixels pour une \u00e9tiquette plac\u00e9e \u00e0 gauche du champ, d'un interligne pour une \u00e9tiquette plac\u00e9e au-dessus du champ et de quelques pixels pour l'\u00e9tiquette plac\u00e9e \u00e0 droite d'une case radio ou \u00e0 cocher<\/li><\/ul>","93":"<p><strong>Objectif<\/strong><\/p><ul><li>Donner un retour \u00e0 l'utilisateur sur l'action qu'il vient d'effectuer<\/li><li>Guider l'utilisateur directement vers les \u00e9l\u00e9ments sur lesquels il doit agir<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Faire figurer en d\u00e9but de formulaire un message indiquant que tout ou partie des champs n\u00e9cessite une correction de la saisie pr\u00e9c\u00e9dente<\/li><li> Indiquer \u00e9galement cette information dans l'\u00e9l\u00e9ment title de la page<\/li><li>\n\nAjouter \u00e9ventuellement au message en d\u00e9but de formulaire la liste des champs \u00e0 corriger<\/li><li>\n\nIndiquer explicitement dans l'\u00e9tiquette de chaque champ concern\u00e9 qu'il doit \u00eatre corrig\u00e9 (par exemple avec la mention \u00ab erreur de saisie&nbsp;\u00bb)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque formulaire&nbsp;:  Soumettre diff\u00e9rentes erreurs possibles dans chaque formulaire telles que&nbsp;: absence de saisie d'un champ (qu'il soit signal\u00e9 comme \u00e9tant obligatoire ou non), non-respect d'un format demand\u00e9 ou pr\u00e9visible (format d'adresse mail, de date, etc), sensibilit\u00e9 \u00e0 la casse<\/li><li>   \t\t\t\t\tPuis, v\u00e9rifier que l'utilisateur est inform\u00e9 de la pr\u00e9sence d'erreurs \u00e0 corriger au moins dans l'\u00e9l\u00e9ment title de la page et que chaque champ erron\u00e9 est signal\u00e9 via son \u00e9tiquette<\/li><li> Firebug permet de contr\u00f4ler que l'information est bien ajout\u00e9e \u00e0 l'\u00e9l\u00e9ment label<\/li><li>\n\nCe contr\u00f4le gagne \u00e0 \u00eatre men\u00e9 apr\u00e8s celui sur la pr\u00e9sence et le balisage de l'\u00e9tiquette des champs de formulaire (bonne pratique 35) et en m\u00eame temps que ceux sur la pr\u00e9sence d'indications sur le caract\u00e8re obligatoire ou le format attendu pour chaque champ (bonne pratiques 39 et 119) et sur l'indication des raisons du rejet (bonne pratique 115)<\/li><\/ul>","94":"<p><strong>Objectif<\/strong><\/p><ul><li>Aider l'internaute \u00e0 comprendre ce qu'on attend et, ainsi, faciliter le passage \u00e0 l'\u00e9tape suivante<\/li><li>\u00c9viter la frustration de l'utilisateur face \u00e0 une erreur dont il n'aurait pas la solution imm\u00e9diate<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pour chaque champ contenant des donn\u00e9es rejet\u00e9es, indiquer la nature de l'erreur et fournir une aide \u00e0 la correction&nbsp;:  Soit en d\u00e9but de formulaire, dans une liste des champs erron\u00e9s ;  \t\t\t\t\tSoit dans le contexte de chaque champ, autant que possible via leur \u00e9tiquette label<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque formulaire examin\u00e9&nbsp;:  Soumettre les diff\u00e9rentes erreurs possibles dans chaque formulaire&nbsp;: absence de saisie d'un champ (qu'il soit signal\u00e9 comme \u00e9tant obligatoire ou non), non-respect d'un format demand\u00e9 ou pr\u00e9visible (format d'adresse mail, de date, etc), sensibilit\u00e9 \u00e0 la casse, etc  \t\t\t\t\tV\u00e9rifier, si la saisie est rejet\u00e9e, que la nature de l'erreur est pr\u00e9cis\u00e9e de mani\u00e8re \u00e0 fournir l'aide n\u00e9cessaire \u00e0 sa correction, par l'un des moyens indiqu\u00e9s dans le paragraphe de mise en oeuvre<\/li><li>\n\nCette v\u00e9rification s'effectue manuellement pour chaque formulaire sur le m\u00eame mode que celle de la bonne pratique 36 sur l'identification des donn\u00e9es rejet\u00e9es en cas de validation et 39 sur celle des rejets de saisie vide dans des champs obligatoires<\/li><li>\n\nOn gagne donc \u00e0 effectuer ce contr\u00f4le de pair avec ceux des bonnes pratiques 36 et 39, mais aussi avec celui de la bonne pratique 119 sur l'indication du format de saisie attendu<\/li><\/ul>","95":"<p><strong>Objectif<\/strong><\/p><ul><li>Laisser la main \u00e0 l'utilisateur sur la totalit\u00e9 des informations qu'il donne<\/li><li>Faciliter la correction des erreurs commises par l'utilisateur<\/li><li>Permettre \u00e0 l'utilisateur de modifier des informations sur lesquelles il voudrait revenir<\/li><li> \u00c9viter que l'utilisateur ne quitte le formulaire avant validation d\u00e9finitive<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Stocker toutes les donn\u00e9es saisies dans des variables de session afin de pouvoir les afficher de nouveau telles qu'elles ont \u00e9t\u00e9 saisies dans les champs<\/li><li>\n\nRendre possible la modification des champs apr\u00e8s rejet des donn\u00e9es<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque formulaire audit\u00e9&nbsp;:  Provoquer le rejet de la saisie en soumettant les diff\u00e9rentes erreurs possibles : absence de saisie d'un champ (qu'il soit signal\u00e9 comme \u00e9tant obligatoire ou non), non-respect d'un format demand\u00e9 ou pr\u00e9visible (format d'adresse mail, de date, etc), sensibilit\u00e9 \u00e0 la casse ;  \t\t\t\t\tPuis, v\u00e9rifier que le formulaire est affich\u00e9 de nouveau tel qu'il a \u00e9t\u00e9 rempli, ceci afin de pouvoir \u00e9ventuellement de le corriger<\/li><li>\n\nCette v\u00e9rification s'effectue manuellement pour chaque formulaire et peut \u00eatre effectu\u00e9e conjointement avec celles de la bonne pratique 36 sur l'identification des donn\u00e9es rejet\u00e9es en cas de validation, 39 sur les rejets de saisie vide dans des champs obligatoires, 119 sur l'indication du format de saisie attendu et 115 sur l'indication des raisons du rejet<\/li><\/ul>","96":"<p><strong>Objectif<\/strong><\/p><ul><li>Donner \u00e0 l'utilisateur une vue globale de ce qu'il a saisi dans les pages pr\u00e9c\u00e9dentes<\/li><li>Permettre \u00e0 l'utilisateur de v\u00e9rifier l'ensemble des informations d'une proc\u00e9dure complexe avant la soumission d\u00e9finitive<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Stocker les informations saisies dans des variables de session afin de pouvoir en afficher un r\u00e9capitulatif global avant validation<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque formulaire r\u00e9parti sur plusieurs pages :  Soumettre compl\u00e8tement le formulaire<\/li><li>  \t\t\t\t\tV\u00e9rifier que la soumission finale donne lieu \u00e0 l'affichage d'un r\u00e9capitulatif des saisies successives, affich\u00e9 avant la validation finale du processus par l'utilisateur<\/li><\/ul>","97":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter de d\u00e9router l'utilisateur en le menant \u00e0 une page en impasse, y compris par l'utilisation de la fonction \u00ab&nbsp;page pr\u00e9c\u00e9dente&nbsp;\u00bb du navigateur<\/li><li>Limiter le risque de double envoi de formulaire<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Apr\u00e8s envoi d'un formulaire, afficher une page de confirmation du succ\u00e8s ou d'avertissement d'\u00e9chec de l'envoi, o\u00f9 sont pr\u00e9sents les \u00e9l\u00e9ments de navigation du site ou, \u00e0 d\u00e9faut, un lien du type \u00ab&nbsp;Poursuivre&nbsp;\u00bb<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque formulaire examin\u00e9&nbsp;:  Remplir les champs demand\u00e9s et soumettre le formulaire ;   \t\t\t\t\tV\u00e9rifier que l'envoi final de chaque formulaire pr\u00e9sent dans le site est suivi de l'affichage d'une page comportant les \u00e9l\u00e9ments n\u00e9cessaires \u00e0 la poursuite de la navigation (menu principal, lien retour en page d'accueil, etc) ou au minimum d'un lien permettant de poursuivre la navigation<\/li><li>\n\nCe contr\u00f4le gagne \u00e0 s'effectuer en m\u00eame temps que celui de la bonne pratique 118 sur les messages de confirmation<\/li><\/ul>","98":"<p><strong>Objectif<\/strong><\/p><ul><li>Fournir \u00e0 l'utilisateur un retour imm\u00e9diat et explicite sur l'action qu'il vient d'effectuer<\/li><li>\u00c9viter la frustration d'un utilisateur qui pense que le processus s'est d\u00e9roul\u00e9 avec succ\u00e8s alors qu'il y a eu un probl\u00e8me<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Retourner une page de confirmation explicite apr\u00e8s soumission d'un formulaire<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque formulaire&nbsp;:  Soumettre compl\u00e8tement le formulaire ;  \t\t\t\t\tV\u00e9rifier que la soumission finale du formulaire donne lieu \u00e0 l'affichage d'une page de confirmation indiquant explicitement la r\u00e9ussite ou l'\u00e9chec de l'op\u00e9ration concern\u00e9e<\/li><li>\n\nCe contr\u00f4le gagne \u00e0 s'effectuer en m\u00eame temps que celui de la bonne pratique 40 sur la poursuite de la navigation<\/li><\/ul>","99":"<p><strong>Objectif<\/strong><\/p><ul><li>Donner de la visibilit\u00e9 \u00e0 l'utilisateur sur les actions qu'il va r\u00e9aliser (temps, ordre des \u00e9tapes, informations n\u00e9cessaires pour les accomplir, etc)<\/li><li>\u00c9viter que l'utilisateur ne se sente pi\u00e9g\u00e9 dans un processus dont il n'avait pas pr\u00e9vu la dur\u00e9e<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pour tout processus complexe, par exemple un formulaire de commande, afficher \u00e0 chaque \u00e9tape la liste int\u00e9grale de toutes ses \u00e9tapes<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le cas de processus complexes&nbsp;:   V\u00e9rifier, pour chaque page concern\u00e9e, que la liste des \u00e9tapes y est indiqu\u00e9e, en r\u00e8gle g\u00e9n\u00e9rale sous forme d'un chemin d'\u00e9tapes en t\u00eate de page ou de formulaire<\/li><\/ul>","100":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur d'identifier le degr\u00e9 d'avancement dans un processus<\/li><li>Rassurer l'utilisateur lors de la r\u00e9alisation d'un processus complexe<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pr\u00e9ciser sur chaque page du processus l'\u00e9tape correspondant \u00e0 la page en cours<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le cas de processus complexes, v\u00e9rifier, pour chaque page concern\u00e9e, que l'\u00e9tape en cours y est indiqu\u00e9e&nbsp;:  Dans le titre de page (conform\u00e9ment \u00e0 la bonne pratique 12) ;  \t\t\t\t\tDans le contenu de page, sous la forme d'une mise en \u00e9vidence dans le chemin d'\u00e9tapes en t\u00eate de page ou de formulaire, par exemple \u00ab&nbsp;\u00c9tape 2 \u2013 Coordonn\u00e9es&nbsp;\u00bb ou \u00ab&nbsp;\u00c9tape 4 \u2013 Paiement&nbsp;\u00bb<\/li><li>\n\nCette v\u00e9rification va de pair avec le contr\u00f4le de la bonne pratique 37 sur la pr\u00e9sence de la liste d'\u00e9tapes<\/li><\/ul>","101":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter l\u2019utilisation des formulaires r\u00e9partis sur plusieurs pages successives<\/li><li>R\u00e9duire les risques d\u2019erreurs de saisie<\/li><li>Limiter les risques d\u2019abandon en cours de processus<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir \u00e0 chaque \u00e9tape du formulaire un bouton de navigation permettant de retourner \u00e0 l\u2019\u00e9tape pr\u00e9c\u00e9dente<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier manuellement la possibilit\u00e9 de revenir \u00e0 chaque \u00e9tape pr\u00e9c\u00e9dente du processus<\/li><\/ul>","102":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter l\u2019utilisation des formulaires r\u00e9partis sur plusieurs pages successives<\/li><li>Limiter les risques d\u2019abandon en cours de processus<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>G\u00e9n\u00e9rer une alerte JavaScript en cas de l\u2019utilisation de la fonctionnalit\u00e9 \u00ab back \u00bb de l\u2019historique du navigateur<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Amorcer la saisie d\u2019un formulaire apr\u00e8s la premi\u00e8re \u00e9tape du processus, puis activer le bouton \u00ab back \u00bb du navigateur<\/li><\/ul>","103":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la saisie et sa correction dans les formulaires r\u00e9partis par \u00e9tapes<\/li><li>Limiter les risques d\u2019abandon en cours de proc\u00e9dure<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pr\u00e9voir, au niveau de la gestion de la navigation dans les \u00e9tapes du processus, l\u2019enregistrement des donn\u00e9es saisies \u00e0 chaque \u00e9tape, de mani\u00e8re \u00e0 pouvoir afficher \u00e0 nouveau celle-ci sans perte de donn\u00e9es apr\u00e8s que l\u2019utilisateur a utilis\u00e9 le m\u00e9canisme de navigation dans les \u00e9tapes<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Utiliser le m\u00e9canisme de navigation dans les \u00e9tapes pr\u00e9c\u00e9dentes de la saisie et v\u00e9rifier manuellement que les donn\u00e9es saisies \u00e0 chaque \u00e9tape sont conserv\u00e9es et affich\u00e9es \u00e0 nouveau par la suite<\/li><\/ul>","104":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la saisie dans les formulaires<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas intercepter les \u00e9v\u00e9nements JavaScript onpaste ou keydown pour bloquer le coller dans un champ de formulaire<\/li><li>Ne pas intercepter les \u00e9v\u00e9nements JavaScript oncopy ou oncut pour bloquer le copier dans un champ de formulaire<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier qu\u2019il est possible de copier le contenu de chaque champ (en utilisant le menu contextuel du navigateur et ses raccourcis claviers, ou \u00e0 d\u00e9faut un m\u00e9canisme propre au formulaire)<\/li><li>V\u00e9rifier qu\u2019il est possible de coller un contenu dans chaque champ (en utilisant le menu contextuel du navigateur et ses raccourcis claviers, ou \u00e0 d\u00e9faut un m\u00e9canisme propre au formulaire)<\/li><\/ul>","105":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux aides techniques de restituer \u00e0 l'utilisateur une liste&nbsp;:   dont l'organisation est clairement perceptible ;  \t\t\t\t\tqui facilite le passage d'un \u00e9l\u00e9ment du contenu \u00e0 l'autre<\/li><li>  \t\t\t\tFavoriser un rendu appropri\u00e9 des listes d\u00e9roulantes complexes dans tous les navigateurs<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser l'\u00e9l\u00e9ment optgroup pour baliser les regroupements th\u00e9matiques d'\u00e9l\u00e9ments option dans les listes select<\/li><li>\n\nUtiliser l'attribut label de l'\u00e9l\u00e9ment optgroup pour afficher l'\u00e9tiquette de chaque regroupement<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque liste d\u00e9roulante&nbsp;:  Ouvrir chaque liste (select) pour d\u00e9tecter celles qui n\u00e9cessiteraient un regroupement d'\u00e9l\u00e9ments option, par exemple des regroupements de mod\u00e8les de voitures class\u00e9s par marques ou des regroupements de villes r\u00e9alis\u00e9s par d\u00e9partement ;   \t\t\t\t\tV\u00e9rifier, en examinant le code source \u00e0 l'aide de Firebug, que chaque s\u00e9rie d'\u00e9l\u00e9ments option qui devraient \u00eatre regroup\u00e9s est balis\u00e9e avec l'\u00e9l\u00e9ment optgroup ;  \t\t\t\t\tV\u00e9rifier que chaque \u00e9l\u00e9ment optgroup est dot\u00e9 d'un attribut label associant un libell\u00e9 pertinent au groupe d'options concern\u00e9<\/li><\/ul>","106":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'acc\u00e9der rapidement \u00e0 l'item de liste recherch\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pr\u00e9senter les items dans un ordre identifiable, par exemple par ordre alphab\u00e9tique<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque liste d\u00e9roulante contenant plusieurs items&nbsp;:  V\u00e9rifier, pour chaque liste select, que les \u00e9l\u00e9ments option apparaissent dans un ordre identifiable (alphab\u00e9tique, num\u00e9rique, chronologique, th\u00e9matique, etc)<\/li><li>\n\nDe m\u00eame que pour la bonne pratique 184 sur la pr\u00e9sence de regroupements dans les listes d'options, la v\u00e9rification s'effectue manuellement en contr\u00f4lant visuellement l'ordre des \u00e9l\u00e9ments au sein de chaque \u00e9l\u00e9ment select<\/li><\/ul>","107":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter aux utilisateurs d'avoir uniquement une URL peu compr\u00e9hensible en guise de libell\u00e9<\/li><li>\u00c9viter les liens qui deviennent invisibles lorsque les styles CSS ou les images d'arri\u00e8re-plan ne sont pas pris en compte<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Donner \u00e0 chaque lien un libell\u00e9 textuel (entre les balises ouvrantes et fermantes de l'\u00e9l\u00e9ment a) ou, si n\u00e9cessaire, via l'alternative textuelle d'un \u00e9l\u00e9ment img ou object<\/li><li>\n\nNe pas masquer \u00e0 l'affichage le libell\u00e9 textuel de l'\u00e9l\u00e9ment a pour le remplacer par un effet de style CSS (image d'arri\u00e8re-plan)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>La d\u00e9tection des liens vides n\u00e9cessite l'examen du code g\u00e9n\u00e9r\u00e9 afin de contr\u00f4ler le contenu effectivement pr\u00e9sent dans la balise a, dans l'alternative de la balise img en cas d'image-lien ou encore dans l'alternative des \u00e9l\u00e9ments object et embed, par exemple \u00e0 l'aide de Firebug<\/li><li>\n\nDans chaque page examin\u00e9e&nbsp;:   V\u00e9rifier que chaque lien texte a un libell\u00e9 affich\u00e9 lorsque les styles CSS sont d\u00e9sactiv\u00e9s<\/li><li> Utiliser pour cela la fonctionnalit\u00e9 D\u00e9sactiver tous les styles CSS de la Web Developer Toolbar (menu CSS) ;   \t\t\t\t\tContr\u00f4ler que chaque lien image a un libell\u00e9 affich\u00e9 lorsque les images sont d\u00e9sactiv\u00e9es ;   \t\t\t\t\tS'assurer que chaque lien pr\u00e9sent sous forme d'objet flash a un libell\u00e9 affich\u00e9 lorsque le support de cette technologie est d\u00e9sactiv\u00e9e<\/li><li>\n\nDans le cas des liens HTML, il faut \u00e9galement v\u00e9rifier que le libell\u00e9 est affich\u00e9 lorsque les couleurs seules sont d\u00e9sactiv\u00e9es \u00e0 l'aide la Web Developer Toolbar dans Firefox<\/li><li> Cette v\u00e9rification permet de d\u00e9tecter les cas de libell\u00e9s pr\u00e9sents dans le code mais masqu\u00e9s \u00e0 l'affichage et remplac\u00e9s par une image d'arri\u00e8re-plan CSS<\/li><\/ul>","108":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter les clics inutiles sur des contenus soulign\u00e9s per\u00e7us comme des hyperliens<\/li><li><liFaciliter l'identification des liens<\/li><\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas utiliser le soulignement pour des textes simples ou des \u00e9l\u00e9ments qui ne constituent pas des liens<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque page contenant des contenus soulign\u00e9s&nbsp;:   Identifier les textes soulign\u00e9s dans le site ;  \t\t\t\t\tContr\u00f4ler la nature de ces contenus pour v\u00e9rifier s'il s'agit effectivement d'hyperliens<\/li><li>\n\nL'examen des seules feuilles de styles CSS et de l'utilisation de la propri\u00e9t\u00e9 text-decoration: underline ne sont pas suffisants<\/li><li> En effet, un soulignement peut aussi \u00eatre produit en jouant, par exemple, sur l'atribut border ou sur une image d'arri\u00e8re-plan ; l'\u00e9l\u00e9ment de pr\u00e9sentation u est \u00e9galement susceptible d'\u00eatre utilis\u00e9<\/li><\/ul>","109":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier facilement les liens au fil du texte ainsi que les blocs de navigation<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Les hyperliens peuvent \u00eatre diff\u00e9renci\u00e9s \u00e0 l'aide des propri\u00e9t\u00e9s CSS de couleur de texte, de couleur d'arri\u00e8re-plan, de soulignement, de mise en gras, de bordures, de police de caract\u00e8res, etc<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque page examin\u00e9e&nbsp;:  Identifier les liens pr\u00e9sents au fil du texte avec la fonctionnalit\u00e9 Entourer les liens de la Web Developer Toolbar (menu Entourer dans Firefox) ;  \t\t\t\t\tV\u00e9rifier que ces liens se diff\u00e9rencient visuellement du reste du texte au sein duquel ils se trouvent plac\u00e9s<\/li><li> V\u00e9rifier que les liens diff\u00e9renci\u00e9s uniquement par la couleur pr\u00e9sentent un ratio de contraste minimal de 3 avec le texte environnant et qu\u2019ils sont soulign\u00e9s au survol<\/li><li>\n\nCette v\u00e9rification ne s'applique pas aux blocs de navigation dont la nature est par ailleurs \u00e9vidente pour l'utilisateur (menus)<\/li><\/ul>","110":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter l'identification des contenus d\u00e9j\u00e0 visit\u00e9s<\/li><li>Faciliter l'identification des contenus restant \u00e0 d\u00e9couvrir<\/li><li>Inciter \u00e0 la navigation sur de nouvelles pages<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>En dehors des menus de navigation, ne pas appliquer les m\u00eames styles CSS par d\u00e9faut pour les liens non visit\u00e9s (s\u00e9lecteurs a ou a:link) et pour les liens visit\u00e9s (s\u00e9lecteur a:visited)<\/li><li> Pour ce faire&nbsp;: soit pr\u00e9voir un rendu sp\u00e9cifique pour les liens visit\u00e9s, soit ne pas indiquer de r\u00e8gle de rendu pour ceux-ci (le style par d\u00e9faut du navigateur pourra alors s'appliquer sans difficult\u00e9)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque page contenant des hyperliens&nbsp;:  Contr\u00f4ler la pr\u00e9sence et l'utilisation du s\u00e9lecteur :visited dans les feuilles de style CSS affich\u00e9es, par exemple, via la fonctionnalit\u00e9 Voir les CSS de la Web Developer Toolbar dans Firefox (menu CSS)<\/li><\/ul>","111":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter le r\u00e9f\u00e9rencement \u00e0 travers l'obtention de backlinks<\/li><li>Augmenter la visibilit\u00e9 du site pour les utilisateurs<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas publier de conditions restreignant ou interdisant la mise en place dans des sites externes de liens pointant vers le site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans les pages de type \u00ab&nbsp;mentions l\u00e9gales&nbsp;\u00bb, dans les conditions g\u00e9n\u00e9rales d'utilisation ou dans la page d\u00e9di\u00e9e aux cr\u00e9dits du site&nbsp;:  V\u00e9rifier l'absence de conditions restreignant ou interdisant la mise en place dans d'autres sites de liens pointant vers le site<\/li><\/ul>","112":"<p><strong>Objectif<\/strong><\/p><ul><li>Limiter les difficult\u00e9s \u00e0 cliquer sur un lien lorsque celui-ci occupe plus d'espace en mode survol\u00e9 ou activ\u00e9<\/li><li>Limiter les effets de clignotement ou de d\u00e9placement de contenus lors du survol d'un lien ou de sa prise de focus clavier<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Afin de ne pas perturber la mise en forme, il est recommand\u00e9 d'utiliser le m\u00eame m\u00e9canisme de mise en valeur, autre que par la couleur, \u00e0 tous les \u00e9tats possibles d'un lien : actif, visit\u00e9, non visit\u00e9, survol\u00e9<\/li><li> Il convient donc d'\u00e9viter par exemple au survol de mettre en gras ou d'encadrer d'une bordure un lien en graisse normale ou sans bordure par d\u00e9faut<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque hyperlien contenu dans les pages examin\u00e9es&nbsp;:  V\u00e9rifier manuellement que le survol du lien ou la prise de focus clavier (utilisation de la touche tabulation) des hyperliens ne modifie pas la position des autres \u00e9l\u00e9ments de la page ;   \t\t\t\t\tV\u00e9rifier que les hyperliens ne changent pas de taille lors de leur survol ou de leur prise de focus au clavier<\/li><\/ul>","113":"<p><strong>Objectif<\/strong><\/p><ul><li>Acc\u00e9l\u00e9rer l'apprentissage du fonctionnement de l'interface<\/li><li>Am\u00e9liorer l'identification des liens et de leurs fonctions respectives<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Appliquer des propri\u00e9t\u00e9s communes de style, de couleur, de graisse, de casse, de soulignement aux ensembles de liens de m\u00eame nature<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans l'ensemble du site&nbsp;:  V\u00e9rifier que les liens de m\u00eame nature (menus, liens au fil du texte, autres groupes de liens tels qu'un nuage de tags, etc) ont des pr\u00e9sentations visuellement similaires dans l'ensemble du site<\/li><\/ul>","114":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter les erreurs 404 en cours de navigation<\/li><li>Faciliter un acc\u00e8s rapide \u00e0 tous les contenus<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>S'assurer que l'outil utilis\u00e9 pour la r\u00e9daction des contenus poss\u00e8de une gestion satisfaisante et coh\u00e9rente des hyperliens internes<\/li><li>\n\nSi ce n'est pas le cas, lancer r\u00e9guli\u00e8rement un contr\u00f4le de la validit\u00e9 de l'ensemble des liens du site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans l'ensemble du site&nbsp;:  V\u00e9rifier l'absence de liens internes menant \u00e0 des erreurs de type 404<\/li><li>\n\nCette v\u00e9rification peut \u00eatre automatis\u00e9e, \u00e0 l'aide d'un outil tel que l'inspecteur d'Opquast Reporting (onglet Lien) ou d'un validateur de liens comme celui du W3C (http:\/\/validator&#x2e;w3&#x2e;org\/checklink\/) ou encore d'un outil du type Xenu's Link Sleuth<\/li><\/ul>","115":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier pr\u00e9cis\u00e9ment la nature du lien et d'\u00e9viter des actions erron\u00e9es<\/li><li>Permettre aux outils d'indexation d'associer un libell\u00e9 \u00e0 une ressource<\/li><li>Permettre aux lecteurs d'\u00e9cran d'en indiquer la cible de fa\u00e7on explicite et d'\u00e9viter de d\u00e9sorienter les utilisateurs<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer sans ambigu\u00eft\u00e9 le contenu de la page cible du lien, la fonction du lien ou son comportement, le cas \u00e9ch\u00e9ant, dans le libell\u00e9 des liens (portion de texte situ\u00e9e entre les balises &lt;a href=\"URL\"&gt; et &lt;\/a&gt; ou dans l'alternative textuelle de l'image plac\u00e9e entre ces balises, \u00e9ventuellement combin\u00e9e au libell\u00e9 textuel)<\/li><li>\n\n\u00c0 d\u00e9faut, reprendre et compl\u00e9ter le libell\u00e9 textuel via l'attribut title de l'\u00e9l\u00e9ment a<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le code source de chaque lien texte ou image-lien ou lien pr\u00e9sent dans les objets Flash&nbsp;:  V\u00e9rifier que le libell\u00e9 du lien d\u00e9signe explicitement la nature ou la fonction du contenu vis\u00e9, ou encore la fonction sp\u00e9cifique du lien ;  \t\t\t\t\t\u00c0 d\u00e9faut, v\u00e9rifier que l'attribut title du lien reprend et compl\u00e8te ce libell\u00e9 de mani\u00e8re \u00e0 le rendre explicite ;  \t\t\t\t\tContr\u00f4ler, dans le cas d'images-liens, que l'attribut alt de l'image (a, area) joue ce r\u00f4le, \u00e9ventuellement compl\u00e9t\u00e9 par un attribut title du lien au contenu identique ;  \t\t\t\t\tV\u00e9rifier, dans le cas de liens Flash, qu'ils sont dot\u00e9s d'une \u00e9tiquette textuelle qui en joue le r\u00f4le<\/li><\/ul>","116":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter les confusions entre deux liens cons\u00e9cutifs<\/li><li>\n\nAm\u00e9liorer la lisibilit\u00e9 des liens et des contenus<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>S\u00e9parer visuellement deux liens plac\u00e9s successivement dans un m\u00eame texte par un tiret, un espacement important ou une virgule, par exemple<\/li><li>\n\n\u00c9viter autant que possible la succession imm\u00e9diate de liens au fil du texte, par exemple, sur les mots successifs d'une m\u00eame phrase<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Au sein de chaque page examin\u00e9e :  V\u00e9rifier que les liens adjacents au fil du texte se diff\u00e9rencient visuellement les uns des autres de mani\u00e8re imm\u00e9diate, par exemple via un espacement important, un graphisme ou un signe de ponctuation<\/li><li>\n\nLa v\u00e9rification peut \u00eatre facilit\u00e9e par le recours \u00e0 la fonctionnalit\u00e9 Entourer les liens de la Web Developer Toolbar<\/li><\/ul>","117":"<p><strong>Objectif<\/strong><\/p><ul><li>Avertir clairement l'internaute du fait qu'il va quitter le service en ligne qu'il est en train de visiter<\/li><li> Faciliter le rep\u00e9rage des liens externes<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Il est possible d'ajouter l'information \u00ab&nbsp;lien externe&nbsp;\u00bb dans le libell\u00e9 du lien (mention textuelle, ic\u00f4ne HTML sp\u00e9cifique), dans l'attribut title du lien en y reprenant et en y compl\u00e9tant le libell\u00e9, via la mise en forme du lien (ic\u00f4ne CSS) ou encore via le comportement du lien (ouverture dans une nouvelle fen\u00eatre r\u00e9serv\u00e9e aux liens externes, avec avertissement pr\u00e9alable via le libell\u00e9 ou le title)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque page contenant des liens&nbsp;:  V\u00e9rifier que les liens internes et externes sont diff\u00e9renci\u00e9s par le moyen d'une mention textuelle, d'une ic\u00f4ne ou d'un comportement qui leur est propre<\/li><li> La v\u00e9rification s'effectue manuellement en contr\u00f4lant visuellement les liens<\/li><li> Elle peut \u00eatre facilit\u00e9e par le recours \u00e0 la fonctionnalit\u00e9 Entourer les liens externes de la Web Developer Toolbar<\/li><\/ul>","118":"<p><strong>Objectif<\/strong><\/p><ul><li>Rassurer l'utilisateur en lui permettant d'identifier directement l'auteur (au sens large)<\/li>Limiter les risques de d\u00e9fiance<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer, au moins sur une page et id\u00e9alement sur chaque page, le nom de l'auteur, de l'entit\u00e9 ou de la soci\u00e9t\u00e9 qui propose le service<\/li><li>\n\nSi le nom du site est identique \u00e0 celui de l'entit\u00e9 qui le propose, ce qui est relativement fr\u00e9quent, notamment pour les entreprises, la mention de ce nom dans le logo ou la baseline suffit \u00e0 respecter la bonne pratique<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Au sein de la page d'accueil ou au moins dans une page accessible depuis la page d'accueil (fr\u00e9quemment, la page des mentions l\u00e9gales) ou encore dans chacune des pages du site (souvent en pied de page)&nbsp;:  V\u00e9rifier manuellement que le nom de l'auteur, de l'entit\u00e9 ou de la soci\u00e9t\u00e9 proposant le service est mentionn\u00e9 dans au moins une de ces pages<\/li><\/ul>","119":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier sans ambigu\u00eft\u00e9 un interlocuteur physique capable de r\u00e9pondre aux questions \u00e9ventuelles sur les contenus propos\u00e9s, ou d'assumer les responsabilit\u00e9s li\u00e9es \u00e0 ces contenus<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer le nom d'une personne physique responsable des contenus sur le site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Au sein de la page d'accueil ou au moins sur une page accessible depuis la page d'accueil (fr\u00e9quemment, la page des mentions l\u00e9gales) ou encore sur chacune des pages du site (a priori en pied de page)&nbsp;:  V\u00e9rifier manuellement que la mention d'une personne physique ou du service responsable des contenus du site est pr\u00e9sente dans au moins une des pages cit\u00e9e ci-dessus<\/li><\/ul>","120":"<p><strong>Objectif<\/strong><\/p><ul><li>Donner aux utilisateurs une vision imm\u00e9diate de la nature du site et des contenus propos\u00e9s<\/li><li>\u00c9viter les recherches inutiles<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pr\u00e9voir sur la page d'accueil une information, une phrase, un contenu r\u00e9sumant les contenus et services propos\u00e9s dans le site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans la page d'accueil&nbsp;:  V\u00e9rifier la pr\u00e9sence d'une information, d'une phrase ou d'un contenu r\u00e9sumant les contenus et services propos\u00e9s dans le site<\/li><\/ul>","121":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur d'identifier imm\u00e9diatement et en permanence l'auteur, l'entit\u00e9 qui administre le site ou le site lui-m\u00eame le cas \u00e9ch\u00e9ant<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer le nom du site et\/ou le nom de l'auteur clairement dans toutes les pages du site (logo, nom de l'entit\u00e9 responsable, nom du site, etc)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chacune des pages du site&nbsp;:   V\u00e9rifier que le nom du site et\/ou le nom de l'auteur sont clairement pr\u00e9sents et identifiables dans toutes les pages du site (logo, nom de l'entit\u00e9 responsable, nom du site, etc)<\/li><li>\n\nCette v\u00e9rification s'effectue manuellement au fil des autres contr\u00f4les<\/li><li> Elle peut \u00eatre effectu\u00e9e \u00e0 partir des templates du site, sous r\u00e9serve de services tiers n'impl\u00e9mentant pas compl\u00e8tement ceux-ci<\/li><\/ul>","122":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter des consultations inutiles<\/li><li>D\u00e9livrer un avertissement aux utilisateurs<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Faire figurer sur la page d'accueil un message d'avertissement explicite sur la nature des contenus et le public auquel ils sont destin\u00e9s ou r\u00e9serv\u00e9s<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour tout site dont la consultation peut choquer ou \u00eatre interdite \u00e0 une certaine cat\u00e9gorie de la population (mineurs, etc)&nbsp;:  V\u00e9rifier la pr\u00e9sence d'un message d'avertissement explicite sur la nature des contenus propos\u00e9s et sur le public auquel ils sont destin\u00e9s ou r\u00e9serv\u00e9s<\/li><li>\n\nCette v\u00e9rification est \u00e0 mener de pair avec celles des bonnes pratiques 47 sur le r\u00f4le de la page d'accueil et 138 sur l'acc\u00e8s imm\u00e9diat au contenu<\/li><\/ul>","123":"<p><strong>Objectif<\/strong><\/p><ul><li>Donner aux utilisateurs qui le souhaitent la possibilit\u00e9 d'acc\u00e9der sans difficult\u00e9 aux moyens de contact t\u00e9l\u00e9phoniques et postaux<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer l'adresse postale compl\u00e8te et le num\u00e9ro de t\u00e9l\u00e9phone de la soci\u00e9t\u00e9 ou de l'organisme&nbsp;:  Dans chaque page du site ;  \t\t\t\t\tOu dans une page Contact ou \u00c0 propos, accessible directement depuis chaque page du site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque page du site ou dans au moins une page directement accessible depuis toutes les pages du site&nbsp;:  V\u00e9rifier la pr\u00e9sence de l'adresse postale compl\u00e8te et du num\u00e9ro de t\u00e9l\u00e9phone de la soci\u00e9t\u00e9 ou de l'organisme<\/li><li>\n\nCette v\u00e9rification accompagne fr\u00e9quemment celles des bonnes pratiques sur la mention du pays dans les adresses postales sur le format international des num\u00e9ros de t\u00e9l\u00e9phone<\/li><\/ul>","124":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre un r\u00e9f\u00e9rencement cibl\u00e9<\/li><li>Am\u00e9liorer le guidage des outils de recherche<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pour d\u00e9finir les r\u00e9pertoires, fichiers ou types de fichiers non indexables, utiliser les instructions user-agent et disallow dans un fichier texte unique appel\u00e9 robots&#x2e;txt, plac\u00e9 dans le r\u00e9pertoire racine du site<\/li><li>\n\nAlternativement, pour agir au niveau d'une page sp\u00e9cifique, utiliser dans celle-ci la balise &lt;meta name=\"robots\" content=\"attribut1, attribut2\" \/&gt; o\u00f9&nbsp;:  attribut1 peut prendre les valeurs index (indexer cette page) ou noindex (ne pas indexer cette page) ;  \t\t\t\t\tattribut2 peut prendre les valeurs follow (suivre les liens contenus dans cette page) ou nofollow (ne pas suivre les liens)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>\u00c0 partir de l'adresse URL de votre site&nbsp;:   Acc\u00e9der tout d'abord \u00e0 l'adresse du fichier robots&#x2e;txt, \u00e0 la racine du site, en tapant par exemple http:\/\/example&#x2e;com\/robots&#x2e;txt dans la barre d'adresse du navigateur ;   \t\t\t\t\tV\u00e9rifier la pr\u00e9sence du fichier robots&#x2e;txt plac\u00e9 dans le r\u00e9pertoire racine du site ;   \t\t\t\t\tV\u00e9rifier la validit\u00e9 de la syntaxe du fichier robots&#x2e;txt \u00e0 l'aide des indications donn\u00e9es dans le site http:\/\/robots-txt&#x2e;com\/\n\nEn l'absence de fichier robots&#x2e;txt, v\u00e9rifier la pr\u00e9sence et la validit\u00e9 de la balise &lt;meta name=\"robots\" content=\"attribut1, attribut2\"&nbsp;\/&gt; dans chaque page, par exemple \u00e0 l'aide de la fonctionnalit\u00e9 Voir les balises Meta (menu Information) de la Web Developer Toolbar, dans Firefox<\/li><\/ul>","125":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux outils de recherche et d'indexation d'extraire des informations \u00e0 propos du contenu des pages et ainsi d'am\u00e9liorer la restitution aux utilisateurs des r\u00e9sultats de recherche<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Renseigner la balise &lt;meta name=\"description\" content=\"\" \/&gt; avec une description du contenu de la page ou du site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le code source de chaque page examin\u00e9e&nbsp;:  V\u00e9rifier la pr\u00e9sence de la balise &lt;meta name=\"description\" content=\"\" \/&gt; \u00e0 l'aide, par exemple, de la fonctionnalit\u00e9 Informations sur la page ou Voir les balises Meta de la Web Developer Toolbar (menu Informations)<\/li><li>   \t\t\t\t\tContr\u00f4ler que le texte de cette balise d\u00e9crit effectivement le contenu de la page<\/li><li>\n\nCette v\u00e9rification peut \u00eatre associ\u00e9e au contr\u00f4le des bonnes pratiques 100 sur la META content et 170 sur la m\u00e9tadonn\u00e9e indiquant l'URL de r\u00e9f\u00e9rence des contenus propos\u00e9s sous plusieurs formes<\/li><\/ul>","126":"<p><strong>Objectif<\/strong><\/p><ul><li>Am\u00e9liorer l'identification visuelle du site et de ses pages<\/li><li>Faciliter l'identification dans le navigateur et dans les favoris ou signets<\/li><li>Permettre l'affichage, l'appel, et la m\u00e9morisation \u00e9ventuelle de l'ic\u00f4ne de favori par tous les navigateurs<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Selon le format choisi pour l'ic\u00f4ne et son emplacement, utiliser un lien du type&nbsp;:  &lt;link rel=\"icon\" type=\"image\/png\" href=\"\/img\/favicon&#x2e;png\"\/&gt; (format png, mais aussi jpg, gif, etc) ;  \t\t\t\t\t&lt;link rel=\"shortcut icon\" type=\"image\/x-icon\" href=\"\/img\/favicon&#x2e;ico\" \/&gt; (format ico Microsoft seul reconnu par Internet Explorer)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le code source de chaque page examin\u00e9e&nbsp;:  V\u00e9rifier, \u00e0 l'aide de Firebug par exemple, que l'\u00e9l\u00e9ment link rel est pr\u00e9sent dans l'en-t\u00eate de page head ;  \t\t\t\t\tV\u00e9rifier que sa syntaxe est de la forme :\n\n&lt;link rel=\"icon\" type=\"image\/png\" href=\"\/img\/favicon&#x2e;png\"\/&gt; pour les formats png, mais aussi jpg, gif, etc ;\n\nou &lt;link rel=\"shortcut icon\" type=\"image\/x-icon\" href=\"\/img\/favicon&#x2e;ico\" \/&gt; pour le format ico Microsoft<\/li><\/ul>","127":"<p><strong>Objectif<\/strong><\/p><ul><li>Contribuer \u00e0 la compr\u00e9hension imm\u00e9diate de l'identit\u00e9, de l'activit\u00e9 ou de la zone g\u00e9ographique du site<\/li><li>Am\u00e9liorer la capacit\u00e9 des utilisateurs \u00e0 m\u00e9moriser l'adresse du site et \u00e0 la retrouver en cas d'oubli<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Se reporter \u00e0 l'IANA (Internet Assigned Numbers Authority) : http:\/\/www&#x2e;iana&#x2e;org\/domains\/root\/db<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>\u00c0 partir de n'importe quelle adresse url du site examin\u00e9, contr\u00f4ler que l'extension du nom de domaine corresponde effectivement \u00e0 la description donn\u00e9e dans http:\/\/www&#x2e;iana&#x2e;org\/domains\/root\/db et, notamment, qu'elle soit en&nbsp;:   &#x2e;com pour un site e-commerce ;   \t\t\t\t\t&#x2e;info pour un service d'information ;   \t\t\t\t\t&#x2e;org pour un organisme \u00e0 but non commercial ;   \t\t\t\t\tou encore &#x2e;fr si la zone g\u00e9ographique couverte est la France, &#x2e;ch pour la Suisse, &#x2e;uk pour le Royaume-Uni, etc<\/li><\/ul>","128":"<p><strong>Objectif<\/strong><\/p><ul><li>Mettre \u00e0 disposition des informations synth\u00e9tiques et lisibles par les machines sur l'ensemble des contenus propos\u00e9s<\/li><li>Le fichier sitemap permet d'indiquer aux moteurs majeurs l'int\u00e9gralit\u00e9 des contenus \u00e0 indexer<\/li><li> L'int\u00e9r\u00eat premier est pour les sites tr\u00e8s profonds comme les catalogues en ligne avec plusieurs milliers de produits ou encore des sites dont le contenu est difficilement accessible lin\u00e9airement comme des encyclop\u00e9dies<\/li><li>L'int\u00e9r\u00eat pour un site de quelques pages est faible voire inexistant, mais la pr\u00e9sence du fichier ne sera pas p\u00e9nalisante<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Cr\u00e9er un fichier sitemap&#x2e;xml contenant la liste des pages du site \u00e0 la racine du site<\/li><li> \u00c0 d\u00e9faut de respecter le format XML, une simple liste d'URL est accept\u00e9e par les moteurs<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Via l'adresse url du site examin\u00e9&nbsp;:   V\u00e9rifier qu'un fichier sitemap&#x2e;xml existe \u00e0 la racine du site, en y acc\u00e9dant directement dans le navigateur avec une URL du type http:\/\/example&#x2e;com\/sitemap&#x2e;xml ;   \t\t\t\t\t\u00c0 d\u00e9faut, consulter le fichier robots&#x2e;txt (cf&#x2e; bonne pratique 125) pour y rechercher une URL sp\u00e9cifique mentionn\u00e9e sous la forme sitemap: http:\/\/example&#x2e;com\/adresse\/du\/fichier&#x2e;xml<\/li><\/ul>","129":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la compr\u00e9hension par l'utilisateur des r\u00e8gles de qualit\u00e9, d'accessibilit\u00e9 ou autres appliqu\u00e9es sur le site<\/li><li>Accro\u00eetre la confiance dans les informations d\u00e9livr\u00e9es sur le site<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir un lien vers chaque standard ou r\u00e9f\u00e9rentiel concern\u00e9<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans l'ensemble du site, et notamment dans la page d'accueil, la page des mentions l\u00e9gales, la page d'\u00e0 propos, d'aide ou d'accessibilit\u00e9 ou encore dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales de vente ou aux conditions de livraison ou de remboursement&nbsp;:   V\u00e9rifier la pr\u00e9sence d'un lien vers chaque standard ou r\u00e9f\u00e9rentiel que le site ou le service d\u00e9clare respecter<\/li><li>\n\nLe contr\u00f4le de cette bonne pratique est similaire \u00e0 celui de la bonne pratique 101 sur les mentions d'appartenance \u00e0 un ordre ou groupe professionnel, d'un label ou d'une r\u00e9compense<\/li><\/ul>","130":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre l'utilisation imm\u00e9diate du contact t\u00e9l\u00e9phonique quel que soit le contexte utilisateur<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>V\u00e9rifier que tous les num\u00e9ros de t\u00e9l\u00e9phone sont pr\u00e9c\u00e9d\u00e9s de l'indicatif du pays sous la forme +indicatif international - num\u00e9ro de t\u00e9l\u00e9phone<\/li><li> Exemple pour la France&nbsp;: +33 1 23 45 67 89<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque num\u00e9ro de t\u00e9l\u00e9phone indiqu\u00e9 dans le site&nbsp;:   V\u00e9rifier que tous les num\u00e9ros sont pr\u00e9c\u00e9d\u00e9s de l'indicatif du pays sous la forme +indicatif international - num\u00e9ro de t\u00e9l\u00e9phone, par exemple +33 1 23 45 67 89 pour la France<\/li><li> Cette v\u00e9rification accompagne fr\u00e9quemment celles des bonnes pratiques 50 sur la mention du pays dans les adresses postales et 127 sur la pr\u00e9sence de l'adresse compl\u00e8te et du num\u00e9ro de t\u00e9l\u00e9phone des soci\u00e9t\u00e9s et organisations<\/li><\/ul>","131":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'identifier imm\u00e9diatement le pays associ\u00e9 \u00e0 l'adresse postale, sans ambigu\u00eft\u00e9 et sans avoir recours \u00e0 d'autres \u00e9l\u00e9ments (ville, r\u00e9gion, code postal, num\u00e9ro de t\u00e9l\u00e9phone)<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer explicitement le pays dans l'adresse postale sous forme textuelle<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque adresse postale indiqu\u00e9e dans le site&nbsp;:  V\u00e9rifier la pr\u00e9sence de la mention textuelle et explicite du pays dans toutes les adresses postales<\/li><\/ul>","132":"<p><strong>Objectif<\/strong><\/p><ul><li>Favoriser l'indexation des contenus selon leur langue<\/li><li>\n\nFaciliter la traduction automatique<\/li><li>Permettre une lecture correcte du contenu par un outil de synth\u00e8se vocale<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Renseigner l'attribut lang de l'\u00e9l\u00e9ment racine html \u00e0 l'aide du code langue appropri\u00e9 (tel qu'indiqu\u00e9 par le registre tenu par l'IANA : http:\/\/www&#x2e;iana&#x2e;org\/assignments\/language-subtag-registry)<\/li><li> En pratique, pour le fran\u00e7ais, cela donne : &lt;html lang=\"fr\"&gt; (en HTML) et &lt;html lang=\"fr\" xml:lang=\"fr\"&gt; (en XHTML)<\/li><li>\n\n\u00c0 d\u00e9faut, dans des cas plus complexes, la langue du contenu peut \u00eatre indiqu\u00e9e via les diff\u00e9rents \u00e9l\u00e9ments parents : head, body, title, etc<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>La v\u00e9rification consiste \u00e0 contr\u00f4ler la pr\u00e9sence et la pertinence de l'attribut lang de l'\u00e9l\u00e9ment html (ou \u00e0 d\u00e9faut de ses \u00e9l\u00e9ments descendants) dans le code source, par exemple \u00e0 l'aide de Firebug<\/li><li> Dans le code source de chaque page&nbsp;:  V\u00e9rifier que la langue par d\u00e9faut du contenu est indiqu\u00e9e via l'attribut lang de l'\u00e9l\u00e9ment html, par exemple &lt;html lang=\"fr\"&gt; (en HTML)  \t\t\t\t\t\u00c0 d\u00e9faut, v\u00e9rifier qu'elle est au moins h\u00e9rit\u00e9e, pour chaque \u00e9l\u00e9ment de contenu, d'un \u00e9l\u00e9ment parent (head, body, title, etc) via son attribut lang<\/li><li>\n\nV\u00e9rifier la validit\u00e9 et la pertinence du code de langue utilis\u00e9<\/li><li> Pour cela, recourir par exemple au Language Subtag Lookup Tool de Richard Ishida,&nbsp;https:\/\/r12a&#x2e;github&#x2e;io\/app-subtags\/<\/li><li>\n\nParmi les cas courants de codes de langue erron\u00e9s, citons jp au lieu de ja pour le japonais, lu au lieu de lb pour le luxembourgeois, gr au lieu de el pour le grec, lat au lieu de la pour le latin et oci au lieu de oc pour l'occitan<\/li><li> Par ailleurs, les codes mul pour \u00ab&nbsp;langues multiples&nbsp;\u00bb et und pour \u00ab&nbsp;langue ind\u00e9termin\u00e9e&nbsp;\u00bb ne doivent pas \u00eatre utilis\u00e9s dans un contenu web<\/li><li> Enfin, l'attribut xml:lang peut \u00eatre \u00e9galement renseign\u00e9 en compl\u00e9ment de l'attribut lang, mais il n'est pas suffisant pour rendre conforme cette bonne pratique<\/li><\/ul>","133":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs et outils de navigation d'anticiper le changement de langue en cours de navigation<\/li><li>\u00c9viter aux utilisateurs de se rendre sur une page dont ils ne comprennent pas la langue<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>La langue cible d'un lien peut \u00eatre indiqu\u00e9e&nbsp;:  Simplement via le libell\u00e9 du lien qui sera r\u00e9dig\u00e9 dans la langue cible ;  \t\t\t\t\t\u00c9ventuellement \u00e0 l'aide d'une ic\u00f4ne appropri\u00e9e (drapeau) ;  \t\t\t\t\t\u00c9ventuellement de mani\u00e8re explicite dans le libell\u00e9 du lien ou dans son contexte imm\u00e9diat, en mentionnant la langue directement<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le site&nbsp;:  Identifier manuellement les liens dont le contenu de la page cible n'est pas r\u00e9dig\u00e9 dans la m\u00eame langue que celle de la page courante ;  \t\t\t\t\tV\u00e9rifier, pour chacun de ces liens, que l'utilisateur est imm\u00e9diatement inform\u00e9 de la nature de la langue concern\u00e9e soit \u00e0 la lecture du libell\u00e9 (r\u00e9dig\u00e9 dans la langue cible), soit via une ic\u00f4ne, soit via une information donn\u00e9e dans le contexte du lien<\/li><\/ul>","134":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux aides techniques d'interpr\u00e9ter correctement les contenus exprim\u00e9s dans une autre langue<\/li><li>Faciliter le travail des outils de traduction automatiques<\/li><li>Permettre aux outils d'indexation d'extraire des cha\u00eenes dans une langue donn\u00e9e<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser l'attribut lang et le code de langue adapt\u00e9 pour chaque contenu dont la langue diff\u00e8re de celle de la page courante<\/li><li> Par exemple : &lt;title lang=\"en\"&gt;Open quality standards&lt;\/title&gt;\n\nSi le contenu dont la langue diff\u00e8re n'est pas d\u00e9j\u00e0 balis\u00e9 par un \u00e9l\u00e9ment de la structure HTML existante (titre, lien, citation etc), il est alors n\u00e9cessaire d'ajouter un \u00e9l\u00e9ment sp\u00e9cifique (div ou span) pour sp\u00e9cifier la langue de cet \u00e9l\u00e9ment (\u00e0 l'exception du contenu de l'\u00e9l\u00e9ment title qui ne peut comporter de balisage interne)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque page examin\u00e9e&nbsp;:  Rep\u00e9rer tous les contenus r\u00e9dig\u00e9s dans une autre langue que la langue principale, sans oublier les contenus des attributs HTML restitu\u00e9s \u00e0 l'utilisateur (tel que celui de l'attribut alt des images)  \t\t\t\t\tContr\u00f4ler que la langue de ces contenus est pr\u00e9cis\u00e9e via un attribut lang plac\u00e9 sur l'\u00e9l\u00e9ment concern\u00e9 par le changement de langue (titre, lien, item de liste) ou h\u00e9rit\u00e9 d'un \u00e9l\u00e9ment parent<\/li><li>   \t\t\t\t\tV\u00e9rifier la validit\u00e9 et la pertinence du code de langue indiqu\u00e9 dans cet attribut (voir la bonne pratique 49 sur la langue par d\u00e9faut du contenu)<\/li><li>\n\nPour faciliter le contr\u00f4le, il est possible d'afficher les attributs lang et leur contenu \u00e0 l'aide de la fonctionnalit\u00e9 Mettre en valeur les attributs lang de la WAT toolbar pour IE (menu Informations)<\/li><li>\n\nLe contr\u00f4le de cette bonne pratique peut \u00eatre associ\u00e9 \u00e0 celui de la 196 sur le sens de lecture<\/li><\/ul>","135":"<p><strong>Objectif<\/strong><\/p><ul><li>Donner un acc\u00e8s direct et imm\u00e9diat aux traductions de la page courante<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir sur chaque page dont le contenu a \u00e9t\u00e9 traduit un lien ou un formulaire de navigation donnant imm\u00e9diatement acc\u00e8s \u00e0 la version traduite de la page courante, sans retour \u00e0 la page d''accueil de la version linguistique concern\u00e9e<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le cas d'un site internationalis\u00e9&nbsp;:   S'assurer que les liens vers les traductions du contenu conduisent imm\u00e9diatement \u00e0 la traduction du contenu de la page en cours, sans retour en page d'accueil<\/li><li>\n\nCette v\u00e9rification va de pair avec celles des bonnes pratiques 130 sur la pr\u00e9sence de ces liens et 192 sur leur libell\u00e9<\/li><\/ul>","136":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre l'identification imm\u00e9diate du lien pertinent par l'utilisateur<\/li><li> Rendre compr\u00e9hensible des liens sp\u00e9cialement cr\u00e9\u00e9s pour un public sp\u00e9cifique<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>R\u00e9diger les liens et les alternatives textuelles d'images-liens concern\u00e9es dans la langue de chaque page cible<\/li><li> Par exemple, inscrire \u00ab&nbsp;English version&nbsp;\u00bb pour un lien menant vers une version anglaise de la page actuellement r\u00e9dig\u00e9e en fran\u00e7ais<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le cas d'un site internationalis\u00e9&nbsp;:  V\u00e9rifier que chaque lien, qui m\u00e8ne vers une autre version linguistique de la page ou du site, est r\u00e9dig\u00e9 dans la langue cible<\/li><li>\n\nCette v\u00e9rification va de pair avec celles des bonnes pratiques 130 sur la pr\u00e9sence de ces liens et 194 sur leur cible<\/li><\/ul>","137":"<p><strong>Objectif<\/strong><\/p><ul><li>Laisser le choix \u00e0 l\u2019utilisateur de la version ayant ses pr\u00e9f\u00e9rences<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas rediriger c\u00f4t\u00e9 serveur vers la version mobile (en dynamic serving ou en cas de version mobile d\u00e9di\u00e9e) sans possibilit\u00e9 pour l\u2019utilisateur de d\u00e9sactiver cette redirection<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Contr\u00f4ler manuellement qu\u2019il est possible d\u2019acc\u00e9der \u00e0 la version desktop depuis un p\u00e9riph\u00e9rique mobile<\/li><\/ul>","138":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l\u2019utilisateur de choisir le mode de rendu le plus  adapt\u00e9 \u00e0 ses pr\u00e9f\u00e9rences et \u00e0 son contexte<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir sur chaque page du site dans la version desktop un lien vers la page correspondante de la version mobile (ou \u00e0 d\u00e9faut la page d\u2019accueil) et r\u00e9ciproquement<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier manuellement la pr\u00e9sence, sur chaque page, de la version desktop d\u2019un lien vers la page correspondante de la version mobile (ou \u00e0 d\u00e9faut la page d\u2019accueil) et r\u00e9ciproquement<\/li><\/ul>","139":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d\u2019adapter le rendu \u00e0 leurs besoins ou \u00e0 leurs pr\u00e9f\u00e9rences en recourant au zoom graphique<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas utiliser de m\u00e9canisme bloquant le zoom, et en particulier, ne pas utiliser les attributs minimum-scale, maximum-scale et user-scalable de l\u2019\u00e9l\u00e9ment meta viewport<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier sur un p\u00e9riph\u00e9rique tactile qu\u2019il est possible d\u2019agrandir la vue avec la commande de zoom tactile du navigateur<\/li><\/ul>","140":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter les sollicitations impos\u00e9es et r\u00e9p\u00e9titives<\/li><li>Faciliter la navigation dans le site<\/li><li>Pr\u00e9venir d\u2019\u00e9ventuelles p\u00e9nalit\u00e9s de la part des moteurs de recherche<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>G\u00e9rer l\u2019affichage des fen\u00eatres de promotion de l\u2019application mobile associ\u00e9e au site \u00e0 l\u2019aide d\u2019un cookie, de mani\u00e8re \u00e0 ce qu\u2019il ne se produise qu\u2019une seule fois par session<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier manuellement, en naviguant sur le site, que les fen\u00eatres modales et d\u2019alertes JavaScript faisant la promotion de l\u2019application mobile concern\u00e9e ne s\u2019affichent qu\u2019une seule fois lors de la session<\/li><\/ul>","141":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter les sollicitations impos\u00e9es et r\u00e9p\u00e9titives<\/li><li>Faciliter la navigation dans le site<\/li><li>Pr\u00e9venir d\u2019\u00e9ventuelles p\u00e9nalit\u00e9s de la part des moteurs de recherche<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Limiter la promotion de l\u2019application mobile associ\u00e9e au site \u00e0 des banni\u00e8res statiques<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier manuellement, en naviguant sur le site, l\u2019absence de fen\u00eatres modales et d\u2019alertes JavaScript faisant la promotion de l\u2019application mobile concern\u00e9e<\/li><\/ul>","142":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la consultation sur les terminaux mobiles<\/li><li>Am\u00e9liorer le positionnement dans les outils d\u2019indexation qui prennent ce crit\u00e8re en compte<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Soit recourir aux media queries ou \u00e0 l\u2019adaptative design pour adresser au navigateur des r\u00e8gles de style adapt\u00e9es selon la taille de l\u2019\u00e9cran<\/li><li>\n\nSoit fournir une version mobile d\u00e9di\u00e9e<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Comparer l\u2019affichage de la page sur diff\u00e9rentes tailles d\u2019\u00e9cran (desktop, tablettes, smartphone, etc) et v\u00e9rifier que le rendu s\u2019adapte \u00e0 celles-ci<\/li><\/ul>","143":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre l\u2019utilisation des claviers virtuels adapt\u00e9s aux diff\u00e9rents types de saisie sur les terminaux mobiles<\/li><li>Faciliter la validation de la saisie<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Doter chaque \u00e9l\u00e9ment input concern\u00e9 d\u2019un attribut type correspondant \u00e0 la saisie attendue : email, url, tel, number, search, password, date, time<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier, pour chaque \u00e9l\u00e9ment input concern\u00e9, la pr\u00e9sence de l\u2019attribut type dot\u00e9 de la valeur correspondant au type de saisie attendue : email, url, tel, number, search, password, date, time<\/li><\/ul>","144":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter l\u2019utilisation des num\u00e9ros de t\u00e9l\u00e9phone, notamment sur les terminaux mobiles<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Baliser les num\u00e9ros de t\u00e9l\u00e9phone avec un lien a dot\u00e9 d\u2019un attribut href du type href=\"tel:\"<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier, dans le code HTML g\u00e9n\u00e9r\u00e9, le balisage des num\u00e9ros de t\u00e9l\u00e9phone sous la forme a href=\"tel:\"<\/li><\/ul>","145":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre une restitution alternative d'un iframe sous la forme d'un lien correctement libell\u00e9 vers le contenu inclus<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Renseigner l'attribut title de l'\u00e9l\u00e9ment iframe de mani\u00e8re \u00e0 indiquer explicitement la nature du contenu du cadre ou sa fonction<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans toutes les pages examin\u00e9es&nbsp;:  Identifier chaque cadre iframe pr\u00e9sent dans les pages, par exemple, \u00e0 l'aide de la fonctionnalit\u00e9 Entourer les frames de la Web Developer Toolbar (menu Entourer) ;   \t\t\t\t\tV\u00e9rifier que chaque \u00e9l\u00e9ment iframe est dot\u00e9 d'un attribut title \u00e0 l'aide de Firebug ou de la fonctionnalit\u00e9 Afficher les attributs title de la Web Developer Toolbar (menu Informations) ;  \t\t\t\t\tV\u00e9rifier que le contenu de l'attribut title est explicite et pertinent, de mani\u00e8re \u00e0 permette \u00e0 l'utilisateur d'identifier pr\u00e9cis\u00e9ment le contenu ou le r\u00f4le de cet iframe<\/li><li>\n\nIl est prudent d'effectuer \u00e9galement un contr\u00f4le de la version sans javascript de la page, l'iframe pouvant \u00eatre utilis\u00e9 comme solution de rechange \u00e0 certains scripts<\/li><\/ul>","146":"<p><strong>Objectif<\/strong><\/p><ul><li>Am\u00e9liorer la consultation et la navigation pour les personnes handicap\u00e9es<\/li><li>\u00c9viter les probl\u00e8mes d'impression ou de mise en favoris<\/li><li>Am\u00e9liorer le r\u00e9f\u00e9rencement en \u00e9vitant l'indexation de pages orphelines<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas utiliser les \u00e9l\u00e9ments frameset, frame et noframes<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le code source g\u00e9n\u00e9r\u00e9 de chaque page&nbsp;:  V\u00e9rifier l'absence dans le code source d'\u00e9l\u00e9ments frameset, frame et noframes, par d\u00e9faut ou g\u00e9n\u00e9r\u00e9s via Javascript<\/li><li>\n\nAttention, les \u00e9l\u00e9ments iframe ne sont pas concern\u00e9s par cette bonne pratique<\/li><\/ul>","147":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de revenir en page d'accueil en cas de d\u00e9sorientation<\/li><li>Identifier le lien principal permettant d'acc\u00e9der au site<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pr\u00e9voir un lien vers la page d'accueil sur chaque page du site<\/li><li>\n\nVeiller \u00e0 ce que ce lien soit de pr\u00e9f\u00e9rence toujours au m\u00eame endroit (d\u00e9but du fil d'Ariane, menu de navigation, etc)<\/li><li>\n\nLe cas \u00e9ch\u00e9ant, utiliser l'URL correspondant \u00e0 l'adresse g\u00e9n\u00e9rique du site (URL du domaine) du type http:\/\/exemple&#x2e;com plut\u00f4t que l'URL interne de la page, par exemple http:\/\/exemple&#x2e;com\/V1\/accueil&#x2e;html<\/li><li>\n\nSi un logo de site est pr\u00e9sent dans les pages, il doit \u00eatre cliquable et permettre de revenir vers l'accueil<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette v\u00e9rification gagne \u00e0 \u00eatre effectu\u00e9e, si possible, \u00e0 partir des templates et en tenant compte des \u00e9ventuels services tiers susceptibles de produire des pages qui ne correspondraient pas \u00e0 ces templates<\/li><li>\n\nDans chacune des pages du site&nbsp;:  V\u00e9rifier qu'il est possible de revenir directement \u00e0 la page d'accueil depuis toutes les pages, \u00e0 partir d'un lien explicite distinct de l'\u00e9ventuel lien sur le logo principal<\/li><\/ul>","148":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur d'anticiper le r\u00e9sultat de l'activation d'un lien<\/li><li>\u00c9viter aux utilisateurs d'aides techniques d'\u00eatre d\u00e9sorient\u00e9s par l'ouverture d'une nouvelle fen\u00eatre qui n'est pas toujours perceptible et perturbe notamment l'utilisation de l'historique de navigation<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ajouter une mention du type \u00ab&nbsp;(nouvelle fen\u00eatre)&nbsp;\u00bb, soit directement dans le libell\u00e9 du lien, soit dans son attribut title qui doit alors reprendre et compl\u00e9ter le libell\u00e9<\/li><li>\n\nAjouter une mention du type \u00ab&nbsp;(nouvelle fen\u00eatre)&nbsp;\u00bb dans les \u00e9tiquettes de contr\u00f4le de formulaire, dans les libell\u00e9s de boutons ou dans tout autre objet provoquant l'ouverture d'une nouvelle fen\u00eatre<\/li><li>\n\nIndiquer l'ouverture d'une nouvelle fen\u00eatre dans les \u00e9tiquettes textuelles des contr\u00f4les Flash<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans les pages inspect\u00e9es&nbsp;:  Identifier les liens et autres contr\u00f4les d'ouverture d'une nouvelle fen\u00eatre, c'est-\u00e0-dire&nbsp;:   \t\t\t\t\tLes usages de l'attribut target dans la source g\u00e9n\u00e9r\u00e9e HTML, par exemple en faisant une recherche de _blank \u00e0 l'aide de la recherche de Firebug ; Les usages de la fonctionnalit\u00e9 window&#x2e;open via une recherche dans les fichiers Javascript et dans la source HTML ; les liens pr\u00e9sents dans des objets inclus (Flash) et ouvrant une nouvelle fen\u00eatre, ce qui ne peut \u00eatre fait qu'en activant chaque lien successivement<\/li><li>   \t\t\t\t\t  \t\t\t\t\t  \t\t\t\t\tV\u00e9rifier, pour chacun de ces liens, quelle que soit la technologie utilis\u00e9e, la pr\u00e9sence d'un avertissement consultable avant toute action sur celui-ci, du type \u00ab&nbsp;(nouvelle fen\u00eatre)&nbsp;\u00bb&nbsp;:   \t\t\t\t\tDans le libell\u00e9 du lien ou du contr\u00f4le ; Dans son attribut title, \u00e0 v\u00e9rifier via Firebug ; Via Adesigner ou la consultation dans un lecteur d'\u00e9cran pour les objets Flash<\/li><\/ul>","149":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur de naviguer sur le site sans avoir d'op\u00e9ration sp\u00e9cifique \u00e0 effectuer pendant la navigation<\/li><li>\u00c9viter \u00e0 des utilisateurs d'aides techniques d'\u00eatre d\u00e9sorient\u00e9s par l'ouverture d'une nouvelle fen\u00eatre qui ne sera pas toujours ais\u00e9ment perceptible et qui perturbe notamment l'utilisation de l'historique de navigation ou qui masquera dans un lecteur d'\u00e9cran la fen\u00eatre principale<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas utiliser d'ouverture automatique de fen\u00eatres popup (\u00e9v\u00e9nement d'ouverture de fen\u00eatre lors du chargement d'une page) sur les pages internes du site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette bonne pratique est \u00e0 v\u00e9rifier manuellement \u00e0 l'occasion de l'ensemble des autres tests, en prenant soin de d\u00e9sactiver toute \u00e9ventuelle fonctionnalit\u00e9 de blocage des popups dans le navigateur utilis\u00e9<\/li><li>\n\nDans toutes les pages internes du site&nbsp;:  V\u00e9rifier que la navigation dans les pages internes du site ne d\u00e9clenche pas l'ouverture automatique de nouvelles fen\u00eatres<\/li><\/ul>","150":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la navigation<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><\/ul>","151":"<p><strong>Objectif<\/strong><\/p><ul><li>Limiter le temps d\u2019apprentissage de l\u2019interface<\/li><li>Acc\u00e9l\u00e9rer l\u2019acc\u00e8s aux contenus<\/li><li>R\u00e9duire le taux de rebond<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>\u00c9viter tout contenu temporaire de type publicit\u00e9 qui retarde l\u2019acc\u00e8s \u00e0 la possibilit\u00e9 de fermer une fen\u00eatre modale ou similaire<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>S\u2019assurer que chaque fen\u00eatre modale ou similaire peut \u00eatre ferm\u00e9e d\u00e8s son affichage<\/li><\/ul>","152":"<p><strong>Objectif<\/strong><\/p><ul><li>Donner aux utilisateurs des indications explicites pour fermer une fen\u00eatre ou une bo\u00eete modale<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Placer, dans chaque fen\u00eatre dimensionn\u00e9e, un bouton ou un lien avec un libell\u00e9 explicite pour la fermeture et associer ce bouton \u00e0 une action de fermeture<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque fen\u00eatre \u00ab&nbsp;r\u00e9elle&nbsp;\u00bb (popup dimensionn\u00e9e) ou chaque fen\u00eatre simul\u00e9e affich\u00e9e en surimpression du contenu (fen\u00eatre modale), et ce, quelle que soit la technologie utilis\u00e9e (HTML, javascript\/CSS ou flash)&nbsp;:   V\u00e9rifier que le corps des fen\u00eatres dimensionn\u00e9es et des fen\u00eatres modales contient un bouton ou un lien permettant de les fermer<\/li><li>\n\nLes fen\u00eatres dont la fermeture ne se fait qu'implicitement (par exemple via la touche d'\u00e9chappement) invalident cette bonne pratique<\/li><\/ul>","153":"<p><strong>Objectif<\/strong><\/p><ul><li>Limiter le temps d\u2019apprentissage de l\u2019interface<\/li><li>Acc\u00e9l\u00e9rer l\u2019acc\u00e8s aux contenus<\/li><li>Faciliter la navigation<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Opter pour un positionnement syst\u00e9matique des boutons de fermeture dans un m\u00eame emplacement, pour toutes les fen\u00eatres modales et similaires (par exemple, en haut \u00e0 droite de la fen\u00eatre)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>S\u2019assurer visuellement que l\u2019emplacement de tous les boutons de fermeture est identique \u00e0 travers le site<\/li><\/ul>","154":"<p><strong>Objectif<\/strong><\/p><ul><li>Laisser \u00e0 l'utilisateur le contr\u00f4le de son navigateur et de son interface de consultationNe pas le d\u00e9sorienter ou le surprendre par un changement non anticip\u00e9 de ceux-ci<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas utiliser de techniques Javascript modifiant la taille de la fen\u00eatre du navigateur<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Tout comme pour la bonne pratique 60 sur l'ouverture automatique de popups, celle-ci peut \u00eatre v\u00e9rifi\u00e9e \u00e0 l'occasion de l'ensemble des autres tests&nbsp;:   V\u00e9rifier que la fen\u00eatre du navigateur n'est pas redimensionn\u00e9e lors de la navigation sur le site<\/li><\/ul>","155":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre la navigation au clavier ou via des p\u00e9riph\u00e9riques d'entr\u00e9es ou des dispositifs qui ne reposent pas sur la souris<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Veiller \u00e0 ne pas masquer ou supprimer l'effet visuel de prise de focus qui indique quel est l'\u00e9l\u00e9ment atteint lors de la navigation au clavier<\/li><li> En particulier, ne pas annuler la valeur par d\u00e9faut de la propri\u00e9t\u00e9 CSS outline<\/li><li>\n\nNe pas supprimer via Javascript la prise de focus clavier (exploitation de l'\u00e9v\u00e9nement onblur)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Ce contr\u00f4le s'effectue comme celui de la bonne pratique 57&nbsp;: sur l'ensemble des \u00e9l\u00e9ments interactifs, prioritairement \u00e0 l'aide de la touche tabulation et, dans l'interface de certains widgets, \u00e0 l'aide de touches de d\u00e9placement sp\u00e9cifiques (touches fl\u00e8ches)<\/li><li>\n\nPour chaque \u00e9l\u00e9ment interactif contenu dans les pages examin\u00e9es&nbsp;:   V\u00e9rifier que l'indication visuelle du focus par d\u00e9faut du navigateur est au moins pr\u00e9sente via une bordure pointill\u00e9e sur l'\u00e9l\u00e9ment HTML actif (dans Firefox, Safari ou Internet Explorer) et via une mani\u00e8re sp\u00e9cifique dans les objets Flash ou, \u00e0 d\u00e9faut, qu'une indication visuelle sp\u00e9cifique a \u00e9t\u00e9 am\u00e9nag\u00e9e<\/li><li>\n\nCe contr\u00f4le peut \u00eatre associ\u00e9 \u00e0 celui des bonnes pratiques 57 sur l'acc\u00e8s au clavier et 134 sur l'ordre de navigation clavier<\/li><\/ul>","156":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre la navigation au clavier pour les utilisateurs ayant une pr\u00e9f\u00e9rence pour cette pratique<\/li><li>Permettre la consultation des contenus et l'utilisation des services ind\u00e9pendamment du p\u00e9riph\u00e9rique d'entr\u00e9e, afin de les rendre accessibles aux utilisateurs d'aides techniques (lecteurs d'\u00e9cran par exemple) qui n'utilisent que le clavier ou un p\u00e9riph\u00e9rique plus sp\u00e9cifique reposant sur les m\u00eames m\u00e9canismes que le clavier (bouton poussoir par exemple)<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Recourir \u00e0 des gestionnaires d'\u00e9v\u00e9nements universels en cas d'interaction bas\u00e9e sur Javascript (par exemple, onclick pour un lien a ou pour un champ ou contr\u00f4le de formulaire) ou, \u00e0 d\u00e9faut, compl\u00e9ter les gestionnaires d'\u00e9v\u00e9nements non universels (onmouseover par exemple) par un second gestionnaire permettant l'acc\u00e8s clavier (onfocus par exemple) ou encore fournir un moyen d'acc\u00e8s alternatif<\/li><li>\n\nFournir des moyens d'acc\u00e8s clavier dans les interfaces recourant \u00e0 des technologies sp\u00e9cifiques telles que Flash<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette v\u00e9rification s'applique \u00e0 l'ensemble des \u00e9l\u00e9ments interactifs&nbsp;: hyperliens, boutons, champs de formulaires, objets inclus (Flash), widgets Javascript, etc Le mode d'interaction par d\u00e9faut est la touche tabulation pour atteindre les liens, les champs et les contr\u00f4les, puis la touche entr\u00e9e pour les activer<\/li><li> Dans certains widgets, un mode d'interaction sp\u00e9cifique peut \u00eatre pr\u00e9sent : barre d'espace pour valider, touches fl\u00e8ches pour se d\u00e9placer, touche d'\u00e9chappement pour fermer ou sortir<\/li><li> Autant que possible dans ce cas, ces touches sp\u00e9cifiques devraient \u00eatre indiqu\u00e9es \u00e0 l'utilisateur<\/li><li>\n\nAu sein de chaque page examin\u00e9e&nbsp;:  V\u00e9rifier que l'ensemble des interactions, liens, boutons, champs de formulaires, objets inclus (Flash) pr\u00e9sents dans les pages sont utilisables au clavier, \u00e0 l'exception de ceux pour lesquels cela n'aurait pas de sens, comme une fonctionnalit\u00e9 de trac\u00e9 \u00e0 la souris<\/li><li>\n\nCe contr\u00f4le peut \u00eatre associ\u00e9 \u00e0 celui des bonnes pratiques 58 sur la visibilit\u00e9 du focus clavier et 134 sur l'ordre de navigation clavier<\/li><li> En cas de focus clavier masqu\u00e9, qui peut rendre ce test particuli\u00e8rement laborieux, il est possible de forcer sa visibilit\u00e9 \u00e0 l'aide d'une feuille de style utilisateur du type&nbsp;: *:focus {outline: 1px dotted red !important}<\/li><\/ul>","157":"<p><strong>Objectif<\/strong><\/p><ul><li>De nombreux utilisateurs naviguent sans souris, avec les touches de leur clavier : facilitez-leur la vie<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Organiser les contenus dans l'ordre lin\u00e9aire du code HTML de mani\u00e8re \u00e0 regrouper et ordonner logiquement les liens et les contr\u00f4les de formulaires qui apparaissent les uns \u00e0 la suite des autres \u00e0 l'affichage et ordonner logiquement les principaux blocs de navigation et de contenu composant la page<\/li><li>\n\nLe cas \u00e9ch\u00e9ant, et en dernier ressort, recourir \u00e0 l'attribut HTML tabindex pour cr\u00e9er un ordre de navigation au clavier sp\u00e9cifique, diff\u00e9rent de l'ordre par d\u00e9faut issu de l'organisation des liens et des contr\u00f4les de formulaires dans le code<\/li><li>\n\nG\u00e9rer sp\u00e9cifiquement l'ordre de navigation au clavier en cas de fen\u00eatre modale ou de widget<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>\u00c0 l'instar des bonnes pratiques 57 et 58, ce contr\u00f4le s'effectue sur l'ensemble des \u00e9l\u00e9ments interactifs, y compris les objets (Flash), prioritairement \u00e0 l'aide de la touche tabulation et, dans l'interface de certains widgets, \u00e0 l'aide de touches de d\u00e9placement sp\u00e9cifiques (touches fl\u00e8ches)&nbsp;:   Naviguer au clavier puis v\u00e9rifier que l'ordre de passage d'un \u00e9l\u00e9ment \u00e0 un autre est identique entre les diff\u00e9rentes pages ;   \t\t\t\t\tV\u00e9rifier que l'ordre de passage est adapt\u00e9 au contenu concern\u00e9<\/li><li> Par exemple, la navigation clavier dans une pseudo-popup javascript commence par son bouton de fermeture, g\u00e9n\u00e9ralement plac\u00e9 en haut \u00e0 droite de celle-ci ;  \t\t\t\t\tContr\u00f4ler que l'ordre est pr\u00e9visible par l'utilisateur : sauf exceptions, cet ordre doit \u00eatre aussi proche que possible de l'ordre de lecture, par exemple haut-bas et gauche-droite<\/li><\/ul>","158":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter des clics inutiles aux utilisateurs<\/li><li>Limiter la consommation inutile de bande passante<\/li><li>Proposer du contenu \u00e0 valeur ajout\u00e9e<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Aucun lien pointant vers de nouvelles pages ou rubriques en cr\u00e9ation n'est rendu public avant ach\u00e8vement complet de ces derni\u00e8res<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Au fil des autres contr\u00f4les&nbsp;:   V\u00e9rifier que la navigation sur les pages internes du site ne donne pas acc\u00e8s \u00e0 des pages en construction<\/li><\/ul>","159":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur de d\u00e9terminer son emplacement dans le site<\/li><li>Simplifier le passage des moteurs de recherche<\/li><li>Faciliter la navigation dans l'arborescence des contenus<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir un fil d'Ariane au d\u00e9but de la zone de contenu principal de la page<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>La v\u00e9rification n\u00e9cessite une inspection manuelle contr\u00f4lant la pr\u00e9sence et la pertinence du fil d'Ariane sur les diff\u00e9rentes pages ou, le cas \u00e9ch\u00e9ant, dans les templates sous r\u00e9serve de services tiers produisant un contenu sp\u00e9cifique<\/li><li>\n\nDans les pages examin\u00e9es ou les templates du site&nbsp;:  V\u00e9rifier la pr\u00e9sence syst\u00e9matique du fil d'Ariane sur toutes les pages, \u00e0 l'exception \u00e9ventuelle de la page d'accueil du site ;   \t\t\t\t\tS'assurer que le fil d'Ariane est imm\u00e9diatement identifiable gr\u00e2ce \u00e0 une mise en forme pr\u00e9visible par l'utilisateur<\/li><\/ul>","160":"<p><strong>Objectif<\/strong><\/p><ul><li>Fournir aux utilisateurs une solution de navigation alternative et d'acc\u00e8s rapide aux contenus li\u00e9s \u00e0 des mots-cl\u00e9s retenus par ceux-ci<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Proposer un formulaire et une fonctionnalit\u00e9 de recherche simple, qu'il s'agisse d'une solution interne ou de l'incorporation d'une solution externe (Google par exemple)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans toutes les pages \u00e9valu\u00e9es ou bien en contr\u00f4lant les templates du site (sous r\u00e9serve de tenir compte de pages d\u00e9pendant de solutions tierces)&nbsp;:   V\u00e9rifier manuellement la pr\u00e9sence syst\u00e9matique d'un moteur de recherche ou d'un acc\u00e8s \u00e0 cette solution sous la forme d'un lien<\/li><\/ul>","161":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'avoir l'ensemble des informations essentielles relatives \u00e0 la recherche qu'ils ont effectu\u00e9e<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Le nombre global de r\u00e9sultats est g\u00e9n\u00e9ralement annonc\u00e9 et rappel\u00e9 dans le titre de chaque page de r\u00e9sultats (par exemple : 246 r\u00e9sultats correspondent \u00e0 votre requ\u00eate \u00ab&nbsp;Exemple&nbsp;\u00bb)<\/li><li>\n\nLe nombre de pages de r\u00e9sultats est g\u00e9n\u00e9ralement indiqu\u00e9 dans le menu de navigation entre les pages de r\u00e9sultats<\/li><li>\n\nLe nombre de r\u00e9sultats par page est g\u00e9n\u00e9ralement indiqu\u00e9 avant la liste des r\u00e9sultats<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Via le moteur de recherche du site examin\u00e9&nbsp;:  Effectuer une ou plusieurs requ\u00eates sur le ou les formulaire(s) de recherche (en fonction de la configuration des r\u00e9sultats, il peut \u00eatre n\u00e9cessaire de tester des requ\u00eates ayant successivement un nombre r\u00e9duit de r\u00e9sultat, un nombre important et aucun r\u00e9sultat) ;   \t\t\t\t\tV\u00e9rifier, dans chaque page de r\u00e9sultats, la pr\u00e9sence du nombre global de r\u00e9sultats ;  \t\t\t\t\tContr\u00f4ler, en cas de r\u00e9sultats pagin\u00e9s, que le nombre total de pages de r\u00e9sultats et le nombre de r\u00e9sultats par page sont pr\u00e9sents dans chaque page de r\u00e9sultats<\/li><\/ul>","162":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l\u2019utilisateur de partager ou de conserver dans ses signets un r\u00e9sultat de recherche<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>G\u00e9rer les requ\u00eates du formulaire de recherche en utilisant la m\u00e9thode GET<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Faire une recherche et contr\u00f4ler que l\u2019Url de la page de r\u00e9sultats permet d\u2019acc\u00e9der \u00e0 ceux-ci<\/li><\/ul>","163":"<p><strong>Objectif<\/strong><\/p><ul><li>Fournir aux utilisateurs une solution en cas de d\u00e9sorientation, pour naviguer et se rep\u00e9rer dans le site, pour visualiser l'ensemble des contenus et la taille du site<\/li><li>Inciter les responsables du contenu \u00e0 repr\u00e9senter graphiquement et \u00e0 rationaliser leur contenu<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Cr\u00e9er un plan de site qui donne acc\u00e8s, directement ou indirectement, \u00e0 la totalit\u00e9 des pages du site sous la forme d'une liste de liens textuels explicites<\/li><li>\n\nStructurer cette liste de mani\u00e8re \u00e0 refl\u00e9ter l'organisation des rubriques du site, \u00e0 l'aide d'\u00e9l\u00e9ments de titre et d'\u00e9l\u00e9ments de liste imbriqu\u00e9s<\/li><li>\n\nLa profondeur de l'arborescence \u00e0 repr\u00e9senter varie en fonction des contenus, mais elle est en g\u00e9n\u00e9ral limit\u00e9e aux trois premiers niveaux<\/li><li> Les pages satellites telles que la page Contact et les mentions l\u00e9gales doivent figurer dans le plan de site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette v\u00e9rification gagne \u00e0 \u00eatre effectu\u00e9e si possible \u00e0 partir des templates, en tenant compte des \u00e9ventuels services tiers susceptibles de g\u00e9n\u00e9rer des pages qui ne respecteraient pas ces templates<\/li><li> Dans le site&nbsp;:   V\u00e9rifier la pr\u00e9sence d'une page de plan de site ;   \t\t\t\t\tContr\u00f4ler qu'un lien vers celui-ci est disponible dans chaque page du site<\/li><li>\n\nL'emplacement du lien vers le plan de site est indiff\u00e9rent (en-t\u00eate, menu, pied de page) mais il est pr\u00e9f\u00e9rable qu'il soit constant sur l'ensemble du site<\/li><li> Les bonnes pratiques 78, 150 et 214 sur les pages d'erreur personnalis\u00e9es peuvent \u00eatre contr\u00f4l\u00e9es conjointement avec celle-ci car la pr\u00e9sence du lien \u00ab&nbsp;plan de site&nbsp;\u00bb est particuli\u00e8rement pertinente dans les pages 404 et 403<\/li><\/ul>","164":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter l'apprentissage de la navigation sur l'interface<\/li><li>\n\nFaciliter le rep\u00e9rage de l'information<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Conserver le m\u00eame positionnement \u00e0 l'\u00e9cran des menus de navigation sur l'ensemble du site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Au fil des autres contr\u00f4les&nbsp;:  V\u00e9rifier que les menus de navigation sont affich\u00e9s au m\u00eame endroit \u00e0 l'\u00e9cran<\/li><li>\n\nLa v\u00e9rification peut \u00e9galement \u00eatre men\u00e9e en amont du projet, lors de la conception des maquettes graphiques ou en aval du projet lors de l'int\u00e9gration finale pour v\u00e9rifier l'absence d'une d\u00e9gradation de cette bonne pratique due, par exemple, \u00e0 la mise en place de services tiers<\/li><li>\n\nCette v\u00e9rification va de pair avec celle de la bonne pratique 67 sur la coh\u00e9rence de la charte graphique<\/li><\/ul>","165":"<p><strong>Objectif<\/strong><\/p><ul><li>Limiter le temps d'apprentissage de l'interface<\/li><li>Faciliter la compr\u00e9hension des ic\u00f4nes<\/li><li>Limiter le risque d'erreurs<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>La nature de la cible de chaque ic\u00f4ne-lien est pr\u00e9cis\u00e9e par l'attribut alt de l'image et par l'attribut title du lien, sous la forme :\n\n&lt;a href=\"mailto:John&#x2e;Doe@example&#x2e;com\" title=\"John&#x2e;Doe@example&#x2e;com\"&gt;&lt;img src=\"letter&#x2e;png\" alt=\"John&#x2e;Doe@example&#x2e;com\"&gt;&lt;\/a&gt;&#x2e;\n\nUne \u00e9tiquette textuelle et une bulle d'aide explicitent les contr\u00f4les en Flash<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier que chaque ic\u00f4ne de navigation ou d'action est dot\u00e9e&nbsp;:  D'un attribut alt pertinent pour l'\u00e9l\u00e9ment img ;  \t\t\t\t\tD'un attribut title pertinent pour l'\u00e9l\u00e9ment a, button ou input ;  \t\t\t\t\tD'une \u00e9tiquette textuelle et d'une bulle d'aide au survol dans les contenus en Flash<\/li><\/ul>","166":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter sur le poste client l'ouverture inopin\u00e9e d'un autre logiciel que le navigateur Web<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>R\u00e9diger les libell\u00e9s de liens concern\u00e9s de mani\u00e8re \u00e0 annoncer le comportement pour mieux l'anticiper<\/li><li> Par exemple, il est suffisant de r\u00e9diger les liens e-mails sous la forme \u00ab&nbsp;adresse e-mail&nbsp;\u00bb, \u00e0 d\u00e9faut de \u00ab&nbsp;Envoyer un mail \u00e0\u2026&nbsp;\u00bb<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans toutes les pages inspect\u00e9es&nbsp;:  Examiner le contenu pour y d\u00e9tecter les liens provoquant l'ouverture d'un logiciel externe (lien mail par exemple)<\/li><li> Cette d\u00e9tection peut \u00eatre facilit\u00e9e par le recours \u00e0 un outil de validation des liens du type Xenu's Link Sleuth qui permet d'identifier des types d'URI sp\u00e9cifiques ;  \t\t\t\t\tPour chaque lien concern\u00e9, v\u00e9rifier que le libell\u00e9 du lien est suffisamment explicite pour que l'utilisateur soit pr\u00e9venu de son comportement particulier<\/li><\/ul>","167":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de commencer imm\u00e9diatement leur navigation sur la ressource qu'ils ont demand\u00e9e<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne faire figurer d'avertissement diff\u00e9rant l'acc\u00e8s au contenu qu'en cas de contenu r\u00e9serv\u00e9 \u00e0 un public sp\u00e9cifique<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le site examin\u00e9&nbsp;:  Acc\u00e9der successivement \u00e0 la page d'accueil du site et \u00e0 une page interne via une adresse directement saisie dans le navigateur ou depuis un site tiers ;  \t\t\t\t\tV\u00e9rifier alors que l'acc\u00e8s au contenu est imm\u00e9diat, sans avoir \u00e0 \u00ab&nbsp;passer&nbsp;\u00bb au pr\u00e9alable un affichage temporaire d'avertissement ou bien \u00e0 caract\u00e8re publicitaire ou informatif (sauf en cas de contenu r\u00e9serv\u00e9 \u00e0 un public sp\u00e9cifique comme dans le cas d'un public majeur)<\/li><\/ul>","168":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs qui consultent les pages de mani\u00e8re lin\u00e9aire (mode vocal) ou semi-lin\u00e9aire (\u00e9cran de faible largeur) de ne pas avoir \u00e0 d\u00e9filer l'ensemble des \u00e9l\u00e9ments sur chaque page pour acc\u00e9der aux contenus<\/li><li>Fournir des raccourcis acc\u00e9l\u00e9rant la navigation au clavier et \u00e9vitant des actions au clavier r\u00e9p\u00e9t\u00e9es pour parcourir la page et atteindre la zone souhait\u00e9e<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir en d\u00e9but de code HTML, avant tout autre lien ou formulaire pr\u00e9sent dans la page, les liens visant des ancres correspondantes&nbsp;:  Vers le menu principal si celui-ci n'est pas imm\u00e9diatement plac\u00e9 apr\u00e8s l'en-t\u00eate de page ;  \t\t\t\t\tVers le contenu principal si celui-ci n'est pas imm\u00e9diatement plac\u00e9 apr\u00e8s l'en-t\u00eate de page ;  \t\t\t\t\tVers le formulaire du moteur de recherche si celui-ci n'est pas imm\u00e9diatement plac\u00e9 apr\u00e8s l'en-t\u00eate de page<\/li><li>\n\nLe cas \u00e9ch\u00e9ant, ce menu d'acc\u00e8s rapide peut \u00eatre masqu\u00e9 au chargement de la page et s'afficher lors de la premi\u00e8re tabulation entrant dans celle-ci (via Javascript ou CSS)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette bonne pratique gagne \u00e0 \u00eatre v\u00e9rifi\u00e9e en association avec l'ensemble des bonnes pratiques concernant la navigation au clavier puisque si ces liens d'acc\u00e8s rapide sont pr\u00e9sents, ils doivent au minimum appara\u00eetre d\u00e8s la premi\u00e8re tabulation dans la page<\/li><li>\n\nLors de la navigation dans le site ou de l'inspection des templates (sous r\u00e9serve de tenir compte des pages d\u00e9pendants de services tiers)&nbsp;:   V\u00e9rifier la pr\u00e9sence des liens d'acc\u00e8s rapide au menu, au contenu et \u00e0 la recherche selon l'organisation de la page ;   \t\t\t\t\tV\u00e9rifier qu'ils sont bien plac\u00e9s dans le code de mani\u00e8re \u00e0 appara\u00eetre d\u00e8s la premi\u00e8re tabulation dans la page ;   \t\t\t\t\tV\u00e9rifier qu'en cas de masquage par d\u00e9faut, ils sont affich\u00e9s lisiblement lors de la premi\u00e8re tabulation, \u00e0 un emplacement pr\u00e9visible par l'utilisateur ;   \t\t\t\t\tV\u00e9rifier que leur fonctionnement est effectif, c'est-\u00e0-dire qu'ils permettent d'acc\u00e9der au menu ou \u00e0 la zone de contenu et d'y poursuivre imm\u00e9diatement la navigation au clavier, ou au champ de saisie du formulaire de recherche et de proc\u00e9der \u00e0 la saisie<\/li><\/ul>","169":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux abonn\u00e9s de ne plus recevoir une newsletter<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Faire figurer dans chaque newsletter un hyperlien permettant de se d\u00e9sinscrire<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Comme pour les bonnes pratiques 65 sur l'adresse d'envoi de la newsletter, 66 sur la confirmation d'inscription et 199 sur la date d'envoi, cette v\u00e9rification n\u00e9cessite de s'abonner \u00e0 la newsletter concern\u00e9e et d'en recevoir un exemplaire<\/li><li>\n\nPour chaque site proposant de s'abonner \u00e0 une newsletter&nbsp;:  V\u00e9rifier la pr\u00e9sence de l'hyperlien de d\u00e9sinscription dans les newsletters ;  \t\t\t\t\tV\u00e9rifier que le processus se d\u00e9roule correctement et m\u00e8ne effectivement \u00e0 une d\u00e9sinscription<\/li><\/ul>","170":"<p><strong>Objectif<\/strong><\/p><ul><li>Ne pas imposer \u00e0 l\u2019utilisateur une \u00e9tape qui n\u2019est pas n\u00e9cessaire dans ce contexte<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>G\u00e9rer sp\u00e9cifiquement le processus de d\u00e9sinscription depuis le lien pr\u00e9sent dans le corps de la newsletter, de mani\u00e8re \u00e0 ce que l\u2019utilisateur n\u2019ait qu\u2019une confirmation en ligne \u00e0 donner, sans envoi d\u2019un e-mail de demande de confirmation<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Activer le lien de d\u00e9sinscription pr\u00e9sent dans la newsletter et v\u00e9rifier que le processus ne renvoie pas d'e-mail de demande de confirmation<\/li><\/ul>","171":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter l'inscription \u00e0 une newsletter par un tiers usurpant une identit\u00e9<\/li><li>V\u00e9rifier que l'adresse e-mail a \u00e9t\u00e9 saisie sans erreur<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Envoyer un e-mail permettant l'inscription d\u00e9finitive via la saisie d'un mot de passe, un clic sur un hyperlien, etc<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Comme pour les bonnes pratiques 65 sur l'adresse d'envoi de la newsletter, 199 sur la date d'envoi et 64 sur le lien de d\u00e9sinscription, cette v\u00e9rification n\u00e9cessite de s'abonner \u00e0 la newsletter concern\u00e9e<\/li><li>\n\nPour chaque site proposant de s'abonner \u00e0 une newsletter&nbsp;:  Effectuer une inscription de test et v\u00e9rifier la r\u00e9ception d'un e-mail de confirmation<\/li><\/ul>","172":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre \u00e0 l'utilisateur de se d\u00e9sinscrire sans n\u00e9cessairement passer par un mail<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir une page d\u00e9di\u00e9e \u00e0 la newsletter, dans laquelle le formulaire d'abonnement est accompagn\u00e9 d'un formulaire de d\u00e9sabonnement<\/li><li>\n\nFaire figurer le lien de d\u00e9sabonnement dans les autres \u00e9ventuels formulaires d'inscription \u00ab&nbsp;rapides&nbsp;\u00bb int\u00e9gr\u00e9s \u00e0 d'autres pages du site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque site proposant une newsletter&nbsp;:  V\u00e9rifier la pr\u00e9sence dans le site d'une page proposant un formulaire de d\u00e9sabonnement ;  \t\t\t\t\tV\u00e9rifier que cette page est accessible depuis la navigation du site ;  \t\t\t\t\tV\u00e9rifier que la d\u00e9sinscription est effective<\/li><li>\n\nCette v\u00e9rification peut accompagner celle des bonnes pratiques 200 sur l'acc\u00e8s au dernier num\u00e9ro de la newsletter et 202 sur l'acc\u00e8s aux archives<\/li><\/ul>","173":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de se faire une id\u00e9e de la newsletter envoy\u00e9e aux abonn\u00e9s<\/li><li>Permettre aux utilisateurs de consulter la newsletter en dehors des contraintes de l'email<\/li><li> Accro\u00eetre le r\u00e9f\u00e9rencement de vos contenus<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Rendre publique la derni\u00e8re newsletter envoy\u00e9e en rendant son contenu disponible sur le site et en faisant en sorte que l'acc\u00e8s \u00e0 ce contenu reste possible \u00e0 partir de la page d'accueil ou du plan de site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette v\u00e9rification s'effectue le plus souvent dans la page comportant le formulaire d'abonnement&nbsp;:  V\u00e9rifier qu'une version de la derni\u00e8re newsletter envoy\u00e9e est disponible en ligne (au format HTML ou \u00e9ventuellement PDF) via un lien accessible dans le contexte de l'abonnement<\/li><\/ul>","174":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la consultation des archives des newsletters<\/li><li> Permettre aux utilisateurs de se faire une id\u00e9e de la newsletter envoy\u00e9e aux abonn\u00e9s<\/li><li>Favoriser le r\u00e9f\u00e9rencement de vos contenus<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Rendre publique la totalit\u00e9 des newsletters envoy\u00e9es en rendant leur contenu disponible sur le site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque site proposant une newsletter :  V\u00e9rifier que les archives des newsletters sont disponibles en ligne<\/li><li>\n\nCette v\u00e9rification va de pair avec le contr\u00f4le de la bonne pratique 200 sur l'acc\u00e8s au dernier num\u00e9ro de la newsletter<\/li><\/ul>","175":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de conna\u00eetre avant leur inscription la fr\u00e9quence \u00e0 laquelle ils recevront la newsletter<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer la fr\u00e9quence d'envoi \u2013 si possible chiffr\u00e9e \u2013 des newsletters<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette v\u00e9rification s'effectue le plus souvent dans la page d'abonnement \u00e0 la newsletter, ou \u00e9ventuellement dans une page satellite du type Aide, \u00c0 propos, etc&nbsp;:   V\u00e9rifier la pr\u00e9sence d'une indication explicite et si possible chiffr\u00e9e de la fr\u00e9quence d'envoi des newsletters<\/li><\/ul>","176":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre une homog\u00e9n\u00e9it\u00e9 et une continuit\u00e9 dans la visite et la navigation<\/li><li>Permettre une identification permanente du service en ligne visit\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser des feuilles de styles communes \u00e0 tout le site, ce qui par rebond am\u00e9liore la coh\u00e9rence globale de tout le site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Au fil des contr\u00f4les de bonnes pratiques&nbsp;:  S'assurer que le site utilise des \u00e9l\u00e9ments graphiques communs \u00e0 toutes les pages, en portant notamment une attention particuli\u00e8re \u00e0 la pr\u00e9sence et \u00e0 l'emplacement des menus de navigation, \u00e0 la couleur des sections du site, \u00e0 la largeur des pages et \u00e0 la coh\u00e9rence de la charte graphique globale utilis\u00e9e pour les titres et pour les textes<\/li><li>\n\nLa v\u00e9rification peut \u00e9galement \u00eatre men\u00e9e en amont du projet, lors de la conception des maquettes graphiques, ou en aval du projet lors de l'int\u00e9gration finale pour v\u00e9rifier l'absence d'une d\u00e9gradation de cette homog\u00e9n\u00e9it\u00e9 graphique due, par exemple, \u00e0 la mise en place de services tiers<\/li><\/ul>","177":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs \u00e9quip\u00e9s de navigateurs qui ne g\u00e8rent pas l\u2019agrandissement des polices en taille fixe d\u2019agrandir les polices sans difficult\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas modifier la taille de la police par d\u00e9faut ou l\u2019indiquer en utilisant une unit\u00e9 proportionnelle aux r\u00e9glages de l\u2019utilisateur (em, rem, ex, %, mots-cl\u00e9s) et non avec une unit\u00e9 d\u00e9pendante du p\u00e9riph\u00e9rique de consultation (px, pt, cm, etc)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans l\u2019ensemble des styles CSS appliqu\u00e9s au media screen :\n\nD\u00e9tecter la pr\u00e9sence de tailles de polices d\u00e9finies en pixels (px), en points (pt), en picas (pc), en pouces (in), en centim\u00e8tres (cm) ou en millim\u00e8tres (mm), dans les r\u00e8gles font et font-size pour invalider cette bonne pratique<\/li><\/ul>","178":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre l'impression des contenus sous une forme appropri\u00e9e au support&#x2e;<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir une feuille de style sp\u00e9cifique pour le type de media print, par exemple sous la forme : &lt;link rel=\"stylesheet\" type=\"text\/css\" href=\"print&#x2e;css\" media=\"print\" \/&gt;<\/li><li>\n\nLes styles d'impression peuvent corriger une feuille de style globale (feuille de style pour le media all ou sans mention du media) ou bien s'appliquer seuls pour le media print si la feuille de style d'affichage est appel\u00e9e en pr\u00e9cisant le media print<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette bonne pratique peut \u00eatre \u00e9valu\u00e9e rapidement en testant l'aper\u00e7u avant impression dans le navigateur, mais sa confirmation n\u00e9cessite l'examen du code pour d\u00e9tecter la pr\u00e9sence d'un style d'impression pour le media print, qui peut \u00eatre&nbsp;:   Sous forme d'une balise du type &lt;link rel=\"stylesheet\" type=\"text\/css\" media=\"print\" href=\"print&#x2e;css\" \/&gt; ;  \t\t\t\t\tSous forme d'une balise du type &lt;style media=\"print\" type=\"text\/css\"&gt;\u2026&lt;\/style&gt; ;  \t\t\t\t\tSous forme d'une r\u00e8gle @media print {\u2026} dans une CSS interne ou externe ;  \t\t\t\t\tOu sous forme d'une r\u00e8gle @import url(\"print&#x2e;css\") print; dans une CSS interne ou externe<\/li><\/ul>","179":"<p><strong>Objectif<\/strong><\/p><ul><li>Am\u00e9liorer la lisibilit\u00e9 et la pertinence des contenus imprim\u00e9s<\/li><li>Rationnaliser l'espace utilis\u00e9 par les contenus imprim\u00e9s pour \u00e9conomiser du papier<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir une version HTML adapt\u00e9e pour l'impression<\/li><li>\n\nOu, dans l'id\u00e9al, fournir une feuille de style CSS pour le media print, qui masque les blocs de navigation via la propri\u00e9t\u00e9 display<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Tout comme la bonne pratique 140 sur la pr\u00e9sence des styles CSS, cette v\u00e9rification peut s'effectuer imm\u00e9diatement en utilisant l'aper\u00e7u avant impression du navigateur&nbsp;:  V\u00e9rifier qu'aucun menu ou autre bloc de navigation ne s'affiche dans l'aper\u00e7u avant impression de la page<\/li><li>\n\n\u00c0 d\u00e9faut d'un aper\u00e7u montrant que les blocs de navigation ne seront pas imprim\u00e9s&nbsp;:  Rechercher dans la page la pr\u00e9sence d'un lien vers une version HTML sp\u00e9cifiquement adapt\u00e9e \u00e0 cet effet<\/li><li>\n\nLes blocs de navigation peuvent \u00eatre l'ensemble des menus, des \u00e9l\u00e9ments de header ou de pied de page tels qu'un formulaire de recherche ou des liens annexes, un formulaire d'inscription \u00e0 une newsletter, etc<\/li><\/ul>","180":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux contenus de s'afficher correctement, m\u00eame lorsque les polices pr\u00e9vues ne sont pas pr\u00e9sentes sur le syst\u00e8me de l'utilisateur<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Dans chaque feuille de style CSS, indiquer la famille g\u00e9n\u00e9rique de police appropri\u00e9e dans les propri\u00e9t\u00e9s font-family ou font&nbsp;:  Pour les polices serif, ou \u00e0 empattements (du type Times Roman), sp\u00e9cifier en dernier la famille de police g\u00e9n\u00e9rique serif<\/li><li> Dans l'exemple suivant, le terme \u00ab&nbsp;serif&nbsp;\u00bb a \u00e9t\u00e9 correctement ajout\u00e9 comme dernier \u00e9l\u00e9ment de la liste des polices font-family: Georgia, \"Bookman Old Style\", serif<\/li><li>  \t\t\t\t\tPour les polices sans serif, ou sans empattements (du type Arial), sp\u00e9cifier en dernier la famille de police g\u00e9n\u00e9rique sans-serif<\/li><li> Par exemple&nbsp;: font-family: Optima, \"Trebuchet MS\", sans-serif;   \t\t\t\t\tPour les polices monospace (du type Courier), sp\u00e9cifier en dernier la famille de police g\u00e9n\u00e9rique monospace<\/li><li> Par exemple, font-family: Courier, monospace ;   \t\t\t\t\tDe m\u00eame, utiliser les familles g\u00e9n\u00e9riques cursive et fantasy pour les polices manuscrites et fantaisies<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans toutes les feuilles de style CSS (pour tous les media : screen, print, etc)&nbsp;:  V\u00e9rifier, par exemple \u00e0 l'aide de la fonctionnalit\u00e9 Voir les CSS de la Web Developer Toolbar pour Firefox (menu CSS), que chaque propri\u00e9t\u00e9 font ou font-family contient l'un des termes relatifs aux familles g\u00e9n\u00e9riques de police : serif, sans-serif, monospace, cursive ou fantasy ;  \t\t\t\t\tContr\u00f4ler que ces termes sont situ\u00e9s en fin de liste pour chaque propri\u00e9t\u00e9 font ou font-family ;  \t\t\t\t\tS'assurer de la pertinence de la famille g\u00e9n\u00e9rique indiqu\u00e9e : serif pour les polices \u00e0 empattements, sans-serif pour les polices sans empattements, monospace, cursive ou fantasy dans des cas particuliers<\/li><li>\n\nLa v\u00e9rification peut \u00e9galement \u00eatre effectu\u00e9e en validant la page HTML \u00e0 l'aide de l'Inspecteur Opquast ou du validateur CSS du W3C (http:\/\/jigsaw&#x2e;w3&#x2e;org\/css-validator\/) qui avertit alors en cas d'absence de familles de police g\u00e9n\u00e9rique<\/li><\/ul>","181":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre une bonne lisibilit\u00e9 des contenus<\/li><li>Limiter la charge mentale lors de la consultation<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Veiller \u00e0 conserver un ratio de contraste minimal de 3:1 entre le texte et son arri\u00e8re-plan, tel qu'il peut \u00eatre mesur\u00e9 via l'algorithme WCAG2&#x2e;0<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans l'ensemble des pages&nbsp;:  Rep\u00e9rer les contenus dont la diff\u00e9rence de contraste\/luminosit\u00e9 avec leur arri\u00e8re-plan est potentiellement insuffisante  \t\t\t\t\tUtiliser un outil du type Colour Contrast Analyzer pour calculer le ratio de contraste&nbsp;: cliquer sur Luminosit\u00e9 et relever la couleur du premier plan puis celle du second plan dans les champs d\u00e9di\u00e9s ;  \t\t\t\t\tV\u00e9rifier que le ratio de contraste relev\u00e9 est sup\u00e9rieur ou \u00e9gal \u00e0 3,0:1\n\nDans le cas de textes plac\u00e9s sur un arri\u00e8re-plan en d\u00e9grad\u00e9, en motif ou photographique, la mesure de couleur de l'arri\u00e8re-plan est prise au point le plus d\u00e9favorable jouxtant le texte (pour un texte noir, le pixel le plus sombre)<\/li><li> Il est conseill\u00e9 de tenir \u00e9galement compte de l'agrandissement \u00e9ventuel de la taille de caract\u00e8re par l'utilisateur (dans Firefox \u00e0 l'aide du menu Affichage &gt; Zoom texte seulement), qui peut entra\u00eener un changement dans la superposition texte\/arri\u00e8re-plan<\/li><\/ul>","182":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre un copier-coller des contenus ind\u00e9pendamment de la mise en forme enti\u00e8rement en majuscules<\/li><li>Faciliter l'adaptation de la mise en forme pour les utilisateurs ayant des difficult\u00e9s de lecture des textes enti\u00e8rement en majuscules<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Saisir les contenus HTML en respectant l'usage typographique pour les majuscules (d\u00e9but de phrase, noms propres, etc)<\/li><li>\n\nUtiliser la propri\u00e9t\u00e9 CSS text-transform avec la valeur uppercase pour g\u00e9rer les mises en majuscules d\u00e9coratives<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour tous les contenus mis enti\u00e8rement en majuscules&nbsp;:   D\u00e9sactiver le support des styles du site \u00e0 l'aide, par exemple, de la fonctionnalit\u00e9 D\u00e9sactiver tous les styles CSS de la Web Developper Toolbar (Menu CSS) ;  \t\t\t\t\tIdentifier les textes qui apparaissent en majuscules lorsque les styles sont d\u00e9sactiv\u00e9s ;  \t\t\t\t\tV\u00e9rifier que l'usage des majuscules respecte le cadre des conventions typographiques de la langue utilis\u00e9e<\/li><li> Par exemple&nbsp;: les sigles ou noms d'auteurs dans une bibliographie peuvent \u00eatre en majuscules<\/li><\/ul>","183":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la lecture \u00e0 l\u2019\u00e9cran, notamment pour les personnes dyslexiques<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Ne pas utiliser la propri\u00e9t\u00e9 CSS text-align avec la valeur justify, ou tout autre \u00e9quivalent<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier dans le code CSS l\u2019absence de r\u00e8gles text-align : justify<\/li><li>V\u00e9rifier dans le code HTML l\u2019absence d\u2019attributs HTML align=\"justify\"<\/li><\/ul>","184":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre la compr\u00e9hension de l'information sans l'acc\u00e8s au support visuel ou lorsque le rendu de celui-ci est alt\u00e9r\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Lorsqu'un contenu est d\u00e9sign\u00e9 par une r\u00e9f\u00e9rence \u00e0 sa forme ou \u00e0 sa position \u00e0 l'\u00e9cran, l'information doit \u00eatre \u00e9galement disponible par un autre moyen (balisage, mention textuelle, etc)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cette v\u00e9rification concerne une large vari\u00e9t\u00e9 de cas potentiels, par exemple dans une page d'aide o\u00f9 il est fait r\u00e9f\u00e9rence \u00e0 des captures d'\u00e9cran ou encore dans le fil d'un texte o\u00f9 il est fait r\u00e9f\u00e9rence \u00e0 une illustration ou \u00e0 un tableau<\/li><li> Pour chaque contenu o\u00f9 il est n\u00e9cessaire d'avoir acc\u00e8s \u00e0 l'affichage graphique de la page afin de retrouver le contenu ainsi d\u00e9sign\u00e9&nbsp;:   S'assurer que les r\u00e9f\u00e9rences \u00e0 la forme ou \u00e0 la position \u00e0 l'\u00e9cran d'un contenu ne sont pas le seul moyen d'identifier celui-ci<\/li><li>\n\nLes moyens compl\u00e9mentaires peuvent \u00eatre la r\u00e9f\u00e9rence explicite \u00e0 un identifiant (exemple \u00ab Voir la figure n\u00b01 \u00bb), un lien vers une ancre, etc<\/li><\/ul>","185":"<p><strong>Objectif<\/strong><\/p><ul><li>Fournir aux utilisateurs des informations sur les partenaires tiers impliqu\u00e9s dans la transaction<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer sur le site les informations relatives \u00e0 l'identit\u00e9 des prestataires bancaires et\/ou des solutions de paiement utilis\u00e9es pour les transactions \u00e9lectroniques<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans la page du panier (aussi appel\u00e9 caddie), dans les mentions l\u00e9gales, la FAQ et\/ou une page d'aide d'un site de e-commerce&nbsp;:  Identifier la pr\u00e9sence d'informations relatives \u00e0 l'identit\u00e9 des prestataires bancaires et\/ou des solutions de paiement utilis\u00e9es pour les transactions \u00e9lectroniques<\/li><li> Au minimum, on identifiera la banque ou le prestataire par la pr\u00e9sence d'un logo<\/li><\/ul>","186":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de conna\u00eetre les conditions de conservation de leurs donn\u00e9es personnelles<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer sur chaque page du site la politique de confidentialit\u00e9 du site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque page du site&nbsp;:  V\u00e9rifier que les informations relatives \u00e0 la politique de confidentialit\u00e9 et de respect de la vie priv\u00e9e du site sont accessibles depuis chaque page&nbsp;: soit via un lien pr\u00e9sent dans toutes les pages du site (par exemple, dans le pied de page), soit au sein des mentions l\u00e9gales, soit inscrites directement dans toutes les pages<\/li><li>\n\nLe contr\u00f4le de cette bonne pratique va de pair avec celui de la 149 selon laquelle la proc\u00e9dure d'acc\u00e8s et de rectification des donn\u00e9es personnelles est d\u00e9crite<\/li><\/ul>","187":"<p><strong>Objectif<\/strong><\/p><ul><li>Permette \u00e0 l'utilisateur d'acc\u00e9der \u00e0 son compte en cas de perte du mot de passe<\/li><li>Simplifier la gestion des comptes utilisateurs<\/li><li> Renforcer la s\u00e9curit\u00e9 en \u00e9vitant le stockage de mots de passe non crypt\u00e9s afin de pouvoir les communiquer de nouveau \u00e0 l'utilisateur<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir un lien permettant l'envoi d'un mail \u00e0 l'adresse associ\u00e9e au compte indiquant la proc\u00e9dure de r\u00e9initialisation<\/li><li>\n\nPlacer de pr\u00e9f\u00e9rence ce lien dans le formulaire de connexion<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site proposant un compte personnel prot\u00e9g\u00e9 par mot de passe&nbsp;:  Sans \u00eatre identifi\u00e9 sur le site, v\u00e9rifier la pr\u00e9sence d'un lien du type \u00ab&nbsp;Mot de passe oubli\u00e9 ?&nbsp;\u00bb \u00e0 proximit\u00e9 du formulaire de connexion ;   \t\t\t\t\tV\u00e9rifier la pr\u00e9sence d'une proc\u00e9dure permettant la cr\u00e9ation d'un nouveau mot de passe sur la page point\u00e9e par le lien \u00ab&nbsp;Mot de passe oubli\u00e9 ?&nbsp;\u00bb ;  \t\t\t\t\tV\u00e9rifier qu'il s'agit bien d'une proc\u00e9dure de r\u00e9initialisation et non pas d'un simple renvoi du mot de passe actuel<\/li><\/ul>","188":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de choisir un mot de passe personnalis\u00e9<\/li><li>\u00c9viter aux utilisateurs de rechercher leur mot de passe \u00e0 chaque connexion<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir une proc\u00e9dure en ligne permettant le choix d'un mot de passe personnalis\u00e9 d\u00e8s la cr\u00e9ation du compte ou la modification ult\u00e9rieure des mots de passe automatiquement g\u00e9n\u00e9r\u00e9s<\/li><li>\n\nFournir un acc\u00e8s \u00e0 la modification du mot de passe depuis la gestion du compte utilisateur ou \u00e0 d\u00e9faut dans le contexte du formulaire d'identification<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans tout site proposant un acc\u00e8s par mot de passe&nbsp;:  V\u00e9rifier qu'il est possible de saisir le mot de passe de son choix \u00e0 la cr\u00e9ation du compte ou, dans le cas o\u00f9 le mot de passe est automatiquement g\u00e9n\u00e9r\u00e9 par le service en ligne, contr\u00f4ler qu'il est possible de le modifier apr\u00e8s l'inscription<\/li><li>\n\nCette v\u00e9rification peut s'associer au contr\u00f4le de la bonne pratique 32 sur la double saisie du mot de passe lors de sa cr\u00e9ation ou de sa modification<\/li><\/ul>","189":"<p><strong>Objectif<\/strong><\/p><ul><li>Favoriser un niveau \u00e9lev\u00e9 de s\u00e9curit\u00e9 des mots de passe<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Autoriser la saisie, dans les mots de passe cr\u00e9\u00e9s par les utilisateurs, d\u2019au moins les caract\u00e8res imprimables de la table ASCII indiqu\u00e9s dans le mode de contr\u00f4le ci-apr\u00e8s<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cr\u00e9er un compte et tester la validation de mots de passe comportant :une lettre minuscule, une lettre majuscule (non accentu\u00e9es),un chiffreet les caract\u00e8res suivants :&nbsp;point d'exclamation : !guillemet : \"croisillon : #dollar : $pourcent : %esperluette : &amp;parenth\u00e8se ouvrante : (parenth\u00e8se fermante : )ast\u00e9risque : *plus : +virgule : ,trait d'union : -point : <\/li><li>barre oblique : \/deux-points : :point-virgule : ;inf\u00e9rieur &lt;\u00e9gale : =sup\u00e9rieur : &gt;point d'interrogation : ?arobase @crochet ouvrant : [barre oblique invers\u00e9e \\crochet fermant : ]accent circonflexe : ^tiret bas : _accolade ouvrante : {barre verticale : |accolade fermante : }tilde : ~<\/li><\/ul>","190":"<p><strong>Objectif<\/strong><\/p><ul><li>Informer les utilisateurs sur le niveau de s\u00e9curit\u00e9 du mot de passe choisi et donc sur les risques de d\u00e9tournement<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>La saisie du mot de passe donne lieu \u00e0 une validation et \u00e0 un retour indiquant son degr\u00e9 de s\u00e9curit\u00e9, avant soumission d\u00e9finitive du formulaire d\u2019inscription ou de changement de mot de passe<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour tout formulaire d\u2019inscription ou de changement de mot de passe :Saisir un mot de passe et s\u2019assurer que cette saisie donne lieu \u00e0 une validation et \u00e0 un retour indiquant son degr\u00e9 de s\u00e9curit\u00e9, et ce, avant la soumission d\u00e9finitive du formulaire<\/li><li>\nCette validation peut \u00eatre plus ou moins exigeante : contr\u00f4le du nombre de caract\u00e8res, de l\u2019absence de l\u2019identifiant du compte dans le mot de passe, du type de caract\u00e8res pr\u00e9sents, etc&nbsp;<\/li><\/ul>","191":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de conna\u00eetre la validit\u00e9 du certificat et contribuer \u00e0 la s\u00e9curisation de la transaction<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Faire un suivi rigoureux des certificats de s\u00e9curit\u00e9 utilis\u00e9s sur le site en anticipant les dates de renouvellement<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier la validit\u00e9 du certificat \u00e0 l'aide d'un outil en ligne&nbsp;:  http:\/\/www&#x2e;digicert&#x2e;com\/help\/  \t\t\t\t\thttp:\/\/www&#x2e;sslshopper&#x2e;com\/ssl-checker&#x2e;html\n\nOu bien \u00e0 l'aide des outils fournis par les navigateurs&nbsp;:  Firefox : http:\/\/support&#x2e;mozilla&#x2e;org\/fr\/kb\/Bouton%20d%E2%80%99identit%C3%A9%20du%20site  \t\t\t\t\tSafari : http:\/\/www&#x2e;apple&#x2e;com\/fr\/safari\/features&#x2e;html#security  \t\t\t\t\tIE : http:\/\/windows&#x2e;microsoft&#x2e;com\/fr-FR\/windows-vista\/Get-information-about-Secure-Sockets-Layer-SSL-certificates  \t\t\t\t\tChrome : http:\/\/support&#x2e;google&#x2e;com\/chrome\/bin\/answer&#x2e;py?hl=fr&amp;answer=95617&amp;topic=14666&amp;ctx=topic  \t\t\t\t\tOpera : http:\/\/help&#x2e;opera&#x2e;com\/Windows\/11&#x2e;60\/fr\/fraudprotection&#x2e;html<\/li><\/ul>","192":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter que des donn\u00e9es sensibles ne soient publiques et stock\u00e9es en clair aux diff\u00e9rentes \u00e9tapes de l'acc\u00e8s \u00e0 la page (FAI, proxy, serveur Web, historique du navigateur, services tiers\u2026)<\/li><li>Permettre \u00e0 l'utilisateur de saisir des donn\u00e9es sensibles en sachant qu'elles seront prot\u00e9g\u00e9es et confidentielles<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Envoyer les donn\u00e9es de formulaire sensibles par la m\u00e9thode POST<\/li><li>\n\nNe pas inscrire de donn\u00e9es sensibles dans l'URL d'un lien<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Lors de manipulations dans le site telles que connexion \u00e0 un compte, saisie de donn\u00e9es personnelles, achat, etc, v\u00e9rifier qu'aucune des donn\u00e9es saisies n'appara\u00eet en clair dans l'URL via les trois contr\u00f4les suivants&nbsp;:  V\u00e9rifier que l'identification n'aboutit pas \u00e0 une page du typelogin&#x2e;php?user=machin@password=123 ;  \t\t\t\t\tContr\u00f4ler aussi que les pages ne comportent pas de liens contenant ce type d'informations<\/li><li> Il est en effet possible de faire un lien du type http:\/\/user:pass@example&#x2e;com\/ ou ftp:\/\/user:pass@example&#x2e;com\/<\/li><li> Ceci est bien \u00e9videmment tr\u00e8s fortement d\u00e9conseill\u00e9 et doit \u00eatre banni<\/li><li>   \t\t\t\t\tExaminer \u00e9galement que l'identifiant de la session n'est pas transmis dans l'URL, ce qui donne des URL du type page&#x2e;php?SESSIONID=123abc456def<\/li><li> Toute personne r\u00e9cup\u00e9rant cet identifiant, y compris en lisant par dessus l'\u00e9paule de l'utilisateur, aurait acc\u00e8s \u00e0 son compte<\/li><li>\n\nIl est important de faire ces tests en activant et d\u00e9sactivant les cookies du navigateur, certains outils (frameworks, CMS) ayant la f\u00e2cheuse habitude de transmettre les informations en clair dans le second cas<\/li><\/ul>","193":"<p><strong>Objectif<\/strong><\/p><ul><li>Conforter la confiance de l'utilisateur<\/li><li>Permettre \u00e0 l'utilisateur de saisir des donn\u00e9es sensibles en sachant qu'elles seront prot\u00e9g\u00e9es<\/li><li>Minimiser les risques d'utilisation frauduleuse des donn\u00e9es des utilisateurs<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Recourir \u00e0 un certificat de s\u00e9curit\u00e9 informatique dans une version support\u00e9e par les versions r\u00e9centes des navigateurs<\/li><li>\n\nRecourir \u00e0 un service tiers d'authentification d\u00e9centralis\u00e9 du type OpenID<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Une page s\u00e9curis\u00e9e se reconna\u00eet \u00e0 son URL qui commence par https:\/\/ ou \u00e0 la pr\u00e9sence d'un \u00e9l\u00e9ment visuel dans le navigateur (apparition d'un cadenas, changement de couleur de la barre de saisie de l'URL)<\/li><li>\n\nPour tout site proposant d'\u00e9changer des donn\u00e9es sensibles&nbsp;:  Saisir l'adresse URL du site en http (pas en https), sans \u00eatre identifi\u00e9, et v\u00e9rifier que vous \u00eates directement redirig\u00e9 vers la version HTTPS du site et que tous les \u00e9changes sont s\u00e9curis\u00e9s ;   \t\t\t\t\tAu minimum, v\u00e9rifier que les \u00e9changes de donn\u00e9es sensibles (pages de saisie d'identifiants, de donn\u00e9es personnelles ou bancaires, etc) sont en HTTPS ;  \t\t\t\t\tDans le cas o\u00f9 les donn\u00e9es sont saisies dans une page non s\u00e9curis\u00e9e, v\u00e9rifier dans le code source du formulaire qu'une adresse en HTTPS est pr\u00e9sente au sein de l'attribut action, ce qui prouve que les donn\u00e9es sont envoy\u00e9es vers une page s\u00e9curis\u00e9e<\/li><li>\n\nAttention, la troisi\u00e8me option n'offre pas un niveau de s\u00e9curit\u00e9 \u00e9quivalent aux deux premi\u00e8res et peut \u00eatre tol\u00e9r\u00e9e dans le cas de donn\u00e9es personnelles, voire d'identifiants mais jamais pour des donn\u00e9es tr\u00e8s sensibles (bancaires, par exemple)<\/li><\/ul>","194":"<p><strong>Objectif<\/strong><\/p><ul><li>R\u00e9duire les risques de t\u00e9l\u00e9chargement d\u2019un contenu dangereux dissimul\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Configurer le serveur pour adresser l\u2019en-t\u00eate X-Content-Type-Options avec la valeur nosniff<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier, \u00e0 l\u2019aide d\u2019un outil d\u2019inspection des en-t\u00eates HTTP, la pr\u00e9sence de l\u2019en-t\u00eate X-Content-Type-Options avec la valeur nosniff<\/li><\/ul>","195":"<p><strong>Objectif<\/strong><\/p><ul><li>R\u00e9duire les risques de t\u00e9l\u00e9chargement d\u2019un contenu dangereux dissimul\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Configurer le serveur pour adresser pour chaque ressource (texte, image, script, etc) l\u2019en-t\u00eate ContentType renseign\u00e9 avec le type MIME appropri\u00e9, par exemple :text\/html ;application\/pdf<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier, \u00e0 l\u2019aide d\u2019un outil d\u2019inspection des en-t\u00eates HTTP, la pr\u00e9sence de ContentType avec la valeur correspondant au type de ressource<\/li><\/ul>","196":"<p><strong>Objectif<\/strong><\/p><ul><li>Contribuer \u00e0 l'information des utilisateurs sur la s\u00e9curisation des \u00e9changes de donn\u00e9es sensibles<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer le mode (SSL, TLS) et le niveau de cryptage des donn\u00e9es (128 ou 256 bits, etc) sur les pages concern\u00e9es<\/li><li> Il est aussi possible d'indiquer comment retrouver l'information par le biais de son navigateur dans la mesure o\u00f9 la plupart offrent cette possibilit\u00e9<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans un site proposant d'effectuer des transactions en ligne&nbsp;:&nbsp;contr\u00f4ler que les informations sur le niveau et le mode de cryptage des donn\u00e9es sont facilement accessibles depuis une page d'aide ou une FAQ, par exemple<\/li><li> Si la proc\u00e9dure indique comment retrouver l'information dans l'interface d'un navigateur, elle doit faire r\u00e9f\u00e9rence aux principaux navigateurs du march\u00e9<\/li><\/ul>","197":"<p><strong>Objectif<\/strong><\/p><ul><li>Informer l'utilisateur sur les cookies<\/li><li>Expliquer leur r\u00f4le et leur utilit\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pr\u00e9ciser dans la politique de confidentialit\u00e9 du site si la navigation dans le site n\u00e9cessite l'acceptation des cookies<\/li><li> Si oui, expliquer la raison de leur utilisation, la nature des donn\u00e9es conserv\u00e9es et \u00e9ventuellement, fournir les liens permettant leur d\u00e9sactivation<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans la page des mentions l\u00e9gales, dans la politique de confidentialit\u00e9 ou encore dans la page d'accueil, la page d'\u00e0 propos, d'aide, ou dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation&nbsp;:   Contr\u00f4ler que l'objectif de l'utilisation des cookies et les cons\u00e9quences de leur d\u00e9sactivation sont bien pr\u00e9sents<\/li><\/ul>","198":"<p><strong>Objectif<\/strong><\/p><ul><li>Informer l'utilisateur sur l'utilisation de ses donn\u00e9es personnelles<\/li><li>Conforter la confiance dans le site ou le service<\/li><li>Faciliter la gestion des demandes li\u00e9es aux donn\u00e9es personnelles<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer \u00e0 l'utilisateur dans une section de contenu d\u00e9di\u00e9e par quelles proc\u00e9dures ou moyens de contact il peut effectuer une demande d'acc\u00e8s, de suppression ou de rectification de ses donn\u00e9es personnelles<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans la page d'accueil, la page des mentions l\u00e9gales, la page d'\u00e0 propos, d'aide, ou encore dans les pages consacr\u00e9es aux conditions g\u00e9n\u00e9rales d'utilisation ou \u00e0 la politique de confidentialit\u00e9&nbsp;:   V\u00e9rifier la pr\u00e9sence d'informations sur la proc\u00e9dure d'acc\u00e8s ou de rectification des donn\u00e9es personnelles<\/li><li>\n\nLa nature de la proc\u00e9dure en question n'est pas \u00e9valu\u00e9e ici : seule sa pr\u00e9sence est contr\u00f4l\u00e9e<\/li><\/ul>","199":"<p><strong>Objectif<\/strong><\/p><ul><li>R\u00e9duire les risques d\u2019inscription de l\u2019utilisateur \u00e0 son insu<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Avant activation du compte cr\u00e9\u00e9 en ligne, envoyer une demande de confirmation automatique \u00e0 l\u2019adresse e-mail correspondant \u00e0 celui-ci<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Cr\u00e9er un compte en ligne et contr\u00f4ler qu\u2019il n\u2019est activ\u00e9 qu\u2019\u00e0 partir de l\u2019e-mail de demande de confirmation qui suit l\u2019envoi du formulaire d\u2019inscription<\/li><\/ul>","200":"<p><strong>Objectif<\/strong><\/p><ul><li>Laisser l\u2019utilisateur libre de son choix d\u2019utiliser ou non un service tiers<\/li><li>Fournir un moyen alternatif d\u2019acc\u00e8s au service<\/li><li>Fournir un moyen d\u2019acc\u00e8s ma\u00eetris\u00e9 par les administrateurs du service<\/li><li>Limiter la d\u00e9pendance \u00e0 un acteur tiers dont la politique et la strat\u00e9gie commerciale ou technique ne manquera pas d\u2019\u00e9voluer dans le temps<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Mettre en place une proc\u00e9dure de cr\u00e9ation de compte par saisie ou cr\u00e9ation d\u2019un identifiant et d\u2019un mot de passe propres au service<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier qu\u2019il est possible de cr\u00e9er un compte sans avoir recours \u00e0 un service tiers, par la saisie ou le choix d\u2019un identifiant et d\u2019un mot de passe propres<\/li><\/ul>","201":"<p><strong>Objectif<\/strong><\/p><ul><li>Faciliter la gestion des comptes utilisateurs<\/li><li>\u00c9viter \u00e0 l'utilisateur une recherche de contact<\/li><li>Conforter la confiance dans le site ou le service<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Fournir dans le site une proc\u00e9dure (formulaire) de cl\u00f4ture de compte automatis\u00e9e si la cr\u00e9ation de compte est elle-m\u00eame automatis\u00e9e<\/li><li>\n\nFournir sur le site un formulaire de demande de cl\u00f4ture si la cr\u00e9ation de compte est diff\u00e9r\u00e9e<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans tout site proposant la cr\u00e9ation d'un compte utilisateur&nbsp;:  Cr\u00e9er un compte puis contr\u00f4ler la possibilit\u00e9 de le clore ou de demander sa cl\u00f4ture en ligne, via un processus similaire<\/li><\/ul>","202":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter l'affichage de listes de fichiers contenus dans un r\u00e9pertoire<\/li><li>Am\u00e9liorer la s\u00e9curit\u00e9 du serveur<\/li><li>Limiter les risques d'intrusion<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Configurer le serveur pour qu'il ne renvoie pas la liste des fichiers pr\u00e9sents dans un r\u00e9pertoire<\/li><li> Pour Apache, ajouter par exemple options \u2013indexes dans le &#x2e;htaccess<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque site audit\u00e9&nbsp;:  Contr\u00f4ler que l'appel \u00e0 un r\u00e9pertoire sans page par d\u00e9faut \u2013 comme le r\u00e9pertoire des images, des scripts JS ou des feuilles de style \u2013 ne renvoie pas la liste du contenu de ce dossier (cette action peut en revanche mener \u00e0 une page d'erreur ou \u00e0 une redirection)<\/li><\/ul>","203":"<p><strong>Objectif<\/strong><\/p><ul><li>R\u00e9duire les risques de t\u00e9l\u00e9chargement d\u2019un contenu dangereux dissimul\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Configurer le serveur pour l\u2019envoi de l\u2019en-t\u00eate HTTP X-XSS-Protection avec la valeur 1; mode=block<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier, \u00e0 l\u2019aide d\u2019un outil d\u2019inspection des en-t\u00eates HTTP, la pr\u00e9sence de X-XSS-Protection avec la valeur 1; mode=block<\/li><\/ul>","204":"<p><strong>Objectif<\/strong><\/p><ul><li>R\u00e9duire les risques d\u2019utilisation trompeuse du contenu<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Configurer le serveur pour l\u2019envoi de l\u2019en-t\u00eate HTTP X-Frame-Options avec la valeur deny (pour interdire toute inclusion de la page dans un cadre, quel qu\u2019en soit le site) ou sameorigin (pour limiter les inclusions \u00e0 des cadres du m\u00eame nom de domaine que la page)<\/li><li> La valeur allow-from (pour limiter les inclusions \u00e0 des URL sp\u00e9cifiques) ne b\u00e9n\u00e9ficie pas, en revanche, \u00e0 l\u2019heure o\u00f9 nous \u00e9crivons ces lignes, d\u2019un support suffisant<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier \u00e0 l\u2019aide d\u2019un outil d\u2019inspection des en-t\u00eates HTTP la pr\u00e9sence de X-Frame-Options avec la valeur deny ou sameorigin<\/li><\/ul>","205":"<p><strong>Objectif<\/strong><\/p><ul><li>R\u00e9duire les risques d\u2019ex\u00e9cution ou d\u2019affichage d\u2019un contenu non d\u00e9sirable ou d\u2019une source non autoris\u00e9e<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Activer l\u2019en-t\u00eate HTTP Content-Security-Policy avec les directives CSP 1 appropri\u00e9es :img-src pour les images ;script-src pour le JavaScript ;style-src pour les styles CSS ;font-src pour les webfonts ;etc<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>V\u00e9rifier, \u00e0 l\u2019aide d\u2019un outil d\u2019inspection des en-t\u00eates HTTP, la pr\u00e9sence de l\u2019en-t\u00eate Content-Security-Policy<\/li><\/ul>","206":"<p><strong>Objectif<\/strong><\/p><ul><li>Acc\u00e9l\u00e9rer l'affichage des contenus et permettre une navigation plus fluide<\/li><li>R\u00e9duire les co\u00fbts de bande passante<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Configurer le serveur web pour qu\u2019il puisse g\u00e9rer la mise en cache des \u00e9l\u00e9ments statiques et g\u00e9rer \u2013 au niveau applicatif \u2013 la possible mise en cache des \u00e9l\u00e9ments dynamiques<\/li><li>\n\nEn pratique, et en accord avec les sp\u00e9cifications HTTP, le serveur devra envoyer les en-t\u00eates etag, date et last-modified correspondant, respectivement, \u00e0 l\u2019identifiant de la ressource, \u00e0 la date de traitement de la requ\u00eate et \u00e0 la date de derni\u00e8re modification de la ressource demand\u00e9e<\/li><li> L\u2019ensemble des dates est au format GMT<\/li><li> Ces informations peuvent \u00eatre compl\u00e9t\u00e9es par les champs content-length et expires si la taille en octets et la date d\u2019expiration exacte du contenu sont connues<\/li><li>\n\nAfin d\u2019informer les proxys et les clients finaux sur le comportement \u00e0 adopter vis-\u00e0-vis des contenus mis en cache, les auteurs devront utiliser l\u2019en-t\u00eate HTTP cache-control en accord avec les d\u00e9lais de r\u00e9actualisation n\u00e9cessaires et le caract\u00e8re priv\u00e9 de la diffusion<\/li><li>\n\nLa possible mise en cache pourra \u00eatre ainsi finalis\u00e9e par la soumission d\u2019un message 304 Not Modified (sans la ressource demand\u00e9e dans le corps de la requ\u00eate) lorsque le serveur recevra un en-t\u00eate if-modified-since contenant une date ant\u00e9rieure \u00e0 la date de modification de ladite ressource<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque page : v\u00e9rifier la possible mise en cache des \u00e9l\u00e9ments de la page \u00e0 l\u2019aide d\u2019un outil comme Yslow, redbot&#x2e;org ou encore Dareboost<\/li><li>\n\nAttention \u00e0 bien v\u00e9rifier tous les \u00e9l\u00e9ments li\u00e9s (CSS, JS, images) et pas seulement la page en elle-m\u00eame<\/li><\/ul>","207":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre la d\u00e9tection automatis\u00e9e des URL erron\u00e9es<\/li><li>Transmettre au navigateur une information s\u00fbre<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Modifier la configuration du serveur web pour renvoyer l'utilisateur vers une page personnalis\u00e9e lorsque la ressource demand\u00e9e n'existe pas<\/li><li>\n\nSi la configuration principale du serveur n'est pas directement accessible et si l'environnement le permet, utiliser une configuration locale par r\u00e9pertoire<\/li><li> Par exemple, l'environnement Apache autorise la cr\u00e9ation d'un fichier &#x2e;htaccess contenant des directives relatives aux traitements des erreurs : ErrorDocument 404 \/mapage&#x2e;html<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque site examin\u00e9&nbsp;:  Dans http:\/\/web-sniffer&#x2e;net\/ ou dans http:\/\/redbot&#x2e;org\/, taper l'adresse URL du site suivie de caract\u00e8res al\u00e9atoires (du type http:\/\/www&#x2e;example&#x2e;com\/lsghlshdgkjsdgk)<\/li><li>  \t\t\t\t\tV\u00e9rifier que le statut indiqu\u00e9 par l'outil est bien \u00ab&nbsp;404 not found&nbsp;\u00bb<\/li><\/ul>","208":"<p><strong>Objectif<\/strong><\/p><ul><li>Informer l'utilisateur sur l'erreur rencontr\u00e9e, sur la continuit\u00e9 de fonctionnement du serveur et lever le doute sur un \u00e9ventuel probl\u00e8me li\u00e9 \u00e0 sa connexion<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Modifier la configuration du serveur web pour renvoyer l'utilisateur vers une page personnalis\u00e9e lorsque la ressource demand\u00e9e n'existe pas<\/li><li>\n\nSi la configuration principale du serveur n'est pas directement accessible et si l'environnement le permet, utiliser une configuration locale par r\u00e9pertoire<\/li><li> Par exemple, l'environnement Apache autorise la cr\u00e9ation d'un fichier &#x2e;htaccess contenant des directives relatives aux traitements des erreurs : ErrorDocument 404 \/mapage&#x2e;html<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>\u00c0 partir de n'importe quelle adresse url du site examin\u00e9&nbsp;:  Modifier l'adresse URL afin d'obtenir une erreur 404, par exemple, en ajoutant une s\u00e9rie de trois ou quatre&nbsp;caract\u00e8res al\u00e9atoires en fin d'adresse tel que&nbsp;: http:\/\/www&#x2e;exemple&#x2e;com\/dbvdjb ;  \t\t\t\t\tV\u00e9rifier que la page retourn\u00e9e correspond \u00e0 une page personnalis\u00e9e, coh\u00e9rente avec le reste du site, et non pas \u00e0 la page 404 envoy\u00e9e par d\u00e9faut par le serveur (Apache, IIS, Nginx) ;   \t\t\t\t\tDans le cas de l'utilisation d'un CMS, ce dernier peut vous faire croire qu'il ne renvoie pas la page 404 par d\u00e9faut, il faudra donc effectuer la m\u00eame v\u00e9rification via l'adresse URL d'une image ou d'un fichier CSS ou encore JS pour valider d\u00e9finitivement cette bonne pratique<\/li><\/ul>","209":"<p><strong>Objectif<\/strong><\/p><ul><li>Rassurer l'internaute sur le fait qu'il est toujours dans le m\u00eame site<\/li><li>Permettre \u00e0 l'administrateur du site de mettre des \u00e9l\u00e9ments de guidage pour l'utilisateur<\/li><li>Informer l'utilisateur sur l'erreur rencontr\u00e9e, sur la continuit\u00e9 de fonctionnement du serveur et mettre hors de cause sa connexion<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Modifier la configuration du serveur web pour renvoyer l'utilisateur vers une page personnalis\u00e9e lorsque l'acc\u00e8s \u00e0 la ressource demand\u00e9e n'est pas autoris\u00e9<\/li><li>\n\nSi la configuration principale du serveur n'est pas directement accessible et si l'environnement le permet, utiliser une configuration locale par r\u00e9pertoire<\/li><li> Par exemple, l'environnement Apache autorise la cr\u00e9ation d'un fichier &#x2e;htaccess contenant des directives relatives aux traitements des erreurs : ErrorDocument 403 \/mapage&#x2e;html<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque site audit\u00e9&nbsp;:  Obtenir une page d'erreur 403, pour cela, vous pouvez retirer la derni\u00e8re partie de l'adresse url d'une des images du site pour ne garder que le nom des r\u00e9pertoires pr\u00e9sents entre les slashs de cette adresse, par exemple : http:\/\/www&#x2e;exemple\/com\/img\/<\/li><li> La page affich\u00e9e devrait alors \u00eatre une page d'erreur 403<\/li><li>  \t\t\t\t\tV\u00e9rifier que la page retourn\u00e9e ne correspond pas \u00e0 la page 403 renvoy\u00e9e par d\u00e9faut par le serveur (Apache, IIS, Nginx) mais bien \u00e0 une page d'erreur personnalis\u00e9e, dont le graphisme est coh\u00e9rent avec l'ensemble du site<\/li><\/ul>","210":"<p><strong>Objectif<\/strong><\/p><ul><li>\u00c9viter aux utilisateurs les ruptures de navigation, l'arriv\u00e9e sur des pages cul-de-sac ou l'obligation d'utiliser le bouton Pr\u00e9c\u00e9dent du navigateur<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>La page d'erreur 404 abord\u00e9e au sein de la bonne pratique 82 reprend soit de fa\u00e7on dynamique soit de fa\u00e7on statique l'ensemble de la navigation principale du site<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque site examin\u00e9e&nbsp;:  Modifier l'adresse URL afin d'obtenir une page d'erreur 404, par exemple, en ajoutant une s\u00e9rie de trois ou quatre caract\u00e8res al\u00e9atoires en fin d'adresse tel que : http:\/\/www&#x2e;exemple&#x2e;com\/dbvdjb<\/li><li>  \t\t\t\t\tValider que la page retourn\u00e9e contient les \u00e9l\u00e9ments du menu principal de navigation<\/li><\/ul>","211":"<p><strong>Objectif<\/strong><\/p><ul><li>Am\u00e9liorer la vitesse de rendu de la page<\/li><li>Diminuer les co\u00fbts de bande passante<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Activer le module Gzip ou Deflate du serveur pour compresser les ressources Javascript, CSS et HTML<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque page examin\u00e9e&nbsp;:   V\u00e9rifier la compression des contenus (Gzip) \u00e0 l'aide d'un outil comme Yslow&nbsp;: cliquer sur l'onglet Grade pour v\u00e9rifier la note obtenue par Compress components with gzip<\/li><li> Une note de A indique que les contenus ont \u00e9t\u00e9 bien compress\u00e9s dans leur ensemble<\/li><li> Pour plus de d\u00e9tails, regarder l'onglet Components puis d\u00e9rouler les types de contenu doc, js et css pour v\u00e9rifier qu'un poids inf\u00e9rieur \u00e0 celui pr\u00e9sent dans la colonne Size est bien indiqu\u00e9 dans la colonne Gzip pour chacun des fichiers<\/li><li>\n\nAttention \u00e0 bien v\u00e9rifier tous les \u00e9l\u00e9ments li\u00e9s (CSS, JS, HTML) et pas seulement la page en elle-m\u00eame<\/li><li> Les formats d\u00e9j\u00e0 compress\u00e9s comme les images JPEG ou PNG ou les archives zip, par exemple, ne doivent pas \u00eatre recompress\u00e9s<\/li><li>\n\nSi la taille avant compression d'un \u00e9l\u00e9ment est inf\u00e9rieure \u00e0 1 Ko, il n'est pas n\u00e9cessaire de le compresser, au risque de voir son poids augmenter<\/li><\/ul>","212":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre au navigateur de choisir le bon encodage des caract\u00e8res pour afficher la page<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Le param\u00e8tre charset de l'en-t\u00eate HTTP content-type est renseign\u00e9 sous la forme : Content-Type: text\/html; charset=utf-8 (utf-8 \u00e9tant ici un exemple), en fonction du jeu de caract\u00e8res effectivement utilis\u00e9 par le document et de son type MIME<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque page examin\u00e9e&nbsp;:   V\u00e9rifier la pr\u00e9sence du charset dans le champ content-type renvoy\u00e9 par le serveur avec un outil comme http:\/\/redbot&#x2e;org\/ ou via la fonctionnalit\u00e9 En-t\u00eates HTTP de la Web Developer Toolbar (menu Informations) qui permet d'afficher le contenu des en-t\u00eates ;  \t\t\t\t\tV\u00e9rifier que le jeu de caract\u00e8res d\u00e9clar\u00e9 correspond effectivement au jeu de caract\u00e8res utilis\u00e9 par le document<\/li><li> En pr\u00e9sence de caract\u00e8res bizarres \u00e0 la place des accents ou autres, la bonne pratique sera certainement invalid\u00e9e<\/li><\/ul>","213":"<p><strong>Objectif<\/strong><\/p><ul><li>Servir les pages dans la langue souhait\u00e9e<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser la n\u00e9gociation de contenu disponible selon le serveur, en testant les valeurs de l'en-t\u00eate HTTP accept-language<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour un site disponible en plusieurs langues (fran\u00e7ais et anglais, par exemple)&nbsp;:  Modifier les options de votre navigateur pour choisir votre langue favorite : s\u00e9lectionner, par exemple, l'anglais en tant que langue pr\u00e9f\u00e9r\u00e9e ;  \t\t\t\t\tTaper l'URL principale du site dans ce m\u00eame navigateur et v\u00e9rifier que les contenus de la page sont disponibles dans la langue retenue comme favorite<\/li><li> Dans notre exemple, la version anglaise devrait \u00eatre automatiquement renvoy\u00e9e<\/li><li>  \t\t\t\t\tEffectuer le m\u00eame test en choisissant une autre langue favorite dans les options du navigateur<\/li><\/ul>","214":"<p><strong>Objectif<\/strong><\/p><ul><li>Minimiser la quantit\u00e9 de donn\u00e9es \u00e0 t\u00e9l\u00e9charger par l'utilisateur<\/li><li>Am\u00e9liorer les performances<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Supprimer les espaces non n\u00e9cessaires et les commentaires dans les fichiers CSS, par exemple en recourant \u00e0 des outils tels que http:\/\/developer&#x2e;yahoo&#x2e;com\/yui\/compressor\/<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour l'ensemble du site&nbsp;:  V\u00e9rifier manuellement au sein de tous les fichiers CSS qu'aucun retour ligne, commentaire, indentation ou saut de ligne n'est pr\u00e9sent<\/li><li>  \t\t\t\t\tOu identifier la liste des fichiers CSS non minifi\u00e9s \u00e0 l'aide d'outils tels que http:\/\/www&#x2e;webpagetest&#x2e;org (onglet Performance Review, colonne Combine ou dans l'onglet Page Speed, puis Minify CSS) ou http:\/\/gtmetrix&#x2e;com\/ (onglet Page Speed, ligne Minify CSS) ou encore l'onglet YSlow, puis Minify JavaScript and CSS<\/li><\/ul>","215":"<p><strong>Objectif<\/strong><\/p><ul><li>Acc\u00e9l\u00e9rer la vitesse d'affichage des pages<\/li><li>Am\u00e9liorer les performances<\/li><li>Diminuer la quantit\u00e9 de donn\u00e9es \u00e0 t\u00e9l\u00e9charger<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Supprimer les espaces non n\u00e9cessaires ainsi que les commentaires dans les fichiers Javascript, en recourant par exemple \u00e0 des outils tels que Compressor (http:\/\/developer&#x2e;yahoo&#x2e;com\/yui\/compressor\/) ou JSmin (http:\/\/crockford&#x2e;com\/javascript\/jsmin)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour l'ensemble du site&nbsp;:  V\u00e9rifier manuellement au sein de tous les fichiers Javascript qu'aucun retour ligne, indentation ou saut de ligne n'est pr\u00e9sent<\/li><li>  \t\t\t\t\tOu identifier la liste des scripts Javascript non minifi\u00e9s \u00e0 l'aide d'outils tels que http:\/\/www&#x2e;webpagetest&#x2e;org (onglet Performance Review, colonne minify JS ou dans l'onglet Page Speed, puis Minify JavaScript) ou http:\/\/gtmetrix&#x2e;com\/ (onglet Page Speed, ligne Minify JavaScript) ou encore l'onglet YSlow, puis Minify JavaScript and CSS<\/li><\/ul>","216":"<p><strong>Objectif<\/strong><\/p><ul><li>Minimiser la quantit\u00e9 de donn\u00e9es \u00e0 t\u00e9l\u00e9charger par l'utilisateur<\/li><li>Am\u00e9liorer les performances<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>N'utiliser le contenu de l'\u00e9l\u00e9ment script que pour renseigner des variables ou initialiser un script et d\u00e9porter les fonctions dans les fichiers Javascript externes<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le code source de toutes les pages \u00e9valu\u00e9es&nbsp;:   V\u00e9rifier que les balises &lt;script&gt; ne contiennent pas de code Javascript mais pointent bien vers des fichiers Javascript externes via leur attribut src<\/li><\/ul>","217":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de rejoindre la page d'accueil du site m\u00eame lorsqu'ils oublient de taper le pr\u00e9fixe www&#x2e;<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Configurer le serveur de fa\u00e7on \u00e0 ce qu'il g\u00e8re les adresses sans www (acheminement)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Sur quelques unes des pages examin\u00e9es&nbsp;:  Enlever le pr\u00e9fixe \u00ab&nbsp;www&nbsp;\u00bb dans l'adresse de la page, au sein de la barre d'URL de votre navigateur ;  \t\t\t\t\tV\u00e9rifier que vous avez toujours acc\u00e8s au site<\/li><li>\n\nAttention&nbsp;: certains navigateurs masquent par d\u00e9faut le pr\u00e9fixe www&#x2e; Le test devra donc se faire en ajoutant http:\/\/ devant l'adresse tout en omettant le pr\u00e9fixe, par exemple : http:\/\/temesis&#x2e;com<\/li><\/ul>","218":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de configurer la fr\u00e9quence \u00e0 laquelle leurs outils consultent le fil de syndication<\/li><li>R\u00e9duire la charge du serveur<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Pour RSS 0&#x2e;91, pr\u00e9ciser les jours et heures durant lesquels il n'y a pas de publication \u00e0 l'aide des \u00e9l\u00e9ments skipDays et skipHours<\/li><li>\n\nPour RSS 2&#x2e;0, pr\u00e9ciser la dur\u00e9e de vie du canal d'information \u00e0 l'aide de l'\u00e9l\u00e9ment ttl<\/li><li>\n\nPour RSS 1&#x2e;0, indiquer la date de r\u00e9f\u00e9rence, la fr\u00e9quence et l'intervalle de mise \u00e0 jour \u00e0 l'aide du module Syndication<\/li><li>\n\nLes formats des dates et heures sont indiqu\u00e9s par la note Date and Time Formats du W3C<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque fil de syndication&nbsp;:  Afficher le code source du fil de syndication en cliquant, par exemple dans Firefox, sur Code source de la page dans le menu contextuel qui appara\u00eet apr\u00e8s clic droit sur la page d'abonnement du fil RSS<\/li><li>   \t\t\t\t\tContr\u00f4ler la pr\u00e9sence des \u00e9l\u00e9ments list\u00e9s dans le paragraphe pr\u00e9c\u00e9dant, sous la forme correspondant au format du flux RSS concern\u00e9<\/li><\/ul>","219":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre au navigateur d'indiquer dans son interface la pr\u00e9sence d'un fil de syndication associ\u00e9 \u00e0 la page en cours de consultation<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Indiquer les fils RSS dans la section head de la page, \u00e0 l'aide d'un \u00e9l\u00e9ment link du type&nbsp;:\n\n&lt;link title=\"La bonne pratique du jour\" href=\"https:\/\/checklists&#x2e;opquast&#x2e;com\/dailybp\/feed\" type=\"application\/rss+xml\" rel=\"alternate\"&gt;<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le code source des pages du site&nbsp;:  Identifier les diff\u00e9rents fils de syndication, par exemple, \u00e0 l'aide d'un outil du type Xenu's Link Sleuth qui permet d'identifier des types d'URI sp\u00e9cifiques ;  \t\t\t\t\tContr\u00f4ler, par exemple \u00e0 l'aide de Firebug, la pr\u00e9sence de l'\u00e9l\u00e9ment link appropri\u00e9 (type=\"application\/rss+xml\") dans l'en-t\u00eate de la page HTML ;   \t\t\t\t\tV\u00e9rifier que l'adresse URL pr\u00e9sente dans l'\u00e9l\u00e9ment link affiche bien un contenu RSS<\/li><\/ul>","220":"<p><strong>Objectif<\/strong><\/p><ul><li>Assurer la fiabilit\u00e9 des liens lorsque le contenu est r\u00e9utilis\u00e9<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>N'utiliser que des hyperliens absolus dans les contenus faisant l'objet de syndication<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque fil de syndication&nbsp;:   Afficher le code source du fil de syndication&nbsp;: sur la page du flux RSS, faire un clic droit et choisir l'option Code source de la page dans le menu contextuel qui appara\u00eet   \t\t\t\t\tContr\u00f4ler qu'aucun hyperlien relatif n'est pr\u00e9sent dans le code source du fil de syndication, c'est-\u00e0-dire que tous les liens concern\u00e9s sont du type http:\/\/exemple&#x2e;com\/mapage ou https:\/\/exemple&#x2e;com\/mapage, etc et non pas : \/mapage&#x2e;html (lien relatif)<\/li><\/ul>","221":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs de s'abonner facilement aux fils de syndication<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Les URI des fils de syndication sont indiqu\u00e9s dans une page sp\u00e9cifique ou dans chaque page du site, sous forme de liens explicites :\n\n&lt;a href=\"\/fil&#x2e;rss\" title=\"fil RSS\"&gt;RSS&lt;\/a&gt;<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans chaque site web&nbsp;:  Identifier les diff\u00e9rents fils de syndication diffus\u00e9s par le site, par exemple, \u00e0 l'aide d'un outil du type Xenu's Link Sleuth qui permet d'identifier des types d'URI sp\u00e9cifiques ;  \t\t\t\t\tContr\u00f4ler la pr\u00e9sence, pour chaque fil de syndication, d'un lien HTML a pointant vers celui-ci dans l'ensemble des pages du site&nbsp;: page de rubrique correspondant au sujet du fil concern\u00e9, page g\u00e9n\u00e9rique r\u00e9capitulant les diff\u00e9rents fils de syndication, etc<\/li><\/ul>","222":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux aides techniques de restituer l'information contenue dans les tableaux de donn\u00e9es de mani\u00e8re compr\u00e9hensible, en indiquant \u00e0 l'utilisateur les relations logiques entre contenu et en-t\u00eates du tableau<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser l'\u00e9l\u00e9ment HTML th et son attribut scope pour baliser les cellules d'en-t\u00eates et expliciter leur port\u00e9e (scope de valeur col pour un en-t\u00eate de colonne, de valeur row pour un en-t\u00eate de ligne)<\/li><li>\n\nPour les en-t\u00eates qui ne s'appliquent qu'\u00e0 une partie d'une ligne ou d'une colonne, contr\u00f4ler la pr\u00e9sence syst\u00e9matique de l'attribut id pour l'\u00e9l\u00e9ment th et de l'attribut headers pour les \u00e9l\u00e9ments td avec les valeurs appropri\u00e9es&nbsp;:  Donner \u00e0 chaque en-t\u00eate (\u00e9l\u00e9ment th) un attribut id (par exemple, id=\"foo\") ;  \t\t\t\t\tUtiliser l'attribut headers dans chaque cellule (\u00e9l\u00e9ment td) pour indiquer les en-t\u00eates associ\u00e9es (par exemple, headers=\"foo\" pour chaque cellule rattach\u00e9e \u00e0 l'en-t\u00eate ayant l'attribut id=\"foo\")<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Dans le code g\u00e9n\u00e9r\u00e9 (consultable avec Firebug) des tableaux de donn\u00e9es&nbsp;:  V\u00e9rifier l'utilisation syst\u00e9matique de l'\u00e9l\u00e9ment th pour baliser les en-t\u00eates de ligne ou de colonne ;  \t\t\t\t\tPour les en-t\u00eates s'appliquant \u00e0 la totalit\u00e9 d'une ligne ou d'une colonne, contr\u00f4ler la pr\u00e9sence syst\u00e9matique de l'attribut scope dot\u00e9 de la valeur appropri\u00e9e (row pour une ligne ou col pour une colonne) ;  \t\t\t\t\tPour les en-t\u00eates qui ne s'appliquent qu'\u00e0 une partie d'une ligne ou d'une colonne, contr\u00f4ler la pr\u00e9sence syst\u00e9matique de l'attribut id pour l'\u00e9l\u00e9ment th et de l'attribut headers pour les \u00e9l\u00e9ments td avec les valeurs appropri\u00e9es&nbsp;:  \t\t\t\t\tChaque en-t\u00eate (\u00e9l\u00e9ment th) doit \u00eatre dot\u00e9e d'un attribut id (par exemple, id=\"foo\") ;  \t\t\t\t\tL'attribut headers doit \u00eatre utilis\u00e9e dans chaque cellule (\u00e9l\u00e9ment td) pour indiquer les en-t\u00eates associ\u00e9es (par exemple, headers=\"foo\" pour chaque cellule rattach\u00e9e \u00e0 l'en-t\u00eate ayant l'attribut id=\"foo\")<\/li><\/ul>","223":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'aides techniques (lecteurs d'\u00e9cran) d'identifier ais\u00e9ment la nature des informations fournies par un tableau<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser et renseigner l'\u00e9l\u00e9ment HTML caption pour chaque tableau de donn\u00e9es<\/li><li>\n\nLe cas \u00e9ch\u00e9ant, recourir \u00e0 un \u00e9l\u00e9ment caption masqu\u00e9 \u00e0 l'affichage<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque tableau de donn\u00e9es&nbsp;:  V\u00e9rifier, par exemple avec Firebug, la pr\u00e9sence de l'\u00e9l\u00e9ment caption<\/li><li> Si cet \u00e9l\u00e9ment est masqu\u00e9 \u00e0 l'affichage \u00e0 l'aide d'une classe CSS, v\u00e9rifier qu'il reste accessible pour les lecteurs d'\u00e9cran ;   \t\t\t\t\tContr\u00f4ler la pertinence de l'\u00e9l\u00e9ment caption qui doit permettre d'identifier la nature des informations apport\u00e9es par le tableau<\/li><li>\n\nCette v\u00e9rification peut \u00eatre partiellement automatis\u00e9e pour ce qui est de la pr\u00e9sence de l'\u00e9l\u00e9ment de titre caption mais le contr\u00f4le de sa pertinence n\u00e9cessite un examen manuel<\/li><\/ul>","224":"<p><strong>Objectif<\/strong><\/p><ul><li>Fournir un contenu compr\u00e9hensible aux utilisateurs dont l'agent utilisateur ou l'aide technique (lecteur d'\u00e9cran) ne permet pas de restituer la mise en forme initialement pr\u00e9vue \u00e0 l'aide d'un tableau<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Regrouper dans une m\u00eame cellule les informations qui doivent \u00eatre verticalement associ\u00e9es (ne pas les r\u00e9partir dans des cellules plac\u00e9es dans des lignes successives du tableau)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque tableau de mise en forme, c'est-\u00e0-dire pour chaque tableau ne comportant pas de donn\u00e9e reli\u00e9e \u00e0 des en-t\u00eates de ligne ou de colonne&nbsp;:  Proc\u00e9der \u00e0 la lin\u00e9arisation de l'affichage \u00e0 l'aide, par exemple, de la fonctionnalit\u00e9 Lin\u00e9ariser la page (menu Divers) de la Web Developer Toolbar dans Firefox<\/li><li>  \t\t\t\t\tV\u00e9rifier que le contenu lin\u00e9aris\u00e9 reste compr\u00e9hensible, sans incoh\u00e9rence ni perte d'information<\/li><\/ul>","225":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d\u2019acc\u00e9der \u00e0 des tableaux exploitables par leur agent utilisateur et restitu\u00e9s de mani\u00e8re compr\u00e9hensible dans tous les cas<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser syst\u00e9matiquement l\u2019\u00e9l\u00e9ment table et les \u00e9l\u00e9ments associ\u00e9s (tr, td, th, caption) pour baliser les tableaux de donn\u00e9es, et non des images reproduisant le tableau<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>S\u2019assurer qu\u2019aucun tableau de donn\u00e9es n\u2019est g\u00e9r\u00e9 sous forme d\u2019image<\/li><\/ul>","226":"<p><strong>Objectif<\/strong><\/p><ul><li>Permettre aux utilisateurs d'acc\u00e9der \u00e0 des tableaux exploitables par leur agent utilisateur et restitu\u00e9s de mani\u00e8re compr\u00e9hensible dans tous les cas<\/li><\/ul><p><strong>Mise en \u0153uvre<\/strong><\/p><ul><li>Utiliser syst\u00e9matiquement l'\u00e9l\u00e9ment table et les \u00e9l\u00e9ments associ\u00e9s (tr, td, th, caption) pour baliser les tableaux de donn\u00e9es, et non des artifices reposant sur des accumulations d'espaces ins\u00e9cables ou de caract\u00e8res graphiques tels que les pipes (lignes verticales \u00ab&nbsp;|&nbsp;\u00bb)<\/li><\/ul><p><strong>Contr\u00f4le<\/strong><\/p><ul><li>Pour chaque contenu affich\u00e9 sous forme de tableau de donn\u00e9es (c'est-\u00e0-dire associant des cellules de donn\u00e9es \u00e0 des en-t\u00eates de ligne ou de colonnes)&nbsp;:   S'assurer que celui-ci est balis\u00e9 avec les \u00e9l\u00e9ments HTML tr (ligne), td (cellule de donn\u00e9es), th (en-t\u00eate de ligne ou de colonne) et caption (titre du tableau), par exemple \u00e0 l'aide de Firebug<\/li><\/ul>"}