Inclusion numérique : Bonnes pratiques pour un Web plus accessible

CBTW
L’Actualité Tech — Blog CBTW
7 min readNov 4, 2021

En France, environ 12 millions de personnes sont en situation de handicap temporaire ou permanente. Cette réalité englobe une diversité d’individus et de types de handicaps visibles et invisibles. Il peut s’agir de handicaps physiques, neurologiques, sensoriels, mentaux ou encore de polyhandicaps.

Diversité des utilisateurs

La navigation en ligne peut donc comporter de nombreuses contraintes pour les utilisateurs concernés :

  • Un trouble moteur peut empêcher ou compliquer l’utilisation d’un clavier ou d’une souris,
  • Une déficience auditive peut entraîner des difficultés à comprendre un contenu sonore,
  • Une déficience visuelle aura un impact sur la perception de contenus en ligne,
  • Un trouble cognitif peut altérer la compréhension des informations présentées,
  • Un trouble psychique peut être exacerbé ou développé par certains contenus,

Pour parer à ces difficultés, différents outils et modes de navigation peuvent être utilisés : navigation au clavier, contrôle vocal, lecteur d’écran, contrôle visuel, clavier en braille, etc.
Il reste toutefois nécessaire que les sites visités soient adaptés à ces outils et intègrent des bonnes pratiques pour une utilisation accessible et optimisée.

La loi de 2005 pour l’égalité des droits et des chances, la participation et la citoyenneté des personnes handicapées, prévoit que les services de l’État, des collectivités et des organismes publics soient dans l’obligation de proposer des outils numériques accessibles à tous.
Cela signifie qu’ils doivent garantir un accès équivalent de leurs services en ligne à l’ensemble des utilisateurs, peu importe leur sexe, âge, situation ou handicap.

Mais au-delà de cette obligation légale partielle, tous les acteurs de la Tech se doivent d’être sensibilisés à ces problématiques afin d’œuvrer pour un numérique plus inclusif. Les personnes en situation de handicap doivent pouvoir percevoir, comprendre et interagir avec un contenu web de la même façon que n’importe quel utilisateur.
D’autant plus qu’un service numérique accessible englobe des standards de qualité qui bénéficient finalement à tous.

Les principes essentiels d’un site en ligne accessible sont qu’il soit :

  • Perceptible — L’utilisateur doit pouvoir percevoir l’interface via différents sens.
  • Utilisable — L’utilisateur doit pouvoir interagir avec l’interface.
  • Compréhensible — Le contenu et le fonctionnement de l’interface doivent être facilement compréhensibles par l’utilisateur.
  • Robuste — Le contenu et l’interface doivent être compatibles avec différents moyens d’affichage et toutes les technologies d’assistance.

Afin de respecter ces principes, des référentiels internationaux et nationaux ont été créés.
Ils correspondent à des guides techniques destinés aux professionnels du numérique afin de concevoir des outils plus inclusifs.
Ils permettent d’apprendre des bonnes pratiques afin de créer des sites plus accessibles dès leur conception, mais aussi de mesurer l’accessibilité de sites déjà existants afin de les optimiser.

Parmi ces référentiels, on retrouve notamment :

Parmi ces bonnes pratiques et principes à appliquer pour produire des sites et interfaces plus accessibles et inclusifs se retrouvent :

Fondamentaux

Les fondamentaux d’un site accessible restent globalement les mêmes que pour un site classique, car il s’agit avant tout d’éléments de bon sens pour produire un site de qualité.

  • Respecter les standards de code W3C.
  • Privilégier la simplicité, à la fois dans la conception et dans le discours.
  • Conserver les comportements natifs tels que la possibilité de zoomer, de naviguer par tabulation, l’affichage textuel au survol, …
  • Veiller à ce que son site soit bien responsive et que l’information proposée reste la même, bien qu’elle puisse être affichée différemment ou simplifiée.
  • S’appuyer sur des codes existants et majoritairement maîtrisés par les utilisateurs.
    Par exemple une option de recherche est souvent symbolisée par un pictogramme loupe. Il est donc préférable de rester sur cette représentation plutôt que sur un autre symbole qui pourrait être moins intuitif.
  • Veiller à ce que les outils externes auxquels vous faites appel soient eux-mêmes accessibles.

Lisibilité et compréhension

  • Prévoir une architecture de navigation structurée et cohérente, avec également un plan du site et un fil d’ariane sur chaque page.
  • Structurer et hiérarchiser son contenu de manière claire et aérée. Pour commencer, chaque page doit avoir un titre principal puis différents niveaux de titre cohérents.
  • Le contenu doit être suffisamment explicite. Il faut par exemple éviter les abréviations, les mots à plusieurs connotations, le jargon, les mots peu employés, …
  • Il faut veiller à ce que la taille des textes et des éléments interactifs soit suffisante et veiller à l’utilisation d’une police lisible, ainsi qu’à l’interlettrage, aux espacements et au découpage syllabique.
    L’utilisateur doit également avoir la possibilité d’agrandir le texte et de zoomer en évitant de devoir basculer vers un défilement vertical.
  • Les contenus doivent être suffisamment contrastés avec la possibilité de modifier les couleurs des textes.
  • La couleur d’un élément ne doit pas être utilisée comme seule indication de son utilité. Par exemple les liens cliquables sont souvent affichés dans une couleur différente, mais également soulignés.
  • Il convient d’éviter l’affichage de tableaux ou de représentations complexes. Et dans tous les cas proposer un résumé ou un équivalent textuel à tout contenu non textuel.

