Skip to content. Skip to navigation
You are here: Home Base de connaissances Les règles d'accessibilité Les règles 1.0 Navigation

Navigation

by admin last modified 2008-10-03 10:30

Liste des points de contrôle

Fournir des informations concernant l'organisation d'un site. 13.3 (P2)

WCAG 1.0, traduction française d'AccessibilitéWeb

Fournir des informations concernant la mise en page générale d'un site. (p. ex. le plan d'un site, ou une table des matières).

Section 508 version anglaise

[No equivalent.]

WCAG 2.0 version de travail, traduction française d'AccessibilitéWeb

  • 2.4.5 (niveau AA)
    Plusieurs manières :
    Plus d’une manière est offerte pour localiser une page Web dans un ensemble de pages, sauf quand cette page Web est le résultat ou une étape d’un processus.

Projet de standard du gouvernement du Québec

  • 01 - 10, f : Le volet informatif d’un site Web comportant un menu de navigation de plus d’un niveau doit inclure le plan du site Web.
  • 01 - 10, g : Le plan du site Web doit permettre d'accéder aux éléments principaux des trois premiers niveaux de navigation du site.
  • 01 - 10, h : Si un site Web comporte un plan du site, toute page Web informative de ce site doit inclure un lien vers le plan du site.

RGAA

13.3 Fournir des informations sur l'architecture générale du site

  • Test 13.3.1 : Présence d'une page plan du site.
  • Test 13.3.2 : Plan du site fonctionnel.
  • Test 13.3.3 : Plan du site accessible depuis la page d'accueil.
  • Test 13.3.4 : Présence d'un fil d'ariane

AccessiWeb

  • Fiche 9.3 : Y a-t-il un plan du site ?
  • Fiche 9.4 : Y a-t-il une page d'aide expliquant les principes de navigation à l'intérieur du site ?
  • Fiche 9.6 : Y a-t-il un moteur de recherche interne au site ?

Clientèles visées

  • Personnes ayant une incapacité visuelle.
  • Personnes ayant une incapacité motrice.
  • Personnes ayant une incapacité cognitive.

Explication

Le plan du site est une aide à la navigation et à la compréhension de l'organisation générale d'un site. Le plan du site doit donner accès à tout le contenu du site, directement ou indirectement. En fait, sur un site comptant un nombre important de pages, on peut limiter le plan du site aux trois premiers niveaux de navigation.

Un lien vers le plan du site devrait être offert sur chaque page.

Une page longue nécessitant le défilement sur plus de 3 écrans de hauteur devrait aussi offrir un menu de navigation interne à la page.

Voir aussi Multiple Ways in WCAG 2.0.

Utiliser les mécanismes de navigation de manière cohérente. 13.4 (P2)

WCAG 1.0, traduction française d'AccessibilitéWeb

Utiliser les mécanismes de navigation de manière cohérente.

Section 508 version anglaise

[No equivalent.]

WCAG 2.0 version de travail, traduction française d'AccessibilitéWeb

  • 3.2.3 (niveau AA)
    Navigation cohérente :
    Dans un ensemble de pages Web, les mécanismes de navigation qui se répètent sur plusieurs pages se présentent dans un ordre relatif similaire chaque fois qu’ils sont répétés, à moins qu’un changement soit initié par l’utilisateur.
  • Erreur à éviter :

    • F66 : Présenter les liens dans un ordre relatif différent sur différentes pages.
  • 3.2.4 (niveau AA)
    Identification cohérente :
    Dans un ensemble de pages Web, les composants qui ont une fonctionnalité similaire sont identifiés de la même façon.
  • Erreur à éviter :

    • F31 : Utiliser deux étiquettes différentes pour la même fonction sur des pages différentes dans un même ensemble de pages.

