Utilisation des guides de style pour l'accessibilité

Commençons par poser quelques questions.

Qu'est-ce qu'un guide de style?

Un guide de style est un document de conception qui peut être utilisé pour établir un ensemble de normes lors de la constitution de garanties ou d'interfaces utilisateur pour une entreprise, essentiellement tout produit ou artefact produit pour l'entreprise.. 

Qui utilise un guide de style?

Un guide de style peut être créé pour un développeur, afin qu'il connaisse les détails de ce qu'il faut construire, ou qu'un concepteur comprenne les considérations de conception et la vue d'ensemble. Il peut également être utilisé de manière plus large dans une organisation pour donner des indications et clarifier la création de nouveaux documents.. 

Qu'est-ce que l'accessibilité??

L'accessibilité consiste à s'assurer que vos conceptions respectent une norme commune et sont accessibles à un large éventail de personnes, telles que celles souffrant d'un handicap physique ou cognitif..

Pourquoi utiliser un guide de style pour l'accessibilité?

Un guide de style est un excellent moyen d’appliquer automatiquement la cohérence dans vos conceptions. Cela garantit que vous disposez d'une base solide pour travailler. Lorsque nous parlons de guides de style, nous pensons normalement à l’intégrité du logo, à la typographie, à la couleur. Mais qu'en est-il de l'accessibilité? Considérez les cas suivants pour utiliser un guide de style d'accessibilité:

1. Pour définir la direction

Un guide de style donne la direction. Par exemple, au lieu de devoir créer une maquette parfaite en pixels chaque fois que vous concevez un formulaire, un développeur peut préférer se référer à un guide d'accessibilité pour décider de la manière de le construire. Lors de la définition des instructions d’accessibilité, vous pouvez inclure des instructions sur les types de contrôle de formulaire à utiliser et à quel moment.. 

2. SEO

Le référencement est une autre raison pour laquelle les concepteurs doivent être conscients de l'accessibilité. Par exemple, si vous placez du texte dans une image, les lecteurs d'écran ne pourront pas y accéder et Google pénalisera votre site Web pour contenu mal balisé. Rendre votre site Web accessible a pour résultat positif supplémentaire d'aider SEO.

3. Expérience utilisateur

L'accessibilité est une grande partie de l'UX; Après tout, tout le monde ne fera pas l'expérience d'un produit de la même manière. Des couleurs contrastées peuvent diriger un utilisateur à travers le flux souhaité, mais une personne incapable de distinguer ces couleurs contrastantes peut trouver l'expérience peu intuitive. Anticiper les obstacles à la convivialité et les prévoir dans un guide de style d'accessibilité est une bonne pratique.. 

4. Remettre

Hand off est un exemple parfait du moment où vous utiliseriez un guide de style d'accessibilité. Vous pouvez travailler sur une base contractuelle et chercher à concilier vos responsabilités avec le prochain entrepreneur ou la prochaine agence qui prendra la relève. Donnez à la prochaine ligne de travailleurs un aperçu de votre façon de penser du point de vue de l'accessibilité. 

Commencer par les bases

Formes

Les formulaires ont un certain nombre d'heuristiques ou de règles empiriques associées à l'accessibilité. Comment un formulaire est construit est très important. Quand était la dernière fois que vous avez inclus un élément avec un

? Les détails de balisage comme celui-ci sont vraiment utiles pour les technologies d'assistance..

Visuellement, vous pourriez considérer la proximité des étiquettes pour former des entrées. Un autre exemple peut-être alignement et comment ils rendent sur mobile. 

Cible tactile

La taille de la cible tactile est très importante. Sur les appareils mobiles et les tablettes, l'utilisateur doit disposer de la quantité optimale d'espace pour sélectionner un élément de bouton. Si c'est trop petit, ils sont susceptibles de penser que le système est en retard ou que le lien ne fonctionne pas! Idéalement, vous voudriez qu'une cible mesure environ 44 points de haut et de large pour pouvoir être tapée avec le doigt avec précision. 

 Contraste de couleur

