Usabilità - impostazione grafica (lez. 3)

Dopo aver parlato in generale dell'usabilità ed averla distinta dall'accessibilità ed aver inoltre parlato dell'impostazione di una Home Page a prova di Usabilità, entriamo ora nella parte dedicata alla vera e propria impostazione grafica di un sito web professionale. In questa lezione spieghereno il perché sia meglio cercare di evitare l'abbondanza di elementi grafici, l'interazione tra immaigni e contenuto testuale ed infine parleremo di Flash e della sua usabilità.

Introduzione allo stile

Per iniziare è doveroso mettervi al corrente di alcune massime sullo stile grafico e visivo di un sito web a portata di utente. Questa parte si tratta di un piccolo resoconto di quello che affrontiamo poi nei punti successivi di questa lezione.

Primo concetto fondamentale è quello di dare nel minor tempo possibile all'utente tutte le informazioni visive riguardo alla nostra attività ed al nostro sito, pianificando in base all'importanza elementi grafici e testuali

Secondo concetto è quello di cercare di far interagire nel migliore dei modi grafica e contenuti testuali. Accostare cioè le immagini giuste nel posto giusto!

Terzo concetto è quello di cercare di ridurre al minimo le immagini, soprattutto se di grandi dimensioni, per non creare confusione e rendere veloce il caricamento della pagina

Quarto concetto riguarda le animazioni gif e le componenti Flash. Questi due elementi non sempre sono ben voluti dall'utente. Attirano troppo spesso l'attenzione grazie alla loro dinamicità anche se non pubblicizzano argomenti e informazioni primarie. Flash inoltre necessita di un plug-in e pertanto esclude una parte di utenti della rete.

Questo era solo un piccolo riassunto a ciò che affrontiamo oggi, ora puoi leggere la lezione!

Adattare gli elementi grafici ai contenuti e all'attività svolta

Innanzitutto, sembrerà scontato, ma la cosa fondamentale nell'interfaccia grafica di un sito web è quella di utilizzare elementi grafici quali sfondi, bottoni, immagini ed animazioni che rispecchino nel migliore dei modi la propria attività.

Diciamo questo poiché oltre a dare un tocco di professionalità, rendere subito evidente lo scopo del nostro sito fa capire all'utente l'attività che trattiamo e non crea alcuna confusione al visitatore. Capita infatti molto spesso di entrare in siti web, vedere i loro loghi o le loro immagini utilizzte per "abbellire" la loro presenza nella rete, poi leggere i contenuti della presentazione e riscontrare una netta discordanza tra i due elementi.

Avrete quindi capito che sarebbe "poco intelligente" utilizzare come logo ad una società che lavora nel campo dell'informatica un pallone da calcio ;-).

Questa è una delle tante, chiamiamole così, norme da seguire per rendere coerenti immagini e contenuti del proprio sito.

Altro punto che non possiamo trascurare di certo è quello del posizionamento degli elementi grafici in base ai contenuti trattati all'interno di ogni singola pagina.
Questo punto è infatti troppo spesso trascurato e frainteso. Molto spesso vengono fatti riferimenti ad immagini troppo "assoluti" che mettono in una situazione di disagio l'utente che si collega al sito. Per sviare a questo grande, e ripeto grande!, equivoco, sarebbe sempre opportuno creare delle didascalie sottostanti all'immagine, in modo da chiarire si il contenuto rappresentato dall'immagine, ma anche per permettere di poter individuare subito l'immagine a cui si fa riferimento nel testo soprastante. Un esempio è questo:

Qui immagine

IMG 1 - piccola descrizione

Con questo piccolo accorgimento risolverete uno dei grandi problemi che si verificano nella rete quando si parla in termini di immagini.

Altra accortezza di cui tenere presente è quella di evitare di inserire immagini delle quali si parlerà successivamente, soprattutto se la descrizione della stessa viene effettuata in un'altra pagina. E' vero si che a volte una anticipazione può essere utile all'utente, ma molto spesso può non rendere chiaro l'argomento trattato o addirittura portarlo "fuori strada".

Immagini : quando e perché

