Quiz récap'

Quiz récap' sur la navigation.

Dans quels cas dois-je proposer au moins deux systèmes de navigation différents dans mon site ?

  1. Dans tous les cas
  2. Lorsque le site proposent des pages de contenu non atteignables depuis la page d’accueil en excluant les pages résultant d’un processus type formulaire à étapes multiples.
  3. Lorsque le site proposent des pages de contenu non atteignables depuis la page d’accueil même celles qui résultent d’un processus type formulaire à étapes multiples.

Réponse 3
Un site doit proposer au moins 2 systèmes de navigation parmi un menu de navigation et un plan du site ou un menu de navigation et un moteur de recherche dès qu'il comporte des pages non atteignables depuis la page d'accueil. Les pages d’un ensemble de pages qui sont le résultat ou une partie d’un processus (un processus de paiement ou de prise de commande, par exemple) ne sont pas à prendre en compte pour l'évaluation de ce critère..

L’élément nav peut être utilisé pour présenter une collection de liens pointant sur d'autres sites

  1. Vrai
  2. Faux

Réponse b - Faux
L'élément nav identifie uniquement les liens utiles à la navigation dans le site.

L’élément nav peut être utilisé pour présenter une table des matières de la page en cours.

  1. Vrai
  2. Faux

Réponse a - Vrai
Une table des matières est considérée comme un menu de navigation secondaire.

Un lien d'accès rapide au contenu identifié par l’élément main portant le rôle main doit toujours être proposé.

  1. Vrai
  2. Faux

Réponse a - Vrai
Les critères 12.6 et 12.7 du RGAA requièrent la présence de liens d’évitement ou d’accès rapide aux zones de regroupement de contenus présentes dans plusieurs pages web, à savoir :

  • zone d’en-tête (implémenté avec <header role="banner">) ;
  • zone de navigation principale (implémenté avec <nav role="navigation">) ;
  • zone de contenu principal (implémenté avec <main role="main">) ;
  • zone de pied de page (implémenté avec <footer role="contentinfo">) ;
  • et zone de moteur de recherche (implémenté avec <form role="search">).

Le critère 12.7 se concentre plus particulièrement sur le lien d’évitement ou d’accès rapide au contenu principal (implémenté avec <main role="main">).

Un fil d'ariane doit être proposé sur toutes les pages y compris la page d'accueil.

  1. Vrai
  2. Faux

Réponse b - Faux
Le fil d'ariane ne doit être proposé que sur les pages « filles » d'un site web et doit présenter tout le chemin à parcourir pour arriver sur la page affichée ainsi que le nom de la page affichée. Une bonne pratique consiste à rendre cliquable les différents items du fil d'ariane sauf le dernier correspondant à la page en cours.

Dans un fil d'ariane, le dernier item (représentant la page en cours) doit avoir pour attribut aria :

  1. aria-current="true"
  2. aria-current="page"
  3. aria-current="step"

Réponse b - aria-current="page"
Le dernier lien correspondant à la page en cours sera codé de cette manière :
<li><a href="/chapitre/rubrique/page/" aria-current="page">Page en cours</a></li>.
Une bonne pratique consiste à désactiver le lien en CSS avec le code suivant :
[aria-current="page"] { pointer-events: none; }

Les différentes étapes d'un processus par étapes seront balisés avec une liste ordonnée élément HTML ol.

  1. Vrai
  2. Faux

Réponse a - Vrai
Les différentes étapes du processus seront balisées par un liste ordonnée car l’ordre des items a de l’importance. La numérotation automatique de la liste ordonnée pourra être supprimée via CSS.

Dans un processus par étape, l’étape en cours sera balisée avec l’attribut aria :

  1. aria-current="true"
  2. aria-current="page"
  3. aria-current="step"

Réponse 3 - aria-current="step"
La valeur « step » indique l'étape du processus sur laquelle 'utilisateur se situe.

Dans un menu de navigation déroulant, l'item parent de la page en cours (page en cours atteignable via le sous-menu) sera balisé :

  1. <a aria-current="true" ...>
  2. <a aria-current="page" ...>
  3. <button aria-current="true"...>
  4. <button aria-current="page"...>

Réponse c - <button aria-current="true"...>
On utilisera d'abord un bouton (élément button car il s'agit d'un élément interactif sans changement de contexte (on reste sur la page en cours)
La valeur true indique l'élément en cours dans un ensemble d'éléments alors que page indique la page en cours dans un ensemble de pages.

Je peux désactiver la visibilité du focus dans un menu de navigation

  1. Vrai
  2. Faux

Réponse b - Faux
La prise de focus doit toujours être visible.