Accessibilité

Navigation au clavier

La navigation au clavier est un aspect fondamental de l'accessibilité des sites web. Elle permet aux utilisateurs ne pouvant pas utiliser la souris, comme les personnes souffrant de handicaps moteurs, de déficiences visuelles ou de blessures temporaires, de naviguer et d'interagir avec un site web.

Chaque élément interactif, y compris Gauche, boutons et champs de formulaire, doit être accessible à l'aide de la touche Tab, avec un ordre de tabulation logique et des indicateurs de focus visibles pour montrer quel élément est actuellement sélectionné.

Sites Web créés avec la dernière version de Blocs, prend en charge les commandes de navigation au clavier suivantes lorsqu'il est visualisé dans un navigateur Web.

Touche d'échappement

  • Ferme la liste déroulante.
  • Ferme la modale.
  • Ferme la boîte à lumière.
  • Ferme le menu plein écran.

Touches fléchées gauche et droite

  • Naviguer dans Light Box (avant et arrière).
  • Naviguer dans les onglets (avant et arrière).

Clé de retour

  • Cliquez sur le bouton ou le lien sélectionné.
  • Ouvrir le menu / menu déroulant sélectionné.

Touche Espace

  • Cliquez sur le bouton sélectionné.
  • Ouvrir le menu / menu déroulant sélectionné.
  • Basculer la sélection de la case à cocher (cochée/décochée).
  • Basculer la sélection radio (sélection d'une option).

La touche TAB

  • Déplacer la sélection vers l'avant.

Touche Maj + Tab

  • Déplacer la sélection vers l'arrière.
Conseil utile

Dans Safari, la navigation par onglets doit être activée manuellement. Pour l'activer, accédez à Paramètres > Avancé > Accessibilité.

Indicateurs de concentration

Lorsque vous naviguez sur un site Web à l'aide d'un clavier, il est essentiel que les indicateurs de mise au point soient clairement visibles, permettant aux utilisateurs de voir facilement quel élément est actuellement sélectionné. Blocs comprend un intégré Amélioration de l'accessibilité fonctionnalité qui, lorsqu'elle est activée, améliore la visibilité de lien et mes bouton (dans la fenêtre de contrôle qui apparaît maintenant) États de focus. Cette amélioration facilite la navigation sur votre site pour les utilisateurs de clavier et garantit une expérience plus accessible à ceux qui utilisent la saisie au clavier.

Étiquettes d'accessibilité

L'utilisation d'étiquettes d'accessibilité sur un site web est essentielle pour respecter les WCAG (Directives pour l'accessibilité des contenus Web) et garantir l'accessibilité de votre contenu à tous les utilisateurs, y compris ceux qui utilisent des technologies d'assistance comme les lecteurs d'écran. L'utilisation d'étiquettes descriptives est un élément clé. alt balises sur les images, qui fournissent un contexte significatif aux utilisateurs qui ne peuvent pas voir le contenu visuel. Blocs, définir le texte alternatif d'une image est simple, utilisez simplement le champ de texte approprié dans l'inspecteur de la barre latérale, lorsqu'une image est sélectionnée sur le canevas de conception.

Conseil utile

Si vous laissez le champ alt vide, Blocs générera automatiquement une version propre et lisible en fonction du nom du fichier image pour aider à maintenir les normes d'accessibilité lorsque vous exportez ou publiez votre site.

En outre, étiquette d'air et mes aria-labellisé Les attributs aident à étiqueter les éléments qui n'ont pas de texte visible, tels que les icônes ou les boutons, permettant aux lecteurs d'écran de communiquer clairement leur fonction.
Lors de la création d'un site Web avec Blocs, vous pouvez ajouter manuellement ces attributs d'accessibilité en utilisant Attributs de données personnalisés, vous donnant un contrôle total sur la manière dont les technologies d'assistance interprètent et annoncent votre contenu.

Contraste des couleurs

Lors de la création d'une page Web, il est important de prendre en compte contraste des couleurs et mes daltonisme Pour garantir l'accessibilité de votre contenu à tous les utilisateurs, un contraste adéquat entre les couleurs du texte et celles de l'arrière-plan est essentiel à la lisibilité, en particulier pour les personnes malvoyantes ou présentant des déficiences de la vision des couleurs. Blocs comprend intégré filtres de simulation de déficience visuelle qui vous permettent de prévisualiser votre site sous différents angles visuels. Cela facilite l'identification et l'ajustement des combinaisons de couleurs problématiques, vous aidant ainsi à concevoir un site web plus inclusif et accessible.

Structure

Utilisation de balises HTML sémantiques, telles que entête, principal, , nav et pied de page, est un élément important à prendre en compte lors de la création de sites web accessibles. Ces balises structurent et donnent du sens à votre contenu, permettant aux technologies d'assistance comme les lecteurs d'écran d'interpréter la mise en page et de naviguer plus efficacement.

In Blocs, vous pouvez attribuer des balises de conteneur sémantiques à chaque section de votre site à l'aide de la étiquette de conteneur options. Cela améliore non seulement l'accessibilité, mais contribue également à maintenir votre site web bien organisé et peut améliorer le référencement.

Mis à jour le 19th May 2025

Cet article a-t-il été utile?

Articles Relatifs