Non sei connesso a internet.
Galaxus Logo
ThemenwocheReportage 2195

Ecco come un cieco ci ha aperto gli occhi

Sappiamo da tempo che il nostro sito web non è adatto a persone con disabilità. E, il giorno in cui abbiamo osservato un non vedente navigare sul nostro negozio online, ci si sono aperti gli occhi.

Siamo indietro. Siamo addirittura i più indietro quando si tratta di garantire l’accessibilità del nostro sito web a persone disabili. Questo è quanto è stato stabilito nel 2016 dalla Fondazione «Accessibilità per tutti» nello studio sull’accessibilità. Ecco perché oggi siamo seduti negli uffici della Fondazione e ci facciamo spiegare cosa c'è che non va e cosa potremmo migliorare. Chi siamo? L’UX designer Stefan Jost, il front-end developer Remo Vetere, il fotografo Thomas Kunz ed io.

Gianfranco Giudice, non vedente, testa i siti web per la Fondazione e ne verifica l’idoneità alle persone con disabilità. È seduto davanti a un portatile e accede a digitec.ch. Un software speciale, il cosiddetto screen reader, gli legge ciò che si trova sul sito. Ma quello che lo screen reader gli dice non è molto utile. Perché? Sulla pagina mancano informazioni importanti di cui lo screen reader ha bisogno per interpretare correttamente gli elementi grafici.

Gianfranco esplora il nostro sito web con uno screen reader, mentre noi lo seguiamo sul proiettore

Le difficoltà per un non vendente

I vedenti riconoscono un menu semplicemente per il fatto che assomiglia a un menu e, dal punto di vista grafico, si trova dove si aspettano di trovarlo. Per uno screen reader, il menu deve essere etichettato come tale nel codice sorgente della pagina. In caso contrario, la voce legge gli elementi del testo a raffica e il non vedente può solo immaginare che potrebbe trattarsi di un menu.

È esattamente quello che succede sul nostro sito. Idealmente, lo screen reader dovrebbe prima produrre un titolo che anticipi di cosa si tratta e poi procedere a leggere il menu. Su digitec.ch inizia semplicemente con: «Elenco di sei elementi: Contatto Aiuto Chi Siamo Punti vendita Social Media Offerte di lavoro». Le voci di menu vengono sparate una dietro l'altra e le parole inglesi vengono pronunciate come fossero tedesche, ma Gianfranco non ha problemi: il suo udito ci è abituato. Il problema è l'orientamento.

Per un non vedente, non è facile capire che gli elementi in alto a destra facciano parte di un menu.

Grazie a «elenco di sei elementi», Gianfranco può comunque immaginare che si tratti di un menu. Ma poi – in alto a destra – arrivano le voci «Italiano» e «IVA incl.», tutto meno che chiare, soprattutto perché lo screen reader non indica che questi elementi hanno sottomenu espandibili. Se sei in grado di vedere, lo capisci dalla piccola freccia rivolta verso il basso, ma Gianfranco non può utilizzare questo riferimento grafico.

Incubo 2.0: la registrazione

E così continuiamo con il test. Anche il menu delle rubriche non ha un titolo adatto. Gli articoli iniziano con un'immagine priva di qualsiasi forma di testo (l'attributo Alt in HTML), poi ci sono due tag rubrica e infine il titolo. Secondo Gianfranco, la struttura logica del codice sorgente dovrebbe contenere prima il titolo e poi i sottoelementi. Dal punto di vista grafico, naturalmente, si può organizzare in modo diverso. Nel web design, la disposizione visiva e la struttura logica possono essere separate.

Gianfranco ora cerca di registrarsi al sito. Le indicazioni relative ai campi da compilare come «Nome», «Cognome» ecc. non vengono lette dallo screen reader. Gianfranco non sa cosa inserire, né dove. Più sotto, in corrispondenza del campo per il numero di telefono, il reader inizia improvvisamente a funzionare.

Quando arriva al link con l'icona di Facebook, lo screen reader dice «Link». Doh. Ci ridiamo sopra, ma in realtà ce ne vergogniamo. Il lato positivo è che ora sappiamo dove e quali sono i problemi sul sito.

Diverse disabilità, diverse esigenze

