Permettre la navigation et la consultation sans image (navigateurs texte ou braille, images désactivées, etc.
Permettre l'affichage d'un texte pendant la chargement des images améliorer le référencement.

L'attribut alt est présent pour chaque élément <img>, sous la forme alt="" pour les images qui ne véhiculent pas d'information nécessaire à la compréhension du texte.
Exemple de code <img src="spacer.
gif" height="1" width="1" alt="">.
Attention l'omission de l'attribut alt n'est pas l'équivalent d'un attribut vide et n'est pas acceptable.
; alt="_fonction_" pour les images liens, avec comme contenu (_fonction_) la fonction du lien <img src=".
" alt=""> pour la traditionnelle icône "home" ; alt="_description_" pour les images dont la perception est nécessaire à la compréhension du contenu.
La description de l'image ou de sa fonction sera limitée à 60 caractères, afin d'être correctement restituée sur les medias tactiles (plages brailles) et sur les écrans dotés d'une application d'agrandissement (loupe).
Les pages du site satisfont au moins au de conformité "A" des directives pour l'accès aux contenus web (WCAG) 1.
0 du W3C.

La taille des polices destinées à l'affichage écran est exprimée en taille variable et non en taille fixe.

permettre aux utilisateurs d'agrandir la taille des polices affichées à l'écran
Ne pas modifier la taille de la police par défaut ou l'indiquer en utilisant une unité proportionnelle aux réglages de l'utilisateur(em, ex, %) et non avec une unité dépendante du périphérique de consultation (px, pt).
Consulter ce lien Tester la page en changeant la taille de la police dans les principaux navigateurs.
Les technologies du W3C utilisées le sont de manière conforme.
permettre une interprétation correcte par les outils respectant les normes en vigueurfaciliter la maintenance et l'évolution du coderendre le site indépendant des outils de consultationassurer la pérennité du site .
Le code HTML ou XHTML respecte une des DTD valides proposée par le W3C.
Voir à ce propos la structuration des documents HTML-XHTML (tutoriels OpenWeb) ;Le code CSS respecte les normes CSS1 et/ou CSS2.
Voir à ce propos la mise en page (tutoriels OpenWeb) ;Les scripts utilisés respectent les normes DOM1 et/ou DOM2.
Voir à ce propos les pages dynamiques (tutoriels OpenWeb).
Validateurs HTML Validateurs CSS Le montant hors taxes des produits et services est accompagné du détail des taxes et du montant total.
permet aux utilisateurs d'identifier précisément le montant total qu'ils auront à payer .
Indiquer sur le formulaire récapitulatif de la commande, ainsi que sur la facture envoyée au client, le détail de toutes les taxes intégrées au coût des produits et services proposés.
Vérifier sur le formulaire récapitulatif de la commande, ainsi que sur la facture envoyée au client, la présence du détail de toutes les taxes intégrées au coût des produits et services proposés.
La période et les conditions de validité des offres spéciales et promotions sont indiquées.
permet aux utilisateurs d'identifier la période au cours de laquelle ils peuvent bénéficier des offres proposées .
Indiquer sur le site les informations relatives à la période et aux conditions de validité des offres spéciales et de promotions proposées.
Vérifier sur le site la présence des informations relatives à la période et aux conditions de validité des offres spéciales et de promotions proposées.
Les conditions de financement (taux global du crédit, conditions, réserves et délais d'acceptation) sont indiquées.
permet aux utilisateurs d'indentifier le montant total qu'il aura à payer et les différentes composantes de ce montant.

Indiquer sur le site les conditions de financement des crédits proposés aux clients.
Vérifier la présence sur le site des informations relatives aux conditions de financement des crédits proposés aux clients.
Les horaires et tarifs de fonctionnement des services mis à la disposition des utilisateurs sont indiqués.
permettre aux utilisateurs de connaître les services mis à leur disposition et leurs fonctionnements .
Indiquer les horaires et tarifs de fonctionnement des services mis à la disposition des utilisateurs.
Vérifier que les horaires et tarifs de fonctionnement des services mis à la disposition des utilisateurs sont indiqués.
Les délais de réponse estimés aux demandes des utilisateurs sont indiqués.
renseigner les utilisateurs sur le délai normal susceptible de s'écouler avant de recevoir une réponse .
Indiquer les délais de réponse estimés aux demandes des utilisateurs.
Vérifier que les délais de réponse estimés aux demandes des utilisateurs sont indiqués.
Le site n'emploie aucune technique destinée à bloquer ou gêner l'affichage et/ou la lecture du code source.
permettre aux utilisateurs de visualiser le code source et de signaler les erreurs perturbant leur consultation.
.
Vérifier qu'il est possible d'afficher le code source avec la commande native du navigateur.
Un accusé de réception d'une demande d'information est envoyé par e-mail dans les 60 minutes.
permettre aux utilisateurs d'obtenir une confirmation archivable de la bonne réception de leurs demandes d'information .
Mettre en place un script d'envoi automatique d'accusé de réception aux e-mails reçus.
Faire une demande d'information de test et s'assurer de la réception d'un accusé dans les 60 minutes.
Une réponse à une demande d'information est envoyée sous 5 jours ouvrés.
garantir aux utilisateurs un délai raisonnable de traitement de leurs demandes d'information .
Mettre en place les moyens humains et/ou matériels permettant de répondre à l'ensemble des demandes d'information dans les délais.
Faire une demande d'information de test et s'assurer de la réception d'une réponse dans les 5 jours ouvrés.
Les conditions de garantie (durée, options, extensions, tarifs, restrictions, etc.
) sont indiquées.
permet aux utilisateurs d'identifier précisément la nature des services associés et leur coût .
Indiquer dans les conditions générales disponibles sur le site, les informations relatives aux conditions de garanties appliquées.
Vérifier la présence, dans les conditions générales disponibles sur le site, des informations relatives aux conditions de garanties appliquées.
L'adresse et les conditions de retour des produits (sur site, atelier) sont indiquées.
permet aux utilisateurs d'anticiper sur d'éventuelles difficultés d'utilisation et/ou de fonctionnement du bien ou du service proposé .
Indiquer dans les conditions générales les informations relatives aux conditions de retour des produits vendus.
Vérifier dans les conditions générales la présence d'informations relatives aux conditions de retour des produits vendus.
Les conditions de fonctionnement du service après-vente (tarifs, horaires, moyens de , etc.
) sont indiquées.
permet aux utilisateurs de connaître les condtions d'assistance en cas de difficulté .
Indiquer, dans les conditions générales, les informations relatives aux conditions de fonctionnement du service après-vente.
Vérifier la présence, dans les conditions générales, des informations relatives aux conditions de fonctionnement du service après-vente.
La disponibilité des produits est indiquée avant la validation définitive de la commande.
permet d'anticiper d'éventuelles difficultés et une augmentation du délai de livraison .
Indiquer avant la commande et sur le formulaire récapitulatif la disponibilité des produits sélectionnés.
Vérifier avant la commande et sur le formulaire récapitulatif la présence d'informations relatives à la disponibilité des produits sélectionnés.

Les informations relatives à la zone de livraison des produits ou à celle de réalisation des services sont indiquées.
permet d'éviter une navigation et des commandes inutiles, voire une perte de temps pour l'utilisateur et la structure qui propose les biens ou les services .

.
Indiquer, dans les conditions générales, les informations relatives à la zone de livraison couverte pour les produits et les services.
Vérifier la présence, dans les conditions générales, des informations relatives à la zone de livraison couverte pour les produits et les services.
Une adresse de livraison différente de l'adresse de facturation peut être spécifiée.
permet aux utilisateurs de faire livrer un achat sur le lieu de son choix .
Proposer au client, sur le formulaire récapitulatif de la commande, une adresse de livraison différente de l'adresse de facturation.
Vérifier la présence, sur le formulaire récapitulatif de la commande, d'une adresse de livraison différente de l'adresse de facturation.
Le délai de livraison estimé est indiqué avant la validation définitive de la commande.
permet aux utilisateurs d'identifier la date réelle à laquelle le bien commandé sera effectivement en leur possession .
Indiquer, sur le récapitulatif de la commande et avant validation définitive, les informations relatives aux délais de livraison estimés.
Vérifier la présence, sur le récapitulatif de la commande et avant validation définitive, des informations relatives aux délais de livraison estimés.
Le code source de toutes les pages contient une déclaration de type de document (doctype) conforme à la syntaxe définie par le W3C.
permettre une interprétation correcte des pages en indiquant aux outils de consultation le standard utilisé.
.
Utiliser une des déclarations de type de document présentées dans le document List of valid DTDs you can use in your document émis par le W3C QA Vérifiez que le doctype utilisé est celui qui retourne le moins d'erreurs (idéalement aucune) avec un validateur
Le sous-total détaillé (quantités, montants, frais, assurances, etc.
) est indiqué avant la validation définitive de la commande.
permettre à l'utilisateur de connaître le détail du montant de sa commandelever un frein à la validation d'une commande .
Indiquer sur le formulaire récapitulatif de la commande et avant validation, le sous total détaillé du coût du produit ou service commandé.
Faire une commande de test et vérifier que les informations sont bien présentes avant la validation.
La modification de la quantité de chaque article, l'ajout ou la suppression d'un ou plusieurs articles est toujours possible avant la validation définitive de la commande.
permettre à l'utilisateur de modifier facilement sa commande .
Proposer à l'utilisateur une option spécifique sur le formulaire de commande lui permettant de modifier les quantités commandées avant leur validation.
Faire une commande de test et vérifier la possibilité de changer les quantités commandées avant la validation.
Le site accepte au moins 2 moyens de paiement.
permet aux utilisateurs de choisir le mode de paiement qui leur convient le mieux dans ce contexte.

Informer le client, au moment de la commande, qu'il dispose de deux moyens de paiement.
Vérifier la présence, lors d'une commande test, des deux moyens de paiements proposés aux clients.
Les modes de paiement acceptés et les procédures correspondantes sont présents ou accessibles sur toutes les pages présentant les produits ou services.
permet aux utilisateurs d'anticiper sur le mode et les conditions de paiement et de vérifier avant la commande qu'ils pourront la mener à son terme.
.
Indiquer sur le site les informations sur les modes de paiement acceptés ainsi que les procédures correspondantes.
Vérifier sur le site que les informations sur les modes de paiement acceptés ainsi que les procédures correspondantes sont effectivement accessibles à partir de toutes les pages qui présentent les produits ou les services.
La référence de la transaction est affichée au client après la validation de sa commande.
permet aux utilisateurs d'afficher et éventuellement d'imprimer une trace de sa commande .
Indiquer la référence de la transaction sur le formulaire de confirmation de commande envoyé au client après validation d'un achat en ligne.
Vérifier que la référence de la transaction est bien indiquée sur le formulaire de confirmation de commande envoyé au client après validation d'un achat en ligne.
Les informations sur la nature de la sécurisation des transactions ( et mode de cryptage) sont indiquées sur le site.
contribuer à l'information des utilisateurs sur la sécurisation des échanges de données sensibles .
Indiquer le et le mode de cryptage des données sur les pages concernées.
Il est aussi possible d'indiquer comment retrouver l'information par le biais de son navigateur dans la mesure où la plupart offre cette possibilité.
Vérifier que les informations sur le et le mode de cryptage des données sont accessibles Le code source des pages contient l'indication de la langue principale du contenu.
améliorer l'interprétation des pages par les synthèses vocalesaméliorer le référencement en permettant aux moteurs de reconnaître la langue du contenu .
Les attributs lang (en HTML) et/ou xmllang (en XHTML) de l'élément <html> permettent de spécifier la langue par défaut du contenu <html lang="fr"> en HTML4.
01 ; <html lang="fr" xmllang="fr".
.
.
> en XHTML1.
0 compatible HTML ; <html xmllang="en" .
.
.
> en XHTML1.
0 traité en tant que XML, en XHTML1.
1 et dans les autres dialectes XHTML traités en tant que XML.
La syntaxe utilisée est définie par la norme RFC3066 sous la forme d'un code de langue ISO639 ; suivi si nécessaire après un tiret par un code de pays ISO3166 fr-CA.
Le W3C propose deux tutoriels sur cette questionWhy use the language attribute? Using language information in XHTML, HTML and CSS.
Afficher le code source et vérifier la présence du ou des attributs.
Les échanges de données bancaires sont cryptés.
contribue à la sécurisation des échanges de données sensibles.

Utiliser les services d'un éditeur de certificats de sécurité tel que Verisign, Thawte ou GeoTrust Vérifier la présence et la validité du certificat électronique utilisé pour sécuriser la connexion établie au moment des échanges de données bancaires.
sécurité Les certificats de sécurité sont valides et signés par des organismes tiers.
permet aux utilisateurs de connaître la validité du certificat et contribue à la sécurisation de la transaction .
Faire un suivi rigoureux des certificats de sécurité utilisés sur le site en anticipant les dates de renouvellement.
Double cliquer sur l'icone matérialisant l'utilisation d'un certificat électronique et vérifier les dates de validité du certificat dans la boite de dialogue- sécurité L'identité des éventuels bancaires et/ou les solutions de paiement utilisées sont indiqués.
permet de fournir aux utilisateurs des informations sur les tiers impliqués dans la transaction.
.
Indiquer sur le site les informations relatives à l'identité des prestataires bancaires et/ou des solutions de paiement utilisées pour les transactions électroniques.
Vérifier sur le site la présence d'informations relatives à l'identité des prestataires bancaires et/ou des solutions de paiement utilisées pour les transactions électroniques- sécurité La et de respect de la vie privée est indiquée.
permet aux utilisateurs de connaître les conditions de conservation de leurs données personnelles .
Indiquer sur chaque page du site la du site Vérifier que la est visible ou accessible depuis chaque page Le serveur n'envoie pas la liste des fichiers contenus dans les répertoires n'ayant pas de page par défaut.
permet d'empêcher les utilisateurs d'afficher des listes de fichiers proposées par le serveur, et exemptes par exemple de menus de navigation .
Configurer le serveur pour qu'il ne renvoie pas la liste des fichiers présents dans un répertoire.
Pour Apache, vous pouvez rajouter ceci dans votre .
htaccessOptions -Indexes Vérifier que l'appel d'un répertoire sans page par défaut, comme le répertoire des images ou des feuilles de style, ne renvoie pas la liste du contenu de ce dossier- formulaires Les étapes des processus comportant des interactions multiples (commande, formulaires répartis sur plusieurs pages, etc.
) sont décrites et imprimables avant leur commencement.
permettre aux utilisateurs de connaitre le nombre d'étapes et leur déroulement avant de commencer un processus longpermettre aux utilisateurs d'imprimer un mode d'emploi succint du processuslever un frein à l'utilisation de services en ligne complexes .
Faire précéder tout processus complexe d'une description de ses étapes ou d'un hyperlien vers une page spécifique.
Imprimer la page décrivant les différentes étapes du processus- paiement Un récapitulatif indiquant la référence de la transaction et les données de la commande est envoyé par e-mail dans les 60 minutes suivant la validation.
Permet à l'utilisateur d'obtenir une confirmation de sa commande en dehors du contexte de la navigation sur le site.
.
Utiliser ou développer des outils de gestion du caddie envoyant automatiquement une confirmation dans les délais préconisés.
Faire un processus de commande de test et vérifier que le courriel est bien reçu dans les délais prévus- - remboursement Les conditions de remboursement (délais, frais et justificatifs exigés) sont indiquées.
permet aux utilisateurs d'identifier précisément les pièces nécessaires en cas de nécessité de retour du produit .
Indiquer dans les conditions générales la présence d'informations relatives aux conditions de remboursement.
Vérifier dans les conditions générales la présence d'informations relatives aux conditions de remboursement- remboursementLa charge des frais de retour est indiquée.
permet aux utilisateurs d'identifier précisément les risques en cas de nécessité de retour du produit .
Indiquer, dans les conditions générales, à qui incombe la charge des frais de retour d'un produit.
Vérifier, dans les conditions générales, la présence des informations qui définissent à qui incombe la charge des frais de retour d'un produit- réclamations Le mode de dépôt et la procédure de traitement des réclamations sont indiqués.
permet aux utilisateurs de comprendre ou d'anticiper d'éventuelles difficultés sur le site ou lors de la transaction.
.
Indiquer, dans les conditions générales, la procédure de dépôt et de traitement des réclamations.
Vérifier la présence, dans les conditions générales, des informations relatives à la procédure de dépôt et de traitement des réclamations- réclamations Le site propose au moins un moyen de er le responsable des réclamations.
permet aux utilisateurs de s'adresser ou d'adresser directement leurs réclamations au bon interlocuteur .
Indiquer, dans les conditions générales, un moyen de (e-mail, téléphone, fax.
.
.
) avec le responsable des réclamations.
Vérifier, dans les conditions générales, la présence d'informations permettant d'entrer en (e-mail, téléphone, fax.
.
.
) avec le responsable des réclamations- réclamations Un accusé de réception d'une réclamation est envoyé par e-mail dans les 3 jours ouvrés.
permet à l'utilisateur d'obtenir une confirmation de sa commande en dehors du contexte de la navigation sur le site .
Définir une procédure de gestion de l'envoi d'un mail accusant réception d'une réclamation dans les trois jours.
Déposer une réclamation test afin de vérifier le délai de réception de l'accusé de réception- format Le format des fils de syndication est indiqué sur le site.
permettre aux utilisateurs de savoir si le fil de syndication proposé est dans un format pris en charge par les outils dont ils disposent .
Préciser si les fils de syndication sont aux formats RSS et/ou Atom.
Ajouter le numéro de version (RSS0.
91, RSS1.
0, RSS2.
0) si vous le connaissez.
Tester la validité du fil
- Les contenus alternatifs de tous les éléments non-textuels sont correctement indiqués.
permettre la navigation et la consultation sans éléments non textuels (navigateurs texte ou braille, plugins absents, etc.
)permettre l'affichage d'un texte pendant la chargement des éléments non textuelsaméliorer le référencement .
Ajouter un contenu alternatif (texte, lien vers une page de description, etc.
) à l'intérieur des éléments HTML object (ou de l'élément propriétaire embed).
Tester avec un validateur d' W3C utilisées sur la page d' le sont de manière conforme.
" - code Les technologies du W3C utilisées sur la page d' le sont de manière conforme.
permettre une interprétation correcte par les outils respectant les normes en vigueurfaciliter la maintenance et l'évolution du coderendre le site indépendant des outils de consultation.
Le code HTML ou XHTML respecte une des DTD valides proposée par le W3C.
Voir à ce propos la structuration des documents HTML-XHTML (tutoriels OpenWeb) ;Le code CSS respecte les normes CSS1 et/ou CSS2.
Voir à ce propos la mise en page (tutoriels OpenWeb) ;Les scripts utilisés respectent les normes DOM1 et/ou DOM2.
Voir à ce propos les pages dynamiques (tutoriels OpenWeb).
Vérifiez le code HTML Vérifiez le code CSS
internationalisation Si le site est disponible en plusieurs langues, il est possible d'accéder à chaque version depuis n'importe quelle page du site.
Permettre aux visiteurs de trouver facilement un contenu dans leur langue si celui-ci existe .
Utiliser un système de gestion de la langue à base de gabarits.
Fournir un accés direct aux versions dans différentes langues sur chaque page du site.
Naviguer sur le site et changer de langue depuis plusieurs pages.
Vérifier que les versions sont disponibles depuis chaque pagenavigation Le menu principal de navigation du site figure sur la page d'erreur 404 personnalisée.
évite aux utisateurs les ruptures de navigation, l'arrivée sur des pages cul-de-sac, l'obligation d'utiliser le bouton précédent du navigateur .
La page d'erreur 404 abordée au sein de la bonne pratique numéro 82 reprend soit de façon dynamique soit de façon statique l'ensemble de la navigation principale du site.
Modifier un URL afin d'obtenir une erreur 404 et valider que la page retournée reprend les éléments du menu principal de nagitation- pop-ups La navigation sur les pages internes ne provoque pas le déclenchement de pop-ups.
permet à l'utilisateur de naviguer sur le site sans avoir d'opération spécifique à effectuer pendant la navigation .
Ne pas utiliser d'ouverture automatique de fenêtres pop-up (évenement d'ouverture de fenêtre lors du chargement d'une page) sur les pages internes du site.
Vérifier que la navigation sur les pages internes du site ne déclenche pas l'ouverture automatique de nouvelles fenêtres- pop-ups Le chargement de la page d' ne provoque pas le déclenchement de pop-ups.
permet à l'utilisateur de commencer la navigation sur le site sans avoir préalablement d'opération spécifique à effectuer .
Ne pas utiliser d'ouverture automatique de fenêtres pop-up (évenement d'ouverture de fenêtre lors du chargement d'une page) sur la page d' du site.
Vérifier que le chargement de la page d' du site ne déclenche pas l'ouverture automatique de nouvelle fenêtre- pop-ups Si le site impose des pop-ups, celles-ci n'apparaissent qu'une seule fois.
évite à l'utilisateur l'affichage successif de mêmes fenêtres secondaires, et minimise le nombre d'opérations de fermeture .
Lors de l'envoi d'une pop-up, installation d'un cookie signalant celle-ci comme affichée pour l'utilisateur.
Toutefois, la solution technique la plus simple est bien évidemment de ne pas mettre en place de pop-up, bloquées par un grand nombre d'outils de navigation et de barres d'outils, très mal perçues par les utilisateurs et fort peu efficaces.
En cas de présence de pop-up, vérifier que celles-ci ne s'affichent pas au chargement des mêmes pages- pop-ups Si le site impose des pop-ups, celles-ci contiennent un bouton fermer.
garantit à l'utilisateur la présence de solutions alternatives et explicites pour fermer d'éventuelles fenêtres secondaires.
.
Placer dans chaque pop-up un bouton ou un lien avec un explicite pour la fermeture, et associer ce bouton à une action de fermeture Exemple en javascript (peu accessible) Fermer Vérifier que le corps des éventuelles pop-up contiennent un bouton ou un lien permettant de les fermer - code Le contenu de chaque page est organisé selon une structure de titres et sous-titres hiérarchisée.
permettre aux utilisateurs de visualiser la structure du contenu de la pageaméliorer le référencement en facilitant l'interprétation du contenu par les robots d'indexation .
Structurer le document en titres et sous-titres à l'aide des éléments HTML h1 à h6.
Vérifier que la structure des pages est logique (utilisation des éléments H1 à Hx dans l'ordre croissant) en l'analysant avec l'outil suivant

Le résumé des tableaux est correctement indiqué.
permettre aux utilisateurs non-voyants de se représenter la globalité du tableau .
Renseigner l'attribut summary de l'élément HTML <table> avec un résumé approprié.
Tester avec un validateur d' les pages comportant des tableaux Ocawa ou Accès Pour tous - multimedia Si des animations, des sons ou des clignotements sont proposés en boucle infinie, ils peuvent être interrompus par l'utilisateur.
Permet à l'internaute de conserver la maîtrise de tous les éléments qui sont affichés.
Peut minimiser des risques de cas très rares d'épilepsie.
.
Ajouter un lien ou un bouton permettant l'arrêt de l'animation ou du son.
Veiller à la permanence de la disponibilité de la commande.
Pour les images clignotantes, ou animations, limiter le nombre de boucles à deux ou trois.
Se rendre sur les pages où les animations ou les sons en boucle infinie sont présents et tester les commandes d'arrêt- Chaque champ de formulaire est associé à une étiquette qui lui est propre.
faciliter la compréhension des données attendues dans les formulairesfaciliter la saisie en permettant de sélectionner l'étiquette plutôt que la case à cocher ou le bouton radio .
Un élément label définit l'information attendue pour chaque champ.
Chaque label est associé au champ concerné grâce à un identifiant identique pour l'attribut id du champ ;l'attribut for= du label.
Typiquement, cette association prend la forme <label for="identifiant">.
.
.
</label> <input type="text" id="identifiant" name=".
.
.
">On veillera également à ce que le label et le champ du formulaire se succèdent dans l'ordre naturel du contenu, y compris lorsque la page est consultée dans un navigateur ne supportant pas les tableaux.
On évitera donc par exemple <table> <tr> <td>label 1</td> <td>label 2</td> </tr> <tr> <td>champ 1</td> <td>champ 2</td> </tr> </table>Qui donnera dans un navigateur linéarisant le tableau (navigateur texte) label 1 label 2 champ 1 champ 2 Tester avec un validateur d' Ocawa ou Acces pour tousou cliquer sur une étiquette pour vérifier que le champ associé est sélectionné.
- hyperliensLe soulignement est réservé aux hyperliens.
évite des clics inutiles sur des textes soulignés non liés.
.
Ne pas utiliser le soulignement pour des textes simples ou des éléments ne constituant pas des liens.
Vérifier que les textes soulignés sur le site sont toujours des hyperliens-- hyperliens Le des hyperliens est représentatif de leur cible et décrit la nature du contenu vers lequel il pointe.
permet à tous les utilisateurs d'identifier la cible des liens quel que soit le contexte de navigation .
Le des liens (portion de texte située entre <a href="URL"> et </a>) décrit sans ambiguïté le contenu de la page cible du lien.
Vérifier que les s des liens désignent toujours la cible qu'ils pointent.
- plugins Si la visualisation de certaines parties du contenu nécessite un plug-in, l'hyperlien de téléchargement est proposé sur toutes des pages où celui-ci est nécessaire.
permet aux utilisateurs de télécharger les modules nécessaires à la visualisation.
.
Proposer un lien de téléchargement vers le fichier nécessaire sur toutes les pages dont la visualisation du contenu nécessite un plug-in.
Vérifier la présence d'un lien de téléchargement vers le fichier nécessaire sur toutes les pages dont la visualisation du contenu nécessite un plug-in- serveur Si le site est disponible en plusieurs langues, le serveur envoie la page dans la langue demandée par l'outil de consultation, si elle existe.
Permet le cas échéant aux outils de consultation de choisir le bon document en fonction de la langue indiquée .
Utiliser la négociation de contenu disponible selon le serveur, en testant les valeurs de l'en-tête HTTP Accept-Language.
Voir à ce sujet Apache language negotiation set up.
Changer la langue par défaut du navigateur et naviguer sur le site- typographie Une famille générique de police est indiquée comme dernier élément de substitution.
permet d'effectuer des substitutions de polices si la police proposée n'est pas présente sur le système de l'utilisateut .
Les polices de caractères étant indiquées dans les styles CSS à l'aide des propriétés font-family ou font Pour les polices serifs à empattement (du type Times Roman), spécifier la famille de police générique serif.
Exemple font-family Georgia, "Bookman Old Style", serif;.
Pour les polices sans serifs sans empattement (du type Arial), spécifier la famille de police générique sans-serif.
Exemple font-family Optima, "Trebuchet MS", sans-serif;.
Pour les polices monospace (du type Courier), spécifier la famille de police générique monospace.
Exemple font-family Courier, monospace;.
De même, utiliser les familles génériques cursive et fantasy pour les polices manuscrites et fantaisies.
Si le site utilise la technologie nCSS, valider la feuille de style à l'aide du validateur du W3C qui avertit de l'absence de familles de police générique.
Validateur CSS W3C- Les hyperliens adjacents sont toujours séparés par au moins un caractère imprimable ou une image.
permettre aux synthèses vocales de faire une pause entre les liens .
Des liens sont considérés comme adjacents lorsqu'ils se succèdent directement, ou lorsqu'ils sont séparés par un espace, que ce soit Au sein du même bloc, par exemple <p><a href=".
">lien 1</a> <a href=".">lien 2</a></p>Dans des blocs successifs, par exemple <div>. <a href=".">lien 1</a></div><h2><a href=".">lien 2</a> .</h2>.
Un caractère imprimable tel qu'un signe de ponctuation, une barre verticale (|), un tiret, etc.
doit alors être inséré entre les liens.
Ce caractère ne doit pas être masqué à l'affichage à l'aide de la propriété CSS display none.
Les liens placés dans des éléments de liste successifs (li) ne sont pas considérés comme adjacents.
Lorsqu'elle est appropriée, cette structure permet donc de contourner ce problème.
Tester des pages à l'aide de l'outil Bobby- inscription L'inscription aux newsletters est soumise à un processus de vérification.
éviter l'inscription à une newsletter par un tiers usurpant une identitévérifier que l'adresse e-mail a été saisie sans erreur .
Envoyer un e-mail permettant l'inscription définitive via la saisie d'un mot de passe, un clic sur un hyperlien, etc.
Faire une inscription de test et vérifier la réception d'un e-mail de confirmation.
Les newsletters sont proposées aux formats texte brut et HTML.
permettre aux utilisateurs de consulter les newsletters en fonction de leurs choix ou de leurs possibilités .
Au moins proposer aux utilisateurs le choix du format de réception lors de leur inscription à la newsletter.
Au mieux, permettre aux utilisateurs de modifier ce choix par la suite.
Faire deux inscriptions de test, en choisissant de recevoir la newsletter au format texte brut dans le premier cas et HTML dans le second, puis vérifier que la réception des newsletters se fait bien au format choisi- format Le format d'envoi par défaut des newsletters est le texte brut.
permettre à tous les utilisateurs de consulter les newsletterslimiter la charge du serveur de courrier .
Envoyer les newsletters au format texte brut par défaut.
Faire une inscription de test et vérifier que la réception de la newsletter se fait bien au format texte brut- contenu Les informations relatives aux droits de copie et de réutilisation sont accessibles depuis toutes les pages.
informer les utilisateurs sur les conditions sous lesquelles sont publiés les contenus .
Indiquer les droits de copie et de réutilisation des divers éléments du site sur chaque page ou via un hyperlien pointant vers une page spécifique.
Vérifier que les informations relatives aux droits de copie et de réutilisation sont accessibles depuis toutes les pages.
Une version de la dernière newsletter envoyée est disponible en ligne.
permettre aux utilisateurs de se faire une idée de la newsletter envoyée aux abonnés .
Rendre publique la dernière newsletter envoyée en rendant son contenu disponible sur le site et en faisant en sorte que l'accès à ce contenu reste possible via un cheminement de un ou plusieurs clics depuis la page d' Vérifier qu'une version de la dernière newsletter envoyée est disponible en ligne via un cheminement de un ou plusieurs clics depuis la page d' inscription Les newsletters contiennent un hyperlien permettant la désinscription.
permettre aux abonnés de ne plus recevoir une newsletter .
Faire figurer dans chaque newsletter un hyperlien permettant la désinscription.
Vérifier la présence de l'hyperlien de désinscription dans les newsletters.
Vérifier que le processus se déroule correctement- La fréquence d'envoi des newsletters est indiquée sur le site.
permettre aux utilisateurs de connaître avant leur inscription la fréquence à laquelle ils recevront la newsletter .
Indiquer la fréquence d'envoi des newsletters.
Vérifier que la fréquence d'envoi des newsletters est indiquée- multimedia Les vignettes ne sont pas des images de taille supérieure redimensionnées côté client.
Utiliser pour les vignettes de prévisualisation d'images des versions spécifiques de celle-ci, et non les images originales redimensionnées via leurs attributs HTML, leurs propriétés CSS, etc.
Les vignettes affichées hors du contexte de leur page d'origine doivent conserver leurs dimensions apparentes.
- serveur Le serveur envoie les informations permettant la mise en cache des contenus.
Configurer le serveur Web pour qu'il puisse gérer la mise en cache des éléments statiques et gérer - au applicatif - la possible mise en cache des éléments dynamiques.
En pratique, et en accord avec les spécifications HTTP le serveur devra envoyer les champs ETag , Date et Last-Modified correspondant respectivement à l'identifiant de la ressource, à la date de traitement de la requête et à la date de dernière modification de la ressource demandée.
L'ensemble des dates étant au format GMT.
Ces informations pouvant être complétées par les champs Content-Length et Expires si la taille en octets et la date d'expiration exacte du contenu sont connues.
Afin d'informer les proxys et les clients finaux sur le comportement à adopter vis à vis des contenus mis en cache, les auteurs devront utiliser les directives HTTP Cache-Control et Pragma en accord avec les délais de réactualisation nécessaires et le caractère privé de la diffusion.
La possible mise en cache pourra être ainsi finalisée par la soumission d'un message 304 Not Modified (sans la ressource demandée dans le corps de la requête) lorsque le serveur recevra un entête If-Modified-Since contenant une date antérieure à la date de modification de la dite ressource.
Utiliser un outil permettant de vérifier la possible mise en cache .
Le pays est précisé dans toutes les adresses postales.
Indiquer le pays dans l'adresse postale.
Vérifier la présence du pays dans toutes les adresses postales- internationalisation L'indicatif téléphonique du pays est précisé devant chaque numéro de téléphone.
Vérifier que tous les numéros de téléphone sont précédés de l'indicatif sous la forme +indicatif international-numéro de téléphone.
Exemple France (+33) 1 23 23 45 XX Pour tous les numéros de téléphone présents sur le site, vérifier la présence de l'indicatif international correspondant-- serveur Le serveur envoie l'indication de la langue principale du contenu.
L'en-tête HTTP Content-Language est renseigné selon la langue primaire du document sous la forme Content-Language fr.
La syntaxe utilisée est définie par la norme RFC3066 sous la forme d'un code de langue ISO639 ; suivi si nécessaire après un tiret par un code de pays ISO3166 fr-CA.
Le W3C aborde cette question dans le tutoriel Specifying the language of content.
HTTP Header Viewer code Le code source des fils de syndication contient la fréquence de mise à jour.
permettre aux utilisateurs de configurer la fréquence à laquelle leurs outils consultent le fil de syndicationréduire la charge du serveur .
Pour RSS0.
91, préciser les jours et heures durant lesquels il n'y a pas de publication à l'aide des éléments skipDays et skipHours ; Pour RSS2.
0, préciser la durée de vie du canal d'information à l'aide de l'élément ttl ; Pour RSS1.
0, indiquer la date de référence, la fréquence et l'intervalle de mise à jour à l'aide du module Syndication.
Les formats des dates et heures sont indiqués par la note Date and Time Formats du W3C.
Vérifier la présence des éléments précités dans la source des fils de syndication, selon le format de ceux-ci- serveur Le serveur envoie les informations relatives à la nature des contenus (présence ou absence de contenus à caractère sexuel, violent, etc).
Utiliser l'outil en ligne de l'ICRA permettant de générer le code approprié Vérifier avec l'outil en ligne de l'ICRA que le site renvoie bien les informations attendues- hyperliens Le survol ou l'activation des hyperliens ne modifie pas la mise en page.
Afin de ne pas perturber la mise en forme, il est recommandé d'utiliser le même mécanisme de mise en valeur, autre que par la couleur, à tous les états possible d'un lien actif, visité, non visité, survolé, il convient donc d'éviter de mettre en gras, lors de son survol, un lien en graisse normale par ailleurs Vérifier que le survol des hyperliens ne modifie pas la position des autres éléments de la page et vérifier que les hyperliens ne changent pas de taille ou de graisse lors de leur survol- formulaires Les informations destinées à des espaces publics peuvent être prévisualisées avant leur envoi définitif.
Stocker les informations en cours de publication dans des variables de session afin de pouvoir les réafficher.
Faire une publication de test dans un espace public en s'assurant qu'il est possible de la prévisualiser avant son envoi définitifformulaires La page de prévisualisation des informations destinées à des espaces publics permet leur modification.
Faire figurer le formulaire, tel qu'il a été rempli par l'utilisateur, sur la page de prévisualisation.
Faire une publication de test en vérifiant qu'il est possible de la modifier à partir de la page de prévisualisationformulaires Lors de la saisie d'un formulaire réparti sur plusieurs pages, un récapitulatif global est affiché avant l'envoi définitif.
Stocker les informations saisies dans des variables de session afin de pouvoir en afficher un récapitulatif global.
Remplir un formulaire réparti sur plusieurs pages et vérifier qu'un récapitulatif global est bien affiché avant l'envoi définitifidentification La date de diffusion et/ou le numéro des newsletters sont indiqués dans le sujet des messages.
Indiquer la date de diffusion et/ou le numéro des newsletters dans le sujet des messages.
Vérifier que la date de diffusion et/ou le numéro des newsletters sont présents dans le sujet des messages serveur Le serveur envoie les informations relatives à la et de respect de la vie privée.
Utiliser un outil générant le fichier P3P décrivant la .
Un exemple d'outil en ligneGénérateur P3P Utiliser le validateur en ligne du W3C
Les hyperliens contenus dans les fils de syndication sont absolus.
N'utiliser que des hyperliens absolus dans les contenus faisant l'objet de syndication.
Vérifier que les fils de syndication ne contiennent pas d'hyperlien relatif.
Des hyperliens pointant vers les fils de syndication sont présents.
Les URI des fils de syndication sont indiqués dans une page spécifique ou dans chaque page du site, sous forme de liens explicites <a href="/fil.
rss" title="fil RSS">RSS</a></code>.
Vérifier la présence des liens sur le site.
Les conditions de modération des espaces publics sont indiquées sur le site.
expliquer aux utilisateurs pourquoi et dans quelles mesures leurs publications peuvent être modéréeslimiter les demandes des utilisateurs ne voyant leurs publications apparaître .
Indiquer les conditions de modération des espaces publics.
Vérifier que les conditions de modération des espaces publics sont indiquées.
- hyperliens Le des hyperliens pointant vers les fils de syndication en précisent le format.
Précisez dans l'intitulé de chaque lien s'il s'agit d'un fil au format RSS0.
91, RSS1.
0, RSS2.
0 ou Atom.
Vérifier la mention du format dans le des liens.
La désinscription aux newsletters est possible depuis le site.
Proposer sur le site un formulaire de désinscription à la newsletter.
Si la désinscrition se fait à travers le formulaire d'un prestataire, fournir un lien vers le formulaire du prestatire en question.
Vérifier qu'un formulaire de désinscription à la newsletter est acessible sur ou depuis le site qui propose la newsletter.
En cas de rejet des données saisies dans un formulaire, les raisons du rejet sont indiquées à l'utilisateur.
Indiquer, pour chaque champ contenant des données rejetées, les critères de validité des données à saisir.
Remplir un champ avec des données fantaisistes et vérifier, si la saisie est rejetée, que les raisons du rejet sont indiquées.
Les informations destinées à des espaces publics peuvent être prévisualisées sous la forme où elles seront affichées.
Mettre en forme le contenu prévisualisé en utilisant la même feuille de styles que celle des espaces publics.
Faire deux publications de test identiques en s'assurant, lors de l'étape de prévisualisation de la seconde, que les informations sont bien présentées sous la forme où celles de la première sont affichées.
Les données financières sont exprimées dans une unité monétaire conforme à la norme internationale.
Eviter les erreurs de compréhension et d'interprétation de la part des utilisateurs.
.
Utiliser des outils gérant correctement l'internationalisation, et préciser le code ISO 42172001 de la monnaie, par exemple sous la forme 100€ (<abbr title="Euros">EUR</abbr>) Vérifier sur les pages concernées que les prix et tarifs comportent bien une unité monétaire.
Si le site est réservé ou destiné à un public spécifique, ce public est mentionné au moins sur la page d'.
permettre aux utilisateurs de savoir si le contenu du site leur est reservé ou destiné .
Faire figurer sur la page d' un message d'avertissement clair et précis sur la nature des contenus et le public auquel ils sont destinés ou réservés.
Vérifier qu'il est impossible de visiter le site en partant de la page d' sans avoir remarqué la présence d'un message d'avertissement.
Les caractéristiques quantifiables des produits et services (dimensions, durée, contenance, etc.
) sont exprimées dans des unités conformes à la norme internationale.
Eviter les erreurs d'interprétation par les utilisateurs.
.
Utiliser des outils gérant correctement l'internationalisation ; renseigner systématiquement les unités dans les outils de gestion.
Vérifier que les unités figurent bien derrière ou devant chaque nombre.
Les limitations de consultation ou d'utilisation inhérentes au refus des cookies sont indiquées.
permettre aux utilisateurs ne pouvant ou ne souhaitant pas accepter les cookies de connaitre les limitations de consultation ou d'utilisation du site .
Si les cookies sont nécessaires à la consultation, prévoir un système de vérification de l'acceptation des cookies et, en cas de refus, rediriger vers une page expliquant les limitations.
Si la navigation est possible sans les cookies, indiquer les limitations sur le site Désactiver l'acceptation des cookies dans son navigateur.
Naviguer sur le site à la soit de limitations d'utilisation accompagnées d'un message, soit d'informations sur le rôle de cookies.
La durée de vie des cookies est indiquée sur le site.
permettre aux visiteurs de savoir pour quelle durée les cookies sont conservés par leurs outils .
Indiquer la durée de vie des cookies dans la du site.
Vérifier que la durée de vie des cookies est indiquée sur le site.
Les cookies portent un nom explicite qui permet d'identifier sans équivoque le site sur lequel ils ont été émis.
permettre aux utilisateurs d'identifier l'origine des cookies présents sur leurs outlls .
Préfixer le nom des cookies avec le nom de domaine du site (exemple nomsite_com_prefs, nomsite_com_lastvisit).
Vérifier que les cookies émis par le site portent un nom explicite.
La présence et l'des cookies sont indiqués sur le site.
informer les utilisateurs sur les fonctions du site qui emploient des cookies et sur la nature des données stockées .
Indiquer les fonctionnalités du site utilisant des cookies et la nature des données conservées dans la du site.
Vérifier que la présence et l'des cookies sont indiqués sur le site.
Le code source des pages contient un appel valide à une icône de favori.
Permet l'affichage, l'appel, et la mémorisation éventuelle de l'icône de favori par tous les navigateurs.
.
Selon le format choisi pour l'icône et son emplacement, utilisez un lien du type <link rel="icon" type="image/png" href="/img/favicon.
png"/> (format png, mais aussi jpg, gif, etc.
) <link rel="shortcut icon" type="image/x-icon" href="/img/favicon.
ico"/> (format ico Microsoft seul reconnu par Internet Explorer)Note les exemples de codes sont fournis en XHTML.
Vérifier que l'icone s'affiche bien dans la barre d'adresse et/ou les onglets d'un navigateur graphique.
- icone de favori L'icône de favori est au moins proposée au format 32 x 32 pixels.
Permet un affichage correct de l'icone de favori sur tous les systèmes et dans tous les contextes.
.
Réaliser une icône multi-formats en 1616, 3232 et 4848 pixels.
Vérifier que l'icône s'adapte bien en l'affichant en différentes tailles dans l'explorateur de votre système.
Le format (extension du fichier ou lecteur logiciel) des fichiers proposés en téléchargement est indiqué.
permettre aux utilisateurs de savoir si leurs outils leur permettent de consulter les fichiers proposés en téléchargementréduire la charge serveur en évitant les téléchargements inutiles .
Au minimum, prévoir une page indiquant le format des fichiers proposés s'il est unique.
Au mieux, indiquer le format à proximité de chaque lien permettant de télécharger un fichier.
Vérifier que le format des fichiers est indiqué textuellement ou graphiquement (extension en trois lettres ou nom du lecteur logiciel).
Les fichiers en téléchargement sont proposés dans au moins un format dont les spécifications sont publiques.
permettre aux utilisateurs de consulter les fichiers en téléchargment quel que soit leur système et leurs outils .
Proposer les fichiers dans des formats ouverts pour lesquels il existe au moins des lecteurs pour Windows, Linux et Macintosh (par exemple Ogg pour le son et RTF ou PDF pour le texte).
A défaut, utiliser des formats variés (par exemple QuickTime, Real et Windows Media pour la vidéo).
Vérifier qu'il est possible de consulter les fichiers proposés au téléchargement sur des machines utilisant des systèmes d'exploitation différents, notamment Windows, Linux et Macintosh.
La taille des fichiers proposés en téléchargement est indiquée.
informer les utilisateurs sur la quantité de données à télécharger .
Indiquer la taille à proximité de chaque lien permettant le téléchargement d'un fichier.
Vérifier que la taille des fichiers proposés en téléchargement est indiquée à proximité des liens permettant le téléchargement des fichiers.
En cas de rejet des données saisies dans un formulaire, les champs contenant les données rejetées sont indiqués à l'utilisateur.
permettre aux utilisateurs d'identifier les saisies erronées .
Indiquer le nom des champs contenant les données rejetées ou différencier ces champs des autres par un moyen ne se limitant pas à la couleur, en ajoutant une légende si besoin est.
Remplir un champ avec des données fantaisistes et vérifier, si la saisie est rejetée, qu'il est indiqué de manière explicite.
En cas de rejet des données saisies dans un formulaire, toutes les données saisies peuvent être modifiées par l'utilisateur.
Evite à l'utilisateur d'avoir à ressaisir tous les champs et lui permet de vérifier ses saisies originales.
.
Stocker toutes les données saisies dans des variables de session afin de pouvoir les réafficher.
Remplir un champ avec des données fantaisistes et vérifier, si la saisie est rejetée, que le formulaire est réaffiché tel qu'il a été rempli et permet de modifier sa saisie.
Les champs obligatoires des formulaires sont indiqués.
permettre aux utilisateurs de connaitre les informations minimales à saisir dans un formulairelimiter la charge serveur en évitant les envois inutiles .
Indiquer le nom des champs obligatoires ou différencier ces champs des autres par un moyen ne se limitant pas à la couleur, en ajoutant une légende si besoin est.
Ne remplir que les champs indiqués comme obligatoires et vérifier que l’envoi du formulaire est possible.
La taille des polices destinées à l'affichage écran est exprimée en taille variable et non en taille fixe.
permettre aux utilisateurs d'agrandir la taille des polices affichées à l'écran .
Ne pas modifier la taille de la police par défaut ou l'indiquer en utilisant une unité proportionnelle aux réglages de l'utilisateur(em, ex, %) et non avec une unité dépendante du périphérique de consultation (px, pt).
Consulter ce lien Tester la page en changeant la taille de la police dans les principaux navigateurs.
Le nom du site et/ou le nom de l'auteur sont indiqués sur chaque page.
permet une identification immédiate et sans ambiguïté de l'auteur et/ou du site .
Indiquer le nom du site et/ou le nom de l'auteur en clair dans toutes les pages du site (logo, nom de l'entité responsable, nom du site, etc.
) Vérifier que le nom du site et/ou le nom de l'auteur sont présents en clair dans toutes les pages du site.
Le contenu et les services proposés sont décrits sur la page afin d' éviter aux internautes des sauts inutiles et informe sur le contenu du site.
.
Prévoir sur la page d' une information, une phrase, un contenu résumant les contenus et services proposés sur le site.
Vérifier la présence sur la page d' d'une information, d'une phrase, d'un contenu résumant les contenus et services proposés sur le site.
La quantité de données à télécharger pour afficher intégralement la page d' est inférieure à 100 Ko.
minimise le temps de téléchargement pour tous et permet d'atteindre l' du site avec une connection bas-débit ou dégradée .
Limiter la taille des fichiers HTML en favorisant l'utilisation des feuilles de style et en limitant l'utilisation des tables de mise en forme.
Externaliser les éléments qui peuvent l'être (scripts d'interaction, feuilles de style) et optimiser les éléments multimédia.
Utiliser un outil d'analyse de vitesse de chargement de page tel que URL des hyperliens pointant vers un répertoire et non vers une page en particulier se terminent par une barre oblique ("/").
" />.
Les URL des hyperliens pointant vers un répertoire et non vers une page en particulier se terminent par une barre oblique ("/").
évite un aller-retour vers le serveur qui une page et non un dossier.
Diminue en conséquence le temps d'affichage pour l'utilisateur.
.
Les hyperliens pointant vers le répertoire exemple sont du type <a href="http//example.
org/exemple/">.
.
.
</a> et non <a href="http//example.
org/exemple">.
.
.
</a>.
Utiliser le validateur de liens du W3C, qui signale les répertoires non fermés par le caractère / http//validator.
w3.
Les hyperliens de même nature ont des couleurs, des formes et des comportements identiques sur toutes les pages.
permet aux internautes d'identifier les liens sur l'ensemble du site, facilite et accélère la navigation .
Appliquer des attributs communs de style, de couleur, de graisse, de casse, de soulignement à des ensemble de liens de même nature.
L'utilisation de feuilles de style est une solution recommandée pour améliorer l'homogènïté et l'évolutivite des modes de présentation.
Vérifier que les liens de même nature (différents menus, liens texte, groupes de liens.
.
.
) ont des présentations similaires sur l'ensemble du site.
hyperliens Les hyperliens sont visuellement différenciés du reste du contenu.
permet aux utilisateurs d'identifier facilement les liens .
Les hyperliens peuvent être différenciés à l'aide des propriétés CSS de couleur de texte, de couleur d'arrière-plan, de soulignement, de mise en gras, de bordures, de police de caractères, etc.
Afin qu'un lien puisse être différencié du contenu par les personnes souffrants d'un déficit de perception des couleurs, ou en l'absence de restitution des couleurs prévues, il est nécessaire d'utiliser simultanéement un deuxième procédé de différenciation indépendant de la couleur.
Vérifier le rendu visuel dans un navigateur graphique.
Tous les hyperliens internes du site sont valides.
prévenir les erreurs 404 et les interruptions qui en découlent dans la navigation .
S'assurer que l'outil utilisé pour la rédaction des contenus possède une gestion satisfaisante et cohérente des hyperliens internes.
Si ce n'est pas le cas, lancer régulièrement un contrôle de la validité de l'ensemble des liens du site.
Utiliser un validateur de liens tel que celui proposé par le W3C La navigation reste possible sur l'ensemble du site en utilisant exclusivement le clavier.
permettre la navigation aux utilisateurs ne pouvant pas manipuler une souris .
Eviter de gérer les éléments de navigation avec des technologies ne supportant pas le clavier comme Flash ou Java.
Au besoin, recourir aux attributs tabindex et accesskey pour améliorer l'ergonomie.
Tester le site en n'utilisant que le clavier.
- hyperliens Les hyperliens internes et externes sont différenciés.
prévenir clairement l'internaute des conditions dans lequel il va quitter le service en ligne qu'il visite.
.
Il est possible d'ajouter l'information dans le du lien ou dans le titre du lien, dans le comportement du lien (ouverture dans une nouvelle fenêtre).
Consulter la discussion suivante sur le forum La creation de site internet.
orgVérifier que les liens internes et externes sont différenciés - hyperliens La langue principale utilisée sur les pages cibles des hyperliens est précisée lorsqu'elle diffère de celle de la page d'origine.
avertir l'utilisateur des liens en langue étrangère et minimiser les risques de clics inutiles.
.
Utiliser l'attribut hreflang pour marquer la langue primaire du document cible.
Pour faire ressortir cette information sur les clients qui ne la restitue pas directement à l'utilisateur, il peut être envisageable d'utiliser - parmi toutes autres solutions - les CSS couplés ou non à la duplication de cette information dans l'attribut title.
Vérifier que les liens vers des sites dont la langue primaire est étrangère sont marqués comme tels.
Les hyperliens texte visités et non visités sont différenciés.
permet à l'internaute d'identifier les s déjà visitées .
Aucune solution technique n'a été rédigée pour l'instant Aucun moyen de contrôle n'a été rédigé pour l'instant .
Le nom d'un responsable des contenus est indiqué sur le site.
permet d'identifier une personne physique qui pourra effectuer d'éventuelles corrections, suppressions ou ajouts sur les contenus proposés .
Indiquer le nom d'une personne physique responsable des contenus sur le site.
Vérifier la présence sur le site d'une personne physique responsable des contenus sur le site.
identification Les conditions de vente et/ou d'utilisation sont accessibles depuis toutes les pages.
Permet un accès facile et permanent à toutes les conditions de réalisation du service.
.
Faire figurer sur toutes les pages un lien pointant vers la page spécifique présentant les conditions de vente et/ou d'utilisation.
Vérifier la présence sur toutes les pages d'un lien pointant vers la page présentant les conditions de vente et/ou d'utilisation.
Le site propose au moins un moyen de er le modérateur des espaces publics.
permet aux utilisateurs de signaler des abus et de faire effectuer des corrections .
Par exemple, indiquer l'adresse e-mail du modérateur ou mettre en place un formulaire permettant de le er.
Vérifier qu'il est possible de er le modérateur via le(s) mode(s) de proposé(s).
identification Les tribunaux compétents en cas de litige sont indiqués dans les conditions de vente et/ou d'utilisation.
indiquer aux utilisateurs les conditions dans lesquelles peuvent d'exercer des actions juridiques.
.
Indiquer les tribunaux compétents en cas de litige dans les conditions de vente et/ou d'utilisation.
Vérifier la présence de cette indication dans les conditions de vente et/ou d'utilisation.
Le site propose au moins un moyen de er l'auteur et/ou le webmestre.
permettre un retour d'information de la part des utilisateurs .
Par exemple, indiquer l'adresse e-mail de l'auteur et/ou du webmestre ou mettre en place un formulaire permettant de le(s) er.
Vérifier qu'il est possible de er l'auteur et/ou le webmestre via le(s) mode(s) de proposé(s).
Le site propose plus de deux moyens de er l'auteur et/ou le webmestre.
optimiser les possibilités de retour d'information de la part des utilisateurs.
.
Par exemple, indiquer l'adresse e-mail et postale de l'auteur et/ou du webmestre et mettre en place un formulaire permettant de le(s) er.
Vérifier qu'il est possible de er l'auteur et/ou le webmestre via les modes de proposés.
La signification des acronymes, sigles et abréviations est explicitée lors de leur première occurrence dans le corps de chaque page.
expliciter la signification des sigles et abréviationspermettre l'affichage d'infos-bulles .
Les acronymes, sigles et abréviations sont identifiés par les éléments <abbr> et/ou <acronym>.
Lors de leur première occurence, leur attribut title est renseigné avec la signification du sigle.
La langue du sigle peut-être précisée à l'aide des attributs lang (en HTML) et/ou xmllang (en XHTML) lorsqu'elle est différente de la langue de traitement par défaut du document.
Par exemple <abbr title="HyperText Markup Language" lang="en">HTML</abbr> Vérifier l'apparition d'une info-bulle dans un navigateur graphique au survol de l'acronyme, du sigle ou de l'abbréviation.
Si le site comporte plus de 15 pages de contenu textuel, un moteur de interne est accessible depuis toutes les pages.
permet aux utilisateur d'effectuer une par mots-clés sur le contenu du site, accélère s'ils existent la vitesse d'accès aux contenus recherchés .
Choisir une solution ou un outil d'indexation du contenu du site.
Quelques exemples classées dans ce dossier du Journal du Net Effectuer les opérations d'installation ou de souscription.
Installer le formulaire de correspondant sur le site.
Vérifier la présence du formulaire sur le site et vérifier son fonctionnement en testant avec un mot-clé présent sur le site.
Sauf opération irréversible spécifiée, les boutons de navigation (précédent, suivant) permettent le déplacement dans l'historique des pages.
permet à l'utilisateur d'utiliser le bouton back du navigateur en toutes conditions .
Ne pas utiliser de rafraichissement instantané des pages (meta refresh="0") Vérifier le fonctionnement du bouton back du navigateur sur tout le site (ou un ensemble de pages représentatives) .
Les hyperliens internes ne pointent pas vers des pages en construction.
Eviter des clics inutiles aux utilisateurs.
Limiter la bande passante.
proposer du contenu à valeur ajoutée .
Lors de la mise en place de nouvelles pages ou s, aucun lien vers celles-ci n'est mis en place dans la partie publique du site avant leur achèvement complet.
Aucun moyen de contrôle n'a été rédigé pour l'instant 6363 navigation La consultation et la navigation sont possibles sur un écran configuré en 256 couleurs.
améliore la compatibilité avec les différentes interfaces de restitution et permet d'anticiper des difficultés pour des utilisateurs déficients .
Prévoir des couleurs suffisamment contrastées pour les menus, les zones de texte, les fonds de page, les liens.
Configurer son écran en 256 couleurs et vérifier que la navigation reste possible sur tout le site.
L'utilisateur peut reprendre la navigation immédiatement après l'envoi d'un formulaire, sans avoir à recourir au bouton précédent de son navigateur.
éviter les pages "cul-de-sac" et la désorientation des utilisateurs .
Au minimum, intégrer le menu principal de navigation du site dans la page vers lequel conduit le formulaire.
Intégrer éventuellement des liens complémentaires permettant de reprendre directement la navigation.
Vérifier que la page cible du formulaire contient au minimum le menu principal de navigation du site.
Les icônes de navigation sont accompagnées d'une légende explicite.
éviter aux nouveaux utilisateurs de r le sens d'une icône, améliore l' .
La nature de la cible de chaque icône-lien est précisée par l'attribut alt de l'image et par l'attribut title du lien, sous la forme <a href="/" title=""> <img src="home.
png" alt=""></a><a href="/carte/" title="Carte"> <img src="map.
png" alt="Carte"></a><a href="mailtoJohn.
Doe@example.
com" title="John.
Doe@example.
com"> <img src="letter.
png" alt="John.
Doe@example.
com"></a> Vérifier la présence de l'attribut title au survol du lien dans un navigateur graphique.
Vérifier la présence et la pertinence de l'attribut alt en désactivant l'affichage des images.
Il est possible de revenir à la page d' depuis toutes les pages.
fournir une solution simple de réorientation en cas de difficulté de navigation ou en cas d'arrivée directe sur une page secondaire du site .
Prévoir un lien vers la page d' sur chaque page du site.
Veiller à ce que ce lien soit de préférence toujours au même endroit.
Si vous placez un logo, veillez également à ce qu'il soit cliquable et revienne vers l'.
Vérifier qu'il est possible de revenir à la page d' depuis toutes les pages du site.
L'ordre de présentation des s de navigation est identique sur toutes les pages.
fournir aux utilisateurs des repères permanents et stables pour naviguer et se repérer dans le site .
Utiliser pour chaque page du site une structure de menu et des intitulés de s constants.
Vérifier la permanence de structure et d'intitulés des menus de navigation à travers le site Si la totalité des pages du site n'est pas directement accessible depuis le menu de navigation, un est accessible depuis toutes les pages.
fournir aux utilisateurs une solution en cas de désorientation, pour naviguer et se repérer dans le site, pour visualiser l'ensemble des contenus et la taille du site.
Incite les administrateurs à représenter graphiquement et à rationaliser leur contenu.
.
Le plan de site répertorie la totalité des pages du site sous forme d'une liste de liens textuels explicites.
Celle-ci est structurée de manière à refléter l'organisation des s du site, à l'aide d'éléments de titre et d'éléments de liste.
Vérifier la présence du plan de site et du lien vers celui-ci dans chaque page du site.
Le site n'emploie pas la technique des frames.
améliorer la consultation et la navigation pour les personnes handicapéeséviter les problèmes d'impression ou de mise en favorisaméliorer le référencement en évitant l'indexation de pages orphelines .
Ne pas utiliser les éléments HTML frameset, frame et noframe.
Dans un navigateur, afficher la source de la page en utilisant le menu principal (menu affichage>code source).
Regarder le code source de la page à la d'éléments frameset, frame et noframe.
L'emplacement du menu principal de navigation est identique sur toutes les pages.
fournir aux utilisateurs des repères permanents et stables pour naviguer et se repérer dans le site .
Conserver le même positionnement à l'écran des menus de navigation sur l'ensemble du site.
Vérifier que les menus de navigation sont affichés pour l'ensemble du site aux mêmes emplacements à l'écran.
L'utilisateur est informé sur chaque page de la position de cette dernière dans la structure du site.
permet à l'utilisateur de se repérer dans l'architecture, faciliter la navigation et la d'information.
.
Proposer une navigation de type "fil d'Ariane" reprenant - sous forme de liens - les x d'arborescence parcourus entre la page courante et l' du site.
Cette navigation peut par exemple prendre la forme d'un chemin du type " > > Sous-".
Vérifier que la position de chaque page est clairement indiquée.
Le nombre de polices utilisées sur le site est inférieur ou égal à trois (sauf présentation de travaux ou produits graphiques).
permet d'alléger l'aspect graphique des pages du site et facilite leur lecture .
Limiter à 3 pour l'ensemble des pages du site le nombre de familles de polices utilisées dans les feuilles de styles ou les attributs de présentation HTML.
Aucun moyen de contrôle n'a été rédigé pour l'instant .
Si la consultation ou l'utilisation de certains contenus nécessite un plug-in, la taille du fichier à télécharger est précisée.
Informer l'utilisateur de la quantité de données à télécharger et du temps nécessaire pour s'équiper des modules nécessaires à la visualisation .
Indiquer la taille du fichier dans le du lien de téléchargement du plug-in.
Vérifier que la taille de chaque plug-in nécessaire à la consultation ou l'utilisation des contenus et proposé en téléchargement est précisée.
Si la consultation ou l'utilisation de certains contenus nécessite un plug-in, un lien de téléchargement ou d'information sur ce dernier est proposé.
permet aux utilisateurs de télécharger les modules nécessaires à la visualisation .
Proposer un lien de téléchargement ou d'information sur chaque plug-in nécessaire à la consultation ou l'utilisation des contenus.
Vérifier la présence d'un lien de téléchargement ou d'information sur chaque plug-in nécessaire à la consultation ou l'utilisation des contenus.
Sauf avertissement préalable, la quantité de données à télécharger pour afficher une page est inférieure à 150 Ko.
minimise le temps de téléchargemenent, facilite la navigation avec des connections en bas-débit ou dégradées, inciter les administrateurs à alléger leur pages et à avertir les utilisateurs en cas de dépassement .
Intégrer cette limite en cours de développement et utiliser des outils fournissant l'indication de la taille des pages.
Proposer des miniatures pour les images, indiquer la taille des pages cibles lorsqu'elles sont de taille importante.
Vérifier les pages du site en enregistrant la page sur votre ordinateur et en vérifiant le poids total des éléments devant être téléchargés.
Il est également possible d'utiliser des outils automatique de mesure (gratuit et anonyme pour une page)Cette liste devra être complétée.
Aucun objet multimédia de plus de 50 ko (image ou autre) n'est envoyé sans avertissement préable, prévisualisation ou affichage progressif.
évite d'imposer à l'utilisateur un téléchargement sans l'en avoir averti préalablement.
.
Pour les objets multimedia de taille supérieure à cette limite, il est possible par exemple de - proposer des miniatures ou des prévisualisations de tailles moins importantes.
- Indiquer la taille des fichiers à télécharger à proximité ou dans le des liens.
- de proposer une barre de progression du téléchargement et de permettre l'interruption de celui-ci.
Vérifier que les objets multimedias éventuels ne sont pas envoyés sans avertissement, prévisualisation, ou affichage progressif.
Les entêtes envoyés par le serveur contiennent les informations relatives au jeu de caractères employé.
Permet au navigateur de choisir le bon encodage des caractères pour afficher la page.
.
Le paramètre charset de l'entête HTTP content-type est renseigné sous la forme Content-Type text/html; charset=iso-8859-1, en fonction du jeu de caractère effectivement utilisé par le document et de son type Mime.
Le W3C a publié deux tutoriels sur cette question The HTTP charset parameter ;Character encodings.
Vérifier la présence du charset dans le champ Content-Type renvoyé par le serveur - navigation La charte graphique est cohérente sur l'ensemble des pages ou des sections du site.
permet une homogénéïté et une continuïté dans la visite et la navigation, et permet une identification permanente du service en ligne visité.
.
Utiliser au maximum des feuilles de styles communes à tout le site, ce qui par rebond améliore la cohérence globale de tout le site.
Vérifier que le site utilise des éléments communs à toutes les pages, en portant notamment une attention particulière à la présence et à l'emplacement des menus de navigation, à la couleur des sections du site, à la largeur des pages, et à la cohérence de la charte globale utilisée pour les titres et pour les textes.
Le serveur envoie une page d'erreur 404 personnalisée.
informe l'utilisateur sur l'erreur rencontrée, sur la continuité de fonctionnement du serveur, et met hors de cause la connection de l'utilisateur .
Modifier la configuration du serveur Web pour renvoyer l'utilisateur vers une page personnalisée lorsque la ressource demandée n'existe pas.
Si la configuration principale du serveur n'est pas directement accessible et si l'environnement le permet, utiliser une configuration locale par répertoire.
Par exemple, l'environnement Apache autorise la création d'un fichier .
htaccess contenant des directives relatives aux traitements des erreurs ErrorDocument 404 /mapage.
html Modifier un URL afin d'obtenir une erreur 404 et valider que la page retournée correspond à une page personnalisée.
publicité est identifiée comme telle.
permettre aux utilisateurs de différencier la publicité du reste du contenu .
Identifier les publicités par une mention permettant de les identifier (publicité, pub, partenariats.
.
.
)Dans la mesure du possible séparer graphiquement la publicité du reste du contenu.
Vérifier que tous les espaces dédiés à la publicité comportent une mention permettant de les identifier sans ambiguïté.
référencement et statistiques La racine ou les pages du site contiennent des instructions pour les robots d'indexation.
permettre un référencement cibléaméliorer le guidage pour les outils de .
Pour définir les répertoires, fichiers ou types de fichiers non indexables, utiliser les instructions User-agent et Disallow dans un fichier texte unique appelé robots.
txt placé dans le répertoire racine du site.
Voir à ce sujet A Standard for Robot ExclusionAlternativement, pour agir au d'une page spécifique, utiliser dans celle-ci la balise <meta name="robots" content="attribut1,attribut2"> où attribut1 peut prendre les valeurs index (indexer cette page) ou noindex (ne pas indexer cette page) ; attribut2 peut prendre les valeurs follow (suivre les liens contenus dans cette page) ou nofollow (ne pas suivre les liens) ; Validateur de robots.
txt- référencement et statistiques Les informations relatives à l'audience et à la fréquentation du site sont accompagnées de la période couverte et du mode de mesure.
permet une interprétation correcte des données et chiffres proposés.
.
Indiquer les chiffres d'audience et de fréquentation en précisant la période couverte et le mode de mesure.
Vérifier que tous les chiffres de fréquentation et d'audience présentés comportent la période couverte et le mode de mesure.
Chaque page comporte un titre significatif et représentatif du contenu du site.
permet de faciliter l'identification du site par les utilisateurs en cours de navigation, dans les favoris, et par les outils de .
Remplir l'élément HTML <TITLE> </TITLE> de chaque page avec un contenu qui permet au moins de connaître le nom du site (cas idéal voir bonne pratique N°87) Vérifier sur les pages du site que le titre de chacune d'elles permet de connaître le nom du site.
Chaque page comporte un titre significatif et représentatif de son contenu.
permet de faciliter l'identification des pages par les utilisateurs en cours de navigation, dans les favoris, et par les outils de .
Remplir l'élément HTML Title de chaque page avec un contenu qui permet d'identifier sans ambiguïté le contenu de la page Vérifier sur les pages du site que le titre de chacune d'elles permet d'en connaître le contenu.
Les URL internes du site ne contiennent pas d'espaces.
" /> .
Les URL internes du site ne contiennent pas d'espaces.
éviter les appels de pages contenant des caractères de remplacement et les erreurs de fonctionnement liées .
Ne pas utiliser d'espaces dans les URL internes du site.
Vérifier que les URL internes du site ne contiennent pas d'espaces.
L'extension du nom de domaine (.com, .org, .net, etc.) est cohérente avec l'activité, la zone géographique couverte ou le statut de l'auteur.
permet de faciliter la mémorisation de l'URL .
Utiliser un nom de domaine cohérent avec l'activité, la zone géographique couverte ou le statut de l'auteur.
Vérifier que le nom de domaine est cohérent avec l'activité, la zone géographique couverte ou le statut de l'auteur.
Le code source des pages contient les informations relatives au jeu de caractères employé.
permettre un affichage hors-ligne correct des pages en indiquant au navigateur le jeu de caractères utilisé .
L'élément est renseigné en fonction de l'encodage effectif du document et de son type Mime sous la forme <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> en HTML ; <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> ou <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=ISO-8859-1" /> en XHTML.
Le W3C et le WASP ont publiés respectivement deux tutoriels sur cette question Character encodings ;Specifying Character Encoding.
Regarder le code source et chercher l'élément HTML meta.
La longueur du nom de domaine est inférieure à 30 caractères.
améliore la mémorisation de l'URL et limite les risques d'erreur, facilite la frappe directe de l'URL sans passer par un lien ou un outil de .
Choisir un nom de domaine (syntaxe) dont le nombre de caractères de la partie domaine est inférieur à 30.
Compter les caractères du domaine où domaine est entendu par la syntaxe suivante http//www.
domaine.
eL'adresse du site fonctionne avec ou sans préfixe www.
permet aux utilisateurs de rejoindre la page d' du site même lorsqu'il oublie de taper le préfixe WWW .
Configurer le serveur de façon à ce qu'il gère les adresses sans www (acheminement) Vérifier l'équivalence des adresses. http//www.
domaine.
Le nom de l'auteur, de l'entité ou de la société est indiqué.
Permet d'identifier immédiatement l'auteur du site.

