Usabilità - Pagina 2 di 3 - TomStardust.com

Mouse, cursori ed usabilità

Consigli utili per migliorare l’esperienza di navigazione grazie al cursore del mouse.

Il mouse è uno degli strumenti più utilizzati per navigare le pagine web, ed il cursore del mouse è il principale indicatore a disposizione. Le forme che può assumere non sono casuali, e ad ognuna corrisponde un preciso significato.

Lavorando con i CSS, può capitare di cambiare stile al cursore del mouse in corrispondenza di determinate azioni, ma è sempre bene non esagerare. La creatività infatti è da apprezzare finché non va contro anni di consuetudini.

Un chiaro esempio di quanto sia importante il feedback offerto dal puntatore del mouse si ha sui link di una pagina, sia testuali che in altra forma: vedere apparire la classica mano al posto della freccia indica che l’oggetto in questione è proprio un link con cui è possibile interagire.

Cambiare questo comportamento non solo è sbagliato, ma può confondere gli utenti: è fondamentale evitare di modificare questo tipo di feedback.

Un altro esempio è quello dei campi input e delle textarea dei form. In questo caso il cursore cambia forma per indicare un diverso tipo di interazione, ed è bene che questo feedback sia sempre presente. Anche quando si utilizzano tecnologie diverse da HTML e CSS (vedi Flash), è necessario ricordarsi di tale comportamento per non disorientare l’utente.

Un caso in cui è sempre utile un intervento tramite CSS è quello dei tasti submit dei form. Il cursore infatti normalmente non cambia forma al mouseover. E’ un comportamento diffuso ed al quale siamo abituati, ma niente vieta di migliorare l’usabilità del proprio sito con una modifica semplice, aggiungendo cursor: pointer allo stile di tali elementi.

Sono piccoli accorgimenti che possono fare la differenza: anche se il mouse non è l’unico strumento utilizzato per navigare il web, è sicuramente il più diffuso. Il cursore è uno dei primi strumenti a disposizione per dare un feedback all’utente, sarebbe ingenuo non preoccuparsene.

Potete approfondire l’argomento leggendo anche Usability Post: Mouse Cursor Affordance.

La logica dell’iPad ed il computer del futuro

E’ arrivato il momento di dire addio a file e cartelle nei sistemi operativi?

Con il futuro iPad, Apple sembra aver fatto un altro passo avanti per dimenticare il file system e l’organizzazione dei documenti sul sistema operativo. In un articolo di maggio 2009 avevo fatto delle previsioni che si sono avverate dopo l’ultima presentazione di Steve Jobs, e ora sta diventando interessante scoprire le altre novità che iPad cela al suo interno.

Leggo infatti su AppleInsider grazie alla segnalazione di Folletto:

[..] iPad apps can now specify that their documents be shared wirelessly. With that configuration, the iPad will make available each apps’ documents, allowing the user to wirelessly mount their iPad via WiFi and simply drag and drop files back and forth between it and their desktop computer.

On the desktop system, the iPad will show up as a share containing a documents folder for each app that enables sharing. For example, a user with iWork apps will be able to wirelessly connect to their iPad as if it were a directly connected drive, and simply drag spreadsheet, presentation, or word processing files between their local system and the mobile device as desired.

Documents copied to the app’s shared folder will be graphically presented by the app when it launches, sparing users from having to figure out where to look for their document files and avoiding any need to sort through different kinds of documents. The document listing also presents each file as a large preview akin to Quick View on the Mac OS X desktop. [..]

In pratica l’iPad verrà visto come un drive esterno in cui poter copiare tutti i documenti: sarà compito di ogni applicazione riconoscere automaticamente quelli associati, permettendo di accedervi all’apertura.

Una soluzione del genere ha ovviamente dei limiti, ma è un ottimo compromesso visto lo scopo del dispositivo.

La giusta chiave di lettura del nuovo prodotto Apple viene illustrata benissimo anche in un post di Steven Frank, tradotto in italiano da Riccardo Mori sul suo blog.

Fino ad ora i computer ci hanno permesso di eseguire migliaia di compiti, a scapito di usabilità, stabilità ed efficienza. Il futuro invece potrebbe riservarci un panorama molto più semplice, che sarà il risultato di anni di miglioramenti progressivi nell’interfaccia uomo-macchina.