L'idea di questo incontro è anche quella di imparare e di condividere le nostre impressioni. Ecco perché io e il fotografo Thomas Kunz siamo affiancati dall’UX designer Stefan Jost e dal front-end developer Remo Vetere. Andreas Uebelbache, della Fondazione, ci fornisce innanzitutto alcune informazioni di base sulla Fondazione stessa e sul suo lavoro, ma anche sulle disabilità in generale e sulla situazione in Svizzera.

La Fondazione si occupa solo di garantire l’accesso elettronico, poiché esiste un’unità specializzata separata per le barriere architettoniche. Le disabilità possono essere suddivise in queste quattro categorie:

  1. disabilità visive
  2. disabilità uditive
  3. disabilità motorie
  4. disabilità cognitive e neurologiche

Ogni forma di disabilità richiede ottimizzazioni diverse, anche all'interno di una categoria. Una persona non vedente ha bisogno di ausili diversi rispetto a una persona ipovedente che ha ancora un po' di vista e vuole usarla.

I non vedenti rappresentano una piccola minoranza in Svizzera, con circa 10'000 persone. Per fare un confronto: in Germania ci sono almeno 325’000 ipovedenti, 500’000 ipoudenti e, in totale, il 14% della popolazione è affetto da disabilità. Il motivo per cui la Fondazione pone comunque un forte accento sui non vedenti è che rappresentano la sfida più grande per chi gestisce siti web, perché non possono utilizzare elementi grafici, cioè gli elementi su cui si basa un sito internet. Inoltre, anche molti ipovedenti utilizzano uno screen reader come supporto.

Allo stesso tempo, i non vedenti sono fortemente dipendenti dal modo in cui i siti web sono strutturati e funzionano. Gianfranco ci spiega che usa il portatile e lo smartphone ogni giorno perché accedere a un negozio online per lui è molto più facile che visitare un negozio fisico, dove avrebbe bisogno di una guida speciale, il che richiederebbe molto tempo. Anche i giornali li legge solo in formato digitale. Gli orari dei mezzi di trasporto può consultarli sullo smartphone, ma non sui tabelloni in stazione, e così via. «Ciò che per i vedenti è qualcosa di supplementare, ovvero un’opzione più comoda per fare qualcosa, per me è essenziale», riassume.

Il braille può essere anche digitale

Svizzera vs altri Paesi

In Svizzera c'è ancora molto da fare per quanto riguarda l'accessibilità digitale per i disabili. Andreas e Stefan concordano sul fatto che in Gran Bretagna, ad esempio, la consapevolezza sull'argomento è molto più sviluppata. Alcuni Paesi hanno leggi più severe in merito. La Fondazione «Accesso per tutti» lo nota per il fatto che i suoi servizi vengono sempre più richiesti dalle compagnie aeree. Questi devono, ovviamente, essere conformi alle norme internazionali. Alcune compagnie aeree hanno anche implementato l’accessibilità alla tastiera in modo esemplare, senza compromettere il design del sito, offrendo una comoda alternativa anche a persone non disabili che non vogliono passare da mouse a tastiera e viceversa in continuazione. Ecco l'esempio del sito web della Swiss:

Ogni azienda deve utilizzare al meglio le proprie risorse. Questo può significare che il primo obiettivo di un UX designer sia quello di migliorare l'usabilità per la maggior parte delle persone non disabili, piuttosto che per la minoranza di uno specifico gruppo di persone disabili. Le leggi e i regolamenti contribuiscono a garantire che i disabili ricevano sempre ciò di cui hanno bisogno, e questo potrebbe addirittura rendere la concorrenza più equa: un'azienda che si prende un certo impegno nei confronti dei disabili non avrebbe più uno svantaggio competitivo.

Qual è la situazione concreta in Svizzera? In generale, la Costituzione federale vieta la discriminazione, anche nei confronti dei disabili. A livello legislativo, c'è la Legge sui disabili, LDis, che fornisce requisiti più dettagliati. Tuttavia, questi non devono essere obbligatoriamente soddisfatti se il beneficio è sproporzionato rispetto alla spesa economica. Ciò significa che, nel singolo caso, in caso di processo la decisione spetterebbe al tribunale.

Per la Confederazione, i cantoni e i comuni esistono ulteriori e più precise disposizioni. Dal 2014 in Svizzera è in vigore anche la Convenzione delle Nazioni Unite sui diritti delle persone con disabilità], che pone responsabilità anche sulle scuole. Solo nel settore privato l'accessibilità ottimale per le persone con disabilità rimane in gran parte volontaria.

