Organizzata annualmente nelle maggiori capitali del mondo dal guru dell’usabilità Jakob Nielsen, è l’occasione per noi professionisti del web marketing di aggiornarci e imparare sempre di più sugli standard:

• con i quali le persone si relazionano con i siti web
• con i quali i quali progettare siti web pensati per soddisfare l’utente e raggiungere i propri obiettivi
• al fine di ottimizzare gli investimenti in comunicazione online dei nostri clienti.

Problemi di usabilità = problemi di comunicazione online

Ancora oggi poca attenzione è posta dalle agenzie web e dalle agenzie web marketing a questo aspetto, eppure i problemi di Usabilità dei siti web si ripercuotono pienamente sul web marketing stesso!
A tutti noi infatti basta navigare un sito poco usabile per capire che “qualcosa non va”, che “potrebbe essere migliore”. Per questo motivo il nostro impegno va nella direzione di creare siti web più usabili quindi più performanti.

Esiste infatti un problema di usabilità (e quindi performance per l’azienda!) ogni volta che abbiamo problemi a rintracciare un’informazione su un sito, a trovare i dettagli di un prodotto, a contattare l’azienda, ad eseguire un’acquisto online… insomma ogni volta che l’utente cerca di portare a termine un’azione e non vi riesce facilmente o non vi riesce a fatto. Pensiamo solo in ottica di ottimizzazione degli investimenti web, che salto in avanti potrebbe fare il sito web di un’aziende se avesse maggiore cura di questa voce.

Vantaggi di un sito usabile? Siti più usabili = siti più performanti

Le ricerche e la formazione nel campo permettono di creare siti sempre più usabili, vale a dire siti:

• facili da utilizzare
• efficienti ed efficaci
• che riducono gli errori
• piacevoli da navigare
• facili da ricordare

Se aumentano l’efficacia, l’efficienza e la soddisfazione con la quale l’utente porta a termine i propri obiettivi, significa che il sito web – che è un mezzo – ha fatto ciò che per cui è stato progettato.

Linee guida dell’Usabilità per siti web

L’usabilità è una scienza empirica, solo le misurazioni sul campo (cioè osservare quello che le persone fanno navigando i siti internet) possono fornire le giuste indicazioni su “come fare un sito” e “come migliorare un sito esistente”.

Non per niente durante la Usability Week vengono presentati decine e decine di pratiche, esempi e casi di studio condotti sul campo, anche a video: riprese reali di navigatori ai quali viene chiesto di compiere un’azione come ad es. “Trova l’informazione X su questo sito e chiedi maggiori informazioni”, “Compra il prodotto Y su questo sito e-commerce”, “Contatta l’azienda per il servizio Z”. L’osservazione e la reazione degli utenti, permette di definire degli standard di qualità dell’usabilità web da applicare alla progettazione dei siti.

Un giudizio?
Esperienza sicuramente molto positiva, consigliata a tutti i colleghi professionisti e in generale a chi ha intenzione di progettare siti internet che “funzionino meglio”.

1- Gestire i contenuti in  autonomia e libertà
L’indubbio vantaggio di un CMS è di permettere l’aggiornamento dei contenuti  del sito in maniera autonoma, senza ricorrere alla propria web agency per le modifiche. In questo modo si guadagna in tempo e costi.
Es. Bastano un nome utente e un password e si potranno aggiornare testi, offerte, immagini, ecc. in totale autonomia.

2- Per ogni dimensione: siti web, portali, e-commerce
I CMS sono oggi lo standard in tutto il mondo per gestire ogni genere di sito, dal più semplice sito aziendale fino a progetti complessi come portali o siti di e-commerce. I soggetti che gestiscono questi siti hanno infatti tutti la medesima esigenza: caricare contenuti in maniera autonoma e con una certa frequenza.
Es. Nel caso di un sito web aziendale può trattarsi di nuovi servizi o articoli di approfondimenti; nel caso di un e-commerce si tratterà di nuovi prodotti, nuove foto e offerte; nel caso di un portale i contenuti da caricare sono diversissimi.

