2. Scrivere
l'interfaccia
Standard e creatività, ipertesti e interfaccia testuale
tradizionalmente
le decisioni che riguardano la progettazione dell'interfaccia utente
vengono prese dagli ingegneri software. Le decisioni riguardano aspetti come
i colori utilizzati sullo schermo, la scelta del tipo o delle dimensioni dei
caratteri, gli standard da adottare e così via.
Il Web è un ambiente molto più grande e complesso di un'applicazione
software e le scelte che riguardano la progettazione dell'interfaccia web
rispecchiano questa complessità. Solitamente gli utenti passano solo
pochi minuti all'interno di un sito e per questo i progettisti di un sito
devono essere certi che l'interfaccia sia chiara e facilmente utilizzabile
da chiunque. Nel Web, i testi giocano un ruolo essenziale nella creazione
di un'interfaccia che funziona, anche per chi si affaccia per la prima volta
al nostro sito.
- Standard
e creatività: scrivere l'interfaccia testuale - Menu
e pulsanti: microtesti per orientarsi e agire - Link:
scrivere ipertesti usabili - Scrivere
l'interfaccia: consigli in breve
Standard
e creatività: scrivere l'interfaccia testuale
L'interfaccia
testuale è la parte dell'interfaccia utente costituita da testi
di varia natura e lunghezza. Quando raggiungono per la prima volta un sito,
gli utenti del Web fanno grande affidamento sull'interfaccia testuale per
prendere delle decisioni, per orientarsi, per effettuare delle operazioni.
Il web writer
deve effettuare delle scelte che riguardano l'interfaccia testuale, sia in
rapporto allo specifico sito per cui scrive, sia in rapporto al Web, l'ambiente
più generale in cui il sito è ospitato.
Sulle interfacce
utente e le interfacce web leggi: The
difference between Web design and GUI design (Nielsen - in inglese)
I principali
elementi dell'interfaccia testuale sono:
- Le voci dei
menu - I testi dei
pulsanti - I testi dei
link ipertestuali
L'utente che
giunge su un sito deve rapidamente comprendere le caratteristiche della nuova
interfaccia testuale per poter interagire con il sito ed è pertanto
essenziale che il web writer sia consapevole di questa necessità quando
scrive i testi dell'interfaccia.
Come ci ricorda Nielsen, nella sua legge sull'esperienza dell'utente web,
la scelta di una terminologia standard può a volte migliorare
notevolmente l'usabilità del sito:
«Gli
utenti passano la maggior parte del loro tempo su altri siti.
Per questo, qualsiasi convenzione, utilizzata nella maggior parte degli
altri siti, sarà marchiata a fuoco nel cervello degli utenti e l'allontanamento
da tale convenzione comporta necessariamente seri problemi di usabilità.»
Jakob Nielsen,
Interface Standards
and Design Creativity (agosto 1999)
La scelta tra
testi standard e testi creativi nella scrittura dell'interfaccia
testuale è una responsabilità che ricade sul web writer oltre
che, più in generale, sul team di sviluppo web. Dipende da molti aspetti,
come il tipo di utenti del sito, la loro esperienza del web, le loro esigenze
informative e così via.
ESEMPIO:
Carrelli o slitte della spesa?
(da Jakob Nielsen, Interface
Standards and Design Creativity)
Eric
Davis, un architetto dell'informazione di Resource Marketing, ha recentemente
riferito di un test di usabilità relativo alla terminologia dei
carrelli per la spesa (shopping cart). Il progetto preliminare prevedeva
l'uso del termine "slitta per la spesa" (shopping sled) poiché
il sito (che vendeva prodotti per gli sport invernali) desiderava differenziarsi
ed evitare l'uso di terminologia standard.
Risultato: "il 50% degli utenti non compresero il concetto di slitta.
Il restante 50% riferì di aver compreso il significato perché
la slitta si trovava nello stesso posto in cui si sarebbe dovuto trovare
il carrello. Sapevano di dover aggiungere (prodotti) a qualcosa e l'unica
cosa che sembrava aver un qualche senso era la slitta."
Lezione:
non cercate di essere originali e di utilizzare nuovi termini quando
abbiamo a disposizione parole adeguate che gli utenti già conoscono.
Menu
e pulsanti: microtesti per orientarsi e agire
I testi che compaiono
all'interno di menu (o barre di navigazione) e nei pulsanti hanno la caratteristica
di dover essere brevi e sintetici e per questo richiedono tecniche
di scrittura simili.
Le voci dei
menu hanno la funzione essenziale di indicare all'utente il tipo di contenuti
presenti in una pagina o in una sezione del sito. Poiché si tratta
di testi che hanno la funzione di aiutare l'utente a orientarsi nel sito,
è bene evitare titoli fantasiosi o eccessivamente originali, tentando
di rispettare il più possibile gli standard del Web.
Le decisioni
sulla struttura del sito, vale a dire le decisioni di information architecture,
vengono solitamente prese dal team di sviluppo web e non dal web writer. È
tuttavia importante che il web writer sia ben consapevole della struttura
delle informazioni quando effettua scelte sui testi che compariranno nei menu,
perché l'usabilità del sito e la reperibilità delle informazioni
risentiranno di queste scelte.
Alcune regole
essenziali da seguire nella scrittura delle voci di menu sono le seguenti:
- Utilizzare
terminologia standard. Alcuni esempi di voci di menu standard
sono: Contatti (Contact us), Home, Chi siamo (About us), Visita guidata
(Virtual Tour), FAQ, Guida (Help). - Evitare
termini stranieri a meno che non siano diventati standard. Sitemap
(Mappa del sito) è un termine piuttosto frequente ma non necessariamente
noto a tutti. Le voci "Mappa" o "Mappa del sito" possono
in questo caso essere più adeguati. - Scrivere
testi telegrafici, evitando, ove possibile, l'uso di articoli, congiunzioni,
ecc. Se è necessario aggiungere informazioni è possibile utilizzare
i tag TITLE o ALT. - Associare
il testo alla grafica: se sono presenti icone o immagini è bene
che il web writer le possa vedere prima di scegliere un determinato testo
per le singole voci di menu.
I testi nei
pulsanti indicano principalmente un'azione da compiere e vanno trattati
in modo simile ai testi presenti nei pulsanti dello normali interfacce utente
del software.
La funzione principale
di questi testi è di richiedere al server su cui la pagina è
ospitata di compiere una specifica azione (inviare un modulo, effettuare
una ricerca, aprire una pagina, ecc.). Per questo, seguendo lo standard adottato
nelle interfacce utente del software, è consigliabile utilizzare l'imperativo,
come se si comandasse alla macchina di effettuare una data operazione.
Pur rispettando
il principio della brevità e della sintesi, il web writer può
decidere, se necessario, di modificare i testi dei pulsanti, soprattutto per
ragioni di chiarezza:
- I pulsanti
per la gestione dei moduli sono solitamente caratterizzati dai testi
"Invia" e "Reimposta", ma è possibile modificare
questi testi se il contesto lo richiede. Il testo "Invia" potrà
ad esempio essere sostituito da "Invia la richiesta" o da "Richiedi
il preventivo" mentre il testo "Reimposta" potrà diventare
"Cancella le informazioni" o "Annulla". - I pulsanti
di ricerca sono spesso caratterizzati dalla scritta "Cerca"
ma è possibile scrivere testi più espliciti come "Cerca
nel sito" o "Cerca le informazioni". - I pulsanti
di avvio di un'operazione sono spesso lasciati in inglese ("Go")
ma non è ben chiaro per quale motivo non si possa optare per la traduzione
"Vai".
Link:
scrivere ipertesti usabili
I link ipertestuali
sono una parte importante dell'interfaccia utente del Web perché permettono
all'utente di prendere delle decisioni sul suo percorso di lettura, spostandosi
all'interno della pagina o da una pagina all'altra, in un sito o nel Web.
La parte testuale del link è fondamentale per garantire che
l'utente possa comprendere rapidamente quale tipo di informazioni troverà
nel momento in cui decide di seguire il link.
I link ipertestuali
sono fondamentalmente di due tipi:
- Link strutturali,
che permettono all'utente di muoversi all'interno delle informazioni contenute
in un sito, facilitando la navigazione. - Link associativi,
solitamente parole sottolineate che portano a pagine di approfondimento
del testo utilizzato per il link o a pagine dal contenuto simile o correlato.
Una scrittura
corretta dei testi presenti nei link strutturali e associativi, ossia la descrizione
dei link, permette di facilitare le scelte che l'utente compie, migliorando
in questo modo l'usabilità del sito. La descrizione del link è
la parte di testo sottolineata (o evidenziata in altro modo rispetto al testo)
sul quale l'utente può fare clic con il mouse per seguire il link.
Il web writer
deve scegliere descrizioni brevi, scegliendo poche parole (possibilmente
un massimo di quattro) che comunichino la maggior quantità di informazioni
all'utente, aiutandolo a decidere se seguire o meno il link:
- Evitate di
sottolineare (o evidenziare) le parole relative all'azione da compiere (es.
clicca qui, fate clic su questo link) perché il lettore sarà
costretto a leggere il testo circostante per prendere una decisione. Nielsen
ricorda anche che questo tipo di descrizione non è valido per per
chi utilizza un dispositivo diverso dal mouse (touch screen o browser vocali). - Scegliete
con attenzione le parole da sottolineare ma aggiungete, se necessario, un
testo esplicativo vicino al link. Questo accorgimento è particolarmente
utile quando si presenta una serie di link molto simili.
Quando si desidera
integrare la descrizione del link con informazioni supplementari si
può fare uso del tag TITLE che attiva la visualizzazione di
una finestrella che contiene il testo integrativo. I titoli dei link sono
un espediente semplice che può notevolmente migliorare l'usabilità
del link ipertestuale.
ESEMPIO:
Linee guida per i titoli dei link
(da Jakob Nielsen, Web Usability, 2001)
Le
informazioni appropriate da usare per il titolo di un link possono essere:
nome
del sito di destinazione (se è diverso dal sito attuale)
es.: prova il sito di AlfaBeta
nome
della sezione di destinazione (se ci si sposta in un'altra parte del
sito)
es.: leggi la Guida
dedicata all'usabilità di HTML.it
dettagli
aggiuntivi sul tipo di informazioni che troveremo sulla pagina di
destinazione, e il rapporto tra questa, il testo dell'ancora e il
contesto della pagina attuale
avvertimenti
su possibili problemi all'altro capo del link
es.: provate il dizionario
Eurodicautom
Nielsen raccomanda
di non utilizzare titoli di lunghezza superiore a 80 caratteri, e di mantenersi
quando possibile sotto i 60 caratteri. Un'altra raccomandazione è quella
di utilizzare il tag TITLE solo quando il testo del link e il contesto non
sono sufficienti e di non riprodurre nel titolo lo stesso testo del link.
Scrivere
l'interfaccia: consigli in breve
- Applicate,
quando necessario, la legge sull'esperienza dell'utente web di Nielsen:
nell'interfaccia testuale utilizzate terminologia standard se ciò
migliora l'usabilità del sito - Evitate
l'uso di termini stranieri nei menu e nei pulsanti, a meno che non
siano diventati termini standard - Se necessario,
modificate il testo standard dei pulsanti se questo può aiutare
l'utente a capirne l'uso - Scegliete
descrizioni brevi per i link ipertestuali. Evitate di sottolineare
le parole relative all'azione da compiere (es. Clicca qui) - Utilizzate
il tag TITLE per fornire, quando necessario, informazioni supplementari
sui link ipertestuali