Indiquer le nom de l'auteur, de l'entité ou de la société proposant le service.
Vérifier que le nom de l'auteur, de l'entité ou de la société proposant le service est indiqué.
Les coordonnées postales, téléphoniques et électroniques de la représentation locale ou du siège social sont indiquées.
permettre aux utilisateurs de savoir où est basée l'entité et s'il existe une représentation locale .
Indiquer les coordonnées postales, téléphoniques et électroniques de la représentation locale ou du siège social.
Vérifier que les coordonnées postales, téléphoniques et électroniques de la représentation locale ou du siège social sont indiquées.
Le numéro d'immatriculation délivré à la société ou association au terme des procédures légales d'enregistrement en vigueur dans son pays est indiqué.
donne un élément supplémentaire relatif à l'existence officielle de la structure qui propose le service .
Indiquer le numéro d'immatriculation délivré à la société ou association au terme des procédures légales d'enregistrement en vigueur dans son pays.
Vérifier que le numéro d'immatriculation délivré à la société ou association au terme des procédures légales d'enregistrement en vigueur dans son pays est indiqué.
La nature et les caractéristiques quantifiables des produits et services (dimensions, durée, contenance, etc.
) sont indiquées.
permet aux utilisateurs d'identifier précisément la nature et les spécifications des produits proposés .
Indiquer sur le site les informations relatives à la nature ainsi qu'aux caractéristiques des produits et services proposés.
Vérifier la présence sur le site des informations relatives à la nature ainsi qu'aux caractéristiques des produits et services proposés.
La date limite de consommation des denrées périssables est indiquée.
couplée au délai de livraison , permet aux utilisateurs d'identifier la durée réelle au cours de laquelle il pourront utiliser le produit commandé .
Indiquer sur le site les informations relatives aux dates limites de consommation des produits périssables.
Vérifier sur le site la présence des informations relatives aux dates limites de consommation des produits périssables.
Aucune solution technique n'a été rédigée pour l'instant Aucun moyen de contrôle n'a été rédigé pour l'instant .
La date limite de consommation des denrées périssables est indiquée.
couplée au délai de livraison , permet aux utilisateurs d'identifier la durée réelle au cours de laquelle il pourront utiliser le produit commandé .
Indiquer sur le site les informations relatives aux dates limites de consommation des produits périssables.
Vérifier sur le site la présence des informations relatives aux dates limites de consommation des produits périssables.