3- Visibilità naturale sui motori di ricerca
I CMS moderni sono progettati nel pieno rispetto delle linee guida di Google e dei motori di ricerca. I contenuti pubblicati tramite una piattaforma CMS quindi godranna di una naturale predisposizione all’indicizzazione su Google.
Es. Tutte le pagine del CMS, permettono la scelta di appositi titoli, descrizioni e parole chiave per agevolare l’indicizzazione sui motori.

4- Flessibilità, personalizzazione, espansione, integrazione
Un CMS serio permette la massima personalizzazione non solo in fase di realizzazione ma anche in seguito. E’ possibile infatti dotare il proprio CMS di nuovi moduli (es. modulo e-commerce, modulo registrazione utenti, ecc.), dotarlo di un software di statistiche e web analytics o integrarlo con eventuali database aziendali già esistenti per collegare i dati online con quelli offline.
Es. Oggi l’azienda ha bisogno di un sito che presenta i prodotti, domani ha necessità di vendere direttamente online quei prodotti: basterà aggiornare il CMS con un apposito modulo per l’e-commerce.

5- Non solo pagine web: pubblicazione multicanale
I CMS più avanzati permettono di pubblicare non solo pagine web sul dominio aziendale www.miosito.it, ma di distribuire i propri contenuti anche tramite l’invio di una Newsletter o tramite feed RSS.
Es. Se gestiamo un sito e-commerce, potremmo segnalare ai nostri clienti fidelizzati le nuove offerte in corso.

6- Gestione di utenti e gruppi
Ammettiamo che in azienda non tutti debbano avere accesso totale alla gestione del sito e che vi siano persone che possono “amministrare” il sito mentre altre (magari collaborati esterni) hanno principalmente la necessità di aggiornare news o offerte. Il CMS permette di creare Utenti amministratori e Utenti editori cui è riservata la pubblicazione di determinati contenuti. Sul lato pubblico, poi, il CMS può prevedere la possibilità per i visitatori del sito di registrarsi per accedere a servizi o risorse particolari.
Es. La maggior parte dei portali oggi offre agli utenti la registrazione per utilizzare tutti la gamma di servizi.

Caso concreto: una recente realizzazione di Promobit Communications
Per Living Immobiliare abbiamo sviluppato su piattaforma CMS il sito www.veronaliving.it (clicca per visitare), che permette all’agenzia immobiliare di gestire in totale autonomia sia le offerte di affitti-vendite immobiliari che articoli di approfondimento sul settore immobiliare e il risparmio energetico.

Nella maggior parte dei casi è necessario ricorrere ad un account administrator o super administrator per sbloccare ricorsivamente tutti i contenuti attraverso l’utility Strumenti->Controllo Globale.

Poiché molto spesso chi gestisce a livello di contenuto un sito Joomla ha un account di tipo manager, può essere interessante abilitare la funzione di Controllo Globale anche per questo livello utente.

Il tutto può essere realizzato aggiungendo nel file del core di Joomla /libraries/joomla/users/authorization.php dopo la riga 91 questo codice:

$this->addACL( "com_checkin", "manage", "users", "manager" );

NB: Poiché questa modifica interviene su un file core di Joomla è importante annotarla per evitare la sua sovrascrittura in futuri aggiornamenti del CMS.

Dopo gli anni dell’eccesso le ultime tendenze suggeriscono un approccio più leggero, dove un buon design è rappresentato dalla regola del “meno è più”.

A proposito di questo vi segnalo un articolo interessante.

Nello studio iniziale di una landing page, ci si deve concentrare sul poligono concettuale AIDAS:
Attenzione
Interesse
Desiderio
Azione
Soddisfazione

