Conception Web accessible : comment mettre à jour votre site pour tous les internautes
Publié: 2022-01-11Dans cette vidéo, Jaci de l'équipe WebFX Interactive explique comment vous pouvez vous lancer dans la conception de sites Web accessibles.
Transcription:
Comment vous sentiriez-vous si vous étiez vraiment enthousiaste à l'idée de consulter un site Web, mais que lorsque vous accédez à ce site Web, vous ne pouvez accéder à aucun de ses contenus ? Je me sentirais personnellement frustré, et j'imagine que vous aussi.
Si vous n'utilisez pas de conception Web accessible, c'est le scénario que vous créez pour un adulte sur quatre vivant avec un handicap aux États-Unis. C'est environ 61 millions de personnes qui n'ont pas un accès égal à votre site Web.
Suivre les directives d'accessibilité de la conception Web n'est pas facile si vous ne l'avez jamais fait auparavant, mais je vais décrire certaines choses que vous pouvez faire pour commencer .
Utilisez les horodatages dans la description de la vidéo si vous souhaitez passer à différentes sections de cette vidéo. Pour l'instant, je vais me plonger dans un aperçu de l'accessibilité des sites Web.
Qu'est-ce que l'accessibilité d'un site Web ?
L'accessibilité du site Web signifie que votre site Web est conçu pour que les personnes handicapées puissent l'utiliser. L'objectif de la conception accessible est de supprimer les barrières technologiques afin que n'importe qui puisse interagir avec votre contenu.
Selon le World Wide Web Consortium, également connu sous le nom de W3C, un site Web accessible fonctionne pour les personnes ayant des handicaps auditifs, cognitifs, neurologiques, physiques, de la parole et visuels.
Ne vous inquiétez pas si vous ne savez pas par où commencer. Le W3C dispose d'une documentation qui vous indique ce que votre site Web doit inclure pour répondre à ses normes.
Cette documentation comprend :
- Directives d'accessibilité de l'outil de création (ATAG)
- Directives pour l'accessibilité du contenu Web (WCAG)
- Directives d'accessibilité de l'agent utilisateur (UAAG)
ATAG se concentre sur les outils que les gens utilisent pour créer du contenu Internet et UAAG se penche sur l'accessibilité des outils qui rendent le contenu Web.
Je vais me concentrer sur les WCAG dans cette vidéo, qui sont les lignes directrices pour rendre le contenu du site Web accessible à tous.
Avec WCAG, vous disposez de trois niveaux de conformité différents : A, AA et AAA. Au fur et à mesure que vous passez de A à AA à AAA, vous suivez davantage de normes établies par les WCAG et rendez votre site accessible à un plus grand nombre de personnes.
Alors, comment savoir si vous avez un site Web accessible ? Faites un audit !
Comment auditer l'accessibilité de votre site Web
Vous n'êtes pas obligé de faire une vérification par vous-même. Si vous préférez externaliser votre audit, contactez une équipe de consultants qui pourra analyser votre site web et apporter les ajustements nécessaires pour vous.
Maintenant, si vous préférez gérer les choses en interne, vous avez beaucoup d'options. Vous pouvez parcourir les pages de votre site Web à la recherche de problèmes manuellement, mais cela prendra probablement beaucoup de temps.
Vous voudrez peut-être utiliser certains outils pour vous aider. Branchez votre URL dans un vérificateur d'accessibilité comme WAVE pour voir ce que vous devez mettre à jour sur une page. Vous pouvez également utiliser un vérificateur d'accessibilité en bloc pour analyser plusieurs pages à la fois.

Le site Web du W3C propose une longue liste d' outils d'accessibilité , vous n'avez donc pas à tout faire vous-même.
Nous avons également une liste de cinq éléments importants pour votre accessibilité et quelques exemples de conception accessibles - dont je vais parler ensuite - alors restez avec moi.
5 directives d'accessibilité pour la conception Web
N'oubliez pas qu'il s'agit de courts résumés des lignes directrices des WCAG. Je vous encourage à utiliser le guide de référence rapide du W3C pour apprendre des techniques plus approfondies pour une conception accessible.
1. Assurez-vous que le texte est lisible
Tout texte de taille normale qui communique des informations importantes doit être facile à lire.
Le contraste y joue un rôle important. Dans l'état actuel des choses, le texte volumineux (comme les principaux titres) nécessite un rapport de contraste texte / arrière-plan de 3: 1. Le texte normal (ou plus petit), comme le texte qui compose le corps de votre contenu, a besoin d'un rapport de contraste de 4,5:1.
Un exemple de trop peu de contraste ressemble à du texte vert clair sur un fond vert légèrement plus foncé. Changez le texte en noir ou blanc, et vous aurez beaucoup plus de contraste sur votre site Web.
Les utilisateurs doivent également pouvoir effectuer un zoom avant sur le texte d'une manière qui n'affecte pas les fonctionnalités de votre site ou ne leur fait pas manquer de contenu.
2. Optimisez les images pour être vues et lues
L'ajout de texte alternatif aux images n'est pas seulement une pratique SEO courante. Cela aide les personnes qui ne peuvent pas voir les images à comprendre ce qu'elles contiennent.

