digitec per dislessici: una barriera in meno su Internet

Dominik Bärlocher

26.1.2019

Traduzione: Leandra Amato

Le persone dislessiche hanno difficoltà a interpretare correttamente lettere e parole. Ciò rende difficile, o in alcuni casi quasi impossibile, l’interazione con Internet. Personalmente la situazione non mi piace. Quindi ho realizzato un’estensione per browser che dovrebbe fornire un rimedio.

Prima di iniziare con l'articolo, una cosa importante: se sei dislessico, ho un’estensione del browser che fa per te. Sostituisce il font Roboto o Arial con un font progettato per persone dislessiche.

Ecco come funziona:

1. Scarica Google Chrome
2. Installa l’estensione del browser
3. Ricarica digitec.ch o questa pagina
4. Finito

Passiamo ora all'articolo vero e proprio, che si spera venga letto da più persone possibili.

Il mondo delle barriere digitali

Il mondo è pieno di barriere. Gli utenti su sedia a rotelle e le persone con problemi di deambulazione devono fare i conti con barriere quotidiane a causa delle scale che si trovano ovunque. I non vedenti spesso cercano la strada per mancanza di segnaletica in braille. Queste persone vengono aiutate. Organizzazioni come ProInfirmis e la Federazione svizzera dei non vedenti stanno lavorando a livello sociale e politico per rendere il mondo accessibile ai disabili.

Internet è rimasto indietro. Soprattutto se non sei «troppo disabile». Uno di questi casi è la dislessia. Detto in parole semplici, le persone dislessiche hanno difficoltà a scrivere e a leggere. La dislessia può essere acquisita per caso, a causa di un ictus o per via ereditaria. Ma queste persone non sono del tutto prive di aiuto. L’Associazione Svizzera per la Dislessia cerca di rendere accessibile il mondo di Internet ai dislessici.

Infatti, rifletti un attimo: i dislessici, a seconda della natura della dislessia, sono limitati su siti di notizie, Reddit, Pornhub o Wikipedia. La tua giornata tipica su Internet può essere una barriera per qualcun altro.

Non va affatto bene.

È ora di superare questa barriera.

Comic Sans: il soccorritore in caso di difficoltà

Nel febbraio 2017, l'autrice Lauren Hudgins ha divertito e stupito il mondo nel suo blog post intitolato «Hating Comic Sans is Ableist». Ableismo è una parola artificiale che descrive la discriminazione basata sull'abilità. Quindi come il razzismo ma sulle abilità. Nel post, Hudgins descrive aneddoticamente come sua sorella abbia aperto un mondo scoprendo il font Comic Sans.

La sorella è dislessica e ha superato la scuola con difficoltà. Tuttavia, da quando può impostare in Comic Sans tutti i testi con il suo computer, può leggere più facilmente.

Hudgins è solo una dei tanti sostenitori online che vogliono rendere il web accessibile alle persone dislessiche. Delle teste brillanti hanno iniziato ad analizzare la dislessia.

• Cosa rende un carattere leggibile rispetto a un altro?
• Quali elementi condividono i font leggibili?
• Cosa non va?
• Come possiamo rimediare in ampia scala?

La dislessia infatti non può essere generalizzata. Alcuni dislessici non sanno distinguere tra la I maiuscola e la l minuscola, mentre altri distorcono le lettere.

Il profitto ai costi di una disabilità

Il dislessico Christian Boer ha capito che il mondo online potrebbe essere ancora nuovo territorio digitale per i dislessici. Come sua tesi di laurea presso l'Università di Utrecht nel 2008, il designer ha introdotto un font che non vuole entrare nelle fila dei font più belli. Tuttavia, l’estetica non è stato il motivo principale del design di questo carattere. Boer ha scoperto un carattere che soddisfa i bisogni delle persone dislessiche rendendo loro più facile la lettura.

Nel suo discorso a Ted X Fulton Street descrive come i dislessici percepiscono la parola scritta. Nel cervello, le lettere vengono distorte, riflesse o scambiate. Se le lettere ruotate hanno l'aspetto di altre lettere, allora il pasticcio è servito. La d minuscola e la b minuscola sono perfette candidate per lo scambio. I e l, p e q, rn e m e alcune altre.

In breve: Dyslexie Font di Boer ha aperto a lui e a molti altri dislessici un accesso alla scrittura. L’Associazione dislessia in Svizzera consiglia di utilizzare questo font in un suo foglio informativo.

C’è solo un problema: il carattere costa circa 11.42 franchi all’anno per clienti privati. Per le aziende ancora di più. Estensione Chrome? Costa. Text editor? Costa.

Per molti, compreso il sottoscritto, il fatto che Boer faccia soldi con la sua, nonché anche di altri, disabilità non va bene.

Open Source: supereroe nelle difficoltà

Come concorrente del Dyslexie Font arriva Open Dyslexic. Poiché Boer persegue interessi commerciali con la sua scrittura, esclude coloro che non possono permettersi il lusso della lettura. In Svizzera non accade spesso, ma il mondo è un po’ più grande del nostro piccolo angolo di pianeta.

OpenDyslexic persegue gli stessi obiettivi e ha tratto in gran parte gli stessi risultati dalla ricerca. Il carattere venuto fuori dal progetto è simile al Dyslexie Font, ma non costa nulla e il creatore non vuole neanche essere nominato se utilizzi il suo carattere. La persona che si cela dietro questo font è Abelardo «Abbie» Gonzalez e si occupa di controllo qualità presso un gruppo sanitario di Boston.