Projet de standard du gouvernement du Québec

  • 01 - 10, c : Indépendamment de l'affichage horizontal, vertical ou autre :
    • un menu de navigation est balisé sous la forme d’une liste ;
    • une liste de menus est indiquée à l’aide de l’une des balises <ul> ou <ol>.
    • si un menu présente des niveaux inférieurs, un maximum de deux niveaux inférieurs est permis.
    • les niveaux inférieurs d’un menu sont présentés dans des listes imbriquées.
    • un menu déroulant non persistant doit éviter d'afficher un sous-menu en cascade de second niveau.
  • 01 - 10, i et 03 - 12, f : Un menu de navigation répété de page en page doit être organisé dans le même ordre relatif et dans une présentation similaire.
  • 01 - 10, k : À l’exclusion d’un communiqué de presse, d’une allocution ou d’une décision judiciaire ou administrative, une page Web longue doit contenir un menu de navigation interne à la page au début de celle-ci.
  • 01 - 10, o : À l’exclusion d’un intranet, d’un extranet, d’une application Web ou d’un lecteur multimédia, l’utilisation de raccourcis clavier doit être évitée.

RGAA

13.4 Fournir des mécanismes de navigation cohérents

  • Test 13.4.1 : Cohérence de la position des menus et barres navigation dans le code source de la structure HTML.
  • Test 13.4.2 : Cohérence de la présentation des menus et barres de navigation.
  • Test 13.4.3 : Comportement homogène des menus et barres de navigation.

AccessiWeb

  • Fiche 2.9 : Y a-t-il un maximum de trois cadres dans la page ?
  • Fiche 9.5 : À partir de n'importe quelle page du site, la page d'aide est-elle atteignable de manière identique ?
  • Fiche 9.7 : À partir de n'importe quelle page du site, le moteur de recherche est-il atteignable de manière identique ?
  • Fiche 12.1 : La navigation dans l'ensemble des pages du site est-elle cohérente ?
  • Fiche 12.2 : Le menu principal de navigation interne dans le site est-il toujours présent à la même place dans les pages ?
  • Fiche 12.4 : Y a-t-il des liens facilitant la navigation dans la page ?
  • Fiche 12.6 : Si des raccourcis clavier ont été définis dans le site, sont-ils actifs dans la page ?
  • Fiche 13.13 : La page fait-elle au maximum 3 écrans en résolution 1024*768 si aucune navigation interne n'est prévue

Clientèles visées

  • Personnes ayant une incapacité visuelle.
  • Personnes ayant une incapacité cognitive.

Explication

La cohérence des mécanismes de navigation est essentielle à la navigation et à la compréhension d'un site.

Ce devrait être un acquis aujourd'hui.

Voir aussi Language of Parts in WCAG 2.0 et Abbreviations in WCAG 2.0.

Éviter de créer des pages s'actualisant automatiquement. 7.4 (P2)

WCAG 1.0, traduction française d'AccessibilitéWeb

Jusqu'à ce que les agents-utilisateurs permettent de stopper les actualisations, éviter de créer des pages s'actualisant automatiquement.

Section 508 version anglaise

[No equivalent.]

WCAG 2.0 version de travail, traduction française d'AccessibilitéWeb

  • 2.2.1 (niveau A)
    Limite de temps ajustable :
    Toute limite de temps fixée par le contenu, répond à l’une des conditions suivantes :
    • Désactivation :
      l’utilisateur a la possibilité de désactiver cette limite de temps avant qu’elle soit rencontrée;
      Ajustement :
      l’utilisateur a la possibilité d’ajuster la limite de temps avant qu’elle soit rencontrée sur une échelle d’au moins dix fois la longueur du délai fixé par défaut;
    • Extension :
      l’utilisateur est averti avant l’expiration du délai et dispose d’au moins 20 secondes pour étendre le délai à l’aide d’une action simple (par exemple, « appuyer sur la barre d’espacement ») et l’utilisateur est autorisé à demander une telle extension au moins dix fois;
    • Exception de temps réel :
      la limite de temps est partie intégrante d’un événement en temps réel (une enchère, par exemple) et il n’y a pas de solution de rechange à ce délai;
    • Exception essentielle :
      le délai est essentiel ne peut être étendu sans invalider l’activité;
      Exception des 20 heures :
      La limite de temps fixée est d’une durée de plus de 20 heures.
    • Erreur à éviter :

      • F40 : Utiliser meta redirect avec une limite temporelle.
      • F41 : Utiliser meta refresh avec une limite temporelle.
      • F58 : Utiliser une technique côté serveur pour effectuer une redirection automatique après un délai fixé.
      • F16 : Un contenu défilant qui n'est pas essentiel à l'activité sans un mécanisme pour figer et redémarrer le défilement.

