La raison de l’ajustement de votre site Web est claire, vérifiez. Maintenant, vous devez savoir comment. Parce qu’il n’est pas encore inclus en standard sur de nombreuses plateformes e-commerce, votre agence e-commerce devra s’occuper d’un certain nombre de choses. Pour vous aider sur votre chemin, vous trouverez ci-dessous un certain nombre de conseils que vous pouvez utiliser pour bien commencer à rendre votre site Web et votre boutique en ligne Magento accessibles.
1. Ajoutez un texte alternatif clair aux images
Le texte alternatif (alt) est utilisé pour rendre les images accessibles aux personnes aveugles et malvoyantes. Ils utilisent souvent un lecteur d’écran ou un clavier braille pour traduire le contenu d’une page Web. Décrivez dans le texte alternatif aussi clairement que possible ce qui peut être vu dans l’image.
L’exception à cette règle est lorsqu’une image est utilisée uniquement pour la décoration. Dans ce cas, le texte alternatif peut être laissé vide afin que l’utilisateur du lecteur d’écran ne soit pas distrait du contenu le plus important de la page Web.
Utilisez-vous un système PIM ? Ensuite, le texte alternatif correct est transféré directement du PIM vers la boutique en ligne Magento. Si vous utilisez Magento pour gérer les images, ce texte alternatif est en tête. Dans tous les cas, assurez-vous de bien gérer les textes alternatifs en un seul endroit.
2. Accessible au clavier
Les personnes malvoyantes n’utilisent généralement pas une souris mais un clavier pour naviguer sur un site Web. Par conséquent, assurez-vous que le contenu Web d’une page n’est pas seulement accessible avec une souris mais également avec un clavier.
Afin de rendre un site Web accessible avec le clavier, il est important de s’assurer que tous les éléments interactifs du site Web ont le focus lorsque la touche Tab est enfoncée. Les développeurs utilisent l’attribut tabindex= »0″ pour permettre à un élément de recevoir le focus clavier.
3. Les liens clairs et descriptifs
À l’aide d’une technologie d’assistance, telle qu’un lecteur d’écran, les utilisateurs peuvent demander un aperçu des liens sur une page. Si le but de chaque lien est clair, une personne utilisant un lecteur d’écran saura s’il doit cliquer dessus ou non. Les erreurs courantes ici sont les liens trop généraux « en savoir plus » et « cliquez ici » sur une page Web.
Par exemple, si un lien pointe vers la page Web À propos de nous » :
N’utilisez pas de lien tel que le texte souligné : Cliquez ici pour en savoir plus sur notre entreprise.
4. Sauter à gauche
Un lien de saut offre aux utilisateurs de technologies d’assistance, comme un lecteur d’écran, un moyen d’ignorer les liens de navigation courants. Par exemple, ils utilisent la touche « Tab » pour faire défiler la page et utilisent souvent la « Tab » inutilement . Un lien de saut est un lien vers le contenu le plus pertinent de la page. En cliquant dessus, vous accéderez directement à ce contenu.
5. Contraste des couleurs
Lors de l’utilisation de la couleur, il est important d’avoir un contraste suffisant entre la couleur d’arrière-plan et la couleur de premier plan. Des couleurs suffisamment contrastées permettent aux utilisateurs visuels de lire ou de comprendre plus facilement le contenu (texte ou images de texte) de la page.
6. Rendre les formulaires accessibles
Si les champs du formulaire ne sont pas correctement étiquetés, une personne utilisant un lecteur d’écran ne recevra pas les mêmes invités qu’une personne voyante. Il peut alors être difficile de déterminer quel type de contenu saisir dans un champ de formulaire pour un utilisateur de lecteur d’écran.
Chaque champ d’un formulaire doit donc avoir une bonne étiquette descriptive. Par exemple, si un champ de formulaire est destiné au nom d’une personne, l’étiquette « Nom complet » ou deux champs distincts intitulés « Prénom » et « Nom de famille » doivent être utilisés. Utilisez la balise
Parfois, certains champs de saisie sont requis avant de cliquer sur le bouton Envoyer. Dans cette situation, l’attribut « obligatoire » peut être utilisé. Cet attribut indique à un utilisateur de lecteur d’écran que le champ de saisie est obligatoire avant de continuer.
7. Page Web de présentation avec titres et sous-titres
Utilisez des titres et des sous-titres pour former un aperçu de la page. Ils aident les utilisateurs malvoyants (y compris les moteurs de recherche) à comprendre comment la page est organisée et facilitent la navigation des utilisateurs de lecteurs d’écran sur un site Web.
Exemples d’utilisation appropriée des titres : utilisez des en-têtes pour indiquer et organiser la structure du contenu. Ne sautez pas les niveaux de titre, ne passez pas d’un
Rendre le multimédia accessible à tous, en particulier aux personnes handicapées, ne devrait plus être un choix en 2022. Mais nous savons aussi que de nombreuses entreprises n’y travaillent pas encore et que les grands partis (logiciels) ne l’ont pas encore suffisamment mis à l’ordre du jour. Mais on peut déjà faire des petits pas, qui assurent une meilleure expérience !