Accessibilità e Javascript

20 marzo 2006

Questo articolo è stato pubblicato originariamente su Digital Web Magazine (http://www.digital-web.com). Appare qui in traduzione con il permesso dell’editore.

Titolo originale: The bahavior layer
URL: http://www.digital-web.com/articles/the_behavior_layer/

Ora che gli sviluppatori web hanno una solida consapevolezza del livello strutturale rappresentato da XHTML e di quello relativo alla presentazione fondato sui CSS, è il momento di prendere in considerazione il livello dell’azione rappresentato da Javascript e in particolare la sua accessibilità.

Nel passato di Javascript si è fatto abuso, soprattutto perché molti hanno frainteso la sua finalità. Molti siti lo hanno usato solo per effetti di presentazione, soprattutto nelle numerosissime e alla fine noiose interfacce in DHTML.

Il tipico sito basato su DHTML non è molto accessibile e tutte quelle interfacce “rivoluzionarie” non si sono rivelate poi così interessanti o utili, tranne che per evidenziare l’abilità di chi le ha sviluppate.

Questo abuso ha dato a Javascript una brutta nomea. È arrivato il momento di invertire questa tendenza. Io ritengo che Javascript possa rappresentare un’importante aggiunta per un sito accessibile, purché si tengano presenti poche e opportune precauzioni.

In questo articolo vorrei esaminare la relazione tra il livello dell’azione di Javascript e quelli della struttura e della presentazione. Impareremo poche, semplici regole che possono aiutarci a mentenere accessibile un sito continuando a sfruttare per i suoi scopi la potenza di Javascript.

Una pagina di esempio

Immaginiamo di dover creare una semplice pagina accessibile per uno store online di libri. La pagina contiene una manciata di link per la navigazione, un articolo su un libro come contenuto principale e alla fine un piccolo form per ordinare il libro.

Tutto questo contenuto dovrebbe essere reso con un markup XHTML estremamente semplice. Titoli e paragrafi per l’articolo principale, i link e il loro contenitore per la navigazione. Il form dovrebbe consistere di campi di input con le relative label di identificazione. Potremmo aggiungere anche 3 <div>, uno per racchiudere la navigazione, un secondo per il contenuto, un terzo per il form.

Quindi aggiungeremo un po’ di stili CSS per la presentazione. Margini e padding sui vari blocchi di contenuto, colore sui link e effetti di rollover sugli stessi, una leggera variazione di colore per il form. Niente di rivoluzionario, solo un po’ stile per compiacere l’occhio del visitatore.

Ragionare per livelli

È importante capire che abbiamo appena creato 2 livelli: un livello strutturale in XHTML e un livello di presentazione con i CSS. Il livello rappresentato dal codice XHTML è sempre presente, senza di esso non avremmo una pagina web. Il livello dei CSS, invece, può essere assente.

In altre parole, abbiamo definito 2 diverse ‘viste’ dello stesso documento: quella della presentazione dove agiscono gli stili CSS e una vista ‘semplice’ dove non agiscono. Ecco, fondamentalmente, l’accessibilità è l’arte di rendere fruibile una pagina anche senza gli stili dei CSS, l’arte di assicurare la comprensione e l’uso del contenuto e della navigazione basandosi sulla semplice struttura definita a livello di codice XHTML.

È anche importante comprendere come la vista della pagina con i CSS sia più usabile di quella senza. I fogli di stile CSS riguardano solo la presentazione. E una buona presentazione, infatti, è un primo passo per ottenere una migliore usabilità. Ogni designer sa che un margine e un’interlinea un po’ più ampia rendono il testo più facile da leggere, e quindi più usabile. Inoltre, potremmo usare i CSS per distinguere i link della navigazione principale da quelli contenuti nel corpo della pagina, cosa che ha anch’essa piccoli ma importanti benefici in termini di usabilità.

Sono cose note per chiunque abbia seguito gli ultimi sviluppi del web design. Il livello della struttura e quello della presentazione sono stati ampiamente esaminati, e stiamo lentamente creando una solida teoria sul modo di costruire strutture in XHTML e presentazioni con i CSS efficienti e accessibili. Non abbiamo ancora una simile esperienza con Javascript. Non abbiamo ancora ben indagato la sua applicazione nel contesto di siti accessibili.

Se vuoi aggiornamenti su Accessibilità e Javascript inserisci la tua e-mail nel box qui sotto:
 
X
Se vuoi aggiornamenti su Accessibilità e Javascript

inserisci la tua e-mail nel box qui sotto:

Ho letto e acconsento l'informativa sulla privacy

Acconsento al trattamento di cui al punto 3 dell'informativa sulla privacy