digitec aide les personnes dyslexiques: une barrière en moins sur Internet

Dominik Bärlocher

26/1/2019

Les personnes dyslexiques ont de la difficulté à interpréter les lettres et les mots, ce qui rend l'utilisation d'Internet difficile, voire impossible. Comme je trouve que la toile devrait leur être davantage accessible, j'ai développé une extension de navigateur qui les aide.

Avant de poursuivre, je tiens à préciser que si vous êtes dyslexique, vous pouvez utiliser mon extension pour lire cet article. Elle remplace les polices Roboto ou Arial par une police conçue pour les personnes dyslexiques et légasthéniques.

Marche à suivre:

1. Téléchargez Google Chrome
2. Installez l'extension de navigateur
3. Rafraîchissez la page digitec.ch ou la page sur laquelle vous vous trouvez maintenant.
4. Voilà, c’est terminé.

Poursuivons. J'espère que mon article est maintenant accessible à davantage de lecteurs.

Les obstacles numériques

Le monde est rempli d'obstacles. Les personnes en chaise roulante ou à mobilité réduite doivent se débrouiller face à l'omniprésence d'escaliers. Les personnes aveugles et malvoyantes ont souvent de la difficulté à trouver leur chemin faute de panneaux de signalisation et autres écriteaux en braille. Mais elles reçoivent de l'aide. En effet, des organisations comme ProInfirmis et la Fédération suisse des aveugles et malvoyants s'investissent dans la société et sur la scène politique en faveur de leur inclusion.

En revanche, Internet est à la traîne, surtout lorsqu'un handicap n'est pas «trop prononcé», comme c'est le cas de la dyslexie. Dans des termes très simplifiés, la dyslexie est un trouble du langage écrit (lecture et écriture). Elle peut apparaître à la suite d'un accident, d'un AVC, ou être héréditaire. Mais les dyslexiques ne sont pas complètement démunis pour autant, puisque l'association Dyslexie suisse romande tente de leur faciliter l'accès à Internet.

Imaginez: selon la situation et la sévérité du trouble, une personne dyslexique peut devoir se passer des sites d'informations, de Reddit, de Pornhub ou de Wikipédia. Surfer sur Internet au quotidien peut devenir un vrai cauchemar.

C'est inadmissible!

Il est temps d'abolir ces barrières.

Comic Sans, le sauveur

