Navigare il Web con lo screen reader: Giuseppe, i suoi esperimenti e la fondamentale importanza dei titoli

Giuseppe Di Grande è lo sviluppatore dell’eccellente software Biblos, un word processor che permette di creare stampe Braille e grafici tattili a partire da documenti scritti in un ambiente di authoring del tutto simile a quello di Word.

Giuseppe è un non vedente, esperto di computer e informatica. Trovo quindi molto significativi i suoi interventi in video dedicati ad illustrare le difficoltà che un non vedente incontra navigando il Web: è un’esperienza formativa per chi intende comprendere seriamente che cosa sia l’accessibilità, poiché Giuseppe illustra con chiarezza le operazioni che esegue e le difficoltà incontrate.

La sua playlist è disponibile su Youtube, ed è composta da diversi video dedicati all’uso del suo software, Biblos, e all’illustrazione delle sue esperienze di navigazione su importanti siti italiani.

Recentemente Giuseppe ha visitato i siti di due quotidiani, Il Fatto Quotidiano e La Repubblica. Per me, come studioso dell’accessibilità, si tratta di materiale molto interessante, poiché Giuseppe non è un tecnico del Web, e non esamina i siti secondo un’ottica da “accessibilista” o per una verifica di accessibilità. Semplicemente documenta la sua esperienza, fornendo dove possibile consigli per gli sviluppatori.

Su questo blog si è parlato molte volte dell’importanza degli elementi <hn> di XHTML e di come sia di fondamentale importanza utilizzarli correttamente. I video di Giuseppe mostrano chiaramente perché, e perché sia altrettanto importante il rispetto di quella “grammatica formale” tante volte richiamata dalla normativa e dalle specifiche riguardanti l’accessibilità.

Per esempio osserviamo il sito de Il Fatto Quotidiano (ma la stessa cosa vale per Repubblica): Giuseppe utilizza il tasto speciale H del suo screen reader per navigare la pagina desumendone la struttura dai titoli presenti. La struttura non sembra corrispondere a un ordine logico, bensì presentazionale: i titoli di livello due vengono utilizzati per titolare articoli riguardanti notizie di rango inferiore alla notizia principale, che possiede il tag <h1>.

Giuseppe e Il Fatto Quotidiano

Però, secondo la grammatica formale utilizzata, <h2> non è una notizia di rango inferiore, il tag dovrebbe delineare un sottotitolo all’interno dell’articolo iniziato con <h1>.

Cosa significa in pratica? Per capirlo chiaramente utilizziamo un add-on per Firefox,  Heading Maps. Ora osserviamo il sito del Fatto Quotidiano con questo add-on attivo.

Heading Maps crea una mappa attiva e navigabile degli elementi <hn> presenti nella pagina, e simula perfettamente quello che Giuseppe fa nei video utilizzando il tasto H dello screen reader.

Come è facilmente visibile nell’immagine successiva, non è affatto vero che la notizia marcata con <h2> “Csm, 35 milioni di costi e il bilancio è inaccessibile” (sic) sia un sottotitolo all’interno di “Governo, M5S: non diamo liste di nomi” marcata con <h1>.

Sito de il Fatto Quotidiano (03/04/2013). Elementi h annidati.

Così come la notizia marcata con <h3> “Alla Bufalotta tra lamiere e teche” non è per niente un sottotitolo interno a “Il Fatto Quotidiano TV“, marcato con <h2>.

Il Fatto Quotidiano. Elementi h annidati.

Il Fatto Quotidiano. Elementi h annidati.

Ovviamente, il mancato rispetto della semantica di quegli elementi rende la navigazione di Giuseppe più confusa ed imprecisa. Con poco lavoro di riorganizzazione della struttura della pagina la navigazione potrebbe essere chiara e semplice anche per un non vedente, che mi sembra una bella cosa.

 

Annunci

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...