Glossaire

Avant-propos

Cas particuliers

Plusieurs critères AccessiWeb HTML5/ARIA font référence à des cas particuliers nécessaires à leur compréhension et application.

A l'occasion de la parution officielle du référentiel AccessiWeb HTML5/ARIA, la liste des cas particuliers a été mise à jour.

Glossaire

Le référentiel AccessiWeb HTML5/ARIA fait référence à de nouveaux termes, de nouvelles définitions.

A l'occasion de la parution officielle du référentiel AccessiWeb HTML5/ARIA, la liste des nouvelles définitions sera mise à jour si nécessaire et intégré au Glossaire AccessiWeb.

Conditions d'utilisation

La totalité des contenus publiés dans ces pages sont la propriété de l'association BrailleNet.

Contact

Pour toute question sur l'utilisation de ces documents ou sur le Référentiel AccessiWeb HTML5/ARIA en général, merci d'envoyer un courriel à info@accessiweb.org.

Lettre A

Abréviation

Réduction d'un mot ou d'une expression formée avec la ou les première(s) lettre(s) (balise abbr). Une abréviation se prononce en épelant les lettres qui la composent (ex. sncf).

Accéder à chaque page de la collection de pages

Dans le cas où la collection de pages comporte un grand nombre de pages, il est habituel de présenter ces liens d'accès aux pages par groupe de liens, par séquence de 10 liens, par exemple. Cette pratique valide le test.

Acronyme

Abréviation formée avec la ou les première(s) lettre(s) des mots qui la composent (balise acronym). Un acronyme se prononce comme un mot ordinaire (ex. Afnor...)

Afficheur braille

Terminal connecté à l'ordinateur et restituant en braille l'information électronique. Synonymes : terminal braille, plage tactile, plage braille.

Alerte

Message d'alerte interrompant la navigation ou l'utilisation de la page, notamment en demandant de cliquer sur un bouton ou un lien pour continuer la navigation ou l'utilisation du contenu. Par exemple, une boite de dialogue générée par javascript via la fonction alert. Par extension, une fenêtre modale (contenu présenté sous forme de "fenêtre" insérée ou affichée dans le DOM) qui nécessite d'être fermée pour continuer la navigation ou l'utilisation du contenu est considérée comme une alerte. Note : La désactivation des alertes concernée peut être proposée avant le déclenchement de l'alerte, par exemple, via un paramètre utilisateur ou lors de l'affichage de la première alerte, par exemple via une case à cocher "ne plus afficher cette alerte".

Alternative (à script)

Texte ou procédé associé au script via une technique appropriée et permettant de mettre à disposition une fonction ou un contenu similaire à celui proposé par script.

Alternative courte et concise

Les condition de restitution d'une alternative textuelle (via les aides techniques, une loupe d'écran...) nécessitent qu'elle soit la plus courte possible. Une longueur de 80 caractères est fortement recommandée; elle limitera le nombre de manipulations nécessaires pour lire l'alternative par les utilisateurs de tablette braille ou de loupe d'écran, notamment.

Alternative textuelle (à un bouton de formulaire)

Texte associé à un bouton de formulaire via une technique appropriée et décrivant l'action produite par le bouton (lors de la consultation, l'utilisateur est ainsi capable d'identifier l'action associée au bouton).

Alternative textuelle (image)

