La struttura dei layout: togliere il superfluo e aggiungere ciò che è

Webaccessibile.org
La risorsa italiana di IWA dedicata all'accessibilita' del Web
http://www.webaccessibile.org
La struttura dei layout: togliere il superfluo e aggiungere
ciò che è significativo.
Pubblicato da Fabrizio Caccavello il giorno 14 settembre 2008
La ricerca della semplicità
Introduzione
I nuovi sviluppi del web degli ultimi 3-4 anni, conosciuti come web 2.0, hanno portato una nuova
ventata di funzionalità, nuovi contenuti con fattori di crescita esponenziali, e anche nuovi stili,
nuove tendenze e design più accattivanti e usabili con una tendenza generale verso la
semplificazione.
Tuttavia molti layout dei siti e servizi web non hanno seguito questa tendenza e si sono
indirizzati verso strutture apparentemente moderne ma poco utilizzabili e talvolta inaccessibili.
Anche lo sviluppo di nuovi servizi web ha subito una crescita esponenziale, ma spesso in
maniera caotica e poco attenta ai temi di usabilità e accessibilità, introducendo un livello di
complessità generale nelle funzionalità e nei layout. Basti pensare alle migliaia di piattaforme di
condivisione dei contenuti per gli utenti (Splinder, Flickr, Blogger, MySpace, Youtube, ecc), o al
proliferare dei servizi di Home Banking ora messi a disposizione dalla quasi totalità degli istituti
di credito, anche i più piccoli, che molto spesso sono tutt’altro che facili e intuitivi.
In ogni progetto web, sito internet o web-application che sia, la scelta del layout e degli elementi
che lo compongono è determinante per arrivare a un prodotto finale che sia usabile e
accessibile.
Progettare con l’accessibilità in testa, come si sente dire sempre più spesso nel nostro
ambiente, è un approccio fondamentale per arrivare a buoni risultati, ma l’altra parola chiave
che dovrebbe essere presente nella testa degli sviluppatori e dei project manager è semplicità.
Non bisogna però confondere il concetto di semplice con il concetto di elementare o marginale.
Semplificare non significa togliere, ma eliminare il superfluo e aggiungere le cose che contano,
o quelle che fanno capire e funzionare meglio un progetto.
Spesso quindi la semplificazione finale offerta all’utente può corrispondere a un maggior lavoro
a carico di progettisti e sviluppatori.
Lo sanno bene le aziende che intorno ai concetti di semplicità hanno costruito una filosofia di
lavoro, come la Apple per esempio.
Semplificare un layout non è affatto un gioco al ribasso ma un lungo e consapevole lavoro di
definizione di ogni singola struttura presente in una pagina web.
Il processo di semplificazione di un layout è tutt’altro che banale perché prevede una profonda
conoscenza di ogni aspetto del progetto web: contenuti, tecnologia, funzionalità, target degli
utenti, ecc. Fare la scelta migliore per ogni ambito non è necessariamente l’unica scelta
1/6
Webaccessibile.org
La risorsa italiana di IWA dedicata all'accessibilita' del Web
http://www.webaccessibile.org
possibile, ma si dovrebbe avere una visione olistica delle cose, dove layout, funzionalità e
contenuti dovrebbero integrarsi in un unicum il più semplice possibile.
La semplicità è strettamente legata all’accessibilità, perché nessun progetto realmente
accessibile può essere presentato da un layout che non sia semplice e lineare o avere dei
contenuti difficili da comprendere o da legare al contesto in cui sono visualizzati.
Non si può dimenticare infatti che l’accessibilità non è affatto (o non è solo) una questione di
codice.
Dopo un estenuante lavoro di realizzazione di un progetto web accessibile per un comune, il
primo contenuto inserito dall’amministrazione fu il seguente: “AI SENSI DELLA
DELIBERAZIONE DEL CONSIGLIO REGIONALE 20 DICEMBRE 1999 N. 755 COME
MODIFICATO CON DELIBERAZIONE DEL CONSIGLIO REGIONALE 15 FEBBRAIO 2006
N.235, PER LA FORMAZIONE DELLE GRADUATORIE PER L’ASSEGNAZIONE DEI
CONTRIBUTI DEL FONDO AZIONALE DI CUI ALL’ART. 11 DELLA LEGGE 9 DICEMBRE
1998 N. 431 ED AL DECRETO DEL MINISTRO DEI LAVORI PUBBLICI DEL 7 GIUGNO 1999,
PER IL SOSTEGNO ALL’ACCESSO ALLE ABITAZIONI IN LOCAZIONE.”, che tradotto in
linguaggio semplice e accessibile da un redattore professionista per il web, dopo aver letto il
contenuto divenne: “Contributi per le abitazioni in locazione. Entro il 22 febbraio le domande.”
Questo stupendo esempio di “burocratese” (per fortuna degli utenti tradotto) ci serve per dire
che se la semplificazione è eseguita in maniera non riduttiva non toglie valore il
contenuto, ma ne elimina il superfluo migliorandone l’accessibilità per una fetta molto più
ampia di utilizzatori, rendendo un progetto web più accessibile non soltanto per il codice ma
anche per i contenuti.
Solo un approccio olistico quindi può produrre risultati soddisfacenti nei processi di
semplificazione, ma tornando alla progettazione, i web design che si occupano in maniera
esclusiva della definizione dei layout possono comunque attivare delle strategie valide nella
maggioranza dei casi. Vediamo alcuni buoni consigli che si possono seguire.
Eliminare i doppioni.
Nei progetti per il web, la tendenza a duplicare i contenuti (compresi i link) è stata spesso un
elemento chiave per l’abbellimento estetico.
In un’analisi che feci qualche tempo fa sul sito internet di Vodafone (quello precedente
all’attuale) rilevai che le decine di sezioni disponibili in home page potevano essere ricondotte
a 6 o 7 attraverso una riduzione ragionata degli elementi e l’eliminazione di tutti gli elementi
doppi (i cui link conducevano a una stessa destinazione).
In molti progetti, tanto per esemplificare, si effettua la duplicazione dei menù al solo scopo di
riproporre in modalità testuale una precedente soluzione realizzata con le immagini. Questo
crea una doppia struttura che affolla inutilmente il campo visivo degli utenti e obbliga per
esempio gli utilizzatori di screen reader all’ascolto ripetuto delle stesse liste di menù.
Evitare per quanto possibile i doppioni nelle strutture dei layout è senz’altro un primo passo.
2/6
Webaccessibile.org
La risorsa italiana di IWA dedicata all'accessibilita' del Web
http://www.webaccessibile.org
Eliminare le abbondanze
Un layout colmo di elementi, colonne, riquadri, immagini, testi, può risultare confusionario e non
attirare l’attenzione del visitatore sugli elementi fondamentali.
Eliminare tutto ciò che non è strettamente necessario potrebbe essere una giusta operazione,
ma bisogna stare attenti alle valutazioni. Per esempio è naturale che un giornale online come
repubblica.it abbia una homepage più complessa della homepage di Google, i due prodotti non
sono comparabili.
Ma proviamo a dare uno sguardo alla homepage di Firefox e a quella di Internet Explorer.
Lasciamo per un attimo da parte le impressioni sull’estetica e sul codice e concentriamoci solo
sulla struttura del layout.
La homepage di Firefox comunica subito l’essenziale: un logo dominante, un claim (sottotitolo)
immediatamente esplicativo e un pulsante per scaricare il software in evidenza sia come
posizione che come colori. Il tutto concentrato in una parte centrale della pagina che
praticamente non è costituita da nessun box e nessuna colonna. Lo spazio per gli altri contenuti
è stato ricavato in una barra di menù superiore e in spazi secondari nella parte bassa della
pagina.
Tutto chiaro, inequivocabile.
La homepage di Explorer invece è decisamente meno intuitiva. Gli elementi presenti nella
pagina sono molto uniformi, le dimensioni dei titolo e dei menù molto simili ai testi e l’unico
elemento grafico riconducibile al software è situato in una piccola colonna di destra che più che
un logo caratterizzante la pagina sembra un banner pubblicitario.
Il pulsante per scaricare il software è ben nascosto nella parte centrale del sito.
Insomma, nonostante il primo tab di descrizione di Explorer dica proprio “Elimina il superfluo”,
a mio avviso questo processo di semplificazione non è stato fatto per la homepage del sito.
Poche colonne
C’erano una volta i siti a 3 colonne, un header e un footer.
Fin dagli albori della progettazione dei siti internet la suddivisione dello schermo in ideali
colonne è stata una tecnica vincente e lo schema a tre colonne verticali era diventato uno
standard che sembrava intramontabile.
Negli ultimi periodi, grazie anche all’introduzione di template appositamente studiati per i blog,
si è assistito a una rivisitazione di questa modalità progettuale a vantaggio di strutture più
semplici e flessibili.
Una riduzione del numero delle colonne è sempre auspicabile, perché conferisce al progetto
un’interfaccia più semplice da consultare. Abbiamo già visto nell’esempio del paragrafo
precedente come i progettisti di Firefox siano riusciti a ridurre al minimo gli elementi strutturali
rendendoli quasi impercettibili. Altro esempio di utilizzo molto efficace di un layout non troppo
strutturato è il sito di Skype, che presenta per la homepage un layout praticamente a colonna
unica e per le pagine interne sostanzialmente solo due colonne.
Lo stesso non si può dire per Vodafone (riprendendo l’esempio di prima), che nel nuovo
restyling fatto recentemente ha (forse) corretto gli evidenti errori di progettazione del progetto
precedente rimuovendo i doppioni, ma ha introdotto uno schema di layout complesso che
addirittura divide la homepage in 5 ipotetiche colonne che sono state riempite di decine di link e
3/6
Webaccessibile.org
La risorsa italiana di IWA dedicata all'accessibilita' del Web
http://www.webaccessibile.org
contenuti diversi.
Magari dietro a questo lavoro ci sono studi pubblicitari e di marketing complessi ma in ogni caso
questo tipo di progetti non possono essere certo presi come esempio di semplificazione.
Conclusione
Il web è uno strumento formidabile di comunicazione.
Accessibilità, al di là delle linee guida e delle leggi, significa raggiungere il maggior numero
possibile di utenti.
Per far questo ci si deve sforzare a produrre contenuti e presentarli in maniera facilmente
consultabile.
Questi processi possono essere controllati avendo bene in testa una parola chiave, semplicità,
e con l’applicarla a partire dai disegni dei propri layout.
Semplicità non significa togliere qualcosa, ma eliminare il superfluo e dare maggiore enfasi alle
cose che contano.
Potrebbero interessarti anche i seguenti articoli
5 – I principi della progettazione universale
Proviamo ora a riepilogare sinteticamente i sette principi della progettazione universale: come esercizio potresti provare a trasferire
idealmente ciascuno di essi sul tuo sito Web...
Progettazione Universale e Mappe Cognitive
Premessa Il principio di progettazione universale (universal design) ha origine in architettura e nel design dei manufatti; lo scopo di
questi principi di base è stato, sin dall...
4/6
Webaccessibile.org
La risorsa italiana di IWA dedicata all'accessibilita' del Web
http://www.webaccessibile.org
Il colore come informazione
I problemi legati alla percezione del colore sono più diffusi di quanto si pensi ed hanno cause ed effetti diversi: si pensi che
addirittura una persona su dodici ne soffre. I...
I siti accessibili devono essere noiosi?
Se così fosse, i siti Web accessibili sarebbero certamente noiosi. Fortunatamente per tutti noi, la grafica è perfettamente accettabile
nel Web design accessibile, difatti ne è ...
Informatica e disabilità: nuove opportunità o nuove barriere?
Questo testo è rilasciato con licenza Creative Commons (CC-by-nc-nd). E' possibile prelevare il file PDF di questo lavoro all'indirizzo
http://www.pediatria.unipd.it/aidi2000/...
5/6
Webaccessibile.org
La risorsa italiana di IWA dedicata all'accessibilita' del Web
http://www.webaccessibile.org
6/6
Powered by TCPDF (www.tcpdf.org)