Projet de standard du gouvernement du Québec

  • 01 - 10, d : Une page Web qui s'actualise automatiquement doit :
    • soit permettre à l’utilisateur de désactiver cette fonctionnalité,
    • soit lui donner la possibilité de multiplier jusqu’à dix fois l'intervalle d'actualisation.
  • 03 - 12, e : Une animation qui s'actualise automatiquement doit permettre à l’utilisateur de désactiver cette fonctionnalité ou lui donner la possibilité de multiplier jusqu’à dix fois l'intervalle d'actualisation.

RGAA

7.4 Ne pas rafraîchir automatiquement les pages

  • Test 7.4.1 : Absence de rafraîchissement automatique.
  • Test 7.4.2 : Absence de code javascript provoquant un rafraîchissement de la page.
  • Test 7.4.3 : Absence d'éléments provoquant un rafraîchissement de la page.

AccessiWeb

Fiche 13.1 : L'utilisateur a t-il le contrôle du rafraîchissement ?

Clientèles visées

  • Personnes ayant une incapacité visuelle.
  • Personnes ayant une incapacité cognitive.

Explication

L'actualisation automatique de la page est interprétée par les logiciels de lecture d'écran comme le chargement d'une nouvelle page, ce qui entraîne la relecture de la page à partir du début. Cela s'applique également à l'actualisation automatique d'un cadre de la page, car le logiciel de lecture d'écran considère la page dans son ensemble.

Si vous devez absolument inclure ce type de fonction, donnez un moyen pour désactiver l'actualisation automatique.

Voir aussi Timing in WCAG 2.0, Timing (not essential) in WCAG 2.0, Interruptions in WCAG 2.0 et Re-authenticating in WCAG 2.0.

Rediriger les pages sans délai pour l'utilisateur. 7.5 (P2)

WCAG 1.0, traduction française d'AccessibilitéWeb

Jusqu'à ce que les agents utilisateurs fournissent la possibilité de stopper l'autoredirection, ne pas utiliser de balisage permettant la redirection automatique des pages. À la place, configurer le serveur pour effectuer les redirections.

Section 508 version anglaise

[No equivalent.]

WCAG 2.0 version de travail, traduction française d'AccessibilitéWeb

  • 3.2.5 (niveau AAA)
    Changement sur demande :
    un changement de contexte est initié seulement sur demande de l’utilisateur ou un mécanisme est disponible pour désactivé un tel comportement.
  • Erreur à éviter :

    • F60 : Ouvrir automatiquement une nouvelle fenêtre quand l’utilisateur saisit du texte dans un champ.
    • F61 : Changer complètement le contenu principal de la page par une mise à jour automatique qu’un utilisateur ne peut désactiver à partir de ce contenu.
    • F9 : Changer le contexte quand l’utilisateur déplace la zone active hors d’un champ de formulaire.
    • F22 : Ouvrir une nouvelle fenêtre qui n’a pas été demandée par l’utilisateur.
    • F41 : Utiliser meta refresh avec une limite temporelle.

Projet de standard du gouvernement du Québec

  • 01 - 10, e : Toute redirection automatique doit être gérée :
    • soit du côté serveur,
    • soit par l’utilisation de la balise <meta HTTP-EQUIV =Refresh> avec l’attribut
      content dont la valeur est « 0 » (zéro).

RGAA

7.5 Ne pas placer de redirections automatiques à partir des pages

  • Test 7.5.1 : Absence de redirection automatique.
  • Test 7.5.2 : Absence de code javascript provoquant une redirection automatique de la page.
  • Test 7.5.3 : Absence d'éléments provoquant une redirection de la page.

AccessiWeb

Fiche 13.2 : Si une redirection automatique est présente, s'effectue-t-elle sans l'intermédiaire d'un script ?

Clientèles visées

  • Personnes ayant une incapacité visuelle.
  • Personnes ayant une incapacité cognitive.

Explication