La coscienza è importante

Per i nostri designer e sviluppatori UX, il problema è: da dove iniziare? Con siti web complessi – e digitec.ch è senza dubbio uno di questi – anche le più piccole modifiche comportano spesso tutta una serie di attività di follow-up. Più tempo passa senza che vengano implementate ottimizzazioni per l'accessibilità, più diventa difficile farlo.

Alla fine, dobbiamo ammettere apertamente che la scarsa fruibilità di un sito web per i non vedenti non è dovuta alla mancanza di risorse, ma al fatto che il problema non è ancorato nella mente delle persone. Secondo Remo, alcuni dei problemi che Gianfranco ha evidenziato dovrebbero essere relativamente facili da risolvere.

Ce ne siamo accorti tutti: Il semplice fatto che una persona non vedente si trovi nella nostra stessa stanza cambia molto il modo in cui percepiamo le cose. Più della metà dei dipendenti di «Accesso per tutti» è a sua volta affetta da una disabilità. Nei nostri uffici, le cose sono molto diverse: delle circa 130 persone del nostro reparto sviluppo, nessuno è visibilmente disabile. E la stragrande maggioranza di loro non si occupa del front-end, ma del back-end. Questa è la parte interna del sistema che tu, come cliente, non vedi. Gli sviluppatori sono quasi tutti giovani uomini, dotati di occhi d'aquila e di monitor con la migliore risoluzione. Nessuno di loro percepirebbe un piccolo carattere, grigio chiaro su sfondo bianco, come un problema. Ma, se iniziamo a uscire dai nostri panni e a metterci in quelli degli altri un po’ più spesso, stiamo già facendo un primo passo verso il cambiamento.

Avatar

David Lee, Zurigo

  • Teamleader Thor
Il mio interesse per il mondo IT e lo scrivere mi hanno portato molto presto a lavorare nel giornalismo tecnologico (2000). Mi interessa come possiamo usare la tecnologia senza essere usati a nostra volta. Fuori dall'ufficio sono un musicista che combina un talento mediocre con un entusiamso eccessivo.

21 Commenti

3000 / 3000 caratteri

User Anonymous

Bravo Gaalacus. Bin selber sehbehindert. Stolpere ständig. Gratuliere zum kurzen Perspektivenwechsel! Hoffe, es wird was

21.01.2019
User Anonymous

Wann dürfen wir den Artikel zu den Änderungen und Konsequenzen aus dem Besuch lesen?

21.01.2019
User David Lee

Hallo! Das kann ich dir zum jetzigen Zeitpunkt leider nicht sagen. Selbsterkenntnis ist der erste Schritt zu Besserung, aber es ist klar, dass weitere Schritte folgen sollten. Unsere Entwicklungsabteilung wird sich auf jeden Fall mit dem Thema befassen und schauen, wie sie das am besten in ihre Pipeline einbringt und umsetzt.

24.01.2019
Rispondi
User andreas_kocher

Mit Gianfranco hatte ich auch das Vergnügen :) Sehr spannend wie schnell der Mann navigiert. Für Swisspass.ch habe ich mitgeholfen die Zertifizierung zu erhalten. War wirklich schwierig das zu erreichen aber auch spannend. Gerade im Bereich Kontrast kann man mit einfachen Tools sehr viel herausholen. Empfehlen kann ich auch den Einsatz eines Skriptes, welches den Header-Baum visualisiert. So erkennt man rasch, ob man irgendwo mit den Stufen was verbockt hat. Das Fazit war auch bei uns war auch: weniger ist mehr. Statt halt eine fancy pancy Animation einzubauen, einfach besser weglassen. Statt noch ein cooles farbiges Hintergrunds-Div zu verwenden, einfach weglassen.

übrigens kann ich auch empfehlen, einen ScreenReader so auszustatten, dass er den gesprochenen Text wiederum als Schrift-Text anzeigt. Ist als sehender Entwickler deutlich angenehmer die Page so zu prüfen und zu korrigieren.

21.01.2019
User schrottbox83

hm.. wenn die Sites etwas weniger fancy und blinki werden, hat das ja auch für uns sehende was positives. :)