Le texte alternatif est un morceau de texte qui explique clairement ce qui se passe dans une image. Le texte alternatif s'intègre parfaitement dans les codes d'intégration de vos images. Comme vous le voyez dans cet exemple de Mashable, la page contient des images et lorsque vous passez du côté code, vous voyez le texte alternatif.

3. Donnez à votre public des moyens supplémentaires de comprendre les vidéos
Si vous n'avez jamais ajouté de sous-titres à vos vidéos auparavant, il est temps de commencer. Et ne vous fiez pas uniquement à ceux que YouTube ou un autre fournisseur d'hébergement génère automatiquement.
Si vous avez le temps et la patience, jetez un œil à vos sous-titres générés automatiquement et apportez des modifications. Ils ne seront pas parfaits venant d'une IA.
Vous pouvez également commander des sous-titres à l'aide d'un outil comme Rev, puis les ajouter à votre vidéo.
Inclure des transcriptions avec vos vidéos les rend plus accessibles. Si vous avez écrit un script, vous avez déjà préparé une transcription !
Les descriptions audio ajoutent une autre couche d'accessibilité. Ce sont des pistes audio distinctes qui décrivent ce qui se passe dans votre vidéo entre les intervalles de dialogue.
Donc, si vous avez deux personnes qui parlent de leur récente sortie shopping, puis que la vidéo passe à une séquence d'une personne essayant des vêtements, la description audio expliquera ce qui se passe dans la vidéo. Cela peut ressembler à ceci : une femme se tient devant un miroir et drape deux foulards sur son épaule.
Une plateforme d'hébergement comme Wistia vous permet de télécharger des descriptions audio (et a même une liste de contrôle d'accessibilité vidéo lorsque vous téléchargez vos vidéos).
4. Concevez votre site Web de manière à ce qu'il soit convivial pour la souris et le clavier
Tout le monde n'utilise pas une souris pour naviguer sur Internet. Votre site Web doit refléter cela.
Cela signifie non seulement que vous devez vous assurer que quelqu'un peut interagir avec votre site Web via un clavier, mais cela nécessite également que vous ayez des moyens visibles de mettre en évidence la partie de votre site Web qui est ciblée.
En regardant un autre des exemples de conception accessibles, vous voyez que lorsque je clique sur la barre de recherche sur le site Web de Keds, la ligne clignotante classique apparaît pour me faire savoir que je peux taper. La barre de recherche devient également plus visible lorsque vous cliquez dessus.

Pour respecter les directives WCAG, cette fonctionnalité doit se produire lorsqu'un clavier est utilisé.
5. Rendez la navigation de votre site facile à comprendre
Cette astuce va au-delà de l'accessibilité. C'est généralement une bonne chose de rendre la navigation sur votre site Web simple et claire.
Rédigez des titres de page et des en-têtes qui ont un objectif clair. Utilisez un texte d'ancrage de lien qui permet de comprendre facilement le contenu du contenu vers lequel vous créez un lien.
Encore une fois, utilisez des indicateurs de focus pour que les gens sachent où ils se trouvent sur une page. Offrez plusieurs façons d'accéder à une page Web, par exemple via un plan du site, la navigation principale ou la table des matières.
Et comment puis-je sauter celui-ci? Avoir une navigation cohérente. Cela signifie que si vous avez un en-tête de navigation principal, il ne devrait vraiment pas changer lorsqu'un utilisateur saute d'une page à l'autre.
Dans cet exemple présentant le site Web d'At Home, bien que je clique d'une page à l'autre, la navigation en haut de la page ne change pas.

Et comme je l'ai dit plus tôt, ce n'est certainement pas une liste complète de ce que vous devez faire pour suivre les directives d'accessibilité de la conception Web. Ces directives peuvent également changer, alors faites vos recherches lorsque vous serez prêt à évaluer votre accessibilité .
Pour continuer à en savoir plus sur les différents sujets de conception Web et de marketing numérique, abonnez-vous à notre chaîne YouTube et à notre newsletter par e-mail, Revenue Weekly . Vous ne serez pas déçu.
Merci de m'avoir rejoint !

Rejoignez les 5 000 spécialistes du marketing qui tirent leurs connaissances en marketing des vidéos WebFX.
Abonnez-vous maintenant