Le immagini dei maggiori dei casi di siti amatoriali vengono utilizzate esclusivamente per una questione di bellezza, ma nascono per tutt'altro motivo. Questo elemento grafico è stato infatti introdotto nelle pagine web più che altro per dare una spiegazione maggiore ai contenuti testuali ed il suo scopo centrale non era di certo quello della questione estetica.

Il problema sta nel quando utilizzare le immagini in un sito web…



Il nostro consiglio è quello di risevare le immagini al solo utilizzo comunicativo come approfondimento ad un tema trattato nella stessa pagina web. Il motivo di questa scelta, si basa fondamentalmente su due elementi principali:

- semplificare la lettura della pagina
- rendere più leggera la pagina web

Il primo motivo può risultare forse un po' complicato da capire ed a volte può risultare anche sbagliato.

In un sito web l'abbondanza di immagini può fare passare in secondo piano il contenuto testuale della stessa pagina, che di norma dovrebbe essere l'elemento fondamentale di un sito, poiché di solito le visite sono comportate dalla qualità dei contenuti (a parte qualche caso: sfondi per desktop, gallerie di immagini ecc…) e non dagli elementi grafici (basti pensare ai migliaia di siti che offrono contenuti di primo livello e le cui pagina non presentano alcuna immagine se non un logo). A volte però il solo testo non può esprimere e rendere bene l'idea di ciò di cui si parla ed allora in questi casi l'immagine viene utilizzata come oggetto di approfondimento, o ancor meglio di spiegazione.

Il secondo motivo invece rigurdano i KB richiesti al server al caricamento della pagina. Il solo testo in media occupa in una pagina web dai 5 ai 50KB. Già quindi il contenuto testuale può comportare un tempo di caricamento elevato, se in più noi contorniamo le nostre pagine web con eccessivi elementi grafici, allora la faccenda si fa complicata. Capirete quindi che se non abbiamo un buon server che ci permette di ottenere tempi di caricamento buoni (dobbiamo poi tenere conto anche di modem e connessioni degli utenti), la soluzione migliore è quella di cercare di ridurre al minimo la componente "immagine". Un trucchetto che spesso usano i webmaster più esperti è quello di spostare i banner che vengono visualizzati (quelli 468*60 occupano circa sui 10KB se ottimizzati) su un altro server, in modo da non sovraccaricare il server.

Questi due motivi affrontati non sono gli unici che dovrebbero indurvi a limitare l'utilizzo delle immagini, ma sono di certo quelli fondamentali.

Immagini : Animazioni e Flash

E' a tutti noto che le animazioni gif riescono ad attirare l'attenzione dell'utente in ogni pagina web ed è per questo motivo che dovrebbero prestare una maggiore attenzione e non dovrebbero essere utilizzate a dismisura.

Ritorniamo infatti nuovamente in termini di eccessività! Questo perché l'attenzione non deve essere mai richiesta per contenuti di secondo livello, non indispensabili all'utente, ma bensì devono essere utilizzata per rendere più semplice e veloce la visita all'interno del web. Le animazioni quindi svolgono un ruolo fondamentale nel web in termini di attenzione più che per una questione estetica.

Ora però con l'avvento di Flash tendono a passare "inosservate" e non è di certo un bene, soprattutto se si considera che Flash ha sì grandi potenzialità, ma rischia di tagliare ancora una grossa fetta di utenti.

Se dalla parte dei webdesigner Flash è considerato positivamente, dalla parte degli utenti esigenti e dalla parte degli esperti di usabilità viene considerato in parte negativamente.

L'argomento Flash sarà affrontato più avanti in una lezione a sé, ma è nostro dovere fin da subito darvi alcune informazioni a rigurdo per non incappare in sgradevoli sorprese.

Elemento fondamentale è quello di fornire flash sempre come alternativa alle comuni pagine web, permettendo quindi a tutti di accedere al sito.

Se utilizzate Flash dovete sempre linkare il download del plug-in nella prima pagina del sito ed informare il visitatore del fatto che utilizziamo tale tecnologia nelle nostre pagine.

Mai utilizzare solo un'applicazione flash per permettere l'accesso al vostro sito. Dovrete infatti permettere sempre di saltare l'introduzione (soprattuto per gli utenti che si collegano più volte) e di entrare con un semplice link html.