andere frage:
Wie ist das eigentlich mit so "werbeverseuchten" sites (nenne hier jetzt einfach mal als bsp. blick oder 20min). liest der screenreader dann auch noch den ganzen quatsch dazu vor? hilft man sich hier mit einem Adblocker? oder schnallt der reader dies und verzichtet wenigstens darauf?

21.01.2019
User andreas_kocher

Ich habe versucht dazu noch was rauszufinden. Tatsächlich sind Werbungen in vielen Fällen sehr hinderlich für Personen mit Screenreader. Gerade Werbung, welche dann auch noch automatisch Audio abspielt, übertönt den Screenreader und macht die Page eigentlich nutzlos. Ein Adblocker hilft dann genau so weiter.

Wie man das korrekt löst könnte ich aber nicht sagen. Es hängt vermutlich stark davon ab, wie genau die Werbungen eingebunden werden. Das einfachste wäre vermutlich, den Werbebereich entsprechend zu markieren, dass er für Screenreader ausgeblendet wird.

22.01.2019
User crodino

Ich denke ein Pi-Hole könnte für Sehbehinderte interessant sein.
Dieses ist auf einem Raspberry Pi innerhalb nützlicher Frist einzurichten. Es übernimmt in einem LAN den DNS und mittels Filter und Blacklist werden Anfragen an Werbesites zwar geschickt, die Antwort wird jedoch nicht an den User weitergeleitet, also "versandet" im Pi-Hole.
Recht nützlich für Sites, die nach aktiviertem Adblocker scannen. Die Site bekommt nichts mit, der User sieht (oder hört) die Werbung nicht.
Links:
pi-hole.net/ (offizielle Pi-Hole website)
en.wikipedia.org/wiki/Pi-ho... (englisches Wikipedia)

23.01.2019
User schrottbox83

@Andreas: Danke für deine Antworten.

@Crodino: Pi-Hole ist definitv ein cooles Teil. Gibts übrigens auch als Dockerimage und kann so auf der Synology ohne zusätzliche Hardware betrieben werden (über RaspPi ist aber definitv einfacher).
Die Funktion ist aber, glaube ich zumindest, genau anders rum. So wie du es beschreibst, funktionieren (soweit ich weis) die AdBlock-Addons in Browsern. Die Blocken erst die zurückkommende Antwort.
Der Pi-Hole blockt aber bereits die ausgehende Anfrage und schickt sie somit gar nicht erst raus. Bin der Meinung, dies ist ja das coole Feature von Pi-Hole, da so der Traffic gar nicht erst anfällt.. und dies Netzwerkweit. Egal welche Cleint (Mobile/Konsole/PC/TV/..)!
Somit kann auch die Gegenstelle (Facebook-/Googlewerbetracker) gar kein Datenprofil von dir generieren, da sie nie irgendwas von dir gehört haben. :)

..man möge mich korrigieren und erleuchten, falls ich falsch liege.

23.01.2019
User crodino

@Schrottbox83
Du hast selbstverständlich recht, ich hatte das falsch im Kopf.

25.01.2019
Rispondi
User Janser0

Supper Beitrag.
Sehr viele Lehrreiche Informationen :).
Hat mich auf jedenfall Aufgeklärt wie das Blinde im Internet unterwegs sind.
Danke

21.01.2019
User andreas_kocher

Für die es interessiert. Die SBB befasst sich stark mit dem Thema und hat einen Guide veröffentlicht. Ist alles noch in Beta, also noch nicht zu stark werten ;) Vielleicht helfen die Tipps ja mal jemanden aus

digital.sbb.ch/de/barrieref...

22.01.2019
User sa

Ja, es ist erstaundlich, wie schnell blinde Menschen mit dem Computer umgehen können und es ist extrem faszinierend. Aber dabei bleibt es leider meistens. Ich hoffe aber, dass Digitec das Gegenteil beweisen wird und sich für die Accessibility einsetzt sowie das Thema wirklich mal an den Wurzeln packt.

21.01.2019
User MakeAppsNotWar

Wäre es nicht eine Idee einen speziellen Webseiten Teil zu machen? Also so wie bei Englisch/Deutsch, dass sich der Inhalt der Seite verändert? So das man beide Seiten optimal optimieren könnte.

21.01.2019
User andreas_kocher