texte associé à une image via une technique appropriée et décrivant l'information véhiculée par l'image (par rapport au contexte du contenu Web dans lequel elle se trouve). Accessiweb 2.0 considère quatre types d'alternatives liées à la nature de l'image :

  • pour une image porteuse d'information, l'alternative apporte l'information nécessaire à la compréhension du contenu auquel l'image est associée.
  • pour une image de décoration, l'alternative doit être vide (alt="")
  • pour une image-lien, l'alternative doit permettre de comprendre la fonction et la destination du lien.
  • pour une image Captcha ou une image-test, l'alternative ne peut pas apporter l'information véhiculée par l'image sans rendre la fonction associée inopérante. Dans ce cas de figure, l'alternative doit se contenter de permettre d'identifier la nature et la fonction de l'image (ex : image Captcha ou image N°3 de l'exercice)

Notes : La présence ou non d'un attribut title pour une image ne relève pas du référentiel AccessiWeb. Cependant, si un tel attribut est présent, AccessiWeb conseille que le contenu de l'attribut title soit identique au contenu de l'alternative.

Ambigüe pour tout le monde

L'intention ne peut être déterminée à partir du lien et de toute l'information de la page Web présentée à l'utilisateur en même temps que ce lien. (c'est-à-dire qu'un lecteur sans limitation fonctionnelle ne connaîtrait pas la fonction d'un lien avant de l'activer). Exemple : le mot "goyave" dans la phrase suivante utilisé comme lien : « L'une des exportations importantes est la goyave ». Ce lien pourrait conduire à une définition de la goyave, à un graphe présentant une liste des quantités de goyaves exportées ou à une photo de personnes récoltant la goyave. Jusqu'à ce que le lien soit activé, tout utilisateur est dans l'incertitude et une personne handicapée n'est donc pas désavantagée.

Ancre

En HTML, une ancre (appelée aussi signet) est constituée d'une balise <a> avec l'attribut id et dépourvue de Href, <a id="contenu"></a> par exemple. Une ancre sert de cible à un lien de la forme <a href="#id">Intitulé</a> : <a href="#contenu">Accéder au contenu</a> par exemple.

Accessible et activable par le clavier et la souris

  • Un composant d'interface (lien, bouton, élément cliquable dans Flash...) est accessible au clavier et à la souris lorsque l'utilisateur peut prendre, indifféremment, le focus par le pointeur de la souris et la touche tabulation.
  • Un composant d'interface (lien, bouton, élément cliquable dans Flash...) est activable au clavier et à la souris lorsque l'utilisateur peut enclencher, indifféremment, l'action prévue par le composant d'interface par le click de la souris ou la touche entrée du clavier.
  • Attention : pour certains composants d'interface comme les sliders (bouton coulissant ou tournant...), il n'est pas possible de contrôler le composant par la seule touche d'entrée. Dans cette situation, d'autres touches (comme les touches de direction) peuvent être utilisées.

Audio-description synchronisée (media temporel)

Narration ajoutée (via un ensemble de fichier son) à une piste sonore pour décrire les détails visuels importants qui ne peuvent être compris à partir de la piste sonore principale seulement. L'audio-description doit être synchronisée avec le media temporel grâce à l'utilisation de langage de synchronisation comme SMIL (Synchronized Multimedia Integration Language).

  • Note 1 : l'audio-description d'une vidéo fournit de l'information à propos des actions, des personnages, des changements de scènes, du texte apparaissant à l'écran et d'autres contenus visuels.
  • Note 2 : dans une audio-description standard, la narration est ajoutée durant les pauses qui existent dans le dialogue. (Voir aussi audio-description étendue.)
  • Note 3 : lorsque toute l'information de la vidéo est déjà donnée dans la piste audio, aucune audio-description supplémentaire n'est requise.

Audio-description étendue

Audio-description ajoutée à une présentation audiovisuelle en mettant en pause la vidéo de manière à avoir le temps d'ajouter des descriptions supplémentaires. Note : cette technique est à utiliser seulement si le sens de la vidéo est perdu sans audio-description supplémentaire et que les pauses entre les dialogues ou la narration sont trop courtes.

Lettre B

Barre de navigation

Liste de liens permettant un navigation spécifique dans le site, dans une rubrique ou dans une collection de page. Les principales barres de navigation sont :

  • Le menu de navigation principal
  • Un fil d'Ariane
  • Une liste de navigation d'une liste de résultats
  • Un menu de sous-rubrique

Bloc d'information de même nature

Dans un formulaire, ensemble des champs pouvant être regroupés par la nature des informations attendues. Par exemple, trois champs successifs pour saisir une date (jour/moi/année) ou un bloc destiné à saisir l'identité et l'adresse de l'utilisateur. Ces champs doivent être regroupés par une balise fieldset accompagnée d'une balise legend pertinente. Note : lorsque le formulaire est uniquement constitué d'un seul bloc d'informations de même nature ( l'identité et l'adresse de l'utilisateur, par exemple) ou d'un champs unique (un moteur de recherche, par exemple), la présence de l'élément fieldset n'est pas obligatoire.

Bloc de citation

Un bloc de citation est un contenu reprenant une citation et présenté de manière indépendante des autres contenus (entre deux paragraphes ou entre deux blocs de paragraphes). En HTML, un bloc de citation s'implémente via une balise blockquote.

Bouton (formulaire)

Élément d'un formulaire qui permet d'effectuer une action prédéfinie. Par exemple, le bouton de soumission d'un formulaire permet l'envoi au serveur des informations collectées pour leur traitement. É L'intitulé d'un bouton doit décrire l'action qui résulte de son activation (par exemple : "Lancer votre recherche", "Envoyer votre message").

En HTML, il y a trois types de boutons de formulaire :

  • balise input de type submit, reset ou button,
  • balise input de type image,
  • balise button.

L'intitulé du bouton peut être de quatre types :

  • le contenu de l'attribut value des boutons de type submit, reset ou button,
  • le contenu de l'attribut alt d'un bouton de type image,
  • le contenu de l'attribut title lorsqu'il est présent,
  • le contenu de la balise button.

Lettre C

Cadre

Éléments HTML (balise frame) permettant d'incorporer des contenus dans une page Web à l'intérieur de zones rectangulaires. Un cadre défini par la balise frame est nécessairement relié à une balise frameset. Plusieurs cadres peuvent être définis dans une même page Web et tous les cadres d'un même ensemble constituent un jeu de cadres.

Cadre en ligne

Éléments HTML (balise iframe) permettant d'afficher un contenu dans la page Web dans laquelle il est implémenté.

CAPTCHA

Un CAPTCHA est un test utilisé pour distinguer un utilisateur humain d'un ordinateur. Le test est souvent basé sur des images contenant du texte déformé que l'utilisateur est invité à retaper. D'autres formes de CAPTCHA peuvent être basées sur des questions logiques ou des extraits sonores.

Cas particuliers

Liste des situations pour lesquelles l'application d'un critère AccessiWeb est spécifique :

Critère 1.3

Il existe une gestion de cas particuliers lorsque l'image est utilisée comme Captcha ou comme image-test. Dans cette situation, où il n'est pas possible de donner une alternative pertinente sans détruire l'objet du Captcha ou du test, le critère est non-applicable. Note : Le cas des Captcha et des images-test est traité de manière spécifique par le critère 1.4.

Critère 1.8

Pour ce critère, il existe une gestion de cas particulier lorsque :

  • le texte fait partie d'un logo ou d'un élément associé à l'identité graphique d'un organisme ou d'une société (un slogan, par exemple). Dans ces situations, le critère est non applicable pour ces éléments.
  • l'image est protégée par un copyright, un droit d'auteur ou une clause juridique particulière qui en interdit la modification ou la création de copie modifiée.

Note 1 : Les changements de couleurs consécutifs à la prise de focus ne sont pas concernés par l'application du critère, sauf si le contenu change également lors de la prise de focus. Note 2 : Les indications des états de liens (visités ou actifs) ne sont pas concernées par l'application du critère.

Critère 1.9

Pour ce critère, il existe une gestion de cas particulier lorsque le texte fait partie d'un logo ou d'un élément associé à l'identité graphique d'un organisme ou d'une société (un slogan, par exemple). Dans ces situations, le critère est non applicable pour ces éléments.

Note 1 : Les changements de couleurs consécutifs à la prise de focus ne sont pas concernés par l'application du critère, sauf si le contenu change également lors de la prise de focus.

Note 2 : Les indications des états de liens (visités ou actifs) ne sont pas concernées par l'application du critère.

Il existe une gestion de cas particulier lorsque l'image est protégée par un copyright, un droit d'auteur ou une clause juridique particulière qui en interdit la modification, la reproduction ou la création de copie modifiée. Dans cette situation le critère est non applicable.

Critères 3.3 - 3.4

Pour ces critères, il existe une gestion de cas particulier lorsque :

  • le texte fait partie d'un logo ou d'un élément associé à l'identité graphique d'un organisme ou d'une société (un slogan, par exemple). Dans ces situations, les critères sont non applicables pour ces éléments.
  • l'image est protégée par un copyright, un droit d'auteur ou une clause juridique particulière qui en interdit la modification ou la création de copie modifiée.

Note 1 : Les changements de couleurs consécutifs à la prise de focus ne sont pas concernés par l'application du critère, sauf si le contenu change également lors de la prise de focus. Note 2 : Les indications des états de liens (visités ou actifs) ne sont pas concernées par l'application du critère.

Pour ces critères, il existe une gestion de cas particuliers lorsque le texte en image est utilisé comme CAPTCHA ou comme image-test. Dans cette situation, les critères sont non-applicables.

Critères 4.1 - 4.2 - 4.3 - 4.5 - 4.7 - 4.9 - 4.11 - 4.13

Il existe une gestion de cas particulier lorsque :

  • le media temporel est utilisé à des fins décoratives (i.e il n'apporte aucune information)
  • le média temporel est lui-même une alternative à un contenu de la page (une vidéo en langue des signes ou la vocalisation d'un texte, par exemple)
  • le media temporel est protégé par un copyright, un droit d'auteur ou une clause juridique particulière qui en interdit la modification ou la création de copie modifiée.
  • le media temporel est utilisé pour accéder à une version agrandie
  • le media temporel est utilisé comme un captcha
  • le media temporel fait partie d'un test qui deviendrait inutile si la transcription textuelle, les sous-titres synchronisés ou l'audio-description étaient communiqués

Dans ces situations, le critère est non applicable.

Critère 4.15

Il existe une gestion de cas particulier lorsque le média temporel est utilisé à des fins décoratives (i.e il n'apporte aucune information). Dans cette situation, le critère est non applicable.

Critère 4.16

Il existe une gestion de cas particulier lorsque :

  • le media non temporel est utilisé à des fins décoratives (i.e il n'apporte aucune information)
  • le media non temporel est diffusé dans un environnement maîtrisé
  • le media non temporel est protégé par un copyright, un droit d'auteur ou une clause juridique particulière qui en interdit la modification ou la création de copie modifiée.
  • le media non temporel est inséré via javascript en vérifiant la présence et la version du plug-in, en remplacement d'un contenu alternatif déjà présent

Dans ces situations, le critère est non applicable.

Critère 4.19

Il existe une gestion de cas particulier lorsque le média temporel est utilisé comme captcha ou fait partie d'un test qui deviendrait inutile si l'arrière plan sonore pouvait être désactivé ou si la ou les pistes de dialogues étaient 20 décibels plus élevées que l'arrière plan sonore

Dans ces situations, le critère est non applicable.

Critère 4.22

Il existe une gestion de cas particulier lorsque :

  • le media le média temporel ou non temporel est utilisé à des fins décoratives (i.e il n'apporte aucune information)
  • le media le média temporel ou non temporel est protégé par un copyright, un droit d'auteur ou une clause juridique particulière qui en interdit la modification ou la création de copie modifiée.

Dans ces situations, le critère est non applicable.

Critères 6.1 et 6.3

Il existe une gestion de cas particulier lorsque le lien est ambigu pour tout le monde. Dans cette situation, où il n'est pas possible de rendre le lien explicite dans son contexte, le critère est non-applicable.

Critère 7.1

Il existe une gestion de cas particulier lorsque le script est utilisé dans un environnement maîtrisé. Dans cette situation, le critère est non-applicable.

Critère 7.3

Il existe une gestion de cas particulier lorsque la fonctionnalité dépend de l'utilisation d'un gestionnaire d'évènement sans équivalent universel, par exemple, une application de dessins à main levée ne pourra pas être rendue contrôlable au clavier. Dans ces situations, le critère est non-applicable.

Critère 7.6

Il existe une gestion de cas particulier lorsque l'alerte non sollicitée concerne un cas d'urgence, un événement ou une situation soudaine et imprévue qui exige une action immédiate afin de préserver la santé, la sécurité ou la propriété. Dans ces situations, le critère est non-applicable.

Critère 8.2

Il y a une gestion de cas particulier sur la conformité du code HTML :

Pour accompagner la prise en charge progressive de HTML5 par les navigateurs, les APIs d'accessibilité et les technologies d'assistance, certains critères peuvent exiger la présence d'attributs ou de balises déclarés "obsolètes" en HTML5. Dans ce cas le test 8.2.2 est Non-Applicable.

Critère 8.7

Il y a une gestion de cas particulier sur le changement de langue pour les cas suivants :

  • nom propre, le critère est non applicable
  • nom commun de langue étrangère présent dans le dictionnaire officielle de la langue par défaut de la page Web, le critère est non applicable (Note : le dictionnaire officiel est celui recommandé par l'académie en charge de la langue en question). Pour la France, par exemple, le lien vers le dictionnaire officiel se trouve sur le site de l'Académie française à l'adresse suivante : http://www.academie-francaise.fr/dictionnaire/index.html. Pour toute demande auprès du service du dictionnaire de l'Académie Française, utiliser le formulaire en ligne formulaire de contact académie française
  • le terme de langue étrangère soumis, via un champ de formulaire et réaffiché dans la page (par exemple comme indication du terme recherché dans le cas d'un moteur de recherche), le critère est non applicable.
  • nom commun de langue étrangère, non présent dans le dictionnaire officiel de la langue par défaut de la page Web et qui est passé dans le langage commun de la langue par défaut de la page Web (exemple : newsletter) : le critère est applicable, uniquement lorsque l'absence d'indication de langue peut provoquer une incompréhension pour la restitution
  • passage de texte dont la langue ne peut pas être déterminée : le critère est non applicable

Critère 10.11

Il existe une gestion de cas particulier pour les langues chinoises, japonaises et coréennes. Dans ces situations, le nombre de caractères de référence est de 40.

Critère 12.1

Il existe une gestion de cas particulier lorsque le site web est constitué d'une seule page ou d'un nombre très limité de pages (Cf. note) pour lesquels la fonction de recherche du navigateur dans le contenu est considérée comme équivalente à un moteur de recherche. Dans ce cas là, le critère est non applicable. Note : l'appréciation d'un nombre très limité de pages devrait réserver ce cas particulier à un site de 2 ou 3 pages, par exemple, avec un volume de contenu peu important.

Critères 12.2 - 12.3

Il existe une gestion de cas particulier lorsque les pages d'un ensemble de pages sont le résultat ou une partie d'un processus (un processus de paiement ou de prise de commande, par exemple) Dans ces situations, le critère est non applicable.

Critère 13.1

Il existe une gestion de cas particulier lorsque la limite de temps est essentielle, notamment lorsqu'elle ne pourrait pas être supprimée sans changer fondamentalement le contenu ou les fonctionnalités liées au contenu. Dans ces situations, le critère est non-applicable. Par exemple, le rafraichissement d'un flux RSS dans une page n'est pas une limite de temps essentielle ; le critère est applicable. En revanche, une redirection automatique qui amène vers la nouvelle version d'une page à partir d'une url obsolète est essentielle ; le critère est non applicable.

Critère 13.6

Il existe une gestion de cas particulier lorsque le document est produit de manière dynamique (par exemple une facture). Dans cette situation, l'indication de poids est facultative, les autres indications (type de fichier et langue) restent exigibles.

Critère 13.7

Il existe une gestion de cas particulier lorsque le document est protégé par un copyright, un droit d'auteur ou une clause juridique particulière qui en interdit la modification ou la création de copie modifiée. Dans ces situations, le critère est non-applicable.

Cellules d'en-tête (d'un tableau)

Cellules en-tête de colonne et en-tête de ligne (balise th) d'un tableau de données.

Champ de saisie de formulaire

objet d'un formulaire permettant à l'utilisateur :

  • de saisir des données textuelles :
    • input type="text"
    • input type="password"
    • textarea
  • de sélectionner des valeurs prédéfinies :
    • input type="checkbox"
    • input type="radio"
    • select
  • ou de télécharger des fichiers :
    • input type="file"

Les objets de formulaires suivants ne sont pas considérés comme des champs de formulaires :

  • input type="submit"
  • input type="reset"
  • input type="hidden"
  • input type="image"
  • input type="button"
  • button

Changement brusque de luminosité ou effets de flash

Alternance de luminosité relative qui peut causer des crises chez certaines personnes si leur taille est suffisamment importante dans une gamme de fréquences spécifiques.

Changement de contexte

Changements majeurs dans le contenu d'une page Web qui, s'ils sont faits sans que l'utilisateur n'en soit conscient, peuvent désorienter l'utilisateur qui ne peut voir l'ensemble de la page en même temps. Les changements de contexte comprennent les changements :

  1. d'agent utilisateur
  2. d'espace de restitution
  3. de focus
  4. de contenu qui modifie la signification de la page Web

Note : Un changement de contenu n'est pas toujours un changement de contexte. Un changement dans le contenu comme le déploiement d'une arborescence, un menu dynamique ou un déplacement de tabulation ne change pas nécessairement le contexte à moins qu'il ne change aussi l'un des éléments énumérés ci-dessus ( le focus, par exemple).

Exemple : l'ouverture d'une nouvelle fenêtre, le déplacement du focus sur un composant différent, le déplacement vers une nouvelle page (y compris tout ce qui, pour l'utilisateur, aurait l'air d'un déplacement vers une autre page) ou la réorganisation significative du contenu d'une page sont autant d'exemples d'un changement de contexte.

Code de langue

Code de 2 caractères (ISO 639-1) ou 3 caractères (ISO 639-2 et suivants) permettant d'indiquer la langue d'un document ou d'un passage de texte. L'indication du code de langue est constituée de deux parties séparées par un tiret sur le modèle lang="[code] - [option]".

  • [code] représente un code de langue valide sur 2 ou 3 caractères.
  • [option] est une indication laissée à l'appréciation de l'auteur.

Lorsqu'un code de pays est utilisé comme option, il peut servir à indiquer une régionalisation de la langue, l'indication "en-us" indique la langue américaine, par exemple. L'indication du code de langue ne concerne que la partie [code] avant le tiret.

Code valide

  • Cas d'une page HTML : code dans lequel l'implémentation des balises et des attributs respecte les spécifications du type de document déclaré.
    • Note 1 : Sauf indication contraire, les attributs non répertoriés par les spécifications sont non-applicables.
    • Note 2 : Sauf indication contraire (la balise bgsound, par exemple), les balises non répertoriées par les spécifications (la balise embed ou les balises audio/vidéo/canvas, par exemple) sont non-applicables.
    • Note 3 : La règle C3 de la spécification Xhtml ("Minimisation d'élément et contenu d'élément vide", en anglais) stipule que l'utilisation d'éléments minimisés (<code><elm /></code>) pour des éléments vides (par exemple <p /> à la place de <p></p>) est déconseillée. Cette pratique constitue une non-conformité dans le cadre d'AccessiWeb 2.
  • Cas d'une page implémentant WAI ARIA : code dans lequel l'implémentation des balises et des attributs respecte les spécifications du type de document déclaré et dans lequel l'implémentation WAI ARIA est conforme à la spécification WAI ARIA.

Cohérent (ordre de lecture)

Un contenu cohérent est lisible (l'ordre des éléments est logique) et compréhensible (l'enchainement de la lecture est cohérent).

Collection de pages

Pages reliées les unes aux autres par des liens et ayant un thème ou une nature commune. Par exemple, les pages de résultats d'un moteur de recherche ou les pages d'un catalogue (pour une même recherche) sont des collections de pages.

Compatible avec les technologies d'assistance

Compatible avec les technologies d'assistance des utilisateurs ainsi qu'avec les fonctions d'accessibilité des navigateurs et des autres agents utilisateurs via une API d'accessibilité.

Cela concerne, à la fois, la technologie, ses fonctionnalités et ses usages :

  • la façon dont la technologie Web est utilisée doit être compatible avec les technologies d'assistance des utilisateurs. Cela signifie que la façon dont la technologie est utilisée a été testée dans une perspective d'interopérabilité avec des utilisateurs des technologies d'assistance dans la ou les langues du contenu,
  • la technologie fonctionne de façon native dans des agents utilisateurs largement distribués qui sont, eux-mêmes, compatibles avec l'accessibilité (comme HTML et CSS) ou avec un module d'extension largement distribué qui est, lui-même, compatible avec l'accessibilité.

La vérification de la compatibilité avec les technologies d'assistance nécessite de réaliser un certain nombre de test spécifiques à la technologie utilisée. Par exemple, pour Flash, trois points principaux sont concernés :

  • nom, rôle, valeur et changement d'états des composants d'interface ;
  • alternative aux éléments graphiques ;
  • ordre de lecture du contenu.

Contenu d'une page Web

Informations (sous forme textuelle ou autre), services ou fonctionnalités proposés sur une page Web à l'exclusion des menus de navigation.

Contenu visible

Contenu présent et visible lorsque CSS est activé. Note 1 : il existe une différence entre "contenu présent" et "contenu visible" dans les tests associés au critère 10.2 Pour le test 10.2.1 : "Contenu présent" signifie que le contenu visible reste présent lorsque CSS est désactivé. Par exemple, une image porteuse d'information en propriété de fond CSS invalide ce test car l'information n'est plus "présente" lorsque CSS est désactivé. En revanche, une image porteuse d'information en propriété de fond CSS mais accompagnée d'un texte caché valide ce test car l'information est bien "présente" lorsque CSS est désactivé. Pour les tests 10.2.2 et 10.2.3, "contenu visible" signifie que le contenu reste visible lorsque les images ou les couleurs sont désactivés mais que CSS reste activé. Par exemple, une image en propriété de fond CSS invalide ces tests car le contenu "visible" devient "invisible" lorsque les images sont désactivées. En revanche, une image en propriété de fond CSS accompagnée d'un texte caché peut valider ces tests si le texte caché est "visible" lorsque les images ou les couleurs sont désactivés mais que CSS est activé. Note 2 : la pratique qui consiste à gérer des images en propriété de fond d'éléments via CSS est formellement déconseillée, même si elle est accompagnée d'un texte caché "visible" lorsque les images ou les couleurs sont désactivées.

Contexte du lien

Le contexte du lien représente les informations supplémentaires (on parle d'informations de contexte) qui peuvent être mises en relation par un programme informatique avec l'intitulé du lien. Les informations de contexte qui permettent de rendre un lien explicite sont les suivantes :

  • Le contenu de la phrase dans laquelle le lien texte est présent
  • Le contenu du paragraphe (balise p) dans lequel le lien texte est présent
  • Le contenu de l'item de liste (balise li) ou le contenu d'un item de liste parent (balise li) dans lequel le lien texte est présent
  • Le contenu du titre (balise H) précédant le lien texte
  • Le contenu de la ou les cellule(s) d'en-tête de tableau (balise(s) th) associée(s) à la cellule de donnée (balise td) dans laquelle le lien texte est présent
  • Le contenu de la cellule de donnée (balise td) dans laquelle le lien texte est présent
  • Le contenu du titre de lien (attribut title)

Note : l'un des 7 contextes de lien doit permettre à lui seul d'expliciter le lien.

Contraste

Opposition marquée entre une couleur de premier plan et une couleur d'arrière-plan. Le rapport de contraste est basé sur la différence de luminosité relative entre l'arrière-plan et le premier plan selon la règle : (L1 + 0,05) / (L2 + 0,05) où L1 est la luminosité relative la plus claire et L2 la luminosité relative la plus sombre. La luminosité est calculée selon la formule suivante : L = 0,2126 * R + 0,7152 * G + 0,0722 * B Où R, G et B sont définis par : si RsRGB >= 0,03928 alors R = RsRGB/12,92 sinon R = ((RsRGB+0,055)/1,055) ^ 2,4 si GsRGB >= 0,03928 alors --G = GsRGB/12,92 sinon G = ((GsRGB+0,055)/1,055) ^ 2,4 si BsRGB >= 0,03928 alors B = BsRGB/12.92 sinon B = ((BsRGB+0,055)/1,055) ^ 2,4 et RsRGB, GsRGB et BsRGB sont définis par : RsRGB = R8bit/255 GsRGB = G8bit/255 BsRGB = B8bit/255 Le caractère "^" est l'opérateur exponentiel.

Note : la mesure de contraste concerne le texte, le texte en image, le texte et le texte en image dans les animations, le texte de sous-titrage et le texte incrusté dans les vidéos. Pour le texte et le texte en image dans les animations, le texte de sous-titrage et le texte incrusté dans les vidéos, la taille de la police doit être mesurée par rapport à la taille d'affichage par défaut (telle qu'affichée). Les textes présents dans les éléments d'une image ou d'une vidéo (par exemple un écriteau, une affiche etc.) ne sont pas concernés.

Contrôlable par le clavier et la souris

Le contrôle d'une fonctionnalité par le clavier signifie que celle-ci est accessible via la touche tabulation et activable par la touche entrée à l'exception des composants d'interface implémentés via ARIA lorsqu'un motif de conception définit un ensemble d'interactions au clavier à respecter.

Contrôle (contenu en mouvement ou clignotant)

Possibilité pour l'utilisateur de contrôler l'affichage ou la lecture d'un contenu en mouvement ou clignotant par le clavier et la souris, au moins.

Contrôle de la consultation (d'un media temporel)

Possibilité pour l'utilisateur de contrôler la consultation d'un media temporel par le clavier et la souris, au moins. Les points suivants doivent être respectés :

  • liste des fonctionnalités de contrôle de la consultation obligatoires :
    • l'objet multimédia doit toujours avoir les fonctionnalités suivantes, au minimum : lecture, pause, stop,
    • si l'objet multimédia a du son, il doit avoir une fonctionnalité de contrôle du volume,
    • si l'objet multimédia a des sous-titres, il doit avoir une fonctionnalité de contrôle de l'apparition/disparition des sous-titres,
    • si l'objet multimédia a une audio-description, il doit avoir une fonctionnalité de contrôle de l'apparition/disparition de l'audio-description.
  • chaque fonctionnalité doit être accessible par le clavier, via la touche de tabulation, et par la souris au moins,
  • chaque fonctionnalité doit être activable par le clavier et par la souris, au moins.

Note : s'il n'y a pas de son à un media temporel, il n'est pas utile de mettre une fonctionnalité de contrôle du volume.

Contrôle de saisie (formulaire)

Ensemble des processus qui permettent de prévenir l'utilisateur des champs obligatoire, des indications de type ou de format attendus et des erreurs de saisie dans un formulaire. Ces contrôles de saisie peuvent être implémentées par l'auteur des contenus ou s'appuyer sur des attributs (comme required ou pattern), des propriétés ARIA (comme aria-required) ou des types de champ qui produisent de manière automatique des indications de saisie ou d'erreurs (comme les types url, email, date, time par exemple).

Note importante : lorsqu'une page est renvoyée avec des erreurs de saisie le titre de la page doit comporter la mention "erreur sur le formulaire".

Couleur (porteuse d'information)

Couleur qui a une fonction particulière (exemple : portions colorées d'un graphique en forme de camembert, délimitation de zones dans une image par l'utilisation de la couleur, expression d'un sentiment par la couleur, comme le rouge pour la colère...).

Critère AccessiWeb

C'est une condition à respecter pour valider un point d'accessibilité. Un critère peut être :

  • valide : si la condition est vérifiée,
  • non valide : si la condition n'est pas vérifiée,
  • non applicable : si l'élément sur lequel porte la condition n'est pas utilisé sur la page analysée ou en raison d'un cas particulier.

Un critère est défini par :

  • le numéro de la thématique à laquelle il appartient, suivi d'un point,
  • son numéro d'apparition dans la thématique,
  • son niveau d'exigence, le premier étant le Bronze, puis l'Argent, puis l'Or,
  • son intitulé,
  • exemple : Critère 1.1 [Bronze] : Chaque image a-t-elle une alternative textuelle ?

Lettre D

Description détaillée (image)

Contenu associé à une image en complément de son alternative textuelle afin de décrire en totalité l'information véhiculée par l'image. La description détaillée peut être insérée via :

  • un attribut longdesc qui contient l'adresse d'une page ou d'un emplacement dans la page contenant la description détaillée,
  • une référence, dans l'attribut alt, à une description détaillée adjacente à l'image,
  • un lien adjacent à l'image qui contient l'adresse d'une page ou d'un emplacement dans la page contenant la description détaillée.

Lettre E

En-tête de colonne ou de ligne

Contenu d'une cellule dans un tableau de données (la première cellule d'une colonne ou d'une ligne, généralement) qui sert d'intitulé pour une ou toute partie des cellules de la colonne ou de la ligne. Une colonne ou une ligne peut contenir plusieurs en-têtes (en-tête intermédiaire). Les en-têtes doivent utiliser une balise TH.

Ensemble de pages

Pages Web liées les unes aux autres par des liens et constituant un ensemble cohérent à l'intérieur d'un site Web. Par exemple, les pages d'un processus de paiement électronique, les pages d'une rubrique spécifique, les pages d'un blog, les pages d'administration d'un compte client sont autant d'ensembles de page. Note : La page d'accueil d'un site Web peut constituer, à elle seule, un "ensemble de pages" du fait de son unicité.

Environnement maîtrisé

Tout environnement dans lequel l'accès à l'information, les technologies, les conditions d'utilisation et le profil des utilisateurs peuvent être connus et maîtrisés. Les principaux éléments dont la maîtrise est essentielle sont :

  • Le type et la version des navigateurs
  • Les technologies supportées, leur version et leur activation (Javascript, ARIA, Flash...)
  • Les technologies d'assistance et tout dispositif utilisé de manière spécifique par les utilisateurs handicapés
  • Les systèmes d'exploitation et les Apis d'accessibilités supportées
  • La formation des utilisateurs de technologies d'assistance à l'utilisation de tout dispositif particulier (interface, application en ligne...)

Un système d'information en environnement maîtrisé peut s'abstenir de fournir des alternatives au Javascript ou aux technologies tierces (Flash...). Les auteurs et les administrateurs doivent, en revanche, garantir la compatibilité des technologies utilisées et de leurs usages par les utilisateurs et leurs technologies (y compris les technologies d'assistance). Les services d'information ou les sites web, quel que soit leur statut, qui offrent un accès public ne peuvent pas être considérés comme des environnements maîtrisés.

Etiquette de champs de formulaire

Texte à proximité du champ de formulaire permettant d'en connaître la nature, le type ou le format des informations attendues. L'étiquette peut être associée au champ de formulaire de plusieurs manière : par l'utilisation d'une balise

Explicite hors contexte (lien)

Un lien doit être explicite hors contexte, c'est-à-dire que son intitulé de lien (s'il n'y a pas de titre de lien) ou alors son titre de lien (si présent) doit être explicite hors contexte (exemple : un lien - sans titre de lien - avec seulement l'intitulé de lien "Lire la suite" n'est pas explicite hors contexte). En rédaction de contenu Web, il faut privilégier un intitulé de lien explicite hors contexte plutôt qu'un intitulé de lien non explicite avec un titre de lien venant le rendre explicite hors contexte.

Lettre F

Feuille de style

Le langage CSS destiné à la mise en forme des éléments du contenu (exemples : couleur du fond de la page, taille/police/couleur des caractères, positionnement de l'information dans la page Web...). Les styles CSS peuvent être externes (fichier CSS), embarqués (déclarés dans l'en-tête de la page) ou en ligne (déclarés via l'attribut style d'une balise).

Fonctionnalités de contrôle (media temporel)

Il s'agit des fonctionnalités de contrôle de la consultation (objet multimédia) suivantes :

  • l'objet multimédia doit toujours avoir les fonctionnalités suivantes, au minimum : lecture, pause, stop ;
  • si l'objet multimédia a du son, il doit avoir une fonctionnalité permettant d'activer ou de désactiver le son et d'en contrôler le niveau sonore ;
  • si l'objet multimédia a des sous-titres, il doit avoir une fonctionnalité de contrôle de l'apparition/disparition des sous-titres ;
  • si l'objet multimédia a une audio-description, il doit avoir une fonctionnalité de contrôle de l'apparition/disparition de l'audio-description.

Note : s'il n'y a pas de son à un objet multimédia, il n'est pas utile de mettre une fonctionnalité de contrôle du volume. Si cette fonctionnalité est cependant présente et qu'elle nécessite une alternative textuelle pour être comprise par certains utilisateurs (exemple : bouton "volume" dans une vidéo en Flash), il faut, alors, lui en donner une puisque l'utilisateur est susceptible d'y accéder et de vouloir l'activer.

Formulaire

Balise form permettant d'insérer un ou plusieurs champs de formulaire réunis en blocs d'informations de même nature en vue d'un traitement commun (soumission). Exemples : un formulaire d'inscription, un calendrier... Un formulaire peut avoir un ou plusieurs boutons.

Lettre I

Image

Fichier de type graphique (format : gif, jpg, png...) incorporé dans un contenu Web par une des techniques suivantes :

  • balise img
  • balise input avec l'attribut type="image" (bouton de formulaire)
  • balise applet (image applet)
  • balise object avec l'attribut type="image/..." (image objet)

Note : Les liens images doivent être traités dans la thématique Liens, uniquement (cas particulier pour le longdesc : les critères 1.6 et 1.7 s'appliquent à une image contenue dans un lien).

Image applet

Image incorporée ou générée par une balise applet.

Image de décoration

image n'ayant aucune fonction et ne véhiculant aucune information particulière par rapport au contenu auquel elle est associée. Exemples :

  • une image servant à caler la mise en page,
  • une image de coin arrondie pour habiller un bloc d'information,
  • une image d'illustration n'apportant aucune information nécessaire à la compréhension du texte auquel elle est associée.

Image objet

Image incorporée ou générée par une balise object.

Image porteuse d'information

Image qui véhicule une information nécessaire à la compréhension du contenu auquel elle est associée.

Image réactive

  1. image réactive côté client (attribut usemap) : image divisée en zones cliquables ou neutres (attribut nohref).
  2. image réactive côté serveur (attribut ismap) : image pour laquelle le navigateur transmet au serveur les coordonnées du pointeur, chaque jeu de coordonnées correspondant à une ressource (page Web). L'image réactive côté serveur est extrêmement rare.

Image-test

Image servant dans un test, Captcha ou une image servant de test dans un Quiz ou un jeu. Exemple : une série d'images présentent un détail issu de tableau célèbres; il faut reconnaître le titre et le peintre de chaque tableau. Dans cette situation, il n'est pas possible de donner une alternative pertinente (e.g le nom du tableau et/ou du peintre) sans rendre le test inutilisable. L'alternative doit alors se contenter de donner la possibilité d'identifier l'image; par exemple "image 1 du test".

Image texte

Image affichant du texte.

Image texte applet

image incorporée ou générée par la balise applet et affichant du texte.

Image texte objet

image générée par la balise object et affichant du texte.

Image véhiculant une information (donnée par la couleur)

image dont tout ou partie du contenu transmet visuellement une information par l'intermédiaire d'une couleur uniquement.

Information (donnée par la couleur)

information transmise visuellement par l'intermédiaire d'une couleur.

Information sonore (media temporel)

ensemble des informations audio présentes dans un media temporel : paroles des personnages et bruits importants car nécessaires à la compréhension de l'action.

Information visuelle (media temporel)

ensemble des informations visuelles présentes dans un media temporel et nécessaires à la compréhension générale de l'action : les personnages et leurs attitudes/mouvements importants, l'environnement (intérieur, extérieur...), les objets...

Intitulé de lien

Information textuelle comprise entre <a href="..."> et </a> d'un lien complété si nécessaire d'information de contexte. Les 3 différents types de liens sont :

  • lien texte : il s'agit du texte compris entre <a href="..."> et </a> complété si nécessaire d'information de contexte,
  • lien image : il s'agit du contenu de l'alternative textuelle de l'image comprise entre <a href="..."> et </a> complété si nécessaire d'information de contexte,
  • lien composite : il s'agit de l'ensemble du texte et du contenu de l'alternative textuelle de ou des images compris entre <a href="..."> et </a> complété si nécessaire d'information de contexte .

Note : Un lien image pour lequel l'attribut alt est absent est considéré comme non applicable pour le critère 6.6

Intitulé de lien seul

Contenu entre la balise <a href=""> et </a> considéré sans information complémentaire (attribut title ou information de contexte).

Lettre J

Jusqu'à ou à partir de 150% (1.5em) de la taille de police par défaut sans effet de graisse Jusqu'à ou à partir de 120% (1.2em) de la taille de police par défaut en gras

Ces deux mesures déterminent la taille relative des caractères correspondant à une taille de caractères équivalent à 14 points gras ou 18 points sans effet de graisse en considérant que la police de corps (body) est à 100%. Note : jusqu'à 150% et jusqu'à 120% signifie que la taille des caractères est strictement inférieure à 150 ou 120 %. A partir de 150% et à partir de 120% signifie que la taille des caractères est égale ou supérieure à 150 ou 120%.

Lettre L

Langue par défaut

indication de la langue de traitement principale du document qui peut être présente sur l'élément racine Html ou sur chaque élément de la page concerné via les attributs lang et/ou xml:lang selon le schéma suivant :

  • pour HTML jusqu'à la version 4.01 : attribut lang obligatoire, attribut xml:lang non supporté
  • pour XHTML 1.0 servi en "text/html" : attribut lang et xml:lang obligatoires
  • pour XHTML 1.0 servi en "application/xhtml+xml" : attribut xml:lang obligatoire, attribut lang recommandé
  • pour XHTML 1.1 : attribut xml:lang obligatoire, attribut lang non supporté

Lecteur d'écran

Logiciel capable de récupérer les informations apparaissant à l'écran et de les restituer à l'utilisateur autrement que visuellement. Généralement, la retransmission de l'information se fait sous forme de voix de synthèse ou sous forme d'un affichage en braille, ce qui nécessite un terminal spécialisé.

Lecture linéaire

Lecture des éléments du contenu dans l'ordre dans lequel ils sont écrits dans le code source.

Légende d'image

HTML5 propose d'associer une légende à une image via les éléments <figure> (l'ensemble de l'image et la légende) et <figcaption> (la légende).

Une image sans légende peut définir :

  • Une image qui n'est pas insérée dans un élément <figure>
  • Une image insérée dans un élément <figure> sans élément <figcaption>

Lien

Élément HTML (balise a) activable par l'utilisateur (par la souris, le clavier...) et déclenchant une action (affichage d'une page Web, téléchargement d'un fichier...) ou un évènement généré par un script. Un lien possède au minimum :

  • une référence de ressource (attribut href)
  • un intitulé de lien compris entre <a href="..."> et </a>

Lien adjacent

Lien présenté de manière adjacente dans la représentation graphique (CSS activé) et dans le code Html. Dans le code Html, le lien doit se situer juste avant ou juste après l'objet avec lequel il est adjacent.

Lien explicite hors contexte

Un lien est explicite hors contexte lorsque l'intitulé du lien seul (contenu entre la balise <a href="..."> et </a>) permet de connaître et de comprendre la fonction et la destination du lien.

Lien composite

Lien dont le contenu entre <a href="..."> et </a> est constitué de 2 éléments de types différents, au moins ; par exemple, du texte et une ou plusieurs images. L'intitulé de lien pour un lien composite est l'ensemble du texte et du contenu de l'alternative textuelle de ou des images compris entre <a href="..."> et </a>.

Lien dont la nature n'est pas évidente

Lien qui peut être confondu avec un texte normal lorsqu'il est signalé uniquement par la couleur par certains types d'utilisateurs ne percevant pas ou mal les couleurs. Par exemple, dans ce texte "Nouvelle grève à la SNCF", si le mot "grève" est un lien signalé uniquement par la couleur, sa nature peut être ignorée par les utilisateurs ne percevant pas la couleur et accédant au contenu CSS activées. En revanche, dans ce texte " Nouvelle grève à la SNCF, lire la suite" si "lire la suite" est un lien, un utilisateur ne percevant pas les couleurs n'aura pas de problème pour en comprendre la nature.

Note : "signalés uniquement par la couleur" signifie que le lien n'est accompagné d'aucun marqueur visuel (icône, soulignement, bordure...). En conséquence un lien de la même couleur que le texte environnant est concerné par ce critère.

Liens identiques

Deux liens sont dits identiques quand le lien x (intitulé du lien seul, contenu de l'attribut title ou contexte du lien) est égal au lien y. Cette définition s'applique à tous les types de liens : lien texte, lien image (les liens ont alors la même image) et lien composite. Attention : des liens avec des intitulés identiques mais des titres de liens différents ou des contextes de liens différents ne sont pas identiques (exemple : <a href="lien_bar.html" title="cliquer ici pour télécharger la barre d'outils">cliquer ici</a> et <a href="lien_doc.html" title="cliquer ici pour télécharger le document">cliquer ici</a>).

Liens d'évitement ou d'accès rapide

Liens dont la fonction est de permettre de naviguer à l'intérieur du contenu (lien d'évitement, lien d'accès au formulaire de recherche ou au menu..).

Lien image

Lien dont le contenu entre <a href="..."> et </a> est uniquement constitué d'une image. L'intitulé de lien pour un lien image est le contenu de l'alternative textuelle de l'image.

Lien texte

Lien dont le contenu entre <a href="..."> et </a> est uniquement constitué de texte (il s'agit de son intitulé de lien).

Lien vide

Un lien est considéré vide lorsque qu'il n'y a aucun contenu entre <a href="..."> et </a> et qu'il ne s'agit pas d'une ancre nommée.

Linéariser un tableau

Opération visant à afficher toutes les cellules d'un tableau en succession verticale dans l'ordre dans lequel elles sont insérées dans le code source.

Listes

Suite d'éléments pouvant être regroupés sous la forme d'une liste structurée ordonnée, non ordonnée ou de définition. Par exemple la suite des liens d'un menu de navigation est une liste de liens non ordonnée, les différentes étapes d'une procédure est une liste d'éléments ordonnées, le couple terme/définition d'un glossaire est une liste de définition. En HTML, les listes utilisent les balises suivantes :

  • Liste ordonnée : balises ol et li (chaque item de la liste est affecté d'un marqueur non-incrémenté)
  • Liste non ordonnée : balises ul et li (chaque item de la liste est affecté d'un marqueur incrémenté)
  • Liste de définition : balise dl, dt (terme à définir) et dd (définition)

Liste de choix

Champ de formulaire affichant une série d'items à sélectionner sous forme d'une liste déroulante (balise select avec des balises option).

Lettre M

Mécanisme de remplacement

Mécanisme généralement basé sur CSS, permettant à l'utilisateur de remplacer du texte par du texte en image et inversement sur le principe du style switcher. Le mécanisme peut utiliser un langage de script coté serveur ou un langage de script coté client.

Média temporel (type son, vidéo et synchronisé)

  • Média temporel seulement audio : contenu sonore (Wawe, Mp3...)
  • Média temporel seulement vidéo : images ou photos en mouvement ou en séquence
  • Média temporel synchronisé : flux audio ou vidéo synchronisé avec un autre format pour présenter de l'information et/ou comportant des composants temporels interactifs. Un média temporel peut être consulté de 2 manières différentes :
    • fichier à télécharger consultable avec un logiciel externe à la page Web,
    • contenu embarqué dans la page Web et consultable dans la page Web via :
      • Un plugin (par exemple une vidéo diffusée par un lecteur Flash)
      • L'élément video (par exemple une vidéo)
      • L'élément audio (par exemple un podcast)
      • L'élément svg (par exemple un dessin animé vectoriel)
      • L'élément canvas (par exemple un dessin animé en image bitmap)

Un média temporel peut être diffusé en temps réel ou être proposé en lecture de manière asynchrone (média pré-enregistré).

Note 1 : l'utilisation du paramètre wmode pour un objet Flash avec les valeurs "transparent" et "opaque" invalide de fait le critère 4.20 (La consultation de chaque média temporel est-elle contrôlable par le clavier et la souris ?). En effet, l'utilisation de ces valeurs a pour conséquence que l'animation Flash vue du côté des utilisateurs de lecteur d'écran est invisible.

Note 2 : les gif animés, les animations d'images réalisées par javascript ou CSS ne sont pas considérés comme étant des média temporels.

Média non temporel

Contenu qui ne se déroule pas dans le temps, consultable via un plugin (Flash, Java, Silverlight...) ou via les éléments svg et canvas; par exemple, une carte interactive en Flash, une application Flash ou Java, un diaporama sont des médias non temporels. Un média non temporel peut contenir des médias temporels (un lecteur Flash qui propose une liste de vidéos à consulter, par exemple).

Note : Note : l'utilisation du paramètre wmode pour un objet Flash avec les valeurs "transparent" et "opaque" invalide de fait le critère 4.21 (La consultation de chaque média non temporel est-elle contrôlable par le clavier et la souris ?). En effet, l'utilisation de ces valeurs a pour conséquence que l'animation Flash vue du côté des utilisateurs de lecteur d'écran est invisible..

Ensemble cohérent de liens ou d'éléments similaires (champs de formulaire, éléments d'une animation, éléments générés par un script) permettant de naviguer dans un ensemble de pages Web

Moteur de recherche (interne à un site Web)

Fonction qui permet à l'utilisateur de trouver une information spécifique dans un site Web via l'utilisation d'un formulaire. Le moteur de recherche doit pouvoir effectuer sa recherche sur la totalité des informations d'un site Web consultables par l'internaute (le contenu des fichiers en téléchargement n'est pas inclus dans la définition). Il est recommandé que le moteur de recherche puisse accepter une tolérance aux fautes d'orthographe.

Motif de conception

Un motif de conception (Design Pattern)est un modèle definit par l'API ARIA qui décrit la structure, les rôles et propriétés et le comportement que doivent respecter un composant javascript (widget).

Le smotifs de conception sont décrits dans le document : WAI-ARIA 1.0 Authoring Practices

Un composant développé avec Javascript doit respecter le motif de conception correspondant au role ARIA utilisé.

Modification du rôle natif d'un élément HTML

La spécification ARIA permet de modifier le rôle natif d'un élément, par exemple modifier un élément A HREF en élément BUTTON.

Ces modification ne peuvent être réalisés que sous certaines conditions décrites dans le document : Using WAI-ARIA in HTML qui définit un certain nombre de restrictions notamment.

Pour qu'une modification du rôle natif d'un élément HTML via ARIA soit compatible il faut que les restrictions soient respectées.

Lettre N

Navigateur Web qui permet la visualisation à l'écran d'éléments textuels, graphiques, multimédias... Synonyme(s) : navigateur en mode graphique (source : Office québécois de la langue française).

Navigateur restituant l'information sous forme textuelle. La restitution des éléments non-textuels du contenu se fonde sur les alternatives textuelles lorsqu'elles sont présentes. Synonyme(s) : navigateur en mode texte.

Navigateur vocal

Navigateur restituant le contenu en particulier via une synthèse vocale intégrée.

Nom de domaine

Désignation unique d'un site Web; par exemple, www.accessiweb.org, qui permet d'y accéder. Un nom de domaine peut avoir des sous-domaines.

Lettre O

Ordre de tabulation

Ordre dans lequel le focus se déplace (vers un élément suivant ou vers un élément précédent). L'ordre naturel est celui qui est implémenté via le code source. Lorsqu'il est modifié par l'utilisation de l'attribut tabindex ou par l'utilisation de commande javascript, c'est l'ordre modifié qui fait référence. Attention : lorsqu'un élément initie un changement dans la page (changement de contexte, gestion de zones cachées, ajout de contenu, gestion de champs de formulaire...) il est nécessaire d'activer l'élément qui initie le changement pour tester la cohérence de l'ordre de tabulation.

Lettre P

Page "plan du site"

Page dédiée présentant l'arborescence d'un site Web, généralement sous forme de listes de liens organisées en rubriques et sous-rubriques donnant accès à l'ensemble des pages du site. Note : les liens du plan du site peuvent être constitués de balises a ou de balises area.

Page Web

Contenu consultable dans un navigateur Web à partir d'une url unique.

Pertinence (information autrement que par la couleur)

Le moyen pour récupérer une information autrement que par la couleur doit être accessible à tous. Par exemple, dans le cas d'une liste d'articles dont les articles en jaune sont en promotion, l'utilisation de texte caché via CSS est un moyen de récupérer l'information "en promotion", mais il n'est pas pertinent car cette information restera cachée à l'utilisateur qui visualise la page CSS activée.

Note : l'utilisation d'une balise d'emphase (strong ou em) comme autre moyen pour récupérer une information donnée par la couleur permet de valider le critère même si ces éléments ne sont généralement pas supportés par les technologies d'assistance, particulièrement les lecteurs d'écrans.

Point de contrôle WCAG (ou checkpoint)

Ce terme est employé dans les documents de WAI, et en particulier les WCAG 1.0. Il détermine une condition à vérifier en termes d'accessibilité d'une page web.

Présentation de l'information

Restitution visuelle des contenus via un navigateur en mode graphique. La présentation concerne le style, la position et les dimensions des éléments Html et de leur contenu. La présentation de l'information doit être réalisée via CSS. Les éléments (basefont, blink, center, font, marquee, s, strike, tt, u) et les attributs (align, alink, background, basefont, bgcolor, border, color, link, text, vlink) sont interdits. Les attributs width et height utilisés sur d'autres éléments que des images (balise img) sont également interdits.

Présentation similaire

Restitution cohérente et uniforme des informations contenues dans un même ensemble de pages Web. Une présentation similaire de l'information permet d'harmoniser l'expérience utilisateur en ce qui concerne, notamment , l'identification des éléments particulièrement structurants (menus de navigation, titres, organisation du contenu...).

Prise de focus

La prise de focus est l'état renvoyé par un élément qui reçoit l'attention suite à une action de l'utilisateur. Il y a trois moyens en Html de donner le focus à un élément :

  • en activant l'élément par un dispositif de pointage (souris)
  • en activant l'élément par la touche tabulation
  • en activant l'élément par un raccourci clavier (accesskey)

Les éléments qui reçoivent naturellement le focus sont : A, Area Button, Input, Object, Select, label, Legend, Optgroup, Option et Textarea. Le comportement de l'élément, lors de la prise de focus, dépend de sa nature ; un lien, par exemple, devra être activé après la prise de focus (sauf utilisation de script). En revanche, un élément de formulaire, comme textarea, devra autoriser la saisie suite à la prise de focus. Les éléments label et legend ne reçoivent la prise de focus que via le pointeur souris ou l'attribut accesskey. Pour l'élément label, le comportement attendu est de transférer la prise de focus sur l'élément qui lui est associé. Note : la spécification ARIA étend le rôle attribué à l'attribut tabindex en définissant que tout élément Html peut acquérir la possibilité de recevoir le focus en lui attribuant la valeur tabindex="0". En revanche, aucun comportement n'est attribué via la seule présence de tabindex. De même, la valeur tabindex="-1" retire l'élément qui en est affecté du plan de tabulation en inhibant sa capacité à signaler la "prise de focus". L'utilisation de tabindex, conformément à la spécification ARIA, peut valider certains tests relatifs à la gestion du focus de tabulation, notamment.

Procédé de rafraîchissement

Technique visant à modifier le contenu d'un ou de plusieurs éléments de la page Web. Le procédé de rafraîchissement peut s'effectuer par rechargement automatique de la page ou de manière dynamique sans rechargement de la page (via AJAX, par exemple:). L'utilisateur doit pouvoir contrôler chaque procédé de rafraîchissement de manière indépendante.

Processus utilisateur

Séries d'actions faites par l'utilisateur où chaque action est nécessaire afin de finaliser l'acte en ligne. Exemples : un acte d'achat sur un site marchand avec un panier de produits, la déclaration en ligne des revenus... L'accessibilité d'un processus est testée de la même manière que pour un script : il convient de tester l'accessibilité d'un processus en testant s'il est contrôlable par le clavier et la souris, au moins, et en testant si son alternative (si nécessaire) est accessible.

Propriété CSS déterminant une couleur

Cela concerne les propriétés suivantes : color, background-color, background, border-color, border, outline-color, outline. Note : l'utilisation d'une image de fond pour insérer une couleur (propriété bakground:url...) est également concernée.

Lettre R

Redirection automatique

Procédé qui consiste pour l'affichage d'une page sur le poste client à rediriger automatiquement l'utilisateur vers une autre page, sur le même domaine ou sur un domaine différent.

Correctement restituée par les Technologies d'Assistance

Lorsqu'un critère, un test ou une condition de test demande de vérifier la restitution d'un dispositif il faut s'assurer que ladite resitution est compatible avec l'accessibilité.

Le test consiste à vérifier que la restitution est pertinente pour au moins une des combinaison de la base de référence utilisée pour déclarer qu'un élement, un dispositif ou un alternative est "compatible avec l'accessibilité"

Par exemple : le test 1.3.7 demande de vérifier que l'alternative d'une image porteuse d'information vectorielle est correctement restituée

On procède alors à un test avec NVDA (dernière version) et Firefox, JAWS (version précédente et IE9+ et Voice Over (dernière version) et Safari

Si on constate que l'alternative est correctement restituée, le test est validé.

Résumé (de tableau)

Un résumé est un passage de texte associé à un tableau de données complexe. Il permet de donner des informations sur la nature et la structure du tableau afin d'en faciliter l'utilisation par les utilisateurs de technologies d'assistance par exemple

Role ARIA équivalent (surcharge de rôle)

Afin de pallier à l'implémenation progressive des nouveaux éléments HTML5 et pour des raisons de rétro-compatibilité le document Using WAI-ARIA in HTML préconise de surcharger les rôle natif des éléments HTML par leur équivalent ARIA, par exemple un élément article devra comporter un attribut role="article".

Ces surcharges de rôles natifs doivent être respectées.

Lettre S

Script

Code généralement écrit sous forme d'une liste de commandes (par exemple javascript). Les langages interprétés côté client nécessitent un navigateur compatible sur lequel l'exécution du langage est active. Les commandes d'un langage de script côté client peuvent être embarquées ou contenues dans un fichier externe. Dans les deux cas, l'insertion se fait via la balise <script>.

Sens de lecture

Indique le sens de lecture du document ou d'un passage de texte via l'attribut dir, dir="ltr", par exemple. Les deux valeurs reconnues sont :

  • "ltr" (left to right) indique un sens de lecture de gauche à droite
  • "rtl" (right to left) indique un sens de lecture de droite à gauche

Note : En l'absence d'indication de sens de lecture via l'attribut dir sur l'élément html, body, ou un des parents du texte analysé, le sens de lecture par défaut est de gauche à droite (valeur "ltr").

Sigle

abréviation formée avec la première lettre de chacun des mots qui la composent (balise abbr). Un sigle se prononce lettre à lettre (ex. SNCF, RATP...).

Site Web : ensemble de toutes les pages Web

  • reliées par des liens Web,
  • appartenant au même nom de domaine (ex : accessiweb.org),
  • qui constituent un ensemble cohérent du point de vue de l'utilisateur.

Cas particulier des pages Web d'un sous-domaine ; un sous-domaine peut :

  • soit appartenir au site Web attaché au nom de domaine, si l'utilisateur en a une perception cohérente avec les autres pages du site Web (par exemple : même structure, même navigation...),
  • soit ne pas appartenir au site Web attaché au nom de domaine (par exemple : différents blogs en sous-domaine d'un nom de domaine et sans relation les uns avec les autres).

Sous-domaine

Espace sur un serveur Web accessible par un identifiant associé à un nom de domaine. Exemple : http://sousdom.site.com est un sous-domaine du nom de domaine site.com. Cette adresse correspond à l'url http://www..site.com/nom_du_sous_domaine où nom_du_sous_domaine est un répertoire.

Sous-titres synchronisés (objet multimédia)

Texte des informations audio (paroles d'un personnage, bruit important pour comprendre l'action...) présentes dans un média temporel et affiché de manière synchrone avec le flux de l'objet multimédia. Note : Pour différencier les sources sonores (différents personnages, voix off...), il est recommandé d'utiliser un mécanisme approprié (mise entre crochets, mise en italique, annonce explicite du type "voix off : ...").

Structure similaire

Structure HTML cohérente et uniforme dans un même ensemble de pages Web.

Synthèse vocale

Dispositif logiciel qui restitue une information sous forme vocale. Les lecteurs d'écran et navigateurs vocaux sont généralement livrés avec une ou deux synthèses vocales intégrées et capables de traiter plusieurs langues. Synonyme(s) : voix de synthèse, moteur de synthèse vocale.

Système de navigation

Tout procédé permettant une navigation dans le site ou dans une page, les systèmes de navigation retenus sont :

  • Menu de navigation principal
  • Table de contenu
  • Plan du site
  • Moteur de recherche

Lettre T

Tableau

Élément HTML (balise table) permettant d'incorporer des contenus dans des cellules disposées en ligne et en colonne. Il y a des tableaux de données simple, complexe ou de mise en forme.

Tableau de données complexe

Lorsqu'un tableau de donnée contient des en-têtes qui ne sont pas répartis uniquement sur la première ligne et/ou la première colonne de la grille ou dont la portée n'est pas valable pour l'ensemble de la colonne ou de la ligne, on parle de tableau de données complexe. Il est alors nécessaire de fournir un "résumé" permettant d'en expliquer sa nature et sa structure afin d'en faciliter la consultation pour des utilisateurs de technologies d'assistance par exemple.

Tableau de mise en forme

Technique qui utilise un élément Html (balise table) pour contrôler l'affichage d'information via des cellules (balise td).

Taille des caractères

Valeur attribuée aux polices de caractères présentes sur une page Web. Pour les contenus web, les tailles de caractères doivent être définies avec des unités relatives (% ou em) ou des mots clés (xx-small, xx-small, x-small, small, medium, large, x-large, xx-large, xsmaller, or larger). Note : l'utilisation du pixel (px) est proscrite.

Taille de police par défaut

La taille de police par défaut est la taille définie par l'auteur pour le document ou, en son absence, la taille par défaut utilisée par l'agent-utilisateur (ie le navigateur)

Texte caché

Les technologies d'assistance (notamment les lecteurs d'écrans) ne restituent pas le texte masqué via les propriétés :

  • display avec la valeur none (display:none)
  • visibility avec la valeur hidden (visibility :hidden)
  • width et height avec les valeurs 0 (width:0;height:0)
  • font-size avec la valeur 0 (font-size:0)

Tous les contenus texte utilisant une ou plusieurs de ces propriétés sont applicables pour le critère 10.13.

Texte stylé

Texte dont la mise en forme est contrôlée par une feuille de style.

Thématique AccessiWeb

Les critères du référentiel AccessiWeb sont classés en 13 rubriques couvrant l'ensemble des éléments constitutifs d'un site Internet. Ces rubriques sont aussi appelées thématiques et numérotées de 1 à 13.

Titre

Élément HTML (balise h) à 6 niveaux de hiérarchie (de h1 pour le titre le plus important à h6 pour le moins important) permettant de structurer l'information d'un contenu Web. La hiérarchie entre les titres doit être respectée dans une page Web et les degrés de titre ne peuvent pas être sautés (un titre h3 ne peut pas venir directement après un titre h1, par exemple). Dans chaque page Web, il doit y avoir un titre h1, au moins.

Note : les titres cachés via CSS sont considérés comme présents et valident le critère 9.1.

Titre de cadre

Contenu de l'attribut title de la balise frame ou iframe.

Titre de lien

Contenu de l'attribut title d'un lien. Ce contenu ne doit être présent que s'il est nécessaire pour identifier la destination du lien de manière explicite. Un titre de lien doit reprendre l'intitulé de lien en y ajoutant des informations. Un titre de lien sera considéré comme non-pertinent dans les cas suivants :

  • Le titre de lien est vide
  • Le titre de lien est identique à l'intitulé du lien (Cf. note 1)
  • Le titre de lien ne reprend pas l'intitulé du lien

Note 1 : Par exception, un titre de lien identique à l'intitulé est accepté dans le seul cas d'un lien image (lien ne contenant que des images), une icône par exemple.

Titre de page

Contenu de la balise title d'une page Web permettant d'identifier de manière claire, concise et unique les contenus/la nature de la page ("Plan du site www.nomdusite.fr" pour une page présentant le plan du site Web ", par exemple).

Titre d'un tableau (de données)

Contenu d'un élément Html (balise caption) qui permet d'identifier le contenu d'un tableaux de données de manière claire et concise.

Transcription textuelle (media temporel)

contenu textuel associé à un media temporel par la technique appropriée (texte codé en Html ou dans un fichier texte qui se trouve dans la même page ou consultable suivant un lien). Ce contenu donne à l'utilisateur (de manière indépendante de la consultation de l'objet multimédia) :

  • la totalité de ce qui y est exprimé oralement,
  • toutes les informations descriptives nécessaires à une compréhension équivalente de l'action.

Ces informations textuelles doivent être présentées dans l'ordre chronologique de leur apparition dans le media temporel. Note : si la transcription textuelle se situe à l'extérieur de la balise object, il n'est pas nécessaire de la répéter à l'intérieur de cette balise.

Type de document

Ensemble de données de références qui permet aux agents utilisateurs de connaître les caractéristiques techniques des langages utilisés sur la page Web (balise doctype).

Type et format de données

Indication concernant le type et le format des données attendue lors de la saisie d'un champ de formulaire. Par exemple :

  • "date (jj/mm/aaa)"
  • "montant en euros"
  • "Code postal (5 chiffres : ex. 75001)"

Note importante : lorsque le type de champ de formulaire propose un masque de saisie, comma par exemple les champs date ou time, l'indication de format n'est pas nécessaire.

Lettre U

Url

Adresse permettant d'accéder aux ressources du World Wide Web : document HTML, pages Web, image, son... Note : dans le référentiel AccessiWeb, la notion d'url est utilisée à la place de uri (chaîne de caractères compacte identifiant une ressource).

Uniquement à des fins de présentation

Uniquement à des fins de présentation : utilisation de balises html pour une finalité différente de celle prévue dans les spécifications (au regard du type de document déclaré). Exemples : utilisation des balises h à seule fin de créer un effet typographique ; utilisation de la balise blockquote à seule fin de mettre un paragraphe en retrait, etc. Note 1 : l'utilisation d'éléments DIV ou SPAN pour créer des paragraphes est considérée comme non conforme de ces éléments et invalide le critère.

Lettre V

Version accessible (pour un document en téléchargement)

Les documents en téléchargement dont les types de format sont reconnus compatibles avec l'accessibilité doivent être rendus accessibles soit directement soit par l'intermédiaire d'une version accessible ou d'une version en HTML. Les formats de documents dont la compatibilité est reconnue sont :

  • Microsoft office (Word 2003, OOXML)
  • Open Office Org (ODF)
  • Adobe PDF
  • Daisy

Les contenus doivent être conforme à Liste des critères Documents Bureautiques en téléchargement.

Note : le format txt ne peut pas être utilisé pour produire une version accessible pour un document en téléchargement.

Lettre W

WAI ARIA

Le document WAI-ARIA explique comment rendre le contenu Web et des applications Web plus accessibles aux personnes handicapées. Il aide, en particulier, à rendre accessibles le contenu dynamique et les interfaces avancées côté utilisateur développées avec Ajax, HTML, JavaScript et toutes les technologies connexes. Actuellement, certaines fonctionnalités utilisées dans les sites Web ne sont pas disponibles pour certains utilisateurs handicapés ; en particulier, les personnes qui utilisent un lecteur d'écran et les personnes qui ne peuvent pas utiliser une souris. WAI-ARIA apporte des réponses à ces nouveaux besoins en accessibilité ; en définissant, par exemple, de nouvelles méthodes de programmation des fonctionnalités. Ceci, afin d'informer, à tout moment, les technologies d'assistance de leur rôle et état, et permettre, ainsi, aux personnes handicapées d'interagir avec elles via leur technologie d'assistance. Avec WAI-ARIA, les développeurs peuvent créer des applications Web accessibles et utilisables pour les personnes handicapées.

W3C (World Wide Web Consortium)

Le World Wide Web Consortium (W3C) a pour mission de mener le World Wide Web au maximum de son potentiel en développant des protocoles communs qui encouragent son évolution et assurent son interopérabilité. Pour plus d'informations, Consulter le site du W3C.

WAI

Le département Web Accessibility Initiative a été créé en 1996 au sein du W3C, qui établit des recommandations internationales pour rendre les sites internet accessibles à tous, mais en particulier aux internautes handicapés. Pour plus d'informations, Consulter le site de WAI.

WCAG (Web Content Accessibility Guidelines)

Les "Directives pour l'accessibilité aux contenus Web" constituent un référentiel international publié par WAI. Il définit des recommandations et des techniques pour produire des sites internet accessibles à tous.

Lettre Z

Zone (d'une image réactive)

Zone cliquable ou zone non cliquable d'une image réactive.

Zone cliquable

Région d'une image réactive à laquelle une action a été associée ; par exemple, le déclenchement d'un événement en cliquant sur un lien (pour une zone cliquable côté client : balise area avec l'attribut href). Les balises area sont contenues dans la balise map.

Zone non cliquable

Région d'une image réactive à laquelle aucune action n'est associée (pour une zone cliquable côté client : balise area avec l'attribut nohref). Les balises area sont contenues dans la balise map.

Zone texte

Région d'une image réactive affichant du texte.

Notes techniques

Critère 1.1 [A]

A l'exception de svg, l'utilisation des attributs aria-label et aria-labelledby permettant de créer une alternative ou de lier l'image à un passage de texte faisant office d'alternative ne peuvent pas être utilisés par manque de support des technologies d'assistance.

La spécification SVG préconise d'utiliser un élément <title> pour la description "courte" et un élément <desc> pour la description longue. Actuellement seul l'élément <desc> est correctement restitué par les technologies d'assistance. L'usage de l'élément <title> est donc considéré comme incompatible avec l'accessibilité.

Critère 1.2 [A]

Lorsqu'une image est associée à une légende la note technique WCAG recommande de renseigner systématiquement l'alternative de l'image (cf critère 1.10). Dans ce cas le critère 1.2 est Non-Applicable.

L'utilisation d'un attribut ARIA role="présentation" ne peut pas être utilisé pour déclarer une image de décoration conformément aux indications données par la spécification sur les restrictions de l'utilisation des rôles ARIA.

Critère 1.3 [A]

La note WCAG interdit l'utilisation de l'attribut title en remplacement de l'attribut alt, néanmoins il est souvent utile d'utiliser l'attribut title pour faire apparaitre un tooltip sur les images particulièrements obscures. Si l'attribut title est utilisé de cette manière, le contenu de l'attribut title doit être strictement identique à celui de l'alternative.

Le manque de support de l'élément <title> par les technologies d'assistance créé une difficulté dans le cas de l'utilisation de l'élément <desc> pour implémenter l'alternative courte de l'image si l'image nécessite une description détaillée. Dans ce cas il est recommandé d'utiliser un texte adjacent ou un lien adjacent pour créer la description détaillée

Les tests 1.3.7 et 1.3.9 sont utilisés pour vérifier que l'implémentation de l'alternative est compatible avec l'accessibilité (e.g avec la base de référence considérée).

Critère 1.6 [A]

Le manque de support de l'élément <title> par les technologies d'assistance créé une difficulté dans le cas de l'utilisation de l'élément <desc> pour implémenter l'alternative courte de l'image si l'image nécessite une description détaillée. Dans ce cas il est recommandé d'utiliser un texte adjacent ou un lien adjacent pour créer la description détaillée.

Si l'élément <desc> est utilisé pour implémenter la description détaillée il est recommandé d'utiliser un attribut aria-label pour implémenter l'alternative courte de l'image.

L'utilisation de l'attribut aria-describedby n'est pas possible pour lier une image à sa description détaillée par manque de support des technologies d'assistance.

La description détaillée adjacente peut être implémentée via un élément <figcaption>, dans ce cas le critère 1.10 doit être vérifié (utilisation de <figure> et du role group, notamment).

Critère 1.8 [AA] et 1.9 [AAA]

Le texte dans les images vectorielles étant du texte réel n'est pas concerné par ce critère.

Critère 1.10 [A]

L'implémentation d'un role="group" sur l'élément parent figure est destiné à pallier le manque de support actuel des éléments figure par les technologies d'assistance. Bien que recommandé, l'utilisation d'un élément figcaption dans un élément figure est optionnelle. En revanche l'utilisation d'un élément figcaption pour associer une légende à une image impose l'utilisation d'un élément parent figure. La référence à la légende adjacente peut être une expression du type "image 1" ou équivalent lorsque cette expression est reprise dans la légende.

Bien que recommandé par HTML5, la note WCAG stipule que le title ne peut pas être utilisé pour "labelliser" l'image.

Les attributs aria-label, aria-labelledby et aria-describedby ne peuvent pas être utilisés actuellement par manque de support par les technologies d'assistance.

Critère 5.1 [A]

La spécification propose plusieurs méthodes pour lier un résumé à un tableau (tableau lié à un passage de texte avec aria-describedby, tableau groupé via figure avec le résumé en texte adjacent, tableau groupé avec figure avec le résumé dans un élément figcaption, résumé dans un élément details dans l'élément caption).

Ces méthodes n'ont pas un support suffisant pour être utilisées actuellement.

Critère 7.3 [A]

ARIA définit pour un certain nombre de rôles dédiés au développement de composants d'interface un ensemble d'interactions au clavier basée sur les touches Echap, Barre d'espace, Tabulation et touches de direction auxquelles peuvent se rajouter d'autres interactions basées sur les touches de pagination, de début ou de fin par exemple. Afin d'accompagner la prise en charge progressive de ces interactions au clavier, le référentiel limite l'exigence aux touches d'interactions principales (Echap, barre d'espace, tabulation, flêches de direction) telles qu'elles sont définies par les motifs de conception.

Critère 9.1 [A]

ARIA permet de définir des titres via le role "heading" et la propriété aria-level (indication du niveau de titre). Bien qu'il soit préférable d'utiliser l'élément de titre natif en HTML <hx>, l'utilisation du role ARIA heading est compatible avec l'accessibilité.

Bien que la spéicification HTML5 autorise l'utilisation eclusive de titre de niveau 1 (H1), le manque de support ds technologies d'assistance oblige à utiliser une hiérarchie de titre pertinente

Critère 9.2 [A]

L'arborescence du document (outline) est généré par l'utilisation des balises sectionnantes <nav>, <article>, <section>, <aside> et les sections implicites générées par l'utilisation d'une balise <hx> (lorsque la balise <hx> n'est pas le premier enfant d'une section).

Une balise sectionnante permet de structurer ou de regrouper un contenu, les parties d'un contenu, ou un ensemble de contenus qui peuvent être considérés de manière indépendante du reste du document.

Une zone de navigation dans le site ou dans une rubrique, un sommaire ou la zone de navigation d'une collection de page (<nav>), un contenu "complémentaire" au contenu principal (<aside>), le contenu principal ou le regroupement de plusieurs contenus comme des articles (<article> ou <section>) un ou des contenus secondaires comme un commentaire, un widget twitter, un fil RSS (<article> ou <section>) sont autant d'exemples de contenus sectionnés.

Lorsqu'il s'agit de contenus, par opposition à des zones de navigations (<nav>) ou des zones de contenus complémentaires (<aside>) une section devrait posséder si c'est approprié une zone d'en-tête (<header>) et un pied de page (<footer>).

Le premier titre <hx> dans une section donne le "nom" de la section tel qu'il sera reporté dans l'arborescence du document. Les titres suivants (<hx>) créer des sections implicites qui seront présentées comme l'arborescence du contenu de la section.

Une section pouvant être considérée de manière indépendante du reste de la page, l'arborescence générée par les sections implicites (<hx>) est calculée à partir d'un niveau 1 affecté au premier titre de la section.

Lorsqu'elle est utilisée, l'arborescence du document peut donc être différente de l'arborescence du contenu représentée par l'ensemble des titres <hx> de la page même si les deux structures restent similaires.

Cette arborescence doit donc être représentative de la structure du document et être cohérente avec la structuration du contenu généré par l'utilisation des balises <hx>. La structuration du contenu générée par les balises <hx>) pouvant être, théoriquement, déduite de l'arborescence du document, la spécification HTML5 recommande d'utiliser uniquement des titre <h1>, cet usage est proscrit et le critère 9.1 impose d'utiliser une hiérarchie de titre (<hx>) cohérente.

Si l'arborescence du document (à la condition qu'elle soit cohérente) peut permettre de proposer à l'utilisateur des fonctionnalités d'exploration et de navigation, sur certaines technologies d'assistance, elle influe sur la hiérarchie de titres générée par l'utilisation des balises <hx> en modifiant le niveau des titres restitués.

Pour accompagner la prise en charge progressive de l'arborescence du document et compte tenu du fait que le référentiel exige de disposer, en tout état de cause, d'une structure de contenu (balises <hx>) robuste et cohérente, il est acceptable de considérer le test 9.2.2 comme Non-Applicable lorsqu'il n'est pas possible de s'assurer que l'arborescence du document est parfaitement cohérente.

Dans ce cas, la non-conformité au test devrait être relevée sous la forme d'une simple alerte.

Critère 9.3 [A]

Les roles ARIA list et listitem peuvent nécessiter l'utilisation des propriétés aria-setsize et aria-posinset dans le cas où l'ensemble de la liste n'est pas disponible via le DOM généré au moment de la consultation.

Bien que possédant un role "definition", utilisé en combinaison avec la propriété aria-labelledby, ARIA ne propose pas de role équivalent à une liste de définition HTML. L'utilisation du rôle "definition" ne peut donc pas être utilisée comme équivalent à une liste de définition HTML DL.

Les roles tree, tablist, menu, combobox et listbox ne sont pas équivalents à une liste HTML UL ou OL

Références : The Role Model, List Role et The role model - ARIA SETSIZE

Critère 9.4 [AAA]

Bien qu' ARIA propose un role "definition" qui pourrait être utilisé, en combinaison avec la propriété aria-labelledby, pour donner la définition d'une abbréviation, le manque de support de la propriété aria-labelledby sur un élément de liste non-interactive ne permet pas l'utilisation de ce role.

Critère 10.13 [A]

ARIA propose une propriété aria-hidden (true ou false) qui permet d'inhiber la restitution d'un contenu en direction des technologies d'assistance, sans influencer sur sa visibilité en direction des agents utilisateurs : un contenu avec aria-hidden="true" ne sera donc plus vocalisable mais restera visible. Sauf si le contenu controlé par aria-hidden n'a pas vocation à être restitué par les technologies d'assistance, la valeur de l'attribut hidden doit être cohérente avec l'état affiché ou masqué du contenu à l'écran

La spécification HTML5 propose un attribut hidden qui permet de rendre indisponible (quand l'attribut hidden est présent) un contenu dans le DOM généré (de manière similaire au type="hidden" sur un contrôle de formulaire). Sauf si le contenu controlé par hidden n'a pas vocation à être restitué par les technologies d'assistance, la valeur de l'attribut hidden doit être cohérente avec l'état affiché ou masqué du contenu à l'écran

Il est possible d'avoir des situations ou un contenu controlé par hidden ou aria-hidden se trouve momentanément dans un état incohérent avec le statut affiché ou masqué du contenu, par exemple si l'on désire rendre disponible un élément mais que son affichage à l'écran reste dépendant d'une action ultérieure. Dans ce cas c'est l'état final du contenu qui doit être considéré.

Critère 11.11 [AA]

Certains types de formulaire HTML5 propose des message d'aide à la saisie automatique, par exemple les types url et email affiche un message du type "veuillez saisir une adresse email valide" dans le cas ou l'adresse email saisie ne correspond pas au format attendus. Ces messages sont personnalisables via l'API Constraint Validation qui peut permettre de personnaliser les messages d'erreur et valider le critère, attention cependant le support de cette API n'est pas encore stabilisée. Le type "pattern" qui permet d'effectuer automatiquement des contrôles de format (via des expressions régulières) affiche également un message d'aide mais ce dernier est personnalisable via l'attribut "title", ce dispositif valide le critère.

Référence : WHATWG - 4.10.21.3 The constraint validation API

Critère 12.10 [A]

ARIA propose des rôles permettant d'indiquer les zones principales (région) du document. Ces rôles sont très profitables aux utilisateurs de lecteur d'écrans notamment mais également aux utilisateurs de la navigation au clavier qui peuvent ainsi bénéficier de fonctionnalités de navigation rapide dans la structure du document. Si la plupart des lecteurs d'écran mettent à disposition ces fonctionnalités, les navigateurs n'ont pas encore proposé de fonctionnalité de navigation dédiée pour les utilisateurs qui ne peuvent pas utiliser la souris. La mise en place des liens d'évitement reste donc une exigence.

Compatible avec les technologies d'assistance - Base de référence

Définition

La base de référence est constituée des configurations (technologie d'assistance, système d'exploitation, navigateur) qui permettent de déclarer qu'un dispositif HTML5/ARIA est "compatible avec l'accessibilité" tel que définie par WCAG 2

Elle est établie par consensus à partir de la liste des technologies d'assistance dont l'usage est suffisamment répandu, ou, dans certains cas (par exemple pour OSX) lorsqu'elle est fournie de manière native et constitue le moyen privilégié d'accès à l'information et aux fonctionnalités.

Le document Base de référence pour la compatibilité avec les technologies d'assistance décrit dans le détail la méthodologie utilisée pour établir cette base de référence. Télécharger le document "compatibilité avec les technologie d'assistance" au format docx (33 ko), odt (25 ko), pdf (543 ko)

Base de référence

La base de référence permettant de couvrir la proportion la plus large des usages est constituée de combinaisons associant des technologies d'assistance d'usage suffisamment répandu, les deux systèmes d'exploitation Windows XP+ et OSX et les trois navigateurs IE9+, Firefox et Safari.

Pour qu'un dispositif HTML5/ARIA ou son alternative soit considéré comme compatible avec l'accessibilité il faut qu'il soit pleinement fonctionnel, en termes de restitution et de fonctionnalités, sur au moins une des combinaisons suivantes :

Base de référence - Combinaison 1
Technologie d'assistanceVersion TANavigateur
NVDADernière versionFirefox
JAWSVersion précédenteFirefox ou Internet Explorer 9+
Voice OverDernière VersionSafari
Base de référence - Combinaison 2
Technologie d'assistanceVersion TANavigateur
JAWSVersion précédenteFirefox
NVDADernière VersionFirefox ou Internet Explorer 9+
Voice OverDernière VersionSafari
Base de référence - Combinaison 3
Technologie d'assistanceVersion TANavigateur
JAWSVersion précédenteFirefox
Windows EyesVersion précédenteFirefox ou Internet Explorer 9+
Voice OverDernière VersionSafari
Base de référence - Combinaison 4
Technologie d'assistanceVersion TANavigateur
Windows EyesVersion précédenteFirefox
JawsVersion précédenteFirefox ou Internet Explorer 9+
Voice OverDernière VersionSafari

Note : Compte tenu que le lecteur d'écran NVDA ne nécessite pas l'achat d'une licence commerciale et couvre toutes les versions de windows, les deux premières combinaisons devraient être privilégiées. La combinaison NVDA + Windows Eyes ne peut pas être retenue car elle ne couvre pas une proportion suffisamment large d'usage.

Exigences complémentaires

Les règles suivantes doivent également être respectées :

  1. L'ensemble des dispositifs HTML5/ARIA ou leurs alternatives doivent être pleinement fonctionnels, sur l'ensemble des pages du site, sans nécessiter de changement de technologie d'assistance en cours d'utilisation
  2. Lorsque des alternatives à des dispositifs HTML5/ARIA sont proposées elles ne doivent pas nécessiter la désactivation d'une technologie (par exemple Javascript ou le plugin flash) sauf s'il s'agit d'une fonctionnalité proposé par le site lui-même.
    Par exemple :
    • le site met à disposition une version alternative conforme pleinement fonctionnelle sans le recours aux technologies dont l'usage est non-compatible avec l'accessibilité.
    • Le site met à disposition une fonctionnalité de remplacement des dispositifs HTML5/ARIA par des dispositifs alternatifs compatibles.
  3. Un moyen est mis à disposition des utilisateurs de technologies d'assistance pour signaler les problèmes rencontrés et obtenir, via un dispositif de compensation, les informations qui seraient rendues indisponibles
  4. Si une déclaration de conformité est établie elle doit comporter la liste des technologies d'assistance avec lesquelles les dispositifs HTML5/ARIA ont été testés et les résultats de ces tests (par exemple "supporté", "non supporté", "supporté partiellement") au moins