Principes de Conception Inclusive

         trois montgolfiérs au ciel calme, ensoleillé

Contributeurs: Henny Swan, Ian Pouncey, Heydon Pickering, Léonie Watson

Avec The Paciello Group

Ces Principes de Conception Inclusive mettent la personne au premier plan. L'idée est de s'assurer que la conception prend en compte les besoins de personnes avec incapacités permanentes, temporaires, contextuelles, ou changeantes — c'est à dire nous tous.

Ils veulent offrir une approche de conception inclusive à tous celles et ceux impliqués dans la conception et développement de contenus et d'applications pour le web, qu'ils soient designers, professionnels de l'expérience utilisateur, gérants de produits, créateurs d'idées, innovateurs, artistes, penseurs.

Pour en savoir plus sur la motivation, consultez l'article Inclusive Design Principles (en anglais) sur le blog du PacielloGroup.

Les Principes

Offrez une expérience identique

Assurez-vous que votre interface permette une expérience identique à tous, afin qu'ils puissent accomplir les tâches de la façon qui leur convient, sans avoir besoin de diminuer la qualité des contenus.

Description complète

Que ce soit par circonstance, choix, ou contexte, les gens sont différents. De par les diverses méthodes et outils qu'ils utilisent pour lire et opérer les interfaces, ce que l'interface doit offrir doit être identique en terme de valeur, de qualité et d'efficacité.

Exemples

  • Contenus alternatifs: Une alternative de base, soit "alt" texte, une transcription, une description audio, ou un langage de signes, rend les contenus accessibles. Mais pour être équivalent, il doit capturer aussi l'essence de l'original.
  • Ergonomie: Les sous-titres synchronisés rendent votre vidéo accessible. Mais les rendre configurables, colorés, et repositionables donne une expérience plus comparable aux autres.
  •            
  • Notifications: Les notifications qui apparaissent dans l'interface sont visuellement évidents, mais pour les utilisateurs de lecteurs d'écran il faut une action spécifique pour les découvrir. Une expérience similaire peut être achevé avec une region aria-live. Ainsi la notification est présentée à l'utilisateur sans autre action de sa part.

Lien vers la section Offrez une expérience identique

Considérez la situation de l'utilisateur

Votre interface peut être utilisée dans diverses situations. Assurez-vous qu'elle donne une expérience enrichissante quelle que soit les circonstances actuelles de l'utilisateur.

Description complète

Les utilisateurs peuvent être néophytes, experts, au travail, chez eux, en voyage, sous pression. Chacune de ces situations peut les affecter, et pour ceux qui ont déjà des difficultés avec les interactions, par exemple en raison d'une incapacité, peut rendre l'utilisation particulièrement difficile.

Exemples

  • Contraste des couleurs: A l'extérieur, un bon contraste diminue l'effet du soleil qui rend l'écran plus difficile à lire.
  • Aide contextuelle: Les utilisateurs peuvent vouloir de l'aide la première fois qu'ils rencontrent un formulaire ou une interaction complexe. Cette aide peut devenir superflue, voir même une distraction, dès l'instant où l'utilisateur s'habitue à l'intéraction ou au formulaire. L'aide contextuelle donne à l'utilisateur le choix d'accéder à l'information quand il le désire, et lui permet un meilleur contrôle sur la page.
  •            
  • Sous-titres en marche: Vos contenus de vidéos seront utilisés sur des appareils mobiles, peut-être dans des lieux publics où l'on préfère ne pas déranger les autres. Pour les écrans réduits, désactivez le son et activez les sous-titres par défaut.

Lien vers la section Considérez la situation de l'utilisateur

Soyez constant

         

Utilisez les conventions connues, de manière constante.

Description complète

         

Les interfaces reconnues répètent des modèles de conception bien établis. Utilisez-les pour renforcer le sens et l'objectif des éléments de l'interface, y compris leur fonctionnalité, comportement, édition et présentation. Vous devez pouvoir dire les mêmes choses de la même façon, et les utilisateurs doivent pouvoir faire les mêmes choses de la même façon.

Exemples

               
  • Modèles de conception constants: Utilisez les même modèles d'interaction et de présentation, afin d'aider l'utilisateur à se familiariser et comprendre.
  • Éditorial constant: Assurez-vous que le style d'écriture est harmonisé partout dans votre site, ainsi que pour tous les contenus utilisés par les lecteurs d'écran, comme les textes alternatifs, entêtes, boutons, etc. Une présentation harmonisée est aussi importante, comme par exemple avoir un paragraphe de resumé au début d'un article, ou faire en sorte que les listes à puces commencent toujours par une définition en gras.
  • Architecture: Utilisez une architecture de page constante à travers l'utilisation de modèles pour ainsi aider l'utilisateur à trouver et reconnaître les principaux contenus plus vite.

Lien vers la section Soyez constant

Laissez l'utilisateur décider

Assurez-vous que l'utilisateur a le contrôle. Il doit être possible pour chacun d'accéder aux contenus, et interagir avec eux, selon ses préférences.

Description complète

Ne supprimez pas la capacité de modifier la configuration du navigateur ou de la plateforme, par exemple l'orientation de l'écran, la taille des caractères, le niveau de zoom ou de contraste.           De plus, évitez les changements de contenus qui ne répondent pas à une action explicite de l'utilisateur.