Das wäre extrem teuer wenn du das machst. Das Ziel muss schon sein, dass du eine Seite hast für alle, die entsprechend optimiert ist. Mit speziellen Anweisungen kannst du explizit für den Screenreader Informationen geben, die der sehende nicht zu Gesicht bekommt. Als Entwickler muss man dann schon fast "doppelt denken". Also deine Idee ist per se nicht falsch und man kann sie auch mehr oder weniger so umsetzen. Aber es soll möglichst automatisch vom Screenreader korrekt gelesen werden.

21.01.2019
Rispondi
User Anonymous

Das Problem fängt meines Erachtens schon eine Stufe vorher an:
"Früher" war es eigentlich guter Usus, dass man sich für einen HTML Doctype entscheidet, gemäss diesem die Seite aufbaut und dann einen Validator (z.B. dem vom W3C) drüber laufen lässt.
Bei digitec sehe ich keine Doctype-Auszeichnung im Quellcode, aber beim validieren 20 mal die Fehlermeldung, dass das alt-Attribut bei Bildern fehlt. Und dieser Text zeigt, warum er so wichtig (und deswegen ein Pflichtattribut) ist.

Allerdings ist Hopfen und Malz nicht verloren, so hat beispielsweise die Artikelüberschrift tatsächlich h1 als Element, so wie man es erwarten würde.

21.01.2019
User terabyte

Das war nicht nur früher so, sondern wird auch heute noch aktiv so beigebracht an den Schulen und Unis. Allerdings wird heutzutage viel Code automatisch generiert wird und es ist daher nicht immer ganz einfach alle Validierungen zu bestehen, respektive mit viel Aufwand verbunden.

Bezüglich des alt-Attributs finde ich es schon ein wenig peinlich von digitec, dass dieses gerade bei einem Artikel über Accessability nirgends vorhanden ist.

21.01.2019
User feerglas

Veto: das alt-Attribut auf Bilder ist nur dann Pflicht (aus Accessibility-Sicht), wenn das Bild inhaltliche Relevanz hat. Bei Bildern, welche nur "Verzierungs-Charakter" haben, ist das alt-Attribut sogar störend und sollte für Screenreader ohne hin einfach versteckt werden.

22.01.2019
Rispondi
User itsupport01

Bonjour, travaillant directement dans le domaine de la déficience visuelle, nous sommes confrontés chaque jour à ces problèmes d'accessibilité à internet, mais aussi aux applications, soit en entreprise, soit à l'école, soit à la maison. Si dans l'ensemble l'accessibilité c'est améliorée ces 10 dernières années, malheureusement les postes de travail pour personnes déficientes visuelles sont de plus en plus difficile à trouver. Si certaines entreprises font des efforts pour offrir une place adaptée, de grande entreprises, qui pourraient créer des postes particuliers, ne le font pas. D'autre part le passage à un environnement de plus en plus virtualisé pose de nombreux problèmes aux moyens auxiliaires nécessaire à l'accès à ces systèmes.
Enfin, la politique de mise à jour constante de Windows nous contraint à vérifier à chaque version que les moyens auxiliaires utilisés fonctionnent encore.
Si il existe de plus en plus de solutions gratuites, elles ne sont pas toujours adaptées aux besoins.
Enfin, le monde Mac qui avait beaucoup d'avance il y a encore 4 à 5 ans, ce fait rattraper par Microsoft pour les solutions natives.
Ces prochaines années verront certainement encore des bouleversements qui nous espérons facilitera encore l'accès.

23.01.2019
User aarr6398

If you searching file explorer windows 10 updated version then fileexplorerwindows.com you must follow this link and and check this updated version of file explorer windows.

24.01.2019
User ElenaSchmolke

Durfte letztes Jahr auch einen Kurs von Access for all besuchen und es hat mir sprichwörtlich «die Augen geöffnet». Gianfranco hat uns da ebenfalls demonstriert, wie er über grössere Schweizer Webportale navigiert. Eine der schlimmsten war hier übrigens watson.ch. Das hat bei mir als UX-Designerin einige Spuren hinterlassen.
Schön, dass dieses Thema mehr Aufmerksamkeit bekommt!

28.01.2019
User janwidmer

Für (frontend) Entwickler ist der Accessibiouty developer guide eine gute erste Anlaufstelle: accessibility-developer-gui...

Dieser wird ebenfalls von der Stiftung betrieben.

28.01.2019