Créer des sites Web accessibles et inclusifs pour notre communauté

Publié: 2021-07-21

Comment rendre votre site Web accessible à tous et quelles sont les normes d'accessibilité des sites Web ?

Vous vous demandez peut-être : qu'est-ce que l'accessibilité et l'inclusion d'un site Web ?

Tout le monde ne peut pas accéder à Internet de la même manière qu'une personne typiquement développée. Une grande partie de notre société – 20 % en Australie – vit avec une forme de handicap. Cela signifie qu'au moins 20 % de tous les Australiens sont moins capables ou incapables de consommer, d'accéder, de lire, d'entendre ou de comprendre le contenu Internet, car ils sont moins capables de voir, d'entendre ou de digérer cognitivement le contenu trouvé en ligne. Cela peut être dû à un handicap permanent ou temporaire, à une blessure ou à une barrière linguistique, ou à des complexités inutiles liées à l'interaction avec le site Web.

L'accessibilité des sites Web signifie que les sites Web, les outils et la technologie peuvent être perçus, compris, navigués, interagis et contribués par tous, peu importe qui ils sont. L'accessibilité favorise l'inclusion sociale de ceux qui risquent autrement d'être isolés et, lorsque les sites Web et les outils Web sont conçus de manière inclusive, les personnes handicapées peuvent les utiliser pleinement.

Dans cet article:

1. Pourquoi devrions-nous rendre nos sites Web plus accessibles ?

L'accessibilité est la loi

L'accessibilité est un droit humain

2. Problèmes d'accessibilité courants

Audience

Voyant

Entente

Naviguer

Parole

3. Comment rendons-nous nos sites Web plus accessibles ?

4. Façons d'écrire des pages Web accessibles à tous

5. Directives pour l'accessibilité du contenu Web (WCAG)

6. Résumé WCAG - Façons de rendre le contenu Web accessible à tous

7. Quand est-il justifié de ne pas être conforme aux WCAG ?

8. Tester l'accessibilité du Web

9. 6 façons simples de tester manuellement l'accessibilité Web

Retour au sommet

1. Pourquoi devrions-nous rendre nos sites Web plus accessibles ?

Nous devrions rendre nos sites Web plus accessibles pour 3 raisons principales :

C'est bon pour le lecteur – Tout le monde a le droit d'utiliser Internet de manière aussi complète que n'importe qui d'autre et lorsque cela se produit, cela ajoute à la qualité de vie et au bonheur du lecteur. Ils se sentent connectés et inclus parce que nous rendons nos sites Web "conformes aux obligations de la société d'éliminer la discrimination et de promouvoir les droits de l'homme".

C'est bon pour l'entreprise - Si plus de personnes peuvent accéder au contenu que nous créons pour nos clients, plus de personnes seront exposées à la marque pour laquelle nous créons le site Web. Une plus grande exposition signifie de plus grandes ventes, mais en plus de cela, une plus grande accessibilité montre que la marque pour laquelle nous créons a l'inclusion à l'esprit. Cela conduira à une augmentation de la perception positive de la marque.

C'est un droit de l'homme et une exigence de la loi – C'est extrêmement important.

Retour au sommet

L'accessibilité est la loi

En vertu de l'article 24 de la loi sur la discrimination à l'égard des personnes handicapées (1992), il est "illégal pour une personne qui, contre rémunération ou non, fournit des biens ou des services, ou met à disposition des installations, de discriminer une autre personne en raison de son handicap :

en refusant de fournir à l'autre personne ces biens ou services ou de mettre ces installations à la disposition de l'autre personne ;
dans les termes ou conditions selon lesquels la première personne fournit à l'autre personne ces biens ou services ou met ces installations à la disposition de l'autre personne ; ou
de la manière dont la première personne fournit à l'autre personne ces biens ou services ou met ces installations à la disposition de l'autre personne.

En clair, cela signifie qu'une entreprise peut être poursuivie en vertu de la loi si elle choisit de ne pas mettre des installations à la disposition d'une personne en raison de son handicap, dans des limites raisonnables.

Retour au sommet

L'accessibilité est un droit humain