In questo scenario l’utente perde logicamente dell’autonomia, ma siamo sicuri che sia sempre positivo lasciargli tutta questa libertà?

La questione non è semplice, e la risposta non è univoca: per determinati compiti sarà comunque indispensabile avere il pieno controllo della piattaforma, ma questo vale solo per casi particolari. L’utente medio non vuole pensare agli aggiornamenti, ai backup ed ai virus: non è un caso che il discorso sia stato sollevato anche da Google parlando di Chrome OS.

Attraverseremo un periodo di transizione dove tutte queste tematiche saranno definite in maniera più chiara: ci saranno sicuramente progetti più riusciti ed altri meno, ma forse nei prossimi anni riusciremo ad interagire con strumenti molto più vicini a noi.

Google Chrome OS: nuovi scenari per l’usabilità dei sistemi operativi

Google si prepara a lanciare il suo sistema operativo web based: cosa aspettarsi?

Google Logo L’annuncio di Google ha fatto il giro della rete: nel 2010 vedremo la nascita di un nuovo sistema operativo, che prenderà il nome da Chrome.

C’era già il sospetto che il browser di Google potesse essere solo un primo passo per arrivare a qualcosa di più importante, ed infatti le previsioni si sono rivelate fondate. Per i dettagli vi rimando all’annuncio sul blog ufficiale, che ha un passaggio interessante:

People want to get to their email instantly, without wasting time waiting for their computers to boot and browsers to start up. They want their computers to always run as fast as when they first bought them. They want their data to be accessible to them wherever they are and not have to worry about losing their computer or forgetting to back up files. Even more importantly, they don’t want to spend hours configuring their computers to work with every new piece of hardware, or have to worry about constant software updates.

Sarà proprio l’usabilità del nuovo Google OS a decretarne l’eventuale successo, la stessa citata in questo estratto: gli utenti vogliono computer veloci, che non impieghino troppo tempo ad avviarsi, con la possibilità di accedere ai propri dati ovunque, senza bisogno di eseguire dei backup.

Un sistema operativo usabile

Queste caratteristiche saranno possibili solo se Chrome OS sarà un sistema operativo ridotto al minimo essenziale, con un cuore web based. Inevitabilmente tutto girerà intorno alle applicazioni web di Google: Gmail, Calendar, Docs, Reader, YouTube, Maps… l’elenco potrebbe continuare a lungo.

Se da un lato questa scelta porta dei vantaggi, in un paese come l’Italia dove la connessione non arriva ovunque ed il wi-fi è spesso una chimera per problemi burocratici, potrebbe esserci qualche problema di troppo. Non sono ostacoli insormontabili, ma è ovvio che lo scenario americano è ben diverso, e Google mira prima di tutto a quel mondo. La società di Mountain View ha già sviluppato un sistema operativo come Android, ma questo pur rimanendo open-source sarà un OS rivolto prima di tutto ai netbook, che solo successivamente potrebbe vedere una propria applicazione sui sistemi desktop. Per come è stato presentato lo vedo comunque un passo più lontano, perchè le esigenze dell’utente casalingo sono diverse da quelle di chi è in movimento.

Parlando anche di backup, sarebbe bello se con la nascita di Chrome Os venisse lanciato un servizio di storage online made in Google, magari efficiente come Dropbox ma con più spazio a disposizione. Non so però quanto un’ipotesi del genere possa essere verosimile: se Google avesse voluto aprire un servizio del genere l’avrebbe fatto già da tempo, considerando che Gmail mette già a disposizione diversi Gb.

A questo punto non resta che attendere entro fine anno il rilascio del codice del nuovo sistema operativo per saperne di più. Per noi consumatori l’entrata di un nuovo concorrente sul mercato può significare solo grandi vantaggi: se Chrome OS avrà successo, sarà dovuto al mantenimento delle promesse fatte da Google ed al supporto dei produttori di netbook.

Usabilità e User Experience

L’usabilità è solo uno dei fattori che contribuiscono ad una buona esperienza di navigazione.

Spesso si sente parlare di usabilità dei siti internet, ma le idee sulla definizione precisa si confondono e si sovrappongono, arrivando a spiegazioni anche molto diverse. In linea generale l’usabilità può essere definita come la facilità di interazione tra una persona e lo strumento che utilizza.