En février 2017, Lauren Hudgins (en anglais) a publié un article de blog intitulé «Hating Comic Sans is Ableist» (en anglais) qui a suscité amusement et stupéfaction. Le terme «abléisme» (ou «capacitisme», parmi d'autres synonymes) est un néologisme qui décrit les discriminations envers les personnes auxquelles manquent certaines capacités. C'est un peu comme le racisme, sauf qu'il vise les facultés d'autrui. Dans son article, Lauren Hudgins raconte comment la découverte de police de caractères Comic Sans a ouvert les portes du monde à sa sœur.

Dyslexique, elle a eu beaucoup de difficulté à finir sa scolarité. Depuis qu'elle peut changer la police de tous ses textes en Comic Sans, elle a beaucoup plus de facilité à les lire.

Mme Hudgins n'est de loin pas la seule à s'investir afin de rendre Internet accessible aux personnes dyslexiques. Certains ont commencé à analyser la dyslexie.

• Qu'est-ce qui rend une police plus lisible qu'une autre?
• Quels sont les éléments communs des polices plus faciles à lire?
• Qu'est-ce qui les rend illisibles?
• Comment peut-on trouver la solution la plus efficace possible?

Le problème, c'est que la dyslexie n'est pas unidimensionnelle. Certaines personnes ne peuvent différencier le I majuscule du l minuscule, et d'autres voient les lettres se déformer.

Le profit aux dépens du handicap

Christian Boer, designer dyslexique, a réalisé en 2008 qu'il avait trouvé un bon filon. Dans le cadre de son travail de bachelor à l'université d'Utrecht, il a présenté une police qui ne fait pas partie des élégants spécimens que nous connaissons. Mais son esthétisme importe peu, puisqu'elle satisfait les besoins des dyslexiques et leur facilite la lecture.

La présentation qu'il a donnée dans le cadre de Ted X Fulton Street décrit comment ils perçoivent le langage écrit. Leur cerveau déforme, retourne ou échange les lettres. Et si ces lettres ont le malheur de ressembler à d'autres, c'est le chaos total. Ainsi, le d et le b minuscules sont de parfaites sources de confusion. Différencier I de i, p de q ou rn de m est tout aussi difficile.

En bref: sa police Dyslexie (en anglais) lui a donné, à lui ainsi qu'à environ 120 000 autres dyslexiques, un accès inédit au langage écrit. Elle est d'ailleurs disponible sur le site de l'association dyslexie suisse romande.

Le seul souci, c'est qu'elle coûte environ 11,42 CHF par année aux particuliers. Et elle est encore plus chère pour les entreprises. Une extension Chrome coûte de l'argent. Un éditeur de texte n'est pas gratuit non plus.

Mais beaucoup, moi y compris, apprécient moyennement que M. Boer se fasse de l'argent sur le dos des dyslexiques.

L'Open Source, le héros

Une autre police, Open Dyslexic, a été créée pour concurrencer Dyslexie. Étant donné que M. Boer exploite sa police a des fins commerciales, il exclut d'office ceux qui n'ont pas les moyens de se l'offrir, surtout dans des pays plus pauvres que la Suisse.

Open Dyslexic a les mêmes objectifs que Dyslexie, et elle se base à quelques détails près sur les mêmes données scientifiques, puisque ce projet a lui aussi nécessité des recherches. Semblable à l'invention de M. Boer, elle est par contre gratuite. Son créateur ne veut même pas être évoqué par les utilisateurs. Il se nomme Abelardo «Abbie» Gonzalez (en anglais) et travaille dans le département de l'assurance qualité d'une entreprise spécialisée dans la santé à Boston.

J'ai donc utilisé OpenDyslexic pour mon extension. Je suis convaincu par ce projet, et je ne veux pas que vous ayez à payer 12 francs pour pouvoir lire du contenu en ligne.

Le problème

La dyslexie ne correspond pas à un diagnostic précis. On ne peut pas dire, par exemple, que chaque dyslexique confond les d et les b. Il est donc difficile de trouver des outils qui aident tout le monde. Mais ça ne veut pas dire qu'il faut abandonner. Par contre, le plugin de navigateur que je vous décris ci-dessous risque de vous décevoir; il ne fonctionnera pas forcément pour vous, ou votre enfant.

IMAGE BETTER WORSE

Lauren Hudgins a aussi mentionné cet aspect. En effet, sa sœur ne veut pas se départir de la police Comic Sans, malgré l'invention de Dyslexie. Son cerveau s'est tout simplement habitué à Comis Sans, et Dyslexie lui cause plus de désagréments que la police de Microsoft par ailleurs souvent ridiculisée.

Mais si je peux aider quelques-uns d'entre vous, je suis heureux de le faire. Et si vous (ou un membre de votre famille) êtes atteint de dyslexie, testez-le.

Voici comment créer votre propre extension de navigateur pour Chrome

Maintenant que vous savez quelle police convient aux personnes dyslexiques, vous pouvez commencer à créer votre extension. C'est beaucoup plus rapide que d'en chercher une, car Google vous facilite l'écriture de votre propre extension destinée à Chrome. Outre quelques images, vous aurez besoin de deux fichiers:

extension/ ├── img/ │ ├── dig16.png │ ├── dig24.png │ └── dig32.png ├── manifest.json └──styles.css

manifest.json: les fonctions de l'extension

Les fichiers PNG sont destinés au bouton en haut du menu. La fonction est fournie dans le fichier manifest.json. Avant de donner la fonction, vous devez indiquer à Chrome le nom et les tâches précises de l'extension.

Tout d'abord, l'Entry Data renseigne l'ordinateur sur ce qu'est le fichier:

{ "manifest_version": 2,

Les crochets sont fermés seulement à la toute fin du fichier json. Pas de panique, c'est tout à fait juste. Puis viennent les informations destinées au Chrome Web Store, où l'extension sera ensuite accessible.

"name": "Digitec Galaxus Dyslexic Accessibility", "version": "0.11", "description": "Being dyslexic can hinder you from reading content on a website. Nowhere is this more vital than when you spend money online. This extension exists to improve accesibility to the sites of Switzerland's largest online shops, digitec.ch and galaxus.ch",

Puis vient le reste, c'est-à-dire la fonction et le design.

"content_scripts": [{ "css": ["styles.css"], "matches": ["https://digitec.ch/", "https://galaxus.ch/", "https://www.digitec.ch/", "https://www.galaxus.ch/"] }],

"browseraction": { "defaulticon": { // optional, standard icon in the menu bar "16": "img/dig16.png", // optional, small icon "24": "img/dig24.png", // optional, middle icon "32": "img/dig32.png" // optional, large icon }, "default_title": "Digitec Galaxus Dyslexic Accessibility", // optional, shown in tooltip }

}

Voici donc le fichier manifest.json complet. Les lignes les plus importantes sont:

• css: elle me sert à indiquer au navigateur où aller chercher la police.
• matches: elle me sert à définir sur quels sites l'extension sera chargée.

styles.css: la police et l'URI

OpenDyslexic ne fait pas partie des polices conventionnelles, et elle ne figure pas non plus dans la liste des polices ouvertes de Google. Je dois donc indiquer la police à la feuille de style d'une autre manière. Pour ce faire, j'utilise un URI.

Un URI est une chaîne de caractères, la plupart du temps codée en Base 64, qui identifie une ressource. Autrement dit, je peux fournir une police complète à un CSS sans devoir la faire héberger quelque part. L'URI est extrêmement long, donc je le raccourcis. Si vous souhaitez voir sa version complète, vous trouverez tous les fichiers correspondants dans le répertoire GitHub.

Voici ce à quoi ressemble le CSS:

@font-face { font-family: 'mobiledyslexic-opendyslexic-regular'; src: url('data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAF0oABMAAAAA… ') format('woff'); }

Ici, j'utilise les éléments suivants:

• @font-face: importation d'une police via le CSS
• @font-face > font-family: ici, je nomme la police dans le contexte de l'extension. Je lui donne un nom, que j'utiliserai ci-dessous. Je peux choisir celui que je veux.
• src: l'URI
• :not(.el):not(.fa):not([class="Icon"]):not([class="icon"]): exceptions destinées à des polices de symboles comme Font Awesome ou Elusive Icons. Au lieu de définir ces exceptions séparément, j'indique au CSS d'écraser tout ce qui n'est pas une icône.
• !important: Les designers du CSS n'apprécient guère qu'on utilise !important quelque part, mais il est utile pour une injection de CSS fiable. !important indique au navigateur que ces lignes ne doivent pas être ignorées, peu importe ce qui figure dans le reste du code.

J'ai commis une erreur

En rédigeant mon code, je remarque que j'ai fait une erreur de conception. J'ai tendance à l'oublier, mais Internet s'étend évidemment bien au-delà de digitec.ch et de galaxus.ch. J'ai donc créé une deuxième extension qui fonctionne sur tous les sites Web. Elle est presque identique à celle que je viens de développer, à l'exception d'une ligne dans le fichier manifest.json, que j'ai modifiée.

"matches": ["https://", "https://"]

Vous pouvez télécharger ici l'extension qui change la police de toutes les pages Internet en OpenDyslexic.

Voilà, c’est terminé. Amusez-vous bien! Si vous souhaitez perfectionner mon code, faites-vous plaisir.

Appel aux lecteurs et à la communauté

Certains de mes brillants lecteurs aimeraient sans doute obtenir des fonctions particulières. Je ne pourrais malheureusement pas répondre à toutes vos requêtes.

Si vous voyez une demande d'extension que vous êtes en mesure d'exaucer et si vous avez le temps de le faire, je ne peux que vous encourager à apporter votre contribution. Internet devrait rester ouvert et accessible, et nous devons parfois mettre les mains à la pâte pour aider les personnes dyslexiques.

Dominik Bärlocher

Senior Editor

dominik.baerlocher@digitecgalaxus.ch

Journaliste. Auteur. Hackers. Je suis un conteur d'histoires à la recherche de limites, de secrets et de tabous. Je documente le monde noir sur blanc. Non pas parce que je peux, mais parce que je ne peux pas m'en empêcher.

Suivre

---

Informatique

Suivez les thèmes et restez informé dans les domaines qui vous intéressent.

Suivre

Ces articles pourraient aussi vous intéresser