Exemples

               
  • Contrôle de défilement: Le 'Défilement Infini' peut poser des problèmes, surtout pour les utilisateurs du clavier qui ne peuvent plus dépasser le flux de contenu qui se remplit automatiquement. Ajoutez un bouton pour désactiver cette fonction.
  •            
  • Stoppez!: Les animations ou 'défilement parallax' donnent la nausée à certains utilisateurs, ou sont simplement une distraction. S'ils démarrent automatiquement, donnez un contrôle évident pour les arrêter - et les relancer.
  • Autorisez la magnification: L'utilisateur peut avoir plusieurs bonnes raisons pour vouloir zoomer les contenus. Assurez-vous que cela fonctionne, et que le contenu ne devienne pas caché.

Lien vers la section Laissez l'utilisateur décider

Offrez le choix

Offrez plusieurs façons de réaliser les tâches, surtout celles qui sont complexes ou peu communes.

Description complète

Souvent il existe plus d'un chemin possible à suivre pour effectuer une tâche. N'essayez pas de supposer la méthode préférée de l'utilisateur. En offrant plusieurs alternatives de présentations, vous offrez à chaque utilisateur la possibilité de choisir la manière la plus confortable, dans chaque contexte où il se trouve.

Exemples

               
  • Plusieurs chemins: Autorisez les interactions variées pour faire les tâches. Pour supprimer un message dans une application il est possible de faire un geste sur l'écran tactile, ou bien de sélectionner un ou plusieurs messages et les supprimer avec un bouton.
  • Présentation: Offrez le choix d'une liste, ou d'une présentation à travers une table ou une grille. Ces choix aident ceux qui préfèrent les images plus grandes, ou de plus petites lignes de tableau.
  • Alternatives accessibles: Des présentations alternatives des données telles qu'une table au lieu de graphiques informatifs doivent être disponibles à tous les utilisateurs, et pas uniquement aux utilisateurs de lecteurs d'écran. Les alternatives accessibles peuvent bénéficier non seulement à groupe spécifique, mais à tous si elles sont offertes.

Lien vers la section Offrez le choix

Le contenu en priorité

Aidez l'utilisateur à se concentrer sur les tâches, les fonctionnalités, et les informations principales, par leurs présentations dans les contenus et par leurs dispositions.

Description complète

Les interfaces sont plus difficiles à comprendre si les parties principales ne sont pas présentées clairement selon leurs priorités. Un site ou une application peut offrir beaucoup d'informations et de fonctionnalités, mais on doit pouvoir focaliser sur une seule chose à la fois. Identifiez le but principal de l'interface, et donc les contenus et les fonctionnalités nécessaires pour y parvenir.

Exemples

  • Maintenez la concentration: Présentez les fonctionnalités et les contenus quand ils sont pertinents, au lieu de le faire en une seule fois.
  •            
  • Les tâches principales en priorité: Une application d'emails sert principalement pour écrire et lire les messages. Le bouton "Composer", doit donc toujours être présent et en évidence, y compris apparaître tôt dans l'ordre de navigation. La boîte principale a plus de priorité que les autres, telles que "spam", ou "messages envoyés". Les fonctionnalités supplémentaires, comme organiser les messages, doivent apparaître plus tard, car en général on ne les utiliser uniquement après la tâche principale de lecture des messages.
  •            
  • Hiérarchisez le contenu: Le contenu principal d'une page d'un journal est l'article. Donc, il doit apparaître en premier, visuellement et dans le code source. Les contenus en relation, comme les articles liées, arrivent ensuite, puis doivent suivre les autres contenus de la page.
  • Clarifiez le texte: Les intitulés des liens, entêtes, et boutons doivent être clairs et directs, avec les points principaux d'abord, qu'ils soit visibles ou non. Cela facilite la lecture rapide même avec un lecteur d'écran. Un langage clair permet d'aider les utilisateurs étrangers, et à la traduction.

Lien vers la section Le contenu en priorité

Ajoutez de la valeur

Demandez-vous ce qu'apportent les fonctionnalités, et en quoi elles améliorent l'expérience des divers utilisateurs.

Description complète

Chaque fonctionnalité doit bénéficier à l'utilisateur, en offrant des moyens efficaces d'accéder aux contenus. Posez-vous la question des fonctionnalités telles que l'interaction par la voix, la géolocalisation, l'appareil photo, ou la fonction de vibration, et comment l'intégration avec des appareils connectés peut offrir plus de choix.

Exemples

               
  • Intégration avec les appareils connectés ou un second écran: Utiliser une interface vocale pour contrôler les contenus multimedias, rechercher du contenu, contrôler sa musique ou sa télévision, aide les utilisateurs qui ont des difficultés a manipuler les interfaces habituelles.
  •            
  • Intégration avec les API de l'appareil: Améliorez la fonctionnalité, en utilisant davantage les capacités de la plateforme. Les vibrations aident les utilisateurs sourds à reconnaître les notifications. La géolocalisation peut aider les utilisateurs ayant des difficultés à se déplacer pour trouver des services aux alentours.
  • Rendre les tâches plus faciles: Ajoutez un bouton pour montrer le mot de passe, pour permettre aux utilisateurs de vérifier qu'ils l'ont saisi correctement. Ajoutez l'identification par empreintes digitales là où l'on peut s'identifier avec un mot de passe.

Lien vers la section Ajoutez de la valeur