Lignes directrices en matière d'accessibilité

En ce qui concerne l'accessibilité, les extensions devraient suivre les mêmes lignes directrices que les sites Web. Cependant, les extensions ont des caractéristiques uniques qui méritent d'être prises en considération lors de la conception pour l'accessibilité. Voici une ventilation des fonctions d'extension et comment elles devraient être utilisées pour rendre une extension accessible.

Vous trouverez plus d'information sur la conception et l'accessibilité dans la section Photon Design System et Accessibilité et Mozilla section de MDN.

Fonction d'interface utilisateur  Lignes directrices

Raccourcis clavier  (commands)

Les raccourcis clavier permettent d'activer facilement les fonctions d'extension.

Pour améliorer l'accessibilité, ajoutez des raccourcis clavier pour :

  • éléments de l'interface utilisateur de l'extension, tels que les boutons de la barre d'outils et de la barre d'adresse.
  • toutes les fonctionnalités d'une extension, cependant, lorsque cela n'est pas pratique, fournissent des raccourcis pour les fonctionnalités d'extension couramment utilisées.  

Les utilisateurs peuvent modifier les raccourcis clavier d'une extension en fonction de leurs besoins. Cependant, les utilisateurs ne peuvent pas ajouter de raccourcis, c'est pourquoi il est préférable d'en ajouter autant que possible.

Bouton de la barre d'outils (action du navigateur)

Pour tenir compte du thème actif, fournissez des icônes de boutons de la barre d'outils pour les thèmes avec du texte clair et foncé.

Suivez les directives du Photon Design System sur l'Iconographie. Utilisez différentes images pour transmettre l'état, par exemple basculé ou actif. N'utilisez pas d'icônes colorées ou de changements de couleur pour indiquer les changements d'état, car ils peuvent ne pas être visibles pour tous les utilisateurs.

Incluez toujours un titre de texte pour que les détails des boutons puissent être lus par un lecteur d'écran. Le titre du bouton doit être mis à jour pour refléter :

  • l'état de l'extension.
  • le contenu des badges texte affichés sur le bouton.

Ajoutez un raccourci à l'action du bouton, en utilisant l'option spéciale de raccourci spécial _execute_browser_action.

Bouton de la barre d'outils avec une fenêtre contextuelle

Le balisage dans la fenêtre contextuelle doit suivre les lignes directrices standard d'accessibilité au web.

Bouton de la barre d'adresse (action page)

Les mêmes directives que les boutons de la barre d'outils doivent être suivies.

Ajoutez un raccourci à l'action du bouton, en utilisant l'option de raccourci  _execute_page_action.

Bouton de la bare d'adresse avec un popup

Le balisage dans la fenêtre contextuelle devrait suivre les lignes directrices standard d'accessibilité du web.

Elément du menu contextuel

Les éléments de menu contextuel offrent aux utilisateurs un moyen accessible de découvrir les fonctions d'extension associées aux éléments d'une page Web. Par conséquent, dans la mesure du possible, ajoutez des fonctions d'extension à leurs menus contextuels pertinents.

Barre latérale

Le balisage dans la barre latérale doit être conforme aux lignes directrices standard d'accessibilité du web.

Ajoutez un raccourci clavier pour ouvrir une barre latérale, en utilisant l'option de raccourci spécial _execute_sidebar_action.

Options page

Le balisage de la page des options doit suivre les lignes directrices standard d'accessibilité du Web.

Extension page

Le balisage de la page d'extension doit suivre les lignes directrices standard d'accessibilité du Web.

Notification

Fournir des notifications pour les événements qui se produisent en arrière-plan ou qui ne sont pas autrement notifiés dans l'interface utilisateur. Soyez économe en notifications, mais veillez à ne pas les minimiser au détriment de l'accessibilité.

Suggestion de la barre d'adresse

Ajoutez des suggestions selon le guide, il n'y a pas d'autres considérations d'accessibilité pour les extensions.

Panneau d'outils de développement

Le balisage dans la barre latérale doit être conforme aux conforme aux directives d'accessibilité du Web standard.

Il est recommandé d'offrir un raccourci clavier pour ouvrir un panneau devtools.