Citation

La citation est un élément éditorial permettant de mettre en forme du contenu dans une page.

Le composant Citation est conçu pour être accessible et respecter les critères du RGAA. Voici les points clés à prendre en compte pour en garantir l’accessibilité.

Interactions clavier

Aucune interaction au clavier spécifique au composant.

Règles d’accessibilité

  • Le texte cité est contenu dans un élément <blockquote> inséré dans un bloc <figure> et les informations complémentaires (image, auteur, ouvrage… ) dans l'élément <figcaption>.
  • L’ouvrage cité doit être placé dans une balise <cite> et ainsi apparaitre en italique.
  • L’icône et l’image sont décoratives et ne doivent pas être restituées aux technologies d’assistance.

Information

Ne pas confondre l’attribut cite qui permet d’ajouter l’URL de la source de la citation si celle-ci provient d’un autre site et l’élément <cite> à utiliser pour le titre de l’œuvre citée. L’attribut et l’élément n’ont pas d’importance pour l’accessibilité.

Contrastes de couleurs

Le composant Citation est suffisamment contrasté en thème clair et en thème sombre.

Restitution par les lecteurs d’écran

NVDA et JAWS sont les seuls lecteurs d’écran à restituer correctement la sémantique de l’élément blockquote.

Critères RGAA applicables

  • Couleurs : 3.2
  • Liens : 6.1, 6.2
  • Éléments obligatoires : 8.9
  • Structuration : 9.3, 9.4
  • Présentation de l’information : 10.1, 10.2, 10.3, 10.4, 10.5, 10.7, 10.8, 10.11, 10.12
  • Navigation : 12.8, 12.9
  • Consultation :: 13.9, 13.11

Références

Proposer une amélioration

Aidez-nous à améliorer la documentation en laissant vos retours, questions ou commentaires sur GitHub.

Accéder à Github