Il design della home page

Questa è la traduzione dell’articolo Home Page Design di Daniel Szuc, pubblicato originariamente su UXmatters il 6 Agosto 2007. La traduzione viene qui presentata con il consenso dell’editore (UXmatters) e dell’autore.

È il momento di rinnovare il design della home page di un’azienda. Ci sono tante persone all’interno dell’azienda coinvolte nel design della home page ed ognuna di esse vuole un pezzo per sé. Esistono delle domande che si possono porre ai vari soggetti prima di approcciare il design della pagina iniziale, in modo da spostare la possibile volontà di ogni singolo individuo verso una visione globale e comune? Ci sono dei consigli per progettare una home page? Questo articolo ha lo scopo di aiutarvi a comprendere meglio come avvicinarvi al design di una home page.

Il valore della porta principale

Qual è il valore della porta principale di un’azienda? Per alcune società è il loro volto sul mondo. Guardando la porta principale della figura 1:

– Qual è la vostra prima impressione?

– Quale tipo di attività pensate che sia?

– Cosa pensate di poter fare una volta passati attraverso i cancelli?

Figura 1 – Luna Park, un parco di divertimenti a Melbourne

Per altre aziende è un logo come quello mostrato in figura 2:

– Che tipo di attività sarà?

– Manca qualche contenuto a questo segnale?

– Quale impressione avete mentre guardate il logo?

Figura 2 – J.J Express, un ristorante take-away a Melbourne

La pagina più importante (ma lo è davvero?)

Molto spesso, sia il cliente che l’azienda in sé comprendono come la home page sia la pagina più importante dell’intero sito web. È il luogo adatto in cui presentare le informazioni più importanti riguardo a prodotti, servizi ed offerte speciali; ai contatti; alle specifiche istruzioni – dando al cliente accesso diretto a ciò di cui ha bisogno. In questo modo, i clienti possono servirsi da soli attraverso la home page.

“Le home page sono il bene più prezioso del mondo… L’impatto della pagina principale è molto più grande sull’utile di un’azienda rispetto a semplici misure sulla rendita proveniente da e-commerce. La home page è il volto che l’azienda mostra al mondo… La home page è la pagina più importante sulla maggior parte dei siti internet ed ottiene maggiori visualizzazioni di qualsiasi altra pagina”. – Jakob Nielsen

Per molti utenti la home page è quel posto dove ricominciare il proprio cammino, una volta che si è persa la strada. Spesso molte persone vogliono tornare alla home page di un sito per potersi orientare. Questo lo possiamo notare durante i test di usabilità. Per un’azienda, la home page offre l’opportunità di comunicare il suo valore al mondo – specialmente quando si relaziona con i suoi prodotti e servizi. Per tale motivo, idealmente, la home page dovrebbe riuscire a riflettere e bilanciare gli obbiettivi dell’azienda e le necessità degli utenti.

E le altre landing page?

Nel suo articolo “Il design della home page è ancora importante?” Jared Spool della UIE mostra come tanti utenti stanno iniziando ad evitare la home page, andando direttamente a visualizzare la pagina che soddisfa le loro necessità. Così, è importante che tutte le pagine di maggiore attenzione si comportino in maniera analoga alla home page. Sempre secondo Spool:

“Un numero sempre maggiore di siti… vedono un gran numero di utenti evitare la home page, andando direttamente ai contenuti. Come risultato, queste pagine di arrivo – le prime pagine con cui viene a contatto l’utente – hanno bisogno di possedere le stesse funzioni della vostra home page. Ciò risulta molto più semplice di quanto possano pensare molti designer, per lo più perché generalmente non capiscono realmente le vere funzioni della home page.”

“Analizzando gli utenti che visitano un sito, abbiamo imparato molto tempo fa che esistono soltanto due funzioni fondamentali per una home page:

• La home page fornisce agli utenti il contenuto cercato – così come la top story, la notizia in primo piano su CNN – oppure
• La home page fornisce un forte aroma a quelle pagine che contengono il contenuto ricercato dagli utenti.