L’Attenzione è la prima parte del processo di studio e dovrebbe rispondere alle seguenti esigenze dell’utente:
- Mi trovo sull pagina che mi stavo aspettando?
- Si tratta di un sito che potrebbe plausibilmente vantare ciò che sto cercando?
- Vale la pena fermarmi a leggere/guardare o meglio cercare qualcos’altro?

Risulta quindi fondamentale la ricchezza dei dati apportati da una campagna di search marketing: se so cosa cerca l’utente, so sicuramente meglio come farlo “ambientare” bene in modo da poter catturare la sua attenzione.

Dopo aver catturato l’attenzione del navigatore, è importante soddisfarne l’Interesse: le porzioni di testo, immagini e aree “cliccabili” devono subito coinvolgerlo e spingerlo ad approfondire. Si cerca di dare risposta ai quesiti:
- Dove dovrei cliccare per avere maggiori informazioni?
- C’è qualcosa su questa pagina che descriva ciò che sto cercando?
- Posso fidarmi a rilasciare a questo sito/azienda i miei dati personali?

Il successo di questa fase si lega indissolubilmente alla mancanza di tempo e alla svogliatezza dei navigatori: sarà importante usare tecniche di sintesi dell’impianto grafico-testuale che sintetizzino e velocizzino la fruizione dei contenuti. Vanno inoltre minimizzate le possibili distrazioni: gli elementi che non si rendono necessari, vanno eliminati.

Una volta che abbiamo catturato l’attenzione del lettore e che si è creato quel primo – labile – legame d’interesse, è il momento in cui egli presterà più attenzione alla nostra offerta per capire se realmente può soddisfare il proprio Desiderio, se gli può interessare quello che andiamo presentando. Il tasso di fruizione dei nostri contenuti (testuali, grafici, multimediali…) tende ad aumentare perchè il navigatore avrà giustamente molte obiezioni al nostro prodotto, egli cercherà risposte a domande quali:
- Questo prodotto/servizio mi offre quello che voglio?
- Posso permettermelo?
- Se non mi piace: posso restituirlo?
- Davvero mi piace, posso però fidarmi di questa compagnia?
- Ci sono altri prodotti migliori di questo?
- Questo prodotto risolverà i miei problemi?

Nostro scopo in questa fase è di non fargli abbandonare il sito con quesiti irrisolti!

Se l’utente a questo punto è convinto, sarà la volta di farlo passare all’Azione, il momento in cui scatta la conversione. Le azioni più frequenti sono: la compilazione di un modulo di contatto o di preventivo, l’acquisto di un oggetto, l’iscrizione alla newsletter, la registrazione ad un servizio, la prenotazione di un evento, ecc.
I “Call to Action!” più diffusi sono di conseguenza: “richiedi un preventivo!” “aggiungi al carrello!” “invia!” “iscriviti ora!” “registrati!” e così via. L’azione ovviamente dev’essere personalizzata a in linea al 100% con gli obiettivi della landing page e cioè della campagna.

Ultima ma non meno importante – anzi oggi forse la più importante! – è la Soddisfazione, che – almeno tecnicamente – esula dal design della landing page e finisce nelle cosidette azioni di CRM. Dobbiamo soddisfare le aspettative dell’utente che è arrivato in fondo al percorso. Ciò significa che dobbiamo dargli esattamente ciò che lui si aspettava di ricevere al momento di chiusura dell’azione. Dobbiamo rispettare le promesse costruite lungo il percorso pre-azione.

A seconda dei casi si può trattare di un contatto in tempi brevi, la spedizione dell’oggetto acquistato nei tempi stabiliti e secondo condizioni di restituzione e rimborso stabilite, la ricezione immediata dei dat per accedere al servizio, la ricezione invito all’evento cui si è registrato, e così via. Tutto il percorso finora è stato costruito secondo uno specifico livello di comunicazione e informazione che l’utente desidera rispettato anche nel “post-azione”.

Fallire a questo punto, come sappiamo, porta non solo un cliente scontento ma (statisticamente parlando) 10 nuovi potenziali clienti scontenti contro i 2 potenziali clienti a quali verrebbe parlato bene del nostro prodotto/servizio.

