Bâtiment 39; Accessibilité: comment faire en sorte que votre magasin soit accessible à tous
En tant que développeurs et propriétaires de magasins en ligne, nous considérons généralement l’accessibilité comme une récompense. Mais c’est une demande! Chaque partie du site Web doit être considérée du point de vue de tous les visiteurs, quel que soit leur âge, leurs capacités ou leur handicap. Après tout, il est important que tout le monde puisse facilement utiliser votre magasin et acheter vos produits. En fin de compte, le contenu accessible est défini comme: perceptible. Toutes les informations doivent être présentées d’une manière qui soit perçue par l’utilisateur, quel que soit le type de programme utilisateur (navigateur, lecteur d’écran ou autre logiciel) qu’il utilise et quel que soit son handicap. Opérationnel. Les visiteurs doivent être en mesure de parcourir le site et d’utiliser toutes les fonctionnalités, même s’ils n’utilisent pas la souris traditionnelle. C’est compréhensible. Le contenu, les formulaires, les menus, les liens et les autres composantes du site Web doivent être faciles à comprendre par les utilisateurs. Robuste Divers outils, dont un lecteur d’écran, un logiciel de reconnaissance vocale et un lecteur braille, devraient pouvoir lire votre contenu. Mais comment l’accessibilité devient – elle une partie essentielle du processus de développement? Quels sont les facteurs à prendre en considération et comment les magasins existants s’adaptent – ils? Quels outils peuvent être utilisés pour tester l’accessibilité Web?
Vous trouverez ci – dessous des réponses à toutes ces questions, mais si vous êtes intéressé à mieux comprendre pourquoi l’accessibilité est si importante, veuillez vérifier l’importance de l’accessibilité pour votre boutique en ligne. Faire de l’accessibilité le Centre d’intérêt des sites Web accessibles commence par la bonne mentalité. Il est important de faire participer tout le monde – développeurs, entrepreneurs, gestionnaires de contenu, etc. Sur la même page Une des meilleures façons de comprendre l’accessibilité est d’essayer d’utiliser un lecteur d’écran pour utiliser votre site web préféré. La nvda est un 8
Oreal fait partie de la conception du site? Dites au lecteur d’écran de sauter un élément décoratif en spécifiant un attribut alt vide pour l’élément décoratif: Idéalement, vous devriez inclure des images décoratives dans CSS plutôt que dans HTML. Si vous souhaitez ajouter des mots clés à votre texte alternatif pour le référencement, n’oubliez pas que Google donnera la priorité à l’expérience utilisateur. L’attribut ALT est plus important pour mieux décrire l’image que pour lister les mots clés.
Une chose importante à considérer lors de l’ajout d’un lien est de toujours dire aux visiteurs du site ce qui se passe lorsqu’ils cliquent. Même s’ils lisent les liens complètement hors contexte (ce qui arrive souvent avec certains types de lecteurs d’écran), ils devraient savoir où ils vont. Exemple de texte du lien d’erreur: Pour plus d’informations sur les bougies, cliquez ici. Téléchargez notre tableau de taille et trouvez la taille qui vous convient le mieux. Bon lien exemple de texte: pour en savoir plus sur les bougies, consultez la foire aux questions sur les bougies. Pour trouver la taille qui vous convient le mieux, téléchargez le tableau des tailles en format PDF. Cependant, il est parfois utile ou nécessaire d’utiliser le texte lié comme « lire plus ». Par exemple, la grille des billets de blog récents sur votre page d’accueil, où chaque court extrait se termine par un lien « en savoir plus ». Que feriez – vous dans cette situation?
Une bonne solution est d’utiliser l’attribut Aria tag, qui vous permet d’ajouter des étiquettes descriptives aux liens. Voici l’apparence du lien avec l’attribut air Label:
Mais si vous voulez lier une image? Pour les images, t
L’attribut uo alt sera le texte du lien. Par conséquent, si vous avez un modèle de téléchargement de livres électroniques gratuits, vous voulez que vos attributs alt ressemblent à « choisissez un livre électronique avec du rouge à lèvres qui correspond à votre teint de peau ». Cela indique aux visiteurs du site ce qu’est l’image et ce qui s’ouvrira lorsqu’ils cliqueront dessus.
La première chose à considérer est la taille de la police. Ce qui est important, c’est que votre texte peut être lu facilement par des personnes partiellement aveugles ou qu’il est difficile de voir des caractères plus petits. Bien qu’il n’y ait pas de taille minimale pour les caractères officiels, un bon point de départ pour le texte est 16px. En général, c’est le navigateur de l’utilisateur qui Redimensionne les caractères, soit en zoomant sur le texte lui – même, soit en zoomant sur la page et en appliquant un style de réponse. Vous devriez créer votre site Web afin que les utilisateurs puissent zoomer jusqu’à 200% sans perdre la capacité d’utiliser ou de visualiser le contenu du site. Par exemple, vous voulez éviter de tronquer du contenu ou d’écraser du texte lorsque vous redimensionnez un caractère. La meilleure façon de le faire est de le tester vous – même. Trouvez ici une description de chaque navigateur.
Considérez également vos choix de rôles. Les courbes ou les caractères complexes sont souvent difficiles à lire et ne peuvent être utilisés qu’occasionnellement (p. ex., éléments de signature ou de décoration). Utilisez seulement 2 – 3 caractères dans tout le site pour rendre votre information moins confuse et plus facile à comprendre. Test de cécité des couleurs de Shiyuan, souvent utilisé pour tester la cécité des couleurs. Tout le monde ne voit pas les couleurs de la même façon. En fait, environ 8% des hommes et 0,5% des femmes souffrent d’une forme ou d’une autre de cécité des couleurs. Votre site Web devrait donc être entièrement fonctionnel et disponible en niveaux de gris. Vous pouvez utiliser des outils tels que l’extension Chrome Scale
Accessibilité Si vous vendez des téléchargements numériques sur un site de commerce électronique, il est également important de s’assurer que les téléchargements eux – mêmes sont accessibles. Une bonne façon de rendre le pdf accessible est d’ajouter des balises PDF qui fournissent aux lecteurs d’écran une représentation structurée et cachée du contenu visuel. Adobe Acrobat offre un excellent guide sur la façon d’accéder au PDF. Bien sûr, lors de la conception du téléchargement numérique, vous devez également garder à l’esprit les autres principes d’accessibilité discutés ci – dessus, tels que le contraste de couleur et la taille de police.
Cours accessibles lorsque vous créez un cours en ligne, assurez – vous de garder à l’esprit des concepts tels que le Sous – titrage vidéo et la transcription audio. Envisagez de présenter votre contenu dans une variété de styles, comme la vidéo, l’audio et le texte, afin que chacun ait son propre style. Bon nombre des principes de conception ci – dessus s’appliquent également à votre cours. Il est important d’offrir plus de façons de communiquer à vos élèves. Par exemple, les utilisateurs non linguistiques peuvent ne pas être en mesure d’appeler et de poser des questions, et les étudiants aveugles peuvent ne pas être en mesure d’envoyer facilement des questions en ligne. Cela s’applique également à l’envoi de tout travail ou cours. Soyez flexible avec vos élèves et travaillez avec tout étudiant handicapé existant pour les aider à tirer le meilleur parti de votre programme. Lorsqu’il s’agit de rendre votre boutique en ligne accessible, il est important de prendre le temps de comprendre comment les personnes handicapées utiliseront votre site Web. Si vous avez une bonne compréhension de toutes les étapes du processus de développement, il est plus facile de tenir compte de l’accessibilité et, en fin de compte, d’offrir une excellente expérience à tous vos clients. Si vous souhaitez en savoir plus, WordPress vous propose un excellent manuel d’accessibilité Web avec plus d’outils de test, meilleures pratiques de développement et conseils aux propriétaires de magasins