web-dev-qa-db-fra.com

WCAG 2.1: 1.3.6 Identifier le but - Comment remplissez-vous les exigences d'icônes pour cela?

WCAG 2.1 a été officiellement publié, je voudrais donc essayer de le soutenir autant que possible.

J'ai de la difficulté à comprendre la directive 1.3.6 (Identifier le but). https://www.w3.org/WAI/WCAG21/Understanding/identify-purpose.html

Ce sont les exemples qu'il donne sur la façon de passer ce critère:

  1. Un site Web utilise les repères ARIA pour identifier les régions de la page,
    et les utilisateurs peuvent masquer les zones qui ne sont pas "principales".
  2. Les liens dans la navigation d'un site Web sont balisés afin que les utilisateurs puissent ajouter leurs propres icônes.
  3. Les icônes d'un site Web sont balisées afin que l'utilisateur puisse remplacer son propre jeu d'icônes dans la page.

Je suis d'accord avec le premier point. Cela signifie essentiellement utiliser correctement les nouveaux éléments HTML5 <header>, <footer>, <main>, <article>, <aside>, et <section>.

Les deux autres points (qui ne sont absolument pas liés au premier point), je n'ai aucune idée de la manière de les respecter. Je ne pense pas que le balisage pour une telle chose existe même pour le moment.

Quelqu'un sait-il comment se conformer aux points 2 et 3?

(Ne pas utiliser d'icônes sur votre site ne compte pas comme réponse).

2
Daniel Tonon

1.3.6 Identifier le but (AAA) s'appuie sur 1.3.5 Identifier le but d'entrée (AA), semblable à la façon dont 1.4.6 Contraste (amélioré) = (AAA) s'appuie sur 1.4.3 Contraste (minimum) (AA).

La plupart des entreprises ont AA comme norme de conformité. La directive 1.3.6 est une directive AAA, donc même s'il est admirable que vous tentiez de satisfaire certaines exigences AAA, gardez à l'esprit que le W3 met en garde contre toute tentative de satisfaire tous Exigences AAA. Voir " Note 2 ".

Quoi qu'il en soit, l'utilisation d'éléments repères en HTML ou l'utilisation de rôles repères sont certainement une bonne première étape, comme vous l'avez mentionné. (Notez que le <article> la balise est pas un point de repère .) Les points de repère sont parfaits pour les utilisateurs de lecteurs d'écran, mais malheureusement, les navigateurs n'ont pas fait remonter la navigation des points de repère aux utilisateurs de clavier voyants (pour le moment?). Si vous souhaitez autoriser la navigation par repères, vous devez le coder vous-même.

Les autres exemples que vous avez notés sont nouveaux et n'ont pas encore de nouveau balisage pour les prendre en charge, donc encore une fois vous devrez le coder vous-même. Voir " Personalization Semantics Content Module 1. " pour un travail fascinant dans ce domaine. Il y a une référence à un " démo de personnalisation " qui est intéressant. Il utilise en quelque sorte "l'amélioration progressive" et la "dégradation gracieuse" pour personnaliser un formulaire afin qu'il contienne uniquement les champs de base (pour les problèmes cognitifs) ou plusieurs champs, mais il devait être codé et ne faisait pas encore partie du langage de balisage.

( Remarque : La démo est un peu déroutante au début. Vous devez sélectionner le bouton "Personnaliser (lire JSON)" à droite [ce qui n'est pas stylisé pour ressembler à un bouton], puis sélectionnez "Plus d'options" ou "Moins d'options" pour augmenter ou diminuer le nombre de champs de saisie. Il a un javascript simple qui masque/affiche les champs en fonction du aria-importance attribut, qui n'est pas un véritable attribut.)

1
slugolicious