Share
Idéalement, l'accessibilité devrait être considérée comme faisant partie de chaque projet Web afin d'accroître la disponibilité pour le public le plus large possible. Cependant, dans le monde réel, il peut être facilement négligé. Dans cet article, nous verrons comment améliorer facilement l'accessibilité de votre site sans avoir à apporter des modifications drastiques ou chronophages..
"Malheureusement, la puissance et l'adaptabilité du Web ne sont pas toujours pleinement utilisées"
Le World Wide Web est une ressource incroyable et il a ouvert de nouvelles possibilités intéressantes. De plus en plus de personnes peuvent désormais accéder à des informations et à des divertissements auxquels ils n’avaient pas accès par le biais des médias traditionnels. Le World Wide Web est particulièrement important pour les personnes handicapées, car la grande quantité d’informations numériques stockées peut être manipulée pour répondre à différentes exigences. Malheureusement, le pouvoir et l'adaptabilité du Web ne sont pas toujours pleinement utilisés et les personnes handicapées peuvent avoir du mal à naviguer sur les sites Web et avoir une expérience négative du Web en général..
Vous devez viser à améliorer l'accessibilité de votre site pour de nombreuses raisons, notamment parce que c'est la loi dans de nombreux pays. Au Royaume-Uni, par exemple, l'accessibilité du Web relève de la loi sur la discrimination des personnes handicapées et si votre site Web ne se conforme pas, des poursuites peuvent être intentées contre vous. Questions juridiques mises à part, pourquoi ne voudriez-vous pas ouvrir votre site au public le plus large possible en le rendant accessible à tous??
La Web Accessibility Initiative (WAI) a été créée par le W3C pour promouvoir l'accessibilité sur le Web. La WAI tente d’éduquer les gens sur la façon dont les personnes handicapées utilisent le Web et a créé des directives que les concepteurs et les développeurs Web doivent suivre. Vous constaterez que beaucoup de directives sont faciles à suivre et à appliquer. Nous discuterons ci-dessous de méthodes simples vous permettant de respecter ces consignes et d’améliorer l’accessibilité de votre site..
On estime qu'environ dix millions d'hommes souffrent de daltonisme aux États-Unis. Les types les plus courants sont la protanopie et la deutéranopie; et ceux qui en souffrent ont du mal à distinguer le rouge, le vert et les couleurs similaires. Avec une telle prévalence, il est vraiment utile de prendre en compte la conception et le codage de votre site Web..
Pour la plupart, il n'y a pas de mesures radicales à prendre lors de la conception avec le daltonisme à l'esprit - comme c'est le cas avec la majorité des suggestions présentées dans cet article. Un site Web bien conçu ne causera généralement pas de problèmes majeurs aux utilisateurs daltoniens. Cependant, il convient de prendre plus en considération lors de la conception d'éléments interactifs ou d'appel à l'action. Par exemple; un simple lien textuel de style rouge sans autre décoration peut être impossible à voir s'il se trouve dans un bloc de texte gris ou noir. Personne ne suggère que vous deviez vous en tenir au style de lien par défaut, mais il est utile d'utiliser plusieurs types de décoration, tels que le soulignement ou la couleur d'arrière-plan..
Un outil utile pour les concepteurs se trouve sur colorfilter.wickline.org. Il fournit plusieurs filtres qui imitent la manière dont différents types d'utilisateurs daltoniens perçoivent un site Web. Il suffit de taper l'URL d'un site Web et de sélectionner le filtre que vous souhaitez utiliser - le chargement prend un peu de temps, mais vous devrez patienter..
Il convient également de prendre en compte le niveau de contraste entre les éléments de premier plan et d’arrière-plan de votre site Web. Un contraste élevé profitera à tous, pas seulement aux malvoyants. Les directives pour l'accessibilité du Web suggèrent un rapport de contraste minimum de 4,5: 1 et un rapport idéal de 7: 1 pour un corps de texte de taille standard. Évidemment, l'option la plus sûre est toujours le texte noir sur fond blanc ou vice versa..
Vous pouvez vérifier le rapport de contraste de plusieurs éléments d'un site à l'aide de l'extension Firefox de Color Contrast Analyzer de Juicy Studio. Il analysera chaque élément de la page et fournira un rapport indiquant s'il est conforme ou non aux directives de la WAI..
Ceux qui utilisent des lecteurs d'écran auront souvent la possibilité de naviguer sur une page Web en sautant les liens pour trouver quelque chose d'intéressant. Dans le cas de liens de texte, l'utilisateur entendrait simplement le mot isolément, quel que soit le contenu qui l'entoure. Il est donc extrêmement inutile de dire que tout ce que l'utilisateur entend est «cliquez ici» ou «plus» - ces types de liens ne fournissent aucune information sur l'endroit où ils dirigent l'utilisateur ou sur ce à quoi ils font référence..
Une option bien meilleure consiste à fournir un lien plus descriptif. Un lien menant l'utilisateur vers l'article complet sur un blog pourrait se lire "En savoir plus sur S.E.O" ou "Cliquez ici pour consulter l'article complet sur S.E.O"..
L'un des principes fondamentaux de la Web Accessibility Initiative est de rendre le contenu disponible sur le Web accessible à tous, indépendamment de leur handicap. Il existe un certain nombre de techniques, telles que celles présentées dans cet article, qui contribueront à la réalisation de l'objectif du WAI. Il y aura toujours certains types de contenu, cependant, certains utilisateurs ne pourront y accéder, tels que l'audio pour les sourds. Dans ce scénario, vous devez toujours fournir du contenu alternatif dans la mesure du possible..
Ligne directrice 1.1 sur l'accessibilité au contenu Web:
Fournissez des alternatives textuelles pour tout contenu non textuel afin qu'il puisse être modifié en d'autres formes, telles que gros caractères, braille, symboles ou langage plus simple.
Par exemple, si vous avez une vidéo d'une interview sur votre site, vous pouvez envisager d'inclure une transcription de la conversation que les utilisateurs pourront télécharger ou lire sur le site. Une autre méthode consiste à ajouter des sous-titres à la vidéo - une méthode que YouTube expérimente avec l'utilisation d'un logiciel de reconnaissance vocale.
Une approche encore plus complète consiste à fournir un lien vers une version textuelle de votre site Web. Cette méthode rendra également votre site beaucoup plus accessible aux utilisateurs disposant de connexions Internet lentes, tels que ceux utilisant encore une connexion à distance ou recherchant un appareil mobile..
L'index des onglets établit en gros l'ordre des éléments qu'un utilisateur peut parcourir lorsqu'il utilise la touche "Onglet". Dans la majorité des cas, si une conception de page suit un ordre logique et établit une hiérarchie forte à l'aide d'en-têtes, de sous-en-têtes, etc., vous n'avez pas à vous en préoccuper trop. C’est avec l’utilisation des formulaires que cette fonction est vraiment utile.
Les formulaires peuvent incorporer de nombreux petits éléments tels que des cases à cocher et des boutons radio qui peuvent nécessiter des mouvements précis et des clics de souris. Une personne ayant une déficience motrice peut ne pas avoir le contrôle nécessaire pour effectuer des actions aussi précises. Avec un index de tabulation correct établi, un utilisateur pourra parcourir et interagir avec chaque élément de formulaire en appuyant simplement sur le clavier. Un index d'onglets profitera également à ceux qui n'ont pas accès à une souris et qui comptent uniquement sur l'utilisateur d'un clavier pour naviguer sur un site Web..
Nous connaissons tous le texte alternatif. C'est ce texte que nous devons ajouter aux images pour que notre site puisse être validé. Tout le monde les utilise, non? En fait, de nombreux sites Web ne le font pas et ceux qui le font ne les utilisent souvent pas correctement. En fait, il y a beaucoup de débats sur l'utilisation correcte de l'attribut alt.
L'attribut alt sert trois objectifs principaux:
"La vérité est que le texte alternatif pour les images dépend du contexte dans lequel il est placé"
Donc, essentiellement, alt texte est l'équivalent textuel d'une image ou d'une autre source multimédia. Il est utilisé lorsque l'on ne peut pas accéder à l'image pour diverses raisons. Alors, quelles informations utilisons-nous exactement pour l'attribut alt? Certaines personnes placent des descriptions détaillées de l'image tandis que d'autres la chargent de mots-clés afin de faciliter leur classement dans les résultats de recherche. La vérité est que le texte alternatif pour les images dépend du contexte dans lequel il est placé.
Par exemple, il est courant qu'une image pertinente accompagne un article de blog, par exemple une machine à écrire pour un article sur l'écriture indépendante. L'article lui-même ne fait aucune référence à l'image, elle est donc superflue. Certaines personnes peuvent attribuer à l'attribut alt la valeur de "machine à écrire" ou "l'image d'une machine à écrire" ou peut-être donneraient-elles la valeur du titre de l'article. Toutes ces méthodes sont fausses cependant. Voyons pourquoi.
Tout d'abord, nous devons imaginer que nous ne pouvons pas voir l'image. Donc, si la valeur de l'attribut alt était "machine à écrire", nous verrions le titre de l'article de blog, le mot "machine à écrire" seul, puis le texte principal de l'article - cela n'a aucun sens si vu comme texte encore plus déroutant si vous utilisiez un lecteur d'écran et entendiez «machine à écrire» au hasard.
En règle générale, il est préférable de ne pas utiliser d'expressions telles que "une image de" ou "une image de" lorsque vous fournissez des valeurs d'attribut alt. L'attribut alt ne profitera qu'à ceux qui ne peuvent pas voir l'image pour diverses raisons. Dire à ces utilisateurs qu'il y a une image ne présente donc aucune valeur réelle, mais peut également dissiper toute confusion causée par la méthode ci-dessus.
Enfin, attribuer à l'attribut alt la valeur du titre de l'article de blog ne ferait que faire en sorte que le titre soit affiché deux fois sous forme de texte ou répété deux fois lors de l'utilisation de lecteurs d'écran. Le texte alternatif ne doit pas répéter les informations déjà fournies sous forme de texte, il est simplement inutile et peut prêter à confusion.
La meilleure option dans ce scénario consiste simplement à fournir une valeur d'attribut alt vide. Une valeur en blanc garantit qu'aucune information potentiellement source de confusion ou non pertinente n'est communiquée et que la compréhension de l'article n'est pas préjudiciable, car l'image n'est pas essentielle à cela. Certains diront peut-être que, l'image étant purement esthétique, elle n'est donc pas un contenu, elle n'appartient donc pas au code HTML et doit être affichée à l'aide de CSS. Cependant, les points de vue diffèrent à ce sujet..
Comme vous pouvez le constater, fournir des valeurs d'attribut alt correctes peut s'avérer délicat et dépend beaucoup de la situation. Le meilleur conseil est d’évaluer chaque scénario individuellement, en décidant si l’image est requise pour comprendre et utiliser votre meilleur jugement..
Comme les index de tabulation, les touches d'accès constituent une fonctionnalité intéressante pour les utilisateurs qui utilisent un clavier pour naviguer sur un site Web. Malheureusement, les clés d’accès sont l’un des éléments HTML les moins utilisés, principalement parce que beaucoup de gens ne les connaissent pas et que ceux qui choisissent de ne pas les mettre en œuvre bien que cela soit extrêmement simple.
Les touches d'accès sont essentiellement des raccourcis clavier qui permettent à un utilisateur de clavier d'accéder rapidement à certaines sections d'un site Web. Les touches d'accès peuvent être utilisées en maintenant une touche de fonction enfoncée (généralement Alt sous Windows ou Ctrl sur Mac) et en appuyant sur une lettre ou une touche numérique spécifique correspondant à une section du site..
Comme je l'ai mentionné précédemment, les clés d'accès sont extrêmement simples à mettre en œuvre. Tout ce que cela implique est un simple morceau de code HTML ajouté aux balises d'ancrage de navigation de votre site. -
Accueil
Simple.
Un problème avec les clés d’accès est qu’il n’existe aucun ensemble universel de clés attribuées que les utilisateurs peuvent s’attendre à utiliser. En outre, il n’existe aucune norme permettant d’informer les utilisateurs de celles qui ont été réellement utilisées, ce qui rend les clés d’accès assez inefficaces..
Le gouvernement du Royaume-Uni a cependant un ensemble de clés d'accès recommandées à attribuer, qui sont les suivantes:
Comme vous pouvez le constater, beaucoup des méthodes ci-dessus sont très faciles à implémenter et ne nécessitent que des connaissances de base en HTML. Rendre votre site Web plus accessible ne doit pas nécessairement prendre beaucoup de temps, nécessiter une modification en profondeur ou nuire à l'attrait d'un site Web..
Je pense qu'il est important que les concepteurs comme les développeurs se familiarisent avec l'accessibilité et en tiennent compte au cours des différentes étapes de la création d'un site Web. Plus tôt dans le processus de conception l'attention est portée sur l'accessibilité, plus il sera facile d'intégrer ces méthodes et d'obtenir de meilleurs résultats..
Il est également important de se rappeler que la majorité des méthodes décrites ci-dessus aideront non seulement les personnes handicapées, mais profiteront également à tous les utilisateurs de votre site Web. Certains conseils peuvent même améliorer votre classement avec les moteurs de recherche.
Nous n’avons abordé que quelques astuces qui rendront votre site Web plus accessible, mais si vous êtes vraiment motivé, vous voudrez peut-être vérifier comment vous pouvez vous conformer à la liste complète des consignes d’accessibilité aux contenus Web..
Accentsconagua