Y a-t-il suffisamment de contraste de couleur sur les éléments de votre page? Le texte est-il lisible sur certaines photos? Il est important de prendre en compte le fait que de nombreuses personnes souffrent de troubles de la vision ou sont daltoniennes d’une manière ou d’une autre.. 

Taille du texte

Un petit texte est un autre problème courant, en particulier pour les personnes âgées. Les développeurs doivent personnaliser les interfaces utilisateur pour plus de flexibilité, afin que les utilisateurs ayant des difficultés à lire du texte puissent effectuer des zooms avant et arrière. Si vous concevez pour une application, vous souhaitez créer une mise en page qui s'adapte à l'écran de l'appareil. Les utilisateurs doivent éviter les contrôles dans lesquels l'utilisateur doit zoomer ou faire défiler horizontalement. 

 De plus, la taille du texte doit être au minimum de 11 points, de manière à être lisible. Idéalement, vous voulez que l’utilisateur moyen évite d’avoir besoin de faire un zoom avant ou arrière pour lire le contenu..

Dégradation progressive

La dégradation gracieuse fait référence à l'efficacité du fonctionnement de votre produit quand une personne dispose d'une connexion plus lente, d'une taille d'écran différente, d'une résolution différente, d'un navigateur différent ou même de restrictions de leur navigateur. La prise de conscience de ces contraintes et limitations peut aider votre organisation à déterminer si des audiences peuvent toujours accéder à votre contenu avec l'une de ces contraintes imposées. La plupart des échecs ne sont pas des surprises choquantes. Ce sont des événements prévisibles que vous pouvez planifier, au lieu de les souhaiter comme de rares accidents imprévisibles.. 

Le rendre pertinent

Si vous effectuez une évaluation de la convivialité, vous pouvez utiliser ce que vous avez observé. Les problèmes d'accessibilité dans votre système peuvent vous aider à définir les règles d'accessibilité dans votre guide de style. Par exemple, si vous utilisez des métriques de test telles que des erreurs critiques et que vous constatez qu’elles sont dues au contraste des couleurs, à des problèmes de dimensionnement tactile ou à tout autre problème d’accessibilité, incluez-les dans votre guide de styles d’accessibilité. Des exemples très pertinents ont plus de chances de donner plus de crédibilité à votre document et d’accepter la participation des parties prenantes..

Conclusion et plats à emporter

Les guides de style sont monnaie courante. Les guides de style d'accessibilité ne sont pas aussi communs, mais ne doivent pas être négligés. En fait, ils peuvent être critiques dans certains cas. Cependant, ils sont également utiles lorsque l’on réfléchit à l’expérience générale de l’utilisateur. Le contraste des couleurs, la taille de la cible tactile et les éléments de forme sont autant de problèmes potentiels s’ils ne sont pas exécutés correctement.. 

  • Pensez à l'essentiel en premier. Incluez uniquement les informations pertinentes dans votre guide de style d'accessibilité.
  • Ne présumez pas que quelque chose est de bon sens. Vous prenez pour acquis les connaissances que vous avez accumulées au fil des ans. N'ayez pas peur de décrire les choses que vous pourriez prendre comme étant données.
  • La forme suit la fonction. Si votre guide de style se heurte à votre guide de style d'accessibilité, il est peut-être temps de revenir en arrière et d'essayer d'aligner les deux (voir l'exemple de contraste de couleur ci-dessus)..
  • Commencez par les problèmes que vous avez déjà identifiés dans vos évaluations heuristiques. Quels sont certains des problèmes d’utilisabilité que vous avez rencontrés? Particulièrement les problèmes fréquents et ceux avec des indices de gravité élevés?

Lectures complémentaires

  • Guide de style A11Y
  • Guide de style de contenu MailChimp: Rédaction pour l'accessibilité
  • edx / ux-pattern-library Styleguide: Accessibilité