Accessibilità

" Un simbolo abbatte le barriere linguistiche, la principale funzione del graphic design non è quella di essere bello, ma di funzionare ovunque e per chiunque rendendo le informazioni accessibili al maggior numero di persone contemporaneamente. La comunicazione visiva non interagisce con l'interpretazione ma con la percezione di un contenuto. "

Le cinque regole per un sito perfetto!

Navigabilità

Una buona struttura di navigazione permette di guidare il flusso delle informazioni. Nel poco tempo che normalmente si dedica ad un sito la cosa più importante è proprio quella di non disorientare il visitatore. Le pagine e le sezioni devono essere logiche, semplici ed intuitive. Quindi per una efficace navigazione:

• Utilizzare le icone
• Separare i menù (primo livello, secondo livello, ecc.) sulle barre di navigazione
• Creare gruppi logici di link correlati
• Conoscere sempre in quale pagina ci si trovi (mappa del sito) per non disorientare
• Passare in un’altra area del sito attraverso la navigazione “breadcrump”.

Contenuti

Non sovraccaricare il sito (e il visitatore) di informazioni che possono stancare ed allontanare dal messaggio principale. Le informazioni devono essere raggiunte in modo logico e rapido attraverso la gerarchia dei contenuti; è questa la vera guida nella navigazione. Tre semplici consigli: 

• Impaginare utilizzando titoli, sottotitoli, e poi eventualmente suddividere in paragrafi, tabelle, ecc.
• Immagini attinenti. Realistiche o astratte devono illustrarne i contenuti e sostenere la comunicazione, non rimandare ad altro. 
• Non temere l’“horror vacui”. Gli spazi bianchi (o non riempiti) permettono di separare meglio le informazioni e i contenuti.


Pulizia, chiarezza

Non includere tutto, non stipare: la pagina deve essere libera, sgombra e quindi leggibile.

• Priorità al contenuto
• Aiutare il visitatore a trovare le informazioni che sta cercando: non confondere le aree di contenuto, da quelle di pubblicità o promozione
• Evitare troppe immagini (effetto “clutter”)
• Accertarsi della necessità dello scopo di ogni singola pagina
• Terminologia attenta e professionale con ortografia e grammatica perfette

Colore e contrasto

La lettura e la fruizione dei contenuti avviene sempre per il riuscito rapporto tra le forme, i colori e il contrasto (vedi anche norme legate all’accessibilità). Nella progettazione quindi utilizzare sempre le regole che definiscono la gerarchia di lettura e definirne il flusso (più importante, meno importante). Alcuni suggerimenti:

• Coerenza (ad esempio utilizzare fondini di colore diverso ma appartenenti alla stessa gamma cromatica)
• Utilizzare colori complementari
• Diversificare i pesi tipografici
• Limitare l’uso del testo in negativo
• Limitare la tavolozza

Invito all'azione pulsanti call action

È importante guidare sempre il visitatore nella navigazione per accedere velocemente alle informazioni ma se il pulsante “clicca qui” è sepolto in un mare di testo o è invisibile, può risultare inutile. Quindi per un “Call to Action” ottimale occorre:

• Definire un chiaro obiettivo per pagina che risponda alla domanda: “Cosa c’è per me?”
e che si ottenga un chiaro “È proprio ciò che sto cercando!” Attraverso per es.: 
• 4 semplici opzioni di: dimensione, forma, colore e posizione.


di Valerio Barba creativo, progettista grafico, amante dell'arte e del design, sperimenta tecniche artigianali, webdesigner per necessità!

Evoluzione del segno