“Questi sono gli unici due elementi che interessano all’utente quando guarda la home page. (Molti designer cercano di creare pagine che svolgano plurime funzioni, come spiegare all’utente certi principi di cui si occupa l’organizzazione, ma l’utente non si cura di tutti questi elementi – come le notizie finanziarie dell’azienda oppure i nuovi prodotti in vendita. Noi riteniamo che sia tutto uno spreco di preziose risorse del design). Quando i designer si concentrano soltanto su questi due elementi nella pagina principale, gli utenti stessi ci spiegano come il sito diventa sostanzialmente più usabile.”

Combattere per il bene più prezioso, lo spazio

L’elemento predominante, che abbiamo potuto notare nei progetti che includono il design o re-design di una home page, sono i vari dipartimenti aziendali in lotta per ottenere un migliore profilo oppure un migliore posizionamento nella pagina. Tutti quanti vogliono una cospicua fetta dello spazio sulla home page per poter ottenere con facilità l’attenzione del consumatore. Spesso, la persona che all’interno di un’azienda urla più di tutti gli altri, che magari ha un atteggiamento critico nella compagnia oppure si immagina le campagne marketing, sarà colui che otterrà i risultati nella battaglia per lo spazio sulla home page.

Cosa vogliono i clienti?

Quando i clienti visitano la vostra home page, la loro attenzione è limitata. Spesso è una persona impegnata e cerca soltanto delle risposte in breve tempo. Non ha bisogno di distrazioni inutili e, quando le trova, lascia immediatamente il sito visitato alla ricerca di un altro dove poter trovare ciò di cui ha bisogno. Sicuramente non ha voglia di navigare in un groviglio di messaggi di marketing.

Quando un cliente arriva sulla vostra home page, si aspetta di trovare ciò che cerca in maniera rapida. Dopo tutto, la promessa del web è quella di fornire un canale efficiente ed alternativo in grado di essere complementare ad altri canali come i negozi oppure il supporto fisico dell’azienda ad un cliente.

Quando un utente visita una home page – che sia la prima volta oppure si tratti di un frequentatore abituale – potrebbe cercare:

– di soddisfare velocemente la necessità di informazioni;

– di trovare informazioni sui contatti come un numero di telefono oppure un indirizzo e-mail;

– di completare una scheda in modo autonomo, senza richiedere l’aiuto di un supporto;

– di risolvere un problema;

– di comprare un prodotto.

Cosa vuole l’azienda?

L’azienda ha anch’essa bisogni che deve soddisfare:

– vendere prodotti;

– accrescere il numero di transazioni favorevoli;

– ridurre le spese – spostando la rete di vendita da altri canali al web;

– pubblicare notizie o risultati finanziari sulla società.

Alcune volte le necessità dell’azienda e dei suoi clienti non coincidono.

Priorità nei contenuti

La sfida è: A quali contenuti una società dovrebbe dare il maggiore spazio sulla sua home page? Spesso alcuni elementi all’interno di un’organizzazione vogliono porre il contenuto principale nella home page, per poter dimostrare il loro valore, senza rendersi effettivamente conto delle necessità della società, dei benefici per l’utente, dei ritorni sugli investimenti (ROI) attraverso il canale web.

Quando cercate di definire le strategie che si riferiscono ai contenuti e al design per la home page della vostra compagnia, ponetevi le seguenti domande:

• Chi sono i vostri clienti?
• Come utilizzano correntemente i clienti la vostra home page?
• Quali compiti cercano di completare i vostri clienti quando visitano la home page?
• Quali contenuti cercano i vostri clienti attraverso la home page?
• Come fare per aiutare un cliente a trovare le informazioni che gli servono attraverso la vostra home page?
• Quali sono gli elementi strategici della vostra home page?
• Cosa volete vendere attraverso la vostra home page?
• Quali sono gli obbiettivi della vostra azienda?
• Come si relazionano i vostri obbiettivi con le funzioni svolte dalla home page?
• Come misura l’azienda il successo della home page?
• Cosa state dicendo ora della vostra home page?
• Cosa stanno facendo i vostri concorrenti e come potete rinnovarvi?
• Come comunica il design della home page con i vostri clienti?
• Dove vanno i clienti dopo aver visto la home page?
• Quali termini di ricerca utilizzano i clienti?