Riferendosi ad internet, il rapporto da considerare è quello tra un utente ed il sito che sta navigando.

Cos’è la User Experience?

Qualcuno potrebbe pensare che l’esperienza dell’utente (in inglese user experience o UX) sia la stessa cosa, ma in realtà non è così. L’usabilità è solo uno dei fattori che servono a raggiungere una buona user experience: sono poi da considerare accessibilità, architettura delle informazioni, user interface design ed interaction design.

L’esperienza dell’utente è il risultato della combinazione di tutti questi aspetti: riguarda emozioni, sensazioni e comportamenti, non solo l’efficienza con cui vengono raggiunti determinati obiettivi.

Buona Usabilità non significa sempre buona User Experience

Un sito usabile non assicura quindi sempre un riscontro positivo da parte degli utenti. Sicuramente aiuta, ma da sola l’usabilità non è sufficiente.

Pensate ad un blog con le categorie bene organizzate, titolo della pagina corrente ben in evidenza, menu e testi leggibili ed anche una ricerca funzionale. Sembrerebbe tutto perfetto, ma se i contenuti dei post fossero incompleti o avessero evidenti errori grammaticali?

I visitatori ricorderebbero molto più facilmente quest’ultimo aspetto, giudicando negativamente il sito senza altre possibilità di appello.

L’esperienza utente va oltre l’usabilità, perchè tiene anche conto di altri fattori:

Desiderabilità

Gli utenti devono avere un motivo per voler navigare il vostro sito. E’ bene che sia funzionale ed efficiente, ma deve essere in grado di offrire qualcosa di più per piacere. La chiave è invogliare i visitatori a tornare.

Credibilità

I testi sono attendibili? Questo aspetto vale per un blog come per un sito aziendale: i messaggi devono essere credibili, e questo ovviamente implica anche la correttezza grammaticale.

Personalità

La personalità di un sito è importante, soprattutto per quelli aziendali: il modo di rivolgersi al visitatore deve essere studiato senza improvvisare. In questo caso sono i dettagli che contano, dai messaggi di avviso alle etichette dei menu, passando per le indicazioni delle azioni da compiere.

Coerenza

Il messaggio trasmesso dal sito deve essere coerente in tutte le pagine. Il modo di rivolgersi al visitatore non può cambiare tra l’homepage ed una procedura di acquisto.

I vantaggi di una User Experience positiva

Ottenere un feedback positivo dai visitatori è fondamentale, e per farlo è sempre bene partire da un sito usabile ed accessibile. L’importante è ricordare come questo da solo non basti per raggiungere una buona user experience. L’utente soddisfatto, a cui piace interagire con il vostro sito, tornerà più spesso e vi porterà altre visite, cosa che non succederà con tutti coloro che avranno un’esperienza negativa.

Immagine: Paul Veugen

Nota: questo articolo è stato ispirato da Usability to the UX, su redant.co.uk.

Checklist per un sito usabile

Nove punti da seguire per migliorare il proprio sito.

Navigando in rete ho spesso la sensazione che l’usabilità sia spesso trascurata. E’ davvero inutile prestare attenzione all’esperienza dei propri visitatori? Ovviamente no.

Quelle che seguono sono indicazioni il più possibile generiche per migliorare l’usabilità del vostro sito. Non diventerà usabile semplicemente seguendo questi 9 punti, ma penso siano un buon punto di partenza.

1. Nome del sito

Il titolo del sito deve essere chiaro e visibile in ogni pagina, così come il logo (se esiste). E’ consuetudine inoltre che l’area occupata da questi elementi abbia un link alla homepage: è frustrante tentare di cliccare un elemento e scoprire che non porta da nessuna parte.

2. Tagline / Sottotitolo

La tagline è una breve frase che comunica velocemente lo scopo del sito che si sta visitando. Difficile farne a meno: che si tratti di un portfolio, di un blog o di un sito aziendale, è bene che il visitatore capisca subito l’argomento trattato.

3. Titolo della pagina

E’ essenziale che ogni pagina sia identificata in maniera univoca. Il titolo della pagina dovrebbe essere presente anche tra i tag <title></title>: questo permetterà di riconoscere un sito anche se sono aperte più finestre (o più tab) del browser.

4. Breadcrumb / Path / Briciole di pane

E’ il modo migliore per far capire ad un visitatore dove si trova. In italiano il breadcrumb viene chiamato anche “briciole di pane”, e la sua funzione è evidente. Se avete un sito su più livelli non potete farne a meno.

5. Navigazione principale

La navigazione deve essere chiara e coerente tra tutte le sezioni. Non cambiate mai posizione ad un menu, è bene che ogni visitatore sia in grado di orientarsi. Un’eccezione a questa regola è rappresentata dai menu secondari, che possono apparire o meno a seconda della pagina e della presenza di sottosezioni.

Nella navigazione è importante anche contrassegnare la pagina corrente, se presente nei menu, magari rendendola anche non cliccabile.

6. Box di Ricerca

Anche la ricerca è un metodo di navigazione. In certi casi è il modo più veloce per raggiungere informazioni presenti sul vostro sito, magari non più recenti. Se decidete di implementare la ricerca, fate in modo che il box sia visibile e presente in ogni pagina.

7. Link testuali

Uno dei problemi più fastidiosi è trovare in un sito dei link di testo che non appaiono come tali. Se i collegamenti si confondono con il testo normale, è il caso di modificarne l’aspetto. Trovate maggiori informazioni in un articolo sui link che ho scritto qualche settimana fa.

8. Colori e grafica

Così come per la navigazione, anche la grafica deve mantenere una sua coerenza tra le varie sezioni di un sito. E’ bene che i colori utilizzati non cambino tra le varie pagine per non confondere le idee. E’ possibile distinguere sezioni diverse con colori differenti, ma è una soluzione rischiosa se applicata male, spesso è meglio non rischiare.

9. Avvisi

Se sul sito compaiono degli avvisi, è bene che la loro funzione sia chiara. Possono essere contrassegnati da un’icona e da colori differenti, tenendo presenti alcune consuetudini:

il rosso indica un errore o un avviso importante
il verde una conferma
il giallo un avviso generico

E’ bene utilizzare delle notifiche di questo tipo quando vengono eseguite azioni importanti, come una procedura di acquisto. L’utente deve capire senza problemi quello che sta facendo e quali azioni può compiere.

In conclusione

Non è possibile imparare in poco tempo a realizzare un sito usabile, ma avere una checklist da controllare spero possa esservi utile. Tenete comunque presente che queste raccomandazioni non sono universali, potrebbero esserci delle eccezioni a seconda del sito.

Aggiornare l’interfaccia di un sito web

Rinnovare l’interfaccia di un sito spesso è un trauma per gli utenti abituali: meglio procedere per gradi?

Aggiornare l’interfaccia di un sito web spesso ha ripercussioni importanti sugli utenti abituali. Dopo un breve periodo di apprendimento è facile imparare la posizione degli elementi nelle pagine, per questo motivo qualsiasi cambiamento può essere problematico.

L’esempio più recente è quello di Facebook: ha stravolto l’homepage, e nonostante gli avvertimenti che anticipavano l’aggiornamento le critiche non si sono fatte attendere. Migliaia di utenti insoddisfatti della nuova interfaccia si sono fatti sentire, reclamando quella precedente.

Evoluzione continua

La soluzione in molti casi potrebbe essere semplice: invece di aggiornare tutto in una volta, meglio procedere per gradi, apportando modifiche minori. In questo modo gli utenti saranno capaci di abituarsi al cambiamento, anzi molti non noteranno nemmeno le nuove funzionalità finchè non le troveranno casualmente.

E’ la pratica adottata da molte applicazioni web in beta costante (qualcuno ha detto Gmail?), che non possono permettersi di rimanere statiche nel tempo. Grazie ai feedback degli utenti le modifiche arrivano gradualmente, correggendo problemi ed introducendo nuove funzionalità.

Il nuovo spaventa

Un altro aspetto da considerare è il “fattore novità”. Molti si lasciano facilmente spaventare dal nuovo, finendo magari per scoprire che non è così male dopo un normale periodo di apprendimento.

Per questo motivo le critiche vanno sempre valutate con attenzione, cercando di intuire il male minore. Se un’interfaccia ha realmente bisogno di essere aggiornata introducendo importanti cambiamenti, gli utenti se ne accorgeranno col tempo: l’importante è rendere la transazione meno traumatica possibile.

Se avete intenzione di aggiornare il vostro blog, o avete un sito destinato a cambiare look, una soluzione potrebbe quindi essere farlo per gradi. Mantenere degli elementi dell’interfaccia comuni tra le due versioni è una scelta saggia, in modo che i visitatori possano orientarsi facilmente.

L’usabilità dei link testuali

Una guida per la corretta formattazione dei link di testo, evitando soluzioni poco usabili.

I collegamenti testuali di una pagina sono un elemento basilare; capita spesso però che vengano sottovalutati dagli sviluppatori, dando per scontato la loro riconoscibilità.

Per avere dei link usabili in realtà basta seguire alcune semplici convenzioni: implementarle non richiede molto tempo, ma i vantaggi per i vostri utenti saranno evidenti.

Le convenzioni da seguire

In certi casi il rischio di confondere chi visita la pagina è alto: quante volte vi è capitato di provare a cliccare su un testo che in realtà non era un collegamento? Per evitare questi problemi, bisogna tenere presenti alcuni parametri:

Colore – Uno dei fattori principali per distinguere un link dal resto della pagina è il suo colore, differente da quello del contenuto. Attenzione però, perchè il colore da solo non è sufficiente: pensate ai problemi che potrebbe incontrare un utente daltonico.
Stile – Ci sono numerosi stili a disposizione, dalla sottolineatura al grassetto, passando per il tipo di font utilizzato. L’importante è che venga usato uno stile differente dal resto della pagina: la pratica comune vede i link sottolineati, ed è bene seguire questa convenzione.
Contrasto – Un link deve essere in evidenza, e non deve essere difficile da identificare. Cambiare il colore non basta, il contrasto deve essere elevato.
Comportamento – Tra le convenzioni più diffuse c’è quella del cambio di cursore al mouseover. Vedere il puntatore trasformarsi in una mano è indispensabile.

Tenendo presenti questi fattori, è possibile ottenere molteplici combinazioni usabili. Sperimentare è lecito, ma ricordate che innervosire i vostri utenti con dei link non riconoscibili, o ancora peggio dei testi normali che sembrano collegamenti, potrebbe causare la loro fuga. Non aspettatevi di ricevere segnalazioni nel caso ci siano problemi di questo tipo, il visitatore medio lascerà il vostro sito innervosito senza concedervi altre possibilità.

Qual è la pratica migliore?

Di default i collegamenti hanno la sottolineatura con text-decoration: underline, ed un colore blu facilmente riconoscibile.

Personalizzando questa impostazione, tenete presente che la sottolineatura è tuttora la pratica migliore e più diffusa. Se però non vi piace il risultato finale, potreste considerare di utilizzare un border-bottom al suo posto, come viene fatto su A List Apart. Il risultato può essere ulteriormente migliorato con 1 pixel di padding-bottom:

Un esempio dei link testuali di A List Apart

Un’altra pratica piuttosto diffusa, che utilizzavo su questo sito qualche tempo fa, sono i link in grassetto, senza sottolineatura. Il problema è che la distinguibilità dei collegamenti in questo caso dipende molto dal colore. Un esempio chiaro si ha su TechCrunch: guardando la pagina in bianco e nero grazie a GrayBit, i link non sono così evidenti come quelli sottolineati:

Un esempio dei collegamenti testuali su TechCrunch

Ovviamente le varianti possibili sono infinite, l’importante è essere sempre consapevoli di quello che si sta facendo.

Ricordate comunque che in certi casi l’originalità può essere messa da parte e riservata ad altri dettagli: dei link usabili e facilmente riconoscibili sono indispensabili per garantire ai vostri utenti la migliore esperienza di navigazione possibile.

Userfly: uno strumento per i test di usabilità

Test di usabilità accessibili a tutti con una nuova applicazione web.

Userfly Sembra si siano accorti in molti dell’importanza dei test di usabilità per il successo di un sito: dopo la nascita di un’applicazione desktop come Silverback, è arrivato il suo equivalente web-based, Userfly.

L’obiettivo di questo strumento è quello di fornire test di usabilità utilizzando utenti reali. Basta inserire una linea di JavaScript e le azioni dei vostri visitatori saranno monitorate praticamente in tempo reale.

Sul sito dell’applicazione infatti avrete accesso a dei veri e propri screencast, che vi consentiranno di seguire le azioni dei vostri utenti: movimenti del mouse, click, scrolling delle pagine ed interazioni di base con gli oggetti presenti.

Il test che ho effettuato è stato estremamente positivo: gli screencast sono stati generati quasi in tempo reale e fin da subito sono rimasto affascinato dalle potenzialità di questo strumento.

Qualche difetto c’è: le interazioni con oggetti AJAX, ad esempio, non vengono memorizzate. E’ anche possibile che nei momenti di particolare traffico alcuni utenti potrebbero non venire monitorati, ma considerando che è un tool nato da poco c’è tempo per vederlo crescere e migliorare.

E’ disponibile anche un video per vedere Userfly all’opera e capirne meglio il funzionamento:

Per chi avesse delle riserve dal punto di vista della privacy, c’è da notare che strumenti simili esistono da tempo. Basti pensare a CrazyEgg, ma in realtà Userfly è assimilabile a tutti gli altri tool capaci di tracciare le azioni degli utenti, a partire da Google Analytics.

Se avete un sito vi consiglio di provarlo: al momento della registrazione vi verranno dati i crediti necessari alla registrazione di 10 screencast. Successivamente, potrete registrare le azioni dei vostri utenti pagandole 0,05$ l’una, una cifra decisamente accettabile considerando la facilità e l’immediatezza dello strumento.

Aggiornamento del 13 Febbraio 2009: vi segnalo anche una promozione in corso legata a Twitter. Se vi registrate ad Userfly (o siete già utenti) e lo segnalate ai vostri followers su Twitter, riceverete gratuitamente altri 5 crediti.

Guida per una navigazione usabile

Una guida completa per organizzare la navigazione di un sito, evitando gli errori più comuni.

Realizzare un sito usabile è un obbligo per ogni web designer professionista. Spesso però non viene riservata sufficente attenzione alla navigazione, dimenticando che un visitatore non tornerà mai su un sito dove non è capace di trovare ciò che cerca.

A questo proposito mi sono permesso di prendere spunto e reinterpretare un interessante post di ifohdesigns, per approfondire la questione suddividendola per argomenti.

Vincoli

Prima ancora di affrontare l’organizzazione della navigazione, è bene analizzare i vincoli presenti. Inutile pensare ad una soluzione se questa non è praticabile, ogni modello deve essere costruito in base al sito.

I limiti più evidenti, che spesso impediscono di seguire una scelta piuttosto che un’altra, sono:

il numero di pagine del sito
la gerarchia delle pagine e la struttura generale
lo stile grafico ed il layout

Consigli e divieti

Per migliorare la navigazione di un sito, è fondamentale non incorrere in gravi problemi di accessibilità ed usabilità. Alcune regole sono ovvie, ma non è mai scontato ricordarle:

non usare Flash per i menu
utilizzare JavaScript solo se i menu restano accessibili anche senza script abilitati
se usate delle immagini, fatelo tramite CSS con una tecnica di image replacement, senza inserirle direttamente nel codice html
cambiando le immagini di sfondo con i CSS, create degli sprite per evitare fastidiosi ritardi al caricamento

Posizione dei menu

I menu di navigazione possono essere posizionati in maniera più o meno originale, ma le collocazioni standard sono tre. Ci possono essere altre soluzioni, ma è meglio non esagerare con la fantasia:

menu orizzontale sotto l’header, se non ci sono troppe voci
menu orizzontale sopra l’header, per link secondari
menu verticale, solitamente a sinistra, facendo attenzione che le voci importanti siano visibili a colpo d’occhio e non scendano oltre i 600-700 pixel

Coerenza

La navigazione dovrebbe essere coerente su tutte le pagine del sito. Una volta decisa la struttura, è fondamentale non cambiare la posizione dei menu o modificarne l’aspetto a seconda della pagina, perchè il visitatore potrebbe rimanere disorientato.

A volte capita di trovare siti con sezioni dove manca la navigazione, con un semplice link “torna alla homepage”. Una soluzione simile non è sufficiente.

Attributi title

E’ importante non dimenticare di fornire maggiori informazioni sui link tramite gli attributi title dell’HTML. Alcune pagine possono avere nomi convenzionali e autoesplicativi, ma è sempre meglio semplificare la vita dell’utente.

Inoltre usare dei title coerenti può favorire una corretta indicizzazione sui motori di ricerca, rendendo anche il sito più accessibile.

Gerarchia

Se un sito contiene numerose pagine, non è mai conveniente metterle tutte sullo stesso livello. Meglio organizzarle in gruppi, suddividendo la navigazione per facilitare la comprensione.

A volte potrebbe bastare raccoglierle in un menu secondario, da mostrare solo quando necessario.

Breadcrumb (Briciole di pane)

Se il sito è complesso, è essenziale avere sempre visibile il percorso della pagina corrente. In certi casi può essere utile visualizzare il path anche su un blog, se esistono molte pagine distribuite su più livelli.

Come si può intuire dal nome, le briciole di pane aiutano l’utente a ritrovare la strada, capire quali pagine ha visitato e decidere quali visitare successivamente.

Footer

Fino a qualche anno fa era considerato un elemento di scarsa importanza, finchè non hanno iniziato ad apparire footer alti, ricchi di link. E’ un modo per permettere all’utente di continuare la visita del sito una volta arrivato a fine pagina.

Il footer non è ovviamente da utilizzare per la navigazione principale, ma non va sottovalutato.

Conclusioni

Organizzare la navigazione non è cosa semplice. Le variabili da considerare sono numerose e non tutte facili da gestire, soprattutto su siti con una struttura complessa.

La cosa più importante è curarsi di tutti gli aspetti, tenendo presente il target di utenti, la coerenza dei menu di navigazione e l’accessibilità degli stessi. Un menu in flash per quanto possa essere attraente impedirà a tutti i visitatori senza plugin di visitare le vostre pagine.

Se ne avete la possibilità fate dei test di usabilità, anche con parenti o amici: scoprirete cose impensabili. Con un minimo di buon senso potrete ottenere ottimi risultati.

L’icona per il salvataggio dei file deve cambiare?

Una riflessione sul design di interfacce e sull’icona del floppy disk, utilizzata per indicare il salvataggio.

L’attività di Interface Design è spesso trascurata, ma è uno dei passi essenziali da affrontare nella realizzazione di software e applicazioni web. Negli ultimi anni i software web-based hanno acquisito grande importanza, tanto da far presagire una sempre più solida integrazione tra desktop e internet.

Tra tutte le convenzioni utilizzate però, una sta ormai diventando obsoleta: quella del floppy disk per indicare il salvataggio di un documento. In questi giorni Positive Space ha sollevato la questione, affermando che è ormai ora di trovare una nuova soluzione: i dischi floppy stanno sparendo, e le nuove generazioni di utenti non avranno modo di capire a cosa faccia riferimento l’icona.

Premettendo che trovare una soluzione soddisfacente non è cosa facile, la stessa decisione di sostituire il floppy non è scontata. L’icona del salvataggio è ormai diventata un concetto astratto, al di là del significato materiale dell’oggetto rappresentato. La convenzione floppy = salva è ben radicata, e sostituirla con un altro tipo di supporto porterebbe ad affrontare lo stesso problema tra una decina di anni.

Voi cosa ne pensate? Avete delle proposte per cambiarla o preferireste mantenerla?

Ho fatto una ricerca su diversi set di icone esistenti, e spesso l’icona del salvataggio è assente, probabilmente perchè per le pagine web il download è più che sufficiente. Tutti i set che la possiedono però non osano utilizzare una simbologia differente, proprio ad indicare quanto sia forte l’attuale convenzione.

Nell’immagine è possibile vedere alcuni degli esempi che ho trovato, direttamente dai set di icone Milky, Oxygen, Function, Fugue e Diagona.

Se è vero che il floppy ormai è un oggetto obsoleto, cambiare l’icona di salvataggio non è detto che sia una scelta saggia nel design di un’interfaccia. Dite la vostra nei commenti, nuove proposte sono benvenute: la discussione può servire anche a rendersi conto se davvero esista un’alternativa valida.