En plus de la Disability Discrimination Act, l'accessibilité sous toutes ses formes est un droit humain. La Convention relative aux droits des personnes handicapées (CDPH) a été adoptée par les Nations Unies en 2006. L'article (4) (1) (g) de la Convention appelle les parties à « promouvoir l'accès des personnes handicapées aux nouvelles informations et communications ». technologies et systèmes, y compris Internet ». L'Australie a été l'un des premiers signataires de la Convention mais, comme le souligne la Commission australienne des droits de l'homme (AHRC), nous avons tous l'obligation de respecter les droits établis par la convention.

Retour au sommet

2. Problèmes d'accessibilité courants

Le contenu en ligne est généralement composé de texte, d'audio, de vidéo et d'images, et généralement dans un format non linéaire (en d'autres termes, les sites Web ne sont généralement pas simplement dans une liste de haut en bas de la page, il y a des liens, des sections séparées, boutons et autres médias disséminés) et divers éléments d'un site Web seront inaccessibles à certaines personnes.

Audience

Une personne malentendante ou s/Sourde ne comprendra pas nécessairement les clips audio ou les clips vidéo contenant de l'audio. L'audio peut être de la musique, des sons qui transmettent un message, comme des partitions musicales, ou des bruits qui sont activés lorsque des éléments d'une page Web sont cliqués, ou de la parole, ou même des sons d'avertissement d'ordinateur.

Voyant

De même, une personne ayant une déficience visuelle ou une cécité partielle ou totale ne sera pas nécessairement en mesure de lire un texte, de visionner des clips vidéo ou de naviguer efficacement sur un site Web. Ils peuvent avoir des difficultés à lire un texte avec un faible contraste ou ils peuvent être sensibles aux images clignotantes.

Entente

Comprendre un site Web se résume à la complexité du site Web. De nombreuses personnes auront des difficultés à naviguer sur un site Web s'il contient un jargon inexpliqué, de petites polices, des endroits non évidents pour cliquer et se déplacer sur le site Web, de mauvais systèmes de backlinking, un manque de structure de titre, un mauvais contraste de texte, des parties cachées. Une personne peut avoir des problèmes dans ces domaines si elle a des problèmes cognitifs, manque d'expérience avec la technologie ou est malvoyante. Cependant, n'importe qui peut avoir des problèmes sur un site Web avec l'un de ces défauts de conception.

Naviguer

Un site Web devient difficile à naviguer avec des défauts de conception, mais une personne qui vit avec un défi cognitif ou qui a des problèmes visuels aura du mal à naviguer sur une page Web. Encore plus de personnes peuvent avoir des facteurs de fonction motrice affectant leur capacité à utiliser une souris ou un clavier.

Parole

Certaines parties d'Internet sont activées par la voix et récemment, les voix sont de plus en plus utilisées comme forme de mot de passe (Centrelink Voice Authentication, par exemple), mais cet aspect croissant de l'accès à Internet peut ne pas être utilisable par les personnes ayant une parole limitée ou une déficience auditive, ou qui utilisent l'anglais comme langue seconde.

Retour au sommet

3. Comment rendons-nous nos sites Web plus accessibles ?

Il est clair que de nombreuses personnes risquent d'être exclues d'une partie, de la plupart ou de la totalité du contenu Internet, à moins que les programmeurs et les concepteurs Web ne s'efforcent de trouver des moyens d'accroître l'inclusion dans leur produit.

La façon de rendre nos sites Web accessibles au plus grand nombre de personnes possible est de suivre les directives internationales pour nous maintenir dans le cadre de la loi établie par le World Wide Web Consortium (W3C).

Retour au sommet

4. Façons d'écrire des pages Web accessibles à tous

Avec juste un peu de recherche, les concepteurs et développeurs Web peuvent jouer un rôle plus actif dans la création de produits que plus de gens peuvent vous proposer. Il existe des ressources fantastiques disponibles en ligne pour vous aider et nous aider à faire mieux pour créer des sites Web qui :

Fournissez des titres de page informatifs et uniques
Utilisez des titres pour transmettre le sens et la structure
Rendre le texte du lien significatif
Écrire des alternatives textuelles significatives pour les images
Créer des transcriptions et des sous-titres pour le multimédia
Fournir des instructions claires
Gardez le contenu clair et concis

Retour au sommet

5. Directives pour l'accessibilité du contenu Web (WCAG)

Le W3C est une communauté internationale où les organisations membres, le personnel à temps plein et le public travaillent ensemble pour développer des normes Web. La mission du W3C est de mener le Web à son plein potentiel et ils dirigent la Web Accessibility Initiative (WAI). Les lignes directrices WAI pour l'accessibilité du Web sont les suivantes :

Web Content Accessibility Guidelines (WCAG) 2.0 – un guide pour rendre les sites Web accessibles aux personnes handicapées.
Mobile Web Best Practices (MWBP) - un guide pour rendre les sites Web utilisables à partir d'un appareil mobile.
Mobile Web Application Best Practices (MWABP) – un guide pour le développement et la diffusion d'applications Web sur des appareils mobiles.

Les détails complets des lignes directrices sont très complexes et complexes et dépassent de loin la portée de cet article. Pour cette raison, cet article résumera et discutera les points principaux des articles, comme tremplin pour votre compréhension de l'accessibilité web et comme point de départ pour une lecture plus approfondie. Voici les liens vers les documents complets :

WCAG (Web Content Accessibility Guidelines) Document complet

MWBP (Mobile Web Best Practices) Document complet

MWABP (Meilleures pratiques pour les applications Web mobiles) Document complet

Vous vous demandez peut-être pourquoi il existe des directives d'accessibilité basées sur la création de pages, d'applications ou d'outils Web pour les appareils mobiles, mais le W3C et la Commission australienne des droits de l'homme (AHRC) conviennent que « les personnes handicapées utilisant des ordinateurs ont des limitations d'interaction similaires à celles des personnes non handicapées qui utilisent des appareils mobiles ». Il y a tellement de chevauchements, en fait, que le W3C a créé des lignes directrices pour les mobiles qui conviennent aux personnes ayant des capacités différentes ainsi qu'aux personnes généralement développées, car nous sommes tous confrontés à des problèmes d'accessibilité sur les téléphones mobiles, par rapport aux ordinateurs.

Retour au sommet

6. Résumé WCAG - Façons de rendre le contenu Web accessible à tous

Voici une façon simple de voir les choses, une règle simple : efforcez-vous d'utiliser plusieurs types de médias pour transmettre chaque message sur un site Web sur lequel nous travaillons, d'inclure plusieurs façons d'accéder à un élément sur un site Web et d'éviter de causer du tort à condition.

Les WCAG les énumèrent sous la forme de 4 grands principes qui peuvent être atteints à un niveau bon, très bon ou excellent (notés respectivement sur les Directives comme A, AA et AAA). Dans ce document, seules les solutions A et AA sont répertoriées, étant donné que tous les grades satisfont aux exigences d'accessibilité et que certaines solutions AAA sont coûteuses en termes de temps ou d'argent. Le site Web du gouvernement australien indique qu'il est conforme à l'AA et travaille à la conformité à l'AAA, par exemple.

Pour faire l'objet d'une réclamation auprès des WCAG, les Informations et le fonctionnement de l'interface utilisateur doivent être :

Perceptible (par la vue, le son ou les deux)
Opérable (par la souris et le clavier)
Compréhensible (l'écriture doit être facile à comprendre)
Robuste (interprété par une grande variété d'agents utilisateurs)

Principe 1 – Un site Web et sa navigation doivent être perceptibles

Utilisez des alternatives textuelles pour tout contenu non textuel, tel que :

Gros caractères, Braille, Discours
Symboles
Langage plus simple

Utilisez des alternatives de médias basés sur le temps pour les médias basés sur le temps tels que :

Sous-titres préenregistrés ou en direct
descriptions audio
langue des signes préenregistrée
descriptions audio étendues

Créez un contenu Web adaptable qui peut être présenté de plusieurs façons sans perdre d'informations ou de structure :

Utilisez la séquence de lecture correcte.
Fournissez des équivalents textuels ou audio pour les instructions qui reposent uniquement sur la forme, la couleur, la taille, l'emplacement visuel, l'orientation ou le son.
Utilisez portrait ET paysage (sauf si une orientation d'affichage spécifique est essentielle).
Champs de saisie d'étiquette .

Facilitez l'affichage et l'écoute du contenu pour les utilisateurs :

Incluez des commandes sonores pour l'audio qui dure plus de 3 secondes.
Utilisez un son de fond faible ou inexistant .
Séparez l'avant-plan de l'arrière-plan.
N'utilisez la couleur avec des mots que comme moyen visuel de transmettre des informations, une action, une réponse ou un élément visuel.
Utilisez du texte pour décrire les présentations visuelles.
Utilisez un rapport de contraste en copie d'au moins 4,5:1
Activez le redimensionnement du texte de copie jusqu'à 200 % sans perte de contenu ou de fonctionnalité.
Éviter aux utilisateurs d'avoir à faire défiler en deux dimensions.
Espacement:
- Interligne : 1,5 ou plus
- Espacement des paragraphes de fin : 2 x la taille de la police ou plus
- Espacement des lettres : 0,12 ou plus
- Espacement des mots : 0,16 x police ou plus
Rendre le contenu de survol ignoble, survolable et persistant.

Retour au sommet

Principe 2 – Un site Web et sa navigation doivent être fonctionnels

Rendre le contenu Web accessible via la souris et le clavier :

Rendre tous les contenus et fonctionnalités disponibles à l'aide d'un clavier ainsi que d'une souris .
Autoriser le libre mouvement du focus du clavier à l'aide du clavier et de la souris.
Les raccourcis peuvent être activés ou désactivés, remappés ou actifs uniquement sur le focus.

Accordez suffisamment de temps aux utilisateurs pour lire et utiliser le contenu :

Avoir la possibilité de désactiver, d' ajuster ou de prolonger chaque limite de temps définie par le contenu.
Donner à l'utilisateur un avertissement sur la fin du délai.
Mettez en pause, arrêtez ou masquez les informations en mouvement, clignotantes, défilantes ou mises à jour automatiquement.

Concevoir du contenu qui ne provoque pas de crises ni de réactions physiques :

Les éléments clignotent moins de 3 fois par seconde ou s'assurent que le flash est inférieur aux seuils de flash général et de flash rouge.
Ajoutez une option pour désactiver les animations non essentielles .

Fournissez des moyens d'aider les utilisateurs à naviguer, à trouver du contenu et à déterminer où ils se trouvent :

Ajoutez une option pour contourner les blocs de contenu répété.
Assurez-vous que les pages Web ont des titres descriptifs précis .
Assurez-vous que les composants focalisables préservent le sens et l'opérabilité.
Assurez-vous que chaque lien peut être déterminé à partir d' un texte ou d'un contexte précis .
Assurez-vous que plusieurs options d'emplacement de page Web existent dans un site Web (sauf si la page Web est le résultat ou une étape d'un processus).
Assurez-vous que l'indicateur de focus du clavier est visible.

Facilitez l'utilisation des fonctionnalités par les utilisateurs grâce à plusieurs entrées au-delà du clavier :

Les gestes de pointeur multipoint ou basés sur le chemin peuvent être utilisés avec un seul pointeur sans geste basé sur le chemin.
Les étiquettes de texte des images de texte doivent contenir le texte présenté visuellement.
La fonctionnalité de mouvement de l'appareil ou de l'utilisateur peut également être exploitée par d'autres composants de l'interface utilisateur.

Retour au sommet

Principe 3 – Compréhensible

Les informations et le fonctionnement de l'interface utilisateur doivent être compréhensibles.

Rendre le contenu textuel lisible et compréhensible :

Le langage humain par défaut de chaque page Web peut être modifié par l'utilisateur.
La langue humaine de chaque passage ou phrase du contenu peut être traduite (à l'exception des noms, du jargon et de l'argot).

Faites en sorte que les pages Web s'affichent et fonctionnent de manière prévisible :

Les composants de l'interface utilisateur n'initient pas de changement de contexte lorsqu'ils reçoivent le focus.
La modification des paramètres d'un élément n'entraîne pas automatiquement un changement de contexte non spécifié.
Les mécanismes de navigation qui se répètent sur plusieurs pages Web au sein d'un site Web se produisent à chaque fois dans le même ordre relatif, à moins qu'un changement ne soit initié par l'utilisateur.
Les composants qui ont la même fonctionnalité dans un site Web sont identifiés de manière cohérente.

Aide à la saisie : aidez les utilisateurs à éviter et à corriger les erreurs :

Identifiez et décrivez à l'utilisateur toutes les erreurs détectées automatiquement.
Fournissez des étiquettes ou des instructions lorsque le contenu nécessite une entrée de l'utilisateur.
Les erreurs de saisie sont automatiquement détectées et des suggestions de correction sont fournies, à moins que cela ne compromette la sécurité ou la finalité du contenu.
Les transactions juridiques ou financières sont réversibles, contrôlées et confirmées avant finalisation.

Retour au sommet

Principe 4 – Robuste

Le contenu doit être suffisamment robuste pour pouvoir être interprété par une grande variété d'agents utilisateurs, y compris les technologies d'assistance.

Optimisez la compatibilité avec les agents utilisateurs actuels et futurs, y compris les technologies d'assistance :

Les éléments de balisage doivent –
- avoir des balises de début et de fin complètes ;
- être imbriqués selon leurs spécifications ;
- ne contiennent aucun attribut en double ;
Les identifiants doivent être uniques, sauf lorsque les spécifications autorisent ces fonctionnalités.
Les éléments de formulaire, les liens et les composants générés par des scripts doivent pouvoir être générés automatiquement.
Les états, les propriétés et les valeurs doivent pouvoir être définis par programme ou manuellement.
La notification des modifications apportées à ces éléments devrait être disponible pour les agents utilisateurs, y compris les technologies d'assistance.
Dans le contenu mis en œuvre à l'aide de langages de balisage, les messages d'état doivent pouvoir être déterminés par programmation de sorte qu'ils puissent être présentés à l'utilisateur par des technologies d'assistance sans être ciblés.

Ceci est un bref résumé des options d'accessibilité qui s'offrent à nous chez Jezweb. Certains sont conformes au niveau A et certains sont AA, mais tous sont réalisables, s'ils sont écrits dans les processus de conception Web et de rédaction dès le début. Il est beaucoup plus rapide et facile d'écrire l'accessibilité à un stade précoce que de modifier le travail existant.

Retour au sommet

7. Quand est-il justifié de ne pas être conforme aux WCAG ?

Il existe des limites convenues à la création de sites Web accessibles, telles que définies par la Commission australienne des droits de l'homme. Aux termes de la Disability Discrimination Act (1992), dans certaines circonstances (mais pas toutes), les obligations en vertu de la DDA de fournir un accès égal sont limitées par le concept de difficultés injustifiables.

En d'autres termes, si une entreprise ne peut pas se permettre le temps ou l'argent pour améliorer certains éléments d'accessibilité spécifiques, et qu'elle peut le prouver , il peut y avoir une raison de ne pas inclure ces éléments. Sinon, eh bien, c'est à nous en tant qu'entreprise et en tant qu'individus de rendre notre contenu aussi accessible à tous que possible.

Pour plus d'informations sur l'affaire juridique - en gardant à l'esprit que ce lien n'est pas un avis juridique, juste des informations générales - cliquez sur humanrights.gov.au/our-work/disability-rights/world-wide-web-access-disability-discrimination -act-advisory-notes-ver#whatis

Retour au sommet

8. Tester l'accessibilité du Web

Nous pouvons tester nos niveaux d'accessibilité Web de 2 façons :

Outils d'accessibilité Web (pour les processus d'outils d'accessibilité Web, référez-vous simplement à votre supérieur hiérarchique)
Audits manuels (vérification humaine - voir ci-dessous)

Lors du développement ou de la refonte d'un site Web ou d'une application Web, évaluez l'accessibilité tôt et tout au long du processus de développement afin d'identifier les problèmes d'accessibilité dès le début, lorsqu'il est plus facile de les résoudre. Il existe des outils d'évaluation qui aident à l'évaluation. Cependant, aucun outil ne peut à lui seul déterminer si un site répond aux normes d'accessibilité. Une évaluation humaine compétente est nécessaire pour déterminer si un site est accessible ». (Site Internet du W3C, 9 avril 2021)

Retour au sommet

9. 6 façons simples de tester manuellement l'accessibilité Web

Les tests humains peuvent être effectués en vérifiant manuellement la conformité d'un site Web aux WCAG (les directives d'accessibilité au contenu Web de la Web Accessibility Initiative, au cas où vous auriez oublié ce que cela signifie !).

Les détails des WCAG sont denses. Les gens ont consacré des carrières entières à le comprendre, mais il y a quelques choses simples que vous pouvez faire pour tester l'accessibilité de votre travail :

1. Débranchez votre souris et/ou éteignez votre trackpad

Interagissez avec le site en utilisant uniquement TAB ou SHIFT+TAB. pour naviguer et ENTER pour suivre un lien.

Pouvez-vous interagir avec tous les contrôles, liens et menus en utilisant uniquement le clavier ?
Pouvez-vous voir quel élément a le focus à tout moment ?
L'ordre de mise au point visuelle correspond-il à l'ordre d'interaction prévu ?

2. Activez le mode Contraste élevé - Cela supprime également les couleurs sur le site.

Selon l'enquête de WebAIM auprès des utilisateurs malvoyants, 30 % des personnes interrogées déclarent utiliser les modes de contraste élevé.

Pouvez-vous facilement visualiser chaque élément de la page ?
Pouvez-vous naviguer sur le site ?
Pouvez-vous lire et comprendre tous les éléments de copie ?

3. Désactivez les images dans les paramètres du navigateur.

Le contenu a-t-il un sens ?
Le contenu devient-il plus difficile à comprendre ?
Un contenu manque-t-il maintenant ?
Des contrôles importants disparaissent-ils ?

4. Vérifiez les sous-titres ou les transcriptions

Y a-t-il des sous-titres directement sur la vidéo ou y a-t-il une commande dans le lecteur qui active/désactive les sous-titres ?
Existe-t-il une version alternative avec description audio ou une commande dans le lecteur qui active/désactive la description audio ?
Pour les vidéos contenant beaucoup de dialogues, y a-t-il une transcription textuelle sur la page ou un lien à proximité du lecteur vidéo menant à une transcription ?

D'autres exigences existent pour les scénarios vidéo uniquement et audio uniquement, mais ce qui précède couvrira la plupart des médias sur la plupart des sites.

Remarque : Non seulement le contenu multimédia lui-même doit être accessible, mais le lecteur doit également l'être. Recherchez un futur article de blog sur l'accessibilité des lecteurs multimédias.

5. Cliquez sur les étiquettes de champ

Faites attention aux étiquettes manquantes ou incomplètes, à la gestion inefficace des erreurs et au mauvais contrôle de la mise au point.

Cliquez sur l'étiquette de texte adjacente au champ :

Lorsque vous cliquez sur l'étiquette à côté d'une entrée de texte ou d'une zone de texte, le curseur entre-t-il dans le champ ?
Lorsque vous cliquez sur l'étiquette à côté d'un bouton radio ou d'une case à cocher, cela sélectionne-t-il l'option adjacente ?
Lorsque vous cliquez sur l'étiquette à côté d'un élément SELECT, cet élément se concentre-t-il sur SELECT ?

NB : Il doit y avoir une relation un à un entre l'étiquette et le contrôle.

6. Désactivez CSS dans les paramètres du navigateur. Les images d'arrière-plan disparaîtront

Le contenu important a-t-il disparu ou des commandes, des icônes ou d'autres éléments actionnables ont-ils disparu ?
Est-il maintenant difficile de comprendre des choses comme les messages d'erreur ou d'autres indices auparavant visuels ?
Le contenu est-il toujours affiché dans un ordre raisonnable et facile à comprendre ?
Reste-t-il une couleur, y compris la couleur d'arrière-plan ?
Reste-t-il des styles de présentation de texte ?

Suivre ces directives simples est un excellent tremplin, mais il ne s'agit que d'un aperçu très simple. Pour des informations plus détaillées, vous devez toujours vous référer aux WCAG.

Retour au sommet

Comment vous assurer que vous êtes un allié pour ceux qui ont des capacités différentes

Demandez un audit de site Web et prenez en compte les recommandations qui en découlent. Jezweb dispose d'une équipe de développeurs et de concepteurs de sites Web hautement expérimentés qui ont de l'expérience dans les sites Web accessibles et qui sont personnellement passionnés pour les rendre plus performants au fur et à mesure que la technologie se développe. Pour plus d'informations sur des fonctionnalités spécifiques du site Web ou des questions, contactez notre équipe pour une conversation.