Visuel et animation

  • Chaque contenu visuel pertinent dans la compréhension du contenu global doit comprendre une légende représentative et un texte alternatif explicite.
    En revanche, ce n’est pas nécessaire pour les visuels décoratifs qui peuvent être ignorés par les outils d’assistance à la navigation.
  • Chaque contenu en mouvement doit être contrôlable par l’utilisateur, afin de pouvoir arrêter ou relancer le mouvement, ainsi que de le cacher ou l’afficher. Il doit également être possible d’afficher le contenu sans mouvement.
    Par ailleurs idéalement la durée de mouvement ne doit pas être supérieure à 5 secondes et il doit être limité à une partie seulement de la surface de l’écran.
  • Avant le lancement d’une animation, prévenir l’utilisateur en amont ou mettre en place une action explicite de déclenchement.
  • Ne pas mettre en place des animations susceptibles de provoquer des crises d’épilepsie, comme des contenus clignotants.

Contenu audio et vidéo

  • Éviter la diffusion d’un arrière-plan sonore ou alors le paramétrer à faible volume.
  • Utiliser un player son ou vidéo accessible avec un dispositif qui permet de contrôler le volume et la lecture. Et éviter les déclenchements automatiques.
  • Chaque contenu audio et vidéo doit pouvoir être consulté à l’aide de sous-titres et d’une audiodescription, et également être accompagné d’une transcription textuelle.

Interaction

  • Éviter les limitations de temps pour consulter un contenu ou réaliser une action, ou laisser la possibilité de modifier ou de suspendre le décompte.
  • Prévoir des intitulés explicites pour les éléments interactifs et les placer dans un contexte qui permet d’en comprendre aisément la fonction.
  • Pour le téléchargement de document, indiquer le format, le poids et la langue du contenu téléchargeable.
    Pour proposer des documents accessibles, vous pouvez privilégier des fichiers en format .doc ou .pdf.
  • Prévoir des liens d’accès rapide dans la structure du site et du contenu.
  • Rendre toutes les fonctionnalités accessibles au clavier.
  • Faire en sorte que les pages et interactions fonctionnent de manière prévisible, en s’appuyant sur les standards usuels.
  • Proposer une fonctionnalité d’annulation d’une action afin d’éviter une activation accidentelle.

Formulaires

  • Regrouper les champs associés par thématique.
  • Pour chaque champ, indiquer un label visible et explicite, le format demandé, un exemple de complétion, et s’il est obligatoire ou non.
  • Proposer l’autocomplétion des champs lorsque la donnée est disponible.
  • Indiquer de manière visible le succès ou l’échec de soumission.
    En cas d’erreur, prévoir des messages d’erreurs explicites et aider l’utilisateur à l’aide de suggestions de correction.
  • Éviter les captchas.
  • L’utilisateur doit pouvoir annuler, corriger ou supprimer les informations fournies.

Il s’agit bien entendu d’une liste de bonnes pratiques non exhaustive.
Si vous souhaitez vous former à l’accessibilité et faire reconnaître votre expertise vous pouvez, entre autres, vous tourner vers les certifications Access 42, Opquast et Accessiweb. L’évènement annuel ParisWeb permet également d’assister à des conférences sur cette thématique et la chaîne Youtube
Les labels Accessiweb, E-accessible, AnySurfer et Euracert peuvent eux être attribués aux sites et administrations ayant entrepris une démarche de mise en conformité aux standards d’accessibilité.

Le développement de l’accessibilité est un enjeu sociétal majeur dans les espaces physiques et numériques. Et au-delà de ce besoin d’une accessibilité accrue, la Tech a également un rôle à jouer dans la création de nouvelles solutions pour accompagner cette transition.
Pour cela, la Tech for Good consiste justement à mettre la technologie au service des usagers afin que le numérique soit source de nouvelles opportunités.
La ville de Paris recense par exemple une liste d’applications utiles pour favoriser le quotidien de personnes en situation de handicaps : https://handicap.paris.fr/liste-des-applications-gratuites-pour-personnes-en-situation-de-handicap/.

Et à noter qu’en dehors des utilisateurs en situation de handicap, il existe également d’autres publics susceptibles de rencontrer des difficultés à accéder et à comprendre des contenus en ligne.
Parmi eux : les utilisateurs seniors, les publics en situation de précarité, les usagers de zones avec un mauvais réseau ou sans réseau, les personnes analphabètes, les personnes touchées par l’illectronisme, …
Il est donc crucial de prendre en compte ces différents publics lors de la conception d’un produit ou d’un service numérique.
Comme pour tout projet, il ne convient pas de présumer — parfois à tort — des besoins et capacités des utilisateurs, mais de proposer une solution répondant à leurs besoins et contraintes réels, et non supposés.
Ne pas prendre en compte l’ensemble de ces profils revient à proposer des services élitistes et à exclure une partie de la population de l’usage du numérique.
Il convient donc de proposer un numérique conçu par tous et pour tous pour réduire cette fracture numérique.

Et vous, quelles sont les bonnes pratiques que vous appliquez et que vous conseillez ?

Nous publions régulièrement des articles sur des sujets de développement produit web et mobile, data et analytics, sécurité, cloud, hyperautomatisation et digital workplace.
Suivez-nous pour être notifié des prochains articles et réaliser votre veille professionnelle.

Vous pouvez d’ailleurs retrouver les articles suivants sur la thématique de l’inclusion et de l’accessibilité :

Retrouvez aussi nos publications et notre actualité via notre newsletter, ainsi que nos différents réseaux sociaux : LinkedIn, Twitter, Youtube, Twitch et Instagram

Vous souhaitez en savoir plus ? Consultez notre site web et nos offres d’emploi.

--

--

CBTW
L’Actualité Tech — Blog CBTW

Nos experts partagent leur vision et leur veille en développement web et mobile, data et analytics, sécurité, cloud, hyperautomation et digital workplace.