Siti accessibili ai touchscreen ed alcune implicazioni della loro diffusione.
Le linee guida per la realizzazione di siti accessibili da tempo hanno chiarito un punto: è fondamentale offrire ad un utente la stessa esperienza di navigazione, indipendentemente dal dispositivo utilizzato. Se fino a poco tempo fa era ovvio pensare alla navigazione da tastiera oltre a quella via mouse, l’avvento dei touchscreen ha aggiunto un altro livello di complessità.
Non si tratta di una questione banale, perché utilizzare un touchscreen è un’esperienza totalmente diversa rispetto alla navigazione tradizionale: ve ne sarete resi conto se avete uno smartphone o un iPad.
Cosa dicono le linee guida
Tra i 22 requisiti per la verifica tecnica della legge Stanca, è da sottolineare il numero 16:
Garantire che i gestori di eventi che attivano script, applet oppure altri oggetti di programmazione o che possiedono una propria specifica interfaccia, siano indipendenti da uno specifico dispositivo di input.
Ed anche un passaggio del requisito 21:
I collegamenti presenti in una pagina devono essere selezionabili e attivabili tramite comandi da tastiera, tecnologia in emulazione di tastiera o tramite sistemi di puntamento diversi dal mouse.
Indicazioni di questo tipo esistono anche nelle WCAG, sia nella loro versione 1.0 che nella più recente 2.0. Un esempio è la linea guida 9 delle WCAG 1.0: Design for device-independence.
I problemi con i touchscreen
La differenza fondamentale tra un mouse ed un touchscreen è che per il secondo non esiste mouseover. Potrebbe sembrare una banalità, ma se pensate a quanti siti utilizzano i CSS o JavaScript per scatenare un evento al passaggio del mouse, potete rendervi bene conto dell’entità del problema (menu a tendina, tooltip…).
Fino ad ora la soluzione più utilizzata consiste nel trasformare il mouseover in un ulteriore clic, anche se questo aumenta la complessità della navigazione. E’ una soluzione efficace? Sì, perché risolve il problema, ma non è detto che sia quella ottimale.
Il discorso quindi si lega anche al tema usabilità ed al design delle interfacce: è inevitabile che l’arrivo di una nuova modalità di navigazione introduca nuove variabili.
Da evitare
Sono sicuramente da eliminare o rappresentare in maniera differente:
- contenuti leggibili solo con lo stato :hover (ad esempio testi con poco contrasto rispetto al background)
- link visibili solo al mouseover, normalmente poco distinguibili dal testo semplice
- azioni correlate al mouseover su un particolare elemento (le più comuni sono modifica e cancella)
Uno sguardo al futuro
I touchscreen sono ormai sul mercato da anni, e la loro presenza continua ad aumentare. Tralasciando le discussioni sulla loro effettiva utilità, è logico pensare che nei prossimi anni continueremo a vedere dispositivi che li utilizzano, seguendo l’esempio dell’iPad.
In questo scenario è obbligatorio considerarne la presenza, soprattutto se si realizzano siti con interfacce fuori dal comune. Proprio questa originalità a volte può rendere un sito inaccessibile: l’importante è ricordare che non esiste solo il mouse.
La prima cosa da fare è assicurarsi che sia possibile usufruire di tutti i servizi di un sito indipendentemente dal mezzo utilizzato per navigare. I touchscreen hanno introdotto nuovi fattori, e la situazione è destinata a diventare sempre più complicata: pensate a chi sta già utilizzando la propria console di casa per navigare dal televisore, o a chi sta usando lo stesso Tv LCD per collegarsi ad internet. In futuro i dispositivi connessi alla rete saranno sempre di più: forse sarà l’occasione buona per vedere considerare l’accessibilità una necessità e non un lusso per pochi.
[Foto di bark]
Ma in realtà l’iPad e iPhone hanno un sostituto del mouseover, che funziona automaticamente (in realtà solo in uso JS penso e solo per i link) ma se ad esempio c’e un menu con il mouseover per il menu a tendina, il primo click fa da evento mouseover, il secondo da click vero e proprio.
@Eduardo: è vero, diciamo che su iPhone e iPad il comportamento potrebbe essere diverso da quello che ci si può aspettare: spesso cambia anche a seconda di come è stato realizzato il sito visitato.
In ogni caso non sono i soli dispositivi touchscreen sul mercato, la situazione si evolverà sicuramente nel tempo.
ciao Tom,
articolo interessante, anche io sono molto curioso di vedere come evolveranno le interfaccie sui dispositivi mobilie soprattutto come svilupperano i nuovi user agent. Spero che l’esperienza abbia però insegnato ad abbandonare e gli user agent evidentemente male sviluppati e i dispositivi che per progettazione non potranno mai essere utilizzati da un diversamente abile. Faccio riferimento per esempio alla confusione che si genera ogni qual volta si chiede un’interfaccia mediamente complessa fruibile anche da ie6, oppure applicativi web che generano dati infiniti fruibili via palmare. Insomma massima attenzione per tutti ma ottimizzazione degli sforzi e delle risorse, per mia esperienza è capitato di investire tempo e risorse in progetti che poi non sono stati mai usati o usati in minima parte, magari penalizzando gli utenti normodotati.
Buona giornata
Luigi
Ancora tanto deve essere fatto in tale contesto.
Bell’articolo! Condivido le tue considerazioni e spero che questa tua affermazione “considerare l’accessibilità una necessità e non un lusso” si verifichi. Mi sono trovata a progettare interfacce touch screen ed è stata una bella sfida, proprio perché essendo abituata a farlo per il web molte delle ”regole” non sono più valide.
Belle le soluzioni presentate nell’articolo, ma hanno un po il sapore del workaround.
Penso che sia il momento per gli organismi di standardizzazione (vedi W3c) di sedersi al tavolo per decidere eventi e comportamenti comuni prima che venga fatta la frittata o torneremi ai tempi di cui W3C rilasciava le specifiche e Microsoft creava il suo HTML.
Storicamente, a partire da HTML4 in poi e dall’arrivo di firefox come browser secondario, il W3C ha sempre giocato d’anticipo sfornando le linee guida delle nuove tecnologie (vedasi i CSS definiti anni prima della loro implementazione nei browser), questa volta mi sembra che sia stata presa in contropiede dagli attori del mercato obbligati a farsi la lotta per consolidare le fasce di mercato aperte dai nuovi devices.
Molti designer si preoccupano di ottimizzare i siti per IE6 (alcuni anche per versioni precedenti) e ignorano touchscreen, consolle e altri dispositivi di nuova generazione.
Importante per i link è differenziarli rispetto al resto del testo e con l’underline fisso non che compare solo al passaggio del mouse (e tu queste regole le applichi divinamente)
Sono questi semplici articoli che fanno crescere la comunità di web designer italiana
Grazie