" Affascinante e misteriosa la storia della scrittura affonda le sue radici nell'età del Bronzo, quando comparvero probabilmente in Egitto, i primi segni di un linguaggio scritto. Per motivi legati alla religione o al commercio, i sistemi di scrittura si svilupparono e raffinarono in tutte le civiltà del Medio - Oriente. Dal XV secolo a. c. in poi si stabilizzarono alfabeti veri e propri, in cui ad ogni segno corrispondeva un suono e dalla combinazione di segni si formavano parole. Scendendo la scala, si ripercorre in pochi passi l'evoluzione della scrittura occidentale, passando dal pittogramma che rappresentava una testa di bue stilizzata all'aleph fenicio e all'alfa dei greci fino ad arrivare alla A del nostro alfabeto latino. Da lì, quasi con un balzo ci si proietta ai due grandi eventi che hanno segnato la storia della comunicazione umana: l'invenzione della stampa a caratteri mobili e il passaggio alla telematica. Il viaggio non è concluso... a ciascuno di noi il compito do proseguirlo e interpretarlo! "

A sinistra Aleph pittogramma rupestre di origine fenicia. 

Queste righe ricche di storia e di fascino che ho riportato sono parte integrante di un testo stampato su un pannello situato all'interno della biblioteca comunale di Subiaco. Più precisamente nello spazio della scala prima di scendere i gradini che portano al piano interrato, essendo la struttura su più piani. Il motivo di questo mio intervento sta nella progettazione grafica della guida a muro illustrata dal pannello. L'ideatore della guida è la stessa persona che vi scrive. Non faccio questo post per rivendicare chissà cosa ma perché quello fu uno dei miei primissimi incarichi. Ed essere partito da lì per questo viaggio tra caratteri e colori, immagini e loghi mi piace ed è per me molto significativo. Nel 2009 agli inizi del mio essere grafico quando studiavo ancora in Accademia progettai per la biblioteca di Subiaco queste sei icone tradotte in una guida raffiguranti l'evoluzione dal segno alla lettera. E' una mia personale interpretazione di come siano andate le cose. La guida a muro progettata per lo spazio delle scale accompagna il visitatore nel piano seminterrato della biblioteca dedicato in parte alla stampa a caratteri mobili. Infatti nello stesso ambiente è situata la riproduzione in legno di un antico torchio da stampa. 

Subiaco, considerata la culla della stampa, vide la nascita del Lattanzio il primo libro stampato in Italia. E per questo motivo, per l'attenzione alla cultura della stampa, mi chiesero di rappresentare il concetto dell'evoluzione che il segno ha subito nel tempo. Progettai una serie di sei icone rappresentanti la nascita e l'evoluzione della prima lettera dell'alfabeto, la  lettera A. La prima icona è un pittogramma rupestre raffigurante aleph che nell'alfabeto fenicio originariamente voleva dire bue. 

La seconda è la raffigurazione molto sintetizzata dello stesso aleph formata da un cerchio e un semicerchio che toccandosi leggermente danno vita a una testa con due corni, come se il simbolo si fosse evoluto da pittogramma a una figura geometrica mantenendo il suo significato. Il terzo simbolo scaturito dal secondo è un segno molto simile alla lettera greca "gamma" avente ancora tratti animaleschi. La quarta icona è la lettera alpha greca ottenuta dalla rotazione di 90° in senso orario di quella icona che chiamiamo "gamma". La quinta icona è ancora la lettera alpha greca però ruotata nuovamente di 90° molto simile ad una A. La sesta icona è una vera A. 

Il segno ha completato la metamorfosi. La settima icona è invece la rappresentazione del carattere da stampa italiano per eccellenza, il Bodoni, disegnato da Giovanni Battista Bodoni (1740-1813), caratterizzato da un alto contrasto tra le linee spesse e quelle sottili. Il progetto grafico della guida a muro di Valerio Barba è stato realizzato in forex intagliato e poi affisso al muro da l'ink, studio grafico dalla progettazione all'allestimento. Arricchito da un pannello esplicativo del progetto di cui ho parlato all'inizio e una serie di tre piccoli quadrati che idealmente uniscono le icone e danno un senso compiuto alla realizzazione. 

di Valerio Barba 26/04/2014
photo by barbavaleriodesign@gmail.com
www.facebook.com/barbavaleriodesign
www.youtube.com/user/valeriobarbadesign