La home page è la pagina più importante del vostro sito, perché è quella più visitata. Vi arrivano sia i visitatori nuovi che quelli ripetuti. Deve dunque assolvere alle seguenti funzioni:
- Spiegare chi siete e cosa fate
- Mostrare le novità più importanti
- Consentire agli utenti di andare nelle pagine o nelle sezioni di loro interesse
Spiegare chi siete e cosa fate
Questa funzione viene di solito assolta dal logo o dal titolo del sito. Poiché non sempre il logo dice tutto, è buona norma utilizzare anche qualche altra riga di testo. In particolare, si usa una riga che accompagna il logo, chiamata “tagline”, di solito posta a fianco o subito sotto il logo. Dall’insieme di titolo/logo e tagline anche l’utente meno avvertito dovrebbe capire chi siete (e magari cosa fate). Ecco alcuni esempi:
Spesso però è chiaro che due semplici righe di testo non bastano a spiegare tutto. In realtà è l’insieme delle voci di testo e delle immagini presenti nella pagina a dare gli indizi sulla vostra attività. Scegliete perciò con cura le vostre etichette verbali
Considerate questa pagina
E confrontatela ora con questa:
Nel primo caso si capisce subito di che si tratta. Nel secondo assolutamente no.
Le scelte di comunicazione della vostra identità e della vostra attività sulla home page possono variare a seconda degli obiettivi che vi ponete. Considerate per esempio queste due pagine:
Es.
Perché il logo non ha nemmeno una scritta e non c‘è la tagline? Già, perché i marchi sono estremamente riconoscibili. Senza contare che omettere di dire il vostro nome è un vezzo, un ammiccamento che vi fa sentire “eletti”, se lo conoscete. Fa tribù. Ma se la stessa scelta di non spiegare molto la fa questo sito, come la mettiamo?
Es.
Certo, non pare ugualmente efficace. Infatti questo marchio non è famoso, non può contare su un pubblico generale di conoscitori. Non vi sono campagne su altri media che rendano il marchio riconoscibile.
Ecco perché le vostre scelte comunicative su identità e attività devono dipendere anche da una realistica valutazione della vostra notorietà. Provate a testare i seguenti indirizzi, e valutate quali sono gli elementi che consentono di definire identità e attività
E i blog?
Tutti i blog-engine (i CMS che gestiscono i contenuti) offrono la possibilità di inserire un nome e una tagline. Alcuni blog hanno il nome del loro autore, altri no. In quest’ultimo caso sarebbe bene mettere il nome dell’autore nella tagline, ma naturalmente dipende da alcune cose: se volete mantenere un certo anonimato, o comunque non mettere in evidenza la natura unipersonale del sito, allora è possibile che vogliate nascondere il vostro nome. Non aspettatevi che la comunicazione sia chiara: ma forse non lo volete (chiedetevi cosa vi aspettate dal vostro blog, in ogni caso).
Potrebbe essere che invece siate particolarmente egocentrici e che il vostro nome sia ripetuto nell’URL, nel titolo e magari anche nella tagline.
In alternativa, una scelta spesso praticata dai blog è quella di inserire una pagina specifica chiamata “chi sono”, o “info” o “profilo”. Altre volte una pagina su chi sia l’autore è del tutto assente.
Blog aziendali
Se tutte le scelte sono legittime (qualunque siano le conseguenze) su blog che non hanno obiettivi particolari, quali possono essere invece le conseguenze su blog aziendali? I blog aziendali vengono usati per mantenere aperto un canale con clienti e appassionati. In quel caso è bene che l’autore o il gruppo di autori sia chiaramente identificabile, ne va della credibilità dell’iniziativa stessa.
Personaggi fittizi
E’ evidente comunque che i blog possono essere scritti da chiunque. Possono essere visti anche come generi letterari a sé stanti: si può fingere di essere un altro e narrare un diario fittizio. In quel caso è evidente che lo scopo non è dire chi siamo, ma attivare un’operazione letteraria, di fiction. E’ il contenuto ad essere in primo piano. Tuttavia, anche in questo caso creare il personaggio (finto) che parla dà spessore al contenuto.
In generale, l’identità dell’autore dovrebbe essere ripetuta in calce ad ogni articolo o post di un blog, per facilitarne l’attribuzione e aumentare la fiducia nel contenuto: se qualcuno lo firma, ne risponde. Altrimenti potrebbe darsi che sia un contenuto “markettaro”, di cui intimamente si vergogna pure l’autore!
Web 2.0: spiegare l’ignoto
I siti del cosiddetto web 2.0 hanno introdotto una relativa novità al modello classico basato sulla testata (logo + tagline) per spiegare chi sono e cosa fanno. Hanno riservato un’are prominente nella home page, solitamente subito sotto la testata e a centropagina, per introdurre quello che fanno.
Perché? Perché propongono tutte servizi innovativi, dei quali gli utenti non hanno precedenti esempi. E’ necessario introdursi, spiegarsi. I visitatori ripetuti possono saltare quella parte (di fatto non ci andranno spesso, perché una volta iscritti all’applicazione andranno in una specifica pagina per utilizzarla, una dashboard, o quadro comandi dell’applicazione). Ma l’obiettivo è attirare sempre nuovi visitatori, dunque è perfettamente sensato dedicare uno spazio importante nella pagina a presentarsi.
Non tutti i servizi online hanno capito l’importanza di una buona presentazione di sé fin dalla home page. Si confronti questi siti:
Con questi: riuscite a dire a prima vista cosa sono?
Errori di comunicazione simili vengono compiuti anche da siti aziendali tradizionali. Forse non hanno chiaro cosa sia un sito web: ma un sito che non presenti subito l’azienda parte con il piede sbagliato.
Mettere in evidenza le novità
Le novità sono tipi di informazione diversa a seconda del sito. Un ente pubblico può dover pubblicare note stampa, documenti appartenenti a sezioni diverse, bandi. La segnalazione delle novità in home page deve dunque essere attentamente progettata: vi deve essere una porzione della pagina chiaramente dedicata a questa funzione. Se vi sono più tipologie di informazioni relativamente indipendenti, possono essere progettate più parti della pagina da dedicare a segnalare novità differenti.
L’abitudine ai blog ha un po’ mortificato la progettazione delle home page, anche se ha, in effetti, valorizzato le novità in due modi:
- Assegnando sempre all’informazione più recente la posizione più prominente in home page
- Assegnando ad ogni informazione un permalink
Prima, le news venivano relegate ad aree marginali della pagina (colonne, o addirittura in fondo alla pagina). Ora è assai più raro trovare questo errore, per effetto più dell’uso dei CMS e dei template già pronti che di una progettazione. Tuttavia la struttura a blog, con i post più recenti in cima, per intero, ha due problemi:
- Può occupare troppo spazio. In un sito personale va bene, ma un sito pubblico o un sito aziendale ha molte cose diverse da dire, e occupare l’intera home page con un unico post non è una buona idea
- Unifica tutto: non c‘è più distinzione fra tipologie di contenuti, è tutto un “post”. Con il risultato che anche la progettazione degli argomenti (le categorie, diciamo…) e delle pagine è carente.
In generale, dovete riservare nella home page lo spazio strategico alla segnalazione delle novità. Anche dividendo la pagina in più aree. Un esempio semplice ma significativo è il sito che ho realizzato per i Nidi Intercomunali isontini. La home page ha due distinte aree di aggiornamento: una per le news generiche (chiamata bacheca per usare un linguaggio più vicino ad utenti non esperti del web) e una per i documenti da scaricare. Sia le news che i documenti hanno una propria sezione, ma, siccome sono entrambi importanti, è stato ricavato uno spazio above the folder, sopra la piega, per entrambi, in modo da non confonderli.
Si poteva usare una colonna unica e unificare news e documenti? Sì, ma hanno un formato differente. E’ più logico e ordinato fare così.
Altri siti (più complessi) usano più aree della pagina per segnalare le novità. Ovviamente, queste esigenze hanno impatto su quanto si può presentare di ogni notizia: non c‘è posto per tutto.
Ma in quale formato conviene presentare le novità?
Il formato delle news
Abbiamo fondamentalmente tre opzioni per segnalare le news in home page, più varianti:
- Solo il titolo della news
- Il titolo e qualche riga di riassunto
- Il titolo e l’intero contenuto
Figure:
Sono stati fatti degli esperimenti, ed è emerso che il formato più conveniente (per quanto riguarda la capacità di trovare le informazioni e il tempo speso) è quello intermedio: titolo e riassunto. E’ in effetti la maniera più semplice per scorrere molte informazioni diverse e trovare quella che ci interessa. Dove possibile, è bene usare questo formato. Ecco alcuni esempi:
Tuttavia spesso il sito o non ha molto contenuto da giustificare questo formato, o ha troppe informazioni, da obbligare a usare il formato con il solo titolo linkato alla notizia. In tal caso è particolarmente importante curare le parole scelte per il titolo, perché dovranno essere particolarmente chiare e significative, come un piccolo sommario che faccia capire cosa c‘è dietro.
Andare altrove
Le stesse news non complete sono strade possibili da seguire per il lettore. Ma naturalmente è importante offrire anche un quadro più stabile di dove andare. Di solito lo si fa attraverso dei menu che tematizzano (organizzano per temi e argomenti) l’intero vostro contenuto. In questo modo si può esplorare il sito in base agli argomenti preferiti, che in quel momento potrebbero anche non essere in prima pagina fra le news.
Usare una buona tematizzazione è anche importante per far capire di cosa vi occupate. Le voci dei menu si scelgono analizzando bene i contenuti di cui vi occupate e dividendoli per argomenti. Per farlo a misura di utente è utile usare il Card Sorting, stabilire un lessico uniforme e mantenerlo per tutto il sito anche negli articoli (attraverso un vocabolario controllato e un thesaurus).
Progettare lo stile visivo
Tutte queste attenzioni sono strutturali. Determinano un’organizzazione dello spazio per diversi oggetti con funzioni precise, ma non dicono molto sullo stile visivo. In effetti lo stile visivo (anni fa noto anche come look & feel) non ha molto a che vedere con il layout. Tanto che i bozzetti delle pagine spesso si fanno in maniera molto spoglia, con riquadri grigi:
E solo in seguito vengono decisi gli stili, i colori, gli elementi grafici (fondi, bordi, linee, sfumature, icone e immagini) che determineranno il tono visivo.
Non è dunque importante il tono visivo? Al contrario, lo è molto, perché è la prima cosa che un utente nota, anche prima di volerlo. Un buon aspetto visivo predispone un utente a perdere del tempo sul vostro sito, uno stile brutto (e in particolare disordinato e caotico) lo scoraggia.
Vi è una famosa ricerca che dimostra come con gli oggetti più belli siamo più tolleranti. E’ bene dunque investire sullo stile visivo del vostro sito. Ma come sceglierlo?
Moodboard
Nel design si usa da tempo gli album stilistici, o mood board, quaderni con ritagli di immagini di diversa provenienza, assemblati coerentemente per suggerire uno stile o l’altro. Ecco qualche esempio:
Cosa è uno stile? E’ un insieme di proprietà visuali usate in maniera coerente e ripetuta nel progetto. Uno stile è carente quando, per esempio, si usa una sfumatura in una pagina e un colore piatto in un’altra pagina. O un font di un tipo e di un altro mescolati senza coerenza. O così i colori, le linee, le immagini. Anche il tipo di forme usate (morbide, spigolose, tratteggiate, ecc.) è importante.
Uniformità di stile significa un messaggio chiaro. Lo stile lancia un messaggio emotivo, ma serve anche a dare ordine e a guidare l’occhio (assieme al layout). Diciamo che layout e look & feel dovrebbero armonizzarsi nel guidare lo sguardo, e che in particolare il look & feel è responsabile della reazione emotiva, viscerale, dell’utente. Quella che può predisporlo bene e renderlo più tollerante con il sito, ma anche quella che può respingerlo.
Alcuni stili a confronto
Il web 2.0 è noto per aver lanciato uno stile relativamente omogeneo fra diverse applicazioni. Questo stile è composto da testi grandi, font moderni, immagini dai colori pastello, assenza di neri netti, ombreggiature e riflessi un po’ ovunque. E’ uno stile soft, morbido, carino. Umanizza la tecnologia. Come tutti gli stili, se usato eccessivamente, uniforma troppo la comunicazione ostacola la distinzione.
Nel webdesign si vedono spesso stili molto caratterizzati: ricchi e rigogliosi:
Oppure “retrò”, rovinati, sporchi, polverosi:
In generale le aziende preferiscono uno stile meno deciso: devono parlare a tutti e sembrare seri, non brillanti e un po’ hippy. Ecco dunque colori piatti, spesso sui toni del blu, molto bianco, e foto nitide e calde:
Una stile visivo poco discusso è quello di Google. Google ha uno stile povero, spartano, minimale. Ha il pregio di essere facile da scaricare anche con connessioni lente (al contrario di altri). Ma soprattutto di essere neutro. Non corporate, non hippy, molto popolare, un po’ cheap (povero): adatto appunto al proprio scopo, che è quello di rivolgersi a TUTTI. Non tutte le aziende hanno questo scopo.
Quando scegliete il vostro tono visivo, chiedetevi quale impressione volete dare. Definitelo con alcuni attributi e testate alcuni stili visivi con alcuni utenti per capire come li giudicano.
Ripiegate poi sullo stile che più si avvicina a quello che volete ottenere, e sviluppate una vostra variante, un po’ personale, e testatela di nuovo.