Accessibilité numérique pour les spécialistes du marketing, partie 2 : expérience utilisateur et sites Web
Publié: 2022-06-16Dans le premier article de cette série sur l'accessibilité numérique, nous avons abordé le "quoi et le pourquoi" de l'accessibilité pour les spécialistes du marketing. Il est maintenant temps pour le "comment".
Notez que nous avons intentionnellement limité nos recommandations aux éléments assez faciles à mettre en œuvre et pertinents pour les spécialistes du marketing. Cette série n'est en aucun cas une liste exhaustive de toutes les normes que les entreprises doivent connaître en matière de contenu accessible. Si vous souhaitez en savoir plus sur les détails des directives d'accessibilité et des critères WCAG, consultez le programme d'apprentissage en ligne TGPi. Il s'agit d'une option d'auto-formation que vous pouvez utiliser pour maintenir vos compétences à jour ou vous familiariser avec les techniques d'accessibilité et les meilleures pratiques.
Passons aux recommandations !
Accessibilité et expérience utilisateur
Une expérience utilisateur fluide et sans effort est l'étoile polaire de chaque spécialiste du marketing. La facilité avec laquelle un individu peut accomplir une tâche critique et la façon dont le contenu répond aux attentes ont une forte incidence sur cela et feront ou détruiront vos efforts de marketing.
C'est logique, non ? Si vous souhaitez acheter quelque chose en ligne et que vous rencontrez un problème lors de la saisie des informations de votre carte de crédit, ou que l'article que vous vouliez est en rupture de stock, la qualité de votre expérience utilisateur chutera. Premièrement, parce que vous n'étiez pas en mesure d'accomplir ce que vous vouliez faire, et deuxièmement, parce que vous vous attendiez à pouvoir l'accomplir, mais ce n'était pas dans les cartes. Ce double coup dur garantirait presque certainement que vous ne reviendrez pas sur ce site Web particulier !
En tant que spécialiste du marketing, vous êtes bien conscient de l'importance d'une expérience utilisateur supérieure. Vous pouvez même le tester (bon pour vous !) ou avoir des analyses en place pour le mesurer. Ces mesures sont essentielles pour optimiser votre entonnoir marketing. Cependant, ce que vous ne faites peut-être pas, c'est tester l'expérience utilisateur pour l'accessibilité. (Si vous ne l'êtes pas, pas de jugement ! C'est ce que cette série d'articles a l'intention de changer.)
Parcours utilisateurs
Un parcours utilisateur (également appelé flux utilisateur ou parcours utilisateur) est une séquence d'actions qu'un utilisateur effectue sur votre site. Un parcours utilisateur critique s'aligne sur l'objectif principal de votre site, comme effectuer un achat, soumettre un formulaire, regarder une vidéo, lire un message, etc.
Vous devez toujours donner la priorité à la correction de l'accessibilité pour vos parcours utilisateur essentiels pour plusieurs raisons.
Tout d'abord, bien que vous puissiez avoir un contenu incroyable sur votre site, si un utilisateur ne peut pas atteindre son objectif principal en visitant votre site Web, c'est un client que vous avez perdu pour toujours.
Deuxièmement, de nombreuses personnes handicapées sont malheureusement habituées à rencontrer des difficultés lorsqu'elles font des choses que d'autres tiennent pour acquises. Ils les attendent généralement, car une grande partie du monde n'a pas été créée en tenant compte de leurs handicaps particuliers.
En moyenne, les problèmes d'accessibilité mineurs sur le contenu tangentiel ne sont pas susceptibles de les frustrer au point d'engager une action en justice. Mais s'ils sont incapables de faire la seule chose qu'ils sont venus accomplir sur votre site Web, vous vous exposez à un gros risque juridique, surtout si vous êtes une marque basée aux États-Unis.
Tester vos chemins utilisateurs critiques
Alors, comment testez-vous l'accessibilité de vos flux d'utilisateurs critiques ? Si vous optez pour la voie manuelle, vous pouvez effectuer des tests utilisateur avec des personnes handicapées ou inspecter le code pour chaque étape à l'aide d'un outil comme la boîte à outils ARC de TPGi (plus à ce sujet plus tard) pour identifier les échecs WCAG.
Bien que les tests manuels soient finalement plus complets, si vous cherchez à identifier immédiatement les erreurs d'accessibilité dans vos chemins d'utilisateur critiques, vous pouvez utiliser la fonction User Flows d'ARC Monitoring pour analyser automatiquement chaque composant pour l'accessibilité. Vous pouvez inclure tous les composants et les interactions dynamiques d'un parcours utilisateur, des images aux boîtes de dialogue, pour l'analyse, et vous serez en mesure de suivre les erreurs au fil du temps pour aider à améliorer vos processus de correction internes.
Vous pouvez associer les informations que vous obtenez de la surveillance des flux d'utilisateurs d'ARC avec vos autres outils d'analyse, tels que l'entonnoir et les objectifs de Google Analytics, pour identifier les obstacles qui empêchent les utilisateurs d'effectuer l'action souhaitée.
Sites Web accessibles
Un site Web est le magasin numérique ou le bureau de votre entreprise. Il peut s'agir de la première (ou de la seule) impression qu'un client potentiel aura de votre entreprise, vous devez donc la rendre aussi attrayante que possible. Peut-être avez-vous quelques vidéos, ou beaucoup d'images pour rompre la monotonie, ou des pages sur des pages de contenu de blog précieux. Ce sont tous des atouts formidables que les spécialistes du marketing peuvent exploiter pour persuader les gens d'acheter leurs produits.
S'assurer que tout ce contenu est accessible peut sembler décourageant, mais bon nombre des meilleures pratiques en matière de contenu accessible sont indiscernables des meilleures pratiques de marketing. Continuez à lire pour en savoir plus:
Texte du lien descriptif
Tout bon spécialiste du marketing sait que la clarté est essentielle pour une excellente communication. Si vous embellissez votre copie avec des peluches et des mots importants (mais finalement dénués de sens), votre message se perdra. De même, si vous êtes trop avare d'explications, un client risque de ne pas avoir assez d'informations pour comprendre ce que vous lui dites.
Un contenu de haute qualité est un équilibre entre ces deux extrêmes et, sans surprise, le lien ou le texte d'ancrage suit ces mêmes règles. Le meilleur texte de lien donne à l'utilisateur une idée de ce à quoi s'attendre une fois qu'il a cliqué. Le texte du lien descriptif est particulièrement important pour votre copie d'incitation à l'action. Qu'est-ce qui prépare mieux l'utilisateur à ce qu'il rencontrera lorsqu'il cliquera sur : « Cliquez ici » ou « Téléchargez notre livre blanc » ? Evidemment, ce dernier ! (Si vous avez choisi le premier, vous voudrez peut-être envisager un nouveau cheminement de carrière.)
Il n'est pas nécessaire d'enchâsser votre CTA avec des mots à la mode ("Téléchargez le plus grand livre blanc du monde sur la magie de Harry Houdini !"), mais il est essentiel de faire en sorte que les gens sachent dans quoi ils s'embarquent.
Pourquoi le texte du lien est-il si important pour l'accessibilité ? Tout d'abord, cela aide grandement les personnes aveugles ou malvoyantes à écrémer le contenu de la page. (Cela vaut également pour les personnes ayant une vision parfaite.) Les utilisateurs ayant une déficience visuelle utilisent une gamme de technologies d'assistance pour accéder au contenu numérique, telles que des outils d'agrandissement d'écran pour les personnes malvoyantes et des lecteurs d'écran pour les personnes aveugles. Comme son nom l'indique, un lecteur d'écran lit littéralement ce qui est à l'écran.
Cependant, les lecteurs d'écran comme JAWS permettent aux utilisateurs de sauter tout autour de l'écran, en lisant divers composants au lieu de parcourir tout le code HTML de haut en bas. Lorsqu'un utilisateur passe d'un composant à l'autre, le lecteur d'écran ne lit que le texte d'ancrage des liens, pas la copie environnante. Cela signifie que si tous vos liens sont la même copie "cliquez ici", un utilisateur de lecteur d'écran n'aura aucune idée de ce qui se passera s'il suit ce lien ; ils sont obligés d'explorer le contenu environnant pour comprendre à quoi ce lien se rapporte.
De plus, les lecteurs d'écran permettent aux utilisateurs d'ouvrir une "liste de liens", ce qui leur donne un accès rapide à tous les liens d'une page Web. Il s'agit d'un scénario courant où le texte du lien sera lu hors de son contexte environnant et où des choses comme "cliquez ici" deviennent un véritable problème.
Texte alternatif pour les images
Le texte alternatif, ou "texte alternatif", décrit les images de votre site Web afin qu'un utilisateur de lecteur d'écran puisse avoir une idée plus complète du contenu de chaque page Web. Si vous choisissez des images qui fonctionnent comme une explication visuelle, les personnes qui ne peuvent pas les voir seront perdues si vous renoncez au texte alternatif.
Cependant, si vous avez inclus des images pour des raisons purement esthétiques (peut-être aimez-vous vraiment les photos de personnes penchées sur des ordinateurs) et que vous en avez plusieurs, vous ne voudrez peut-être pas ajouter de texte alternatif pour toutes. Les lecteurs d'écran liront tout le texte alternatif pour chaque image, ce qui, si le texte n'ajoute pas activement de valeur à l'expérience, peut être ennuyeux. Si une image peut être considérée comme décorative et n'ajoute aucune signification/compréhension supplémentaire au contenu de la page, elle doit être masquée pour la technologie d'assistance en fournissant un attribut alt vide.
Des sites Web bien structurés
Utilisez vos balises d'en-tête de manière appropriée afin que les lecteurs malvoyants et non malvoyants puissent parcourir la page et obtenir une compréhension de base du contenu et y naviguer facilement. Suivez les meilleures pratiques pour les en-têtes, comme commencer chaque page avec un H1 qui décrit le contenu de la page, puis utiliser les H2 et H3 comme sous-titres. Utilisez intentionnellement les balises d'en-tête ; ne les échelonnez pas au hasard sans penser à la structure.
Bien que vous puissiez différencier les titres par des moyens visuels grâce au style CSS, les utilisateurs de lecteurs d'écran n'ont pas le luxe de voir ces distinctions. Il est particulièrement important d'utiliser des mises en page bien formatées pour s'assurer que les utilisateurs ayant des difficultés de vision peuvent facilement consommer votre contenu.
Réduisez au minimum les paragraphes denses, utilisez des phrases plus courtes lorsque vous le pouvez et évitez d'utiliser du jargon ou de l'argot. Une copie plus claire et plus concise aidera les utilisateurs souffrant de troubles cognitifs à mieux comprendre votre contenu et aidera également à minimiser la confusion pour tous les lecteurs.
Peut-être avez-vous entendu dire que la durée d'attention des gens est maintenant plus courte que celle d'un poisson rouge ? En cas de doute, décomposez-le; rendez-le aussi simple que possible.
Rapports de contraste des couleurs
Espérons que le guide de style de votre organisation n'a pas été conçu par le Père Noël, car l'utilisation du rouge et du vert comme couleurs complémentaires ne rendra pas service à vos utilisateurs. Le contraste des couleurs est un élément essentiel du design accessible. Les personnes malvoyantes peuvent avoir du mal à différencier les couleurs qui sont trop similaires, et pour les utilisateurs daltoniens, de nombreuses couleurs sont impossibles à distinguer.
Vous pouvez essayer l'outil gratuit d'analyse du contraste des couleurs de TGPi qui éliminera les conjectures pour déterminer des rapports de couleurs suffisants. Utilisez le sélecteur de couleurs pour choisir vos couleurs de premier plan et d'arrière-plan, et le CCA vous dira si le contraste est approprié.
Formulaires accessibles
Pratiquement tous les sites utilisent un formulaire pour permettre aux utilisateurs d'effectuer une tâche. Que votre entreprise soit du commerce électronique, basée sur les services ou même simplement une vitrine en ligne, elle inclura très probablement un formulaire. Cependant, les formulaires peuvent être délicats pour les personnes handicapées. Il existe plusieurs considérations techniques (lire : celles que les développeurs doivent mettre en œuvre) ainsi que des considérations non techniques, que les spécialistes du marketing sans connaissances en codage peuvent facilement suivre. Voici les bonnes pratiques non techniques :
- Gardez les formulaires courts et simples - Obtenez les coordonnées des clients, puis établissez une relation pour les engager et tirer davantage de connaissances supplémentaires
- Fournissez des instructions claires et des étiquettes visibles - Personne n'aime un formulaire déroutant
- Valider les entrées (annuler les modifications/confirmer) - Avertir les utilisateurs de tout problème et comment les résoudre
- Notification utilisateur (succès / échec) - Informez les utilisateurs si la soumission du formulaire a réussi ou non
- Adoptez un formulaire multipage ou progressif – Si vous devez avoir un formulaire plus compliqué, visez un formulaire multipage ou progressif qui ne submerge pas les utilisateurs
- Supprimer les délais ou proposer des options - Les délais peuvent être utiles pour contraindre les acheteurs à acheter, mais ils ajoutent un stress excessif aux personnes souffrant de graves problèmes d'anxiété
Chapelure
Les fils d'Ariane sont une forme de navigation sur votre site qui vous permet de voir comment la page que vous parcourez actuellement s'intègre dans l'image plus grande. Ce sont généralement des liens qui mènent à des pages de niveau supérieur.
Un exemple de fil d'Ariane sur un site de commerce électronique qui vend des vêtements pourrait être
Femme > Vestes > Laine > Cabans.
Les fils d'Ariane sont utiles pour s'orienter et permettent aux utilisateurs de revenir facilement aux pages de niveau supérieur sans recommencer leur voyage à partir de zéro.
Ils sont particulièrement critiques pour les personnes handicapées pour plusieurs raisons. D'une part, les utilisateurs ayant des troubles cognitifs bénéficieront toujours d'une expérience conviviale qui minimise l'ambiguïté. Les fils d'Ariane sont particulièrement importants si votre site est tentaculaire et compliqué. Les fils d'Ariane orientent également immédiatement les utilisateurs de lecteurs d'écran, rendant la navigation sur le site moins ardue.
Bien que les fils d'Ariane soient clairement utiles pour les utilisateurs handicapés, comme de nombreuses bonnes pratiques d'accessibilité, ils améliorent l'expérience de tous les utilisateurs.
Chatbots et intégrations tierces
De nombreux sites Web exploitent des intégrations tierces pour leurs sites Web, comme les chatbots, les modaux contextuels, les pages de destination dynamiques, etc. C'est une triste réalité que les logiciels tiers sont souvent largement inaccessibles, une situation aggravée par l'incapacité d'une entreprise à y remédier.
Si votre organisation choisit d'intégrer une application tierce à votre site Web, assurez-vous qu'un expert l'évalue avant de l'ajouter. Même si vous ne pourrez peut-être pas résoudre de nombreux problèmes d'accessibilité, vous comprendrez au moins le niveau de risque que vous prenez. Vous pouvez également demander une déclaration ou une garantie d'accessibilité à votre fournisseur pour l'intégrer dans un contrat (bien que vous deviez toujours tester le produit pour vérifier son exactitude avant de l'implémenter).
En passant, interrogez toujours vos fournisseurs sur l'accessibilité de leurs produits. Plus il y a de clients qui demandent des produits accessibles, plus les fournisseurs ont de chances d'écouter et de commencer à intégrer des fonctionnalités d'accessibilité dans leurs versions de produits.