Ovviamente anche rispettare magistralmente tutti questi punti non ci darà mai la certezza di avere la landing page perfetta: la landing page perfetta non esiste (almeno non all’inizio!) ma va continuamente analizzata e ottimizzata fino a raggiungere ad un soddisfacente livello di eccellenza.

Oggi, comunque, la maggior parte degli utenti ha macchine che dispongono di monitor moderni e buone quantità di ram video, il che gli permette di visualizzare ben più di 256 colori.

Fra quelle indicate trovo molto interessante il proliferare di design scuri abbinati a colori molto vivaci. Nonché la presenza di mascotte vettoriali pronte ad umanizzare e rendere più “divertente” il sito. Rispetto agli anni passati (ricordo i layout flash in stile fantascienza) il trend del 2007 è stato sicuramente quello di rendere il web più “cartoon” con sovrabbondare di box pastello e linee morbide.

A proposito di mascotte si esprime anche l’autorevole Smashing Magazine con una galleria ragionata di mascotte del web com’è nel suo stile inconfondibile.

Chiudo con un’osservazione: non voglio certo fare politica, ma provate aguardare lo sfondo su cui campeggia il logo del Partito Democratico nel video della conferenza stampa dei Circoli PD… quel verde acido che fa molto web è il segno: il web sta invadendo l’Italia!

Dal mio punto di vista, ritengo scontate le basi di un buon SEO per siti web (title, description per pagina, url con mod_rewrite per le pagine dinamiche…), tuttavia, poiché c’è sempre da imparare, ecco alcuni hint direttamente da Google:

1) Per evitare che nelle ricerche venga mostrato il breve testo sotto il link aggiungete alla pagina

meta name="robots" content="nosnippet"

2) Se invece volete che una pagina scompaia dal database di Google:

meta name="robots" content="unavailable_after:[data] "

3) Smettete di usare il meta revisit-after, usate le sitemap XML per questo compito

4) Ricordate che di default ogni pagina viene considerata come index(da indicizzare) e follow (segui i link), se questo è ciò che volete potete anche omettere il meta robots.

Chiudo con un video sulla spiegazione dell’attributo alt nelle immagini e con una domanda correlata: Ma non lo sanno anche i muri?!

Ovviamente è possibile creare un sito a larghezza fluida, ma bisogna comunque decidere il limite del ridimensionamento del layout. Se fino a qualche tempo fa era logicamente plausibile supportare la risoluzione 800×600, pare che negli ultimi tempi il limite sia stato superato. Le percentuali di visitatori con questa risoluzione sono infatti sempre meno, aumentano invece gli utenti con schermi widescreen.

Navigando tra siti più o meno importanti, ho notato, per esempio, che il redisign di Punto-Informatico.it è pensato per una larghezza minima di 1024px. Altri esempi illustri sono il sito Repubblica.it, da tempo ormai passato alla risoluzione minima 1024×768, e Splinder.com, nota piattaforma per blogger.

Nel dubbio, il mio consiglio è quello di realizzare layout fluidi che si adattino allo schermo del navigatore, anche perchè gli utenti con pc datati e schermi antidiluviani resisteranno ancora per un po’ di tempo. Ricordiamoci, ad ogni buon conto, che la cosa più importante è garantire la navigazione semplice tra le pagine e rendere leggibili i contenuti.

Per aggirare il problema con estrema semplicità, bisogna sempre ricordarsi di dare al body delle nostre pagine web un colore di sfondo:

body { background: #fff }

Il sito di cui ho fornito l’esempio, è solo uno dei tanti che possono presentare questo problema, ma navigando non sarà difficile scovare altri casi clamorosi.

Morale: ricordatevi sempre di questo particolare quando vi dedicate alla realizzazione di un sito, così anche se il cliente avrà dei colori preimpostati sul suo browser non si potrà lamentare.