Pertanto, per il mio progetto, ho utilizzato OpenDyslexic; per pura convinzione e non voglio che ognuno di voi paghi 12 franchi per leggere su Internet.

Il grande “ma”

La dislessia non ha una diagnosi uniforme. Frasi come «Ogni persona dislessica scambia d e b» sono false. Quindi è difficile trovare strumenti unitari in grado di aiutare tutti i dislessici. Non ha senso gettare la spugna. Per questo, la seguente storia con il plugin del browser arriva con un “ma”, che potrebbe anche deluderti: potrebbe non funzionare per te o per tuo figlio.

IMAGE BETTERWORSE

Anche Hudgins lo dice: sua sorella, infatti, non lascia da parte il Comic Sans neanche con l’invenzione di Dyslexie Font. Il suo cervello si è abituato al Comic Sans e quindi per lei il carattere speciale è più difficile del font deriso di Microsoft.

Ciononostante: se con il mio plugin posso aiutare qualcuno, ben venga. E se sei anche tu una persona dislessica, o se hai un parente dislessico, provalo.

Ecco come creare la tua estensione Chrome

Dopo aver visto quali caratteri sono adatti ai dislessici e perché, possiamo iniziare a lavorare sull’estensione. Questo è più veloce della ricerca. Infatti Google ti rende facile il lavoro per creare la tua estensione. Per la mia estensione per dislessici ti servono, oltre a un paio di immagini, due file:

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

manifest.json: le funzioni dell’estensione

I dati PNG sono per il pulsante in alto nel menu. La funzione viene prestabilita in manifest.json. Prima di specificare la funzione effettiva, a Chrome deve essere detto esattamente cosa fa l'estensione e come si chiama.

Quindi, per prima cosa, abbiamo gli entry data che dicono al computer di che tipo di file si tratta:

{ "manifest_version": 2,

La prima parentesi graffa viene chiusa alla fine del json. Niente panico. È tutto corretto. Seguono le istruzioni per il Chrome Web Store dove si trova l’estensione alla fine.

"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",

Poi arriva il resto, dove vengono specificati funzione e aspetto.

"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 }

}

E questo è già manifest.json. Le righe importanti sono:

• css: qui dico al browser dove trovare il carattere.
• matches: qui definisco su quali siti può essere caricata l’estensione.

styles.css: carattere più URI

OpenDyslexic non fa parte dei caratteri standard mondiali e Google non ha questo font nemmeno sulla sua lista di caratteri aperti. Quindi dobbiamo adattare il carattere allo stylesheet in modo diverso. Utilizzo un URI.

Un URI è una sequenza di caratteri che identifica una risorsa, solitamente codificata in Base64. Ovvero: posso dare a un CSS un font intero senza doverlo ospitare da qualche parte. L’URI è lungo, per questo lo accorcio. Se vuoi vederlo in tutta la sua epica lunghezza, puoi vedere tutti i file dell’estensione nel GitHub Repository.

Il CSS ha questo aspetto:

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

Qui utilizzo i seguenti elementi:

• @font-face: importazione di un font via CSS
• @font-face > font-family: qui nomino il font nel contesto dell'estensione. Quindi do al carattere il nome che utilizzo in basso. Può essere scelto liberamente.
• src: l’URI
• :not(.el):not(.fa):not([class="Icon"]):not([class="icon"]): eccezioni per font di simboli come Font Awesome o Elusive Icons. Invece di definire queste eccezioni separatamente, istruisco il CSS a sovrascrivere tutto ciò che non è un'icona.
• !important: i progettisti di CSS si arrabbiano se si usa !important da qualche parte, ma per un'iniezione CSS affidabile ha senso. !important dice al browser che questa linea non può essere ignorata, non importa cosa dice il resto del codice.

L’errore nel mio ragionamento

Scrivendo, mi accorgo di aver commesso un errore nella concezione. Anche se a volte non me ne rendo conto, Internet si estende ben oltre digitec.ch e galaxus.ch. Così ho sviluppato una seconda estensione che funziona su tutti i siti web. È essenzialmente la stessa di quella di cui sopra, tranne che ho cambiato una riga in manifest.json.

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

Puoi scaricare l’estensione che cambia l’intero Web in Open Dyslexic qui.

Finito. Buon divertimento. Se vuoi continuare ad armeggiare con il mio codice, serviti pure.

Un appello ai lettori, alle lettrici e alla Community

Abbiamo menti intelligenti tra i nostri lettori e le nostre lettrici, e in questo articolo probabilmente anche alcuni che vorrebbero avere certe funzionalità. Difficilmente riuscirò a soddisfare tutte queste richieste.

Se hai qualche ora e vedi una richiesta per un'estensione di accessibilità che puoi soddisfare, allora siediti e prenditi un po’ di tempo. Internet dovrebbe restare libero e accessibile. Per questo noi lettori normali a volte dobbiamo fare qualcosa.

Dominik Bärlocher

Senior Editor

dominik.baerlocher@digitecgalaxus.ch

Giornalista. Autore. Hacker. Sono un contastorie e mi piace scovare segreti, tabù, limiti e documentare il mondo, scrivendo nero su bianco. Non perché sappia farlo, ma perché non so fare altro.

Segui

---

Informatica

Segui gli argomenti e ricevi gli aggiornamenti settimanali relativi ai tuoi interessi.

Segui argomento

Potrebbero interessarti anche questi articoli