La redirection automatique peut être déroutante parce qu'elle ne laisse pas à certains utilisateurs le temps nécessaire à la lecture complète de la page. Il vaut donc mieux gérer la redirection par le serveur.

Si vous devez passer par une page de redirection, offrez un lien vers la nouvelle page que l'utilisateur pourra activer à sa convenance lorsqu'il aura eu le temps de prendre connaissance de votre message.

Voir aussi Change on Request in WCAG 2.0.

Fournir des barres de navigation. 13.5 (P3)

WCAG 1.0, traduction française d'AccessibilitéWeb

Fournir des barres de navigation pour mettre en valeur et donner accès aux mécanismes de navigation.

Section 508 version anglaise

[No equivalent.]

WCAG 2.0 version de travail, traduction française d'AccessibilitéWeb

2.4.5 (niveau AA)
Plusieurs manières :
Plus d’une manière est offerte pour localiser une page Web dans un ensemble de pages, sauf quand cette page Web est le résultat ou une étape d’un processus.

Projet de standard du gouvernement du Québec

  • 01 - 10, f.
    • 01 - 10, g.
    • 01 - 10, h.
    • 03 - 12, c : Les éléments de navigation doivent être utilisables avec les technologies d’adaptation informatiques et donner accès à tout le contenu informatif dans un ordre séquentiel

    RGAA

    13.5 Proposer une barre ou un menu de navigation

    • Test 13.5.1 : Présence de menus ou de barres de navigation.
    • Test 13.5.2 : Présentation spécifique des barres et menus de navigation.

    AccessiWeb

    • Fiche 2.9 : Y a-t-il un maximum de trois cadres dans la page ?
    • Fiche 9.5 : À partir de n'importe quelle page du site, la page d'aide est-elle atteignable de manière identique ?
    • Fiche 9.7 : À partir de n'importe quelle page du site, le moteur de recherche est-il atteignable de manière identique ?
    • Fiche 12.1 : La navigation dans l'ensemble des pages du site est-elle cohérente ?
    • Fiche 12.2 : Le menu principal de navigation interne dans le site est-il toujours présent à la même place dans les pages ?
    • Fiche 12.4 : Y a-t-il des liens facilitant la navigation dans la page ?
      Fiche 12.6 : Si des raccourcis clavier ont été définis dans le site, sont-ils actifs dans la page ?
    • Fiche 13.13 : La page fait-elle au maximum 3 écrans en résolution 1024*768 si aucune navigation interne n'est prévue ?

    Clientèles visées

    • Personnes ayant une incapacité visuelle.
    • Personnes ayant une incapacité motrice.
    • Personnes ayant une incapacité cognitive.

    Explication

    Les liens de navigation doivent être mis en valeur pour bien les distinguer du contenu de la page.

    Ce devrait être un acquis aujourd'hui.

    Voir aussi Technique 13.5 in WCAG 1.0.

    Fournir de l'information à propos des ensembles de documents. 13.9 (P3)

    WCAG 1.0, traduction française d'AccessibilitéWeb

    Fournir de l'information à propos des ensembles de documents (i.e., des documents comprenant plusieurs pages.).

    Section 508 version anglaise

    [No equivalent.]

    WCAG 2.0 version de travail, traduction française d'AccessibilitéWeb

    2.4.8 (niveau AAA)
    Localisation :
    Dans un ensemble de pages Web, l’information sur la localisation de l’utilisateur est disponible.

    1.3.1 (niveau A)
    Information et relations :
    L’information, la structure et les relations véhiculées par la présentation peuvent être déterminées par programmation ou sont disponibles dans le texte.

    Projet de standard du gouvernement du Québec

    • 01 - 10, l : Tout cadre doit être décrit par un titre à l’aide de la balise <title> permettant d'en comprendre la fonction.
    • 01 - 10, m : Une page Web contient un maximum de quatre cadres.
    • 03 - 12, b : Une information contextuelle sur l’utilisation de l’animation et compatible avec les technologies d’adaptation informatiques doit être mise à la disposition des utilisateurs .
    • Recommandation générale numéro 7 : Un document subdivisé en plusieurs pages Web devrait offrir des liens de navigation entre ses subdivisions.

    RGAA

    13.9 Faciliter la navigation sur des groupes de pages

    • Test 13.9.1 : Navigation dans un groupe de pages.

    AccessiWeb

    Fiche 9.8 : La page de moteur de recherche comporte-t-elle au moins les éléments suivants : nombre maximum de réponses par page, nombre total de réponses, éléments de navigation ?

    Clientèles visées

    • Personnes ayant une incapacité cognitive.

    Explication

    « Les documents en lot peuvent faciliter la lecture hors ligne. Pour créer un lot cohérent : Utilisez les métadonnées pour décrire les relations entre les composantes du lot. »

    Extrait des Techniques pour les règles d'accessibilité du contenu Web 1.0.

    Par exemple : page de départ, page suivante, page précédente, page de table des matières, page d'index, page de glossaire.

    Exemple :

    <head>

    <link rel="start" href="…" />
    <link rel="next" href="…" />
    <link rel="prev" href="…" />
    <link rel="contents" href="…" />
    <link rel="index" href="…" />
    <link rel="glossary" href="…" />

    </head>

    Il faut aussi prévoir un système de navigation qui permette à l'utilisateur de naviguer facilement entre les différentes pages d'un même document.

    Voir aussi Location in WCAG 2.0 et Section Headings in WCAG 2.0.

    Placer des informations clés au début des sections, des paragraphes, des listes etc. 13.8 (P3*)

    WCAG 1.0, traduction française d'AccessibilitéWeb

    Placer l'information clé au début des en-têtes, des paragraphes, des listes etc.

    Section 508 version anglaise

    [No equivalent.]

    WCAG 2.0 version de travail, traduction française d'AccessibilitéWeb

    This checkpoint is not required by any Success Criterion in WCAG 2.0.

    Projet de standard du gouvernement du Québec

    Recommandation générale numéro 8 : L’information clé devrait être placée au début d’une section, d’un paragraphe, d’une liste ou autre situation équivalente.

    RGAA

    13.8 Rédiger les contenus de façon simple, logique et ordonnée

    • Test 13.8.1 : Rédaction simple et compréhensible de tous.

    AccessiWeb

    Fiche 9.2 : La page Web est-elle structurée de manière cohérente ?

    Clientèles visées

    • Personnes ayant une incapacité cognitive.

    Explication

    Commencer chaque élément ou section du contenu par les informations clés est une règle de communication bien connue des journalistes. Cela permet de capter immédiatement l'attention et de transmettre l'essentiel du message dès les premières lignes.

    Les personnes ayant des limitations cognitives auront plus de chances d'en saisir le sens. Les lecteurs dont ce n'est pas la langue maternelle apprécieront également.

    Voir aussi Technique 13.8 in WCAG 1.0.

    Fournir des raccourcis clavier. 9.5 (P3)

    WCAG 1.0, traduction française d'AccessibilitéWeb

    Fournir des raccourcis clavier pour les liens importants (y compris ceux dans les images cliquables côté client), les contrôles de formulaire, et les groupes de contrôles de formulaire.

    Section 508 version anglaise

    [No equivalent.]

    WCAG 2.0 version de travail, traduction française d'AccessibilitéWeb

    Accesskeys are no longer required for conformance to WCAG 2.0. It is an advisory item.

    Projet de standard du gouvernement du Québec

    • 01 - 10, o : À l’exclusion d’un intranet, d’un extranet, d’une application Web ou d’un lecteur multimédia, l’utilisation de raccourcis clavier doit être évitée.

      RGAA

      9.5 Proposer des raccourcis clavier

      • Test 9.5.1 : Présence de raccourcis clavier.
      • Test 9.5.2 : Persistance des raccourcis clavier.
      • Test 9.5.3 : Raccourcis clavier fonctionnels.

      AccessiWeb

      • Fiche 9.5 : À partir de n'importe quelle page du site, la page d'aide est-elle atteignable de manière identique ?
      • Fiche 9.7 : À partir de n'importe quelle page du site, le moteur de recherche est-il atteignable de manière identique ?
      • Fiche 12.5 : Les liens importants du site comportent-ils des raccourcis claviers ?

      Clientèles visées

      • Personnes ayant une incapacité visuelle.
      • Personnes ayant une incapacité motrice.

      Explication

      Les raccourcis clavier peuvent être très utiles à condition de ne pas dupliquer une commande de menu et de respecter certaines conventions qui rentabiliseront les efforts de mémorisation que les utilisateurs y consacreront.

      Ces raccourcis sont utilisés pour se déplacer au lien souhaité, mais ne l'active pas automatiquement. L'utilisateur doit l'activer avec la touche Entrée.

      • Clé d'accès 0 = Accessibilité;
      • Clé d'accès 1 = Accueil;
      • Clé d'accès 3 = Plan du site;
      • Clé d'accès 4 = Recherche;
      • Clé d'accès 9 = Contact;
      • Clé d'accès S = Passer la navigation (skip).

      Vous pouvez utiliser S pour Passer la navigation ou Passer à la navigation, selon que la navigation est placée avant le contenu ou après celui-ci.

      Codez-les en utilisant l'attribut accesskey.

      Exemple :

      <a href="index.htm" acceskey="1">Accueil</a>.

      Voir aussi Technique 9.5 in WCAG 1.0.

      Fournir des informations afin que les utilisateurs puissent recevoir les documents selon leurs préférences. 11.3 (P3)

      WCAG 1.0, traduction française d'AccessibilitéWeb

      Fournir des informations afin que les utilisateurs puissent recevoir les documents selon leurs préférences. (p.ex. la langue, le type de contenu, etc.)

      Section 508 version anglaise

      [No equivalent.]

      WCAG 2.0 version de travail, traduction française d'AccessibilitéWeb

      This checkpoint does not map to any WCAG 2.0 success criterion, though certain aspects may map to certain success criteria or to advisory item.

      Projet de standard du gouvernement du Québec

      [Aucun équivalent.]

      RGAA

      11.3 Permettre aux utilisateurs de recevoir des documents conformes à leurs préférences

      • Test 11.3.1 : S'assurer que les informations de format sont données pour les documents en téléchargement.
      • Test 11.3.2 : S'assurer que les informations de poids sont données pour les documents en téléchargement.
      • Test 11.3.3 : S'assurer que les informations de langue sont données pour les documents en téléchargement.
      • Test 11.3.4 : S'assurer que le contenu fourni à l'utilisateur soit conforme à ses préférences de langue.
      • Test 11.3.5 : Présence d'une présentation spécifique pour l'impression.
      • Test 11.3.6 : Informations sur les documents proposés au téléchargement dans les objets externes.

      AccessiWeb

      • Fiche 13.5 : Y a-t-il des informations supplémentaires disponibles décrivant la consultation des fichiers en téléchargement?
      • Fiche 13.6 : Lorsqu'un fichier peut être téléchargé, y a-t-il des formats alternatifs équivalents ?

      Clientèles visées

      • Personnes ayant une incapacité visuelle.
      • Personnes ayant une incapacité motrice.
      • Personnes ayant une incapacité auditive.
      • Personnes ayant une incapacité cognitive.

      Explication

      Ce point de contrôle laisse beaucoup de marge à l'imagination et pourrait être appliqué de différentes façons. Citons à titre d'exemple :

      • Si le site est bilingue, la page peut être servie en fonction de la langue du navigateur. C'est ce qu'on appelle la négociation de contenu. NOTE : Un site du gouvernement du Québec doit d'abord s'afficher en français pour tous afin de se conformer aux dispositions législatives concernant la langue d'affichage.
        • Exemple :
          <meta http-equiv="content-language" content="fr" />
      • La langue de destination des liens devrait être déclarée.
        • Exemple :
          <a href="http://www.w3.org" hreflang="en">W3C [en]</a>
      • Le format des documents non HTML pourrait être spécifié textuellement ou par une icône.
        • Exemple :
          <a href="document1.doc">Document 1 [en format Word]</a>
      • Pour les documents non HTML, des formats alternatifs pourraient être offerts.
        • Exemple :
          <a href="document1.pdf">Document 1 [en format PDF]</a>
          ou
          <a href="document1.rtf">Document 1 [en format RTF]</a>

      Voir aussi Technique 11.3 in WCAG 1.0.

      Liste des thèmes.

      Revenir au début de la page.