Un test in 5 secondi per la vostra Home Page

Nel suo articolo “5-Second Tests: Measuring Your Site’s Content Pages”, Christine Perfetti dell’UIE ha scritto:

“Come suggerisce il nome stesso, il Test in 5 secondi ha lo scopo di mostrare agli utenti una singola pagina di contenuti per 5 rapidi secondi al fine di raccogliere le loro prime impressioni. Cinque secondi potrebbero sembrare un tempo limitato, ma in realtà gli utenti fanno delle importanti considerazioni nei primi momenti in cui visitano una pagina. Questa tecnica svela come si producono quei giudizi, dando al gruppo una visione su certe informazioni essenziali della pagina…”

“Come spesso facciamo in altri test sulla usabilità, iniziamo con il dare agli utenti un compito preciso. Successivamente, prima di mostrare la nostra pagina, informiamo l’utente che potrà visualizzarla soltanto per 5 secondi. Gli chiediamo di provare a ricordare tutto ciò che vede nel breve periodo di tempo. Una volta che la persona visualizza l’intera pagina per i 5 secondi, togliamo l’immagine, coprendola oppure cambiando pagina. Infine gli chiediamo di scrivere tutto ciò che ricorda della pagina. Una volta terminata la richiesta, gli poniamo domande per valutare se gli utenti hanno portato a termine il compito.”

Quando abbiamo applicato l’idea di un test di 5 secondi alle home page, abbiamo domandato ad alcuni soggetti le seguenti domande:

Qual’è il prodotto principale dell’azienda? – La risposta vi permette di capire se la struttura del design sostiene le direttive aziendali della società. Per esempio, riesce ad evocare l’immagine aziendale? – che può essere seria, divertente, utile o così via?

Cosa cattura la vostra attenzione? Quali elementi sulla home page fanno colpo sul vostro occhio? – La risposta ci dice se questi sono gli elementi verso i quali volete che l’utente porga attenzione. Questi elementi di interesse contribuiscono a muovere il cliente su sentieri da cui la società trae un beneficio?

Cosa pensate di poter fare sulla home page? – La risposta vi aiuta a capire se sostenete in maniera ottimale i compiti sui quali si focalizza il cliente.

Possiamo fare un test a differenti home page in modo da capire se gli utenti riconoscono dei modelli di design, domandando:

Esistono alcuni elementi comuni che avete visto nelle home page che vi abbiamo mostrato? Una volta che l’utente ha avuto il tempo di guardare i vari design, abbiamo documentato dei risultati che possiamo transformare in miglioramenti per il design e per la società.

Fine prima parte.

Questioni di usabilità

Chiarimenti sull’usabilità possono aiutare a comprendere il design della home page. Proviamo ad analizzare diversi esempi di home page, pensando a come rispondere alle seguenti domande:

• Di cosa si occupa principalmente la società?
• Cosa cattura la vostra attenzione?
• Cosa pensate di poter fare?

Potete completare questi passaggi velocemente, ma è importante assicurarsi di coinvolgere le giuste persone nel contesto dell’azienda.

Da notare che nelle mie osservazioni riguardo ad ognuno degli esempi di design, ho provato ad indicare quale scelta di design era più consona per gli utenti, per la società oppure per entrambi. Molti sono adatti ad entrambi e questa è un’ottima cosa!

Flickr

Ecco le mie osservazioni riguardo alla home page di Flickr, come appare nella figura3:

La foto a sinistra presenta una grande evidenza, indicando come questo sito potrebbe avere a che fare con le foto. (Positivo per l’utente; positivo per la società).

È presente un messaggio chiaro su quale sia il cardine del servizio Flickr: condividere le proprie foto. (Positivo per l’utente; positivo per la società).

La posizione standard per la registrazione, nell’angolo in alto a destra, è utile per gli utenti che ritornano. (Positivo per l’utente; positivo per la società).

Il pulsante “Crea il tuo Account” fornisce un chiaro invito a compiere l’azione. (Positivo per la società).

Gli utenti di ritorno possono cercare delle foto specifiche. (Positivo per l’utente; positivo per la società).

Seguendo un trend emergente, il logo della società si trova nella tipica posizione in alto a sinistra. (Positivo per la società).

Figura 3 – Home page di Flickr

Blogger

Sulla home page di Blogger, come mostrato in figura 4, ho potuto fare le seguenti osservazioni:

La parola chiave “Crea il tuo Blog” esorta a compiere un’azione. (Positivo per la società).

È presente una descrizione di cos’è un blog, per le persone che non ne sono a conoscenza. (Positivo per l’utente).

Il posizionamento classico per Accedi, in alto a destra, è molto utile per gli utenti che vogliono tornare. (Positivo per l’utente; positivo per la società).

Seguendo un trend emergente, il logo della società si trova nella tipica posizione in alto a sinistra. (Positivo per la società).

Figura 4 – Home page di Blogger

Cityline

Di seguito le mie osservazioni sulla home page di Cityline, presente nella figura 5:

Nella barra di navigazione primaria, posta in alto alla pagina, l’utente può trovare i film sotto Movies oppure Cinemas. (Positivo per l’utente; positivo per la società).

Il pulsante Compra esorta a compiere un’azione. (Positivo per la società).

Seguendo un trend emergente, il logo della società si trova nella tipica posizione in alto a sinistra. (Positivo per la società).

Figura 5 – Home page di Cityline

Provate a testare voi stessi l’usabilità

Provate a fare una valutazione dell’usabilità da voi, su una home page oppure qualsiasi pagina da una chiave di ricerca di vostra scelta. Quanto aiuta la home page a trovare velocemente ciò che serve all’utente e come va incontro agli obbiettivi preposti dalla società?

Million-Dollar Home Page

Come ha scritto Christine Perfetti sul blog di UIE “Brain Sparks”, “la Million Dollar Homepage è un sito innovativo, creato dallo studente universitario Alex Tew per aiutarsi a pagare le spese dell’educazione universitaria. Il piano aziendale di Alex consisteva nel vendere tutti i pixel (un milione) visualizzati sulla sua home page, con un costo di $1 per pixel. Il suo esperimento si è rivelato un enorme successo – in quanto Alex è riuscito a vendere tutti gli spazi”. La figura 6 mostra la pagina The Million Dollar Homepage.

Figura 6 – Million Dollar Home Page

Non tutte le società riescono ad avere una home page da un milione di dollari, però iniziando con queste semplici domande potete ottenere maggiore chiarezza e una migliore visione di come dovrebbe essere la vostra home page – ora e nel futuro.

• Qual’è lo scopo principale della home page?
• Come potranno il contenuto della home page e i compiti che si propone aiutare l’utente?
• Come potranno questi contenuti e questi elementi portare benefici alla società?
• La vostra home page dovrebbe fornire accesso libero alle informazioni, così che gli utenti possano essere relativamente indipendenti nella risoluzione di problemi e domande di base.

Spunti per il design di una home page

Per creare design di successo per la home page:

• scoprite quali sono gli elementi di priorità per l’utente;
• fornite buona visibilità agli elementi di priorità;
• usate un lessico adatto all’utente, non un linguaggio interno alla società;
• sulla barra di navigazione primaria, presentate elementi di interesse per il cliente, poi ponete dei link per le informazioni riguardanti la società verso la fine della barra di navigazione;
• fornite un facile accesso alla home page sulla barra di navigazione primaria, utilizzando la dicitura “Home”;
• i contenuti critici dovrebbero essere sopra il fold della home page;
• differenziate chiaramente i widget dai contenuti – per esempio, pulsanti, sezioni chiavi e via dicendo;
• non utilizzate le finestre pop-up;
• non disponete pagine con intro in Flash prima di far accedere gli utenti alla home page;
• mostrate data e ora in cui la home page è stata aggiornata ultimamente.

Traduzione a cura di Nicole Brioschi.