Il web e la teoria del cioccolatino

In questo post cercherò di raccontare come si prepara un sito web, dalla scelta degli ingredienti al confezionamento finale. Non parlerò di Ajax o di “Web 2.0” ma analizzerò un sito nella sua sostanza, dando per scontato che il prodotto finale sarà al passo con i trend del momento.

Prendete un cioccolatino ripieno, avvolto nella sua carta, scartatelo ed addentatelo: questo è un sito web. Carta che lo avvolge, rivestimento e ripieno: proverò a dare una buona ricetta per fare un buon cioccolatino, che accontenti la vista, il gusto e l’olfatto.

1. Il ripieno

Nel ripieno ci sono i contenuti del sito. I contenuti sono la parte malleabile del sito, la sostanza, quello che fa distinguere un buon cioccolatino da uno mediocre.
Prima di iniziare a selezionare gli ingredienti sarà indispensabile avere un’idea chiara di cosa il nostro sito dovrà offrire – gli obiettivi – e che necessità degli utenti andrà a soddisfare; prima di uscire sul mercato fate provare il vostro cioccolatino ad un gruppo di persone rappresentativo del vostro target di consumatori.
I contenuti sono spesso eterogenei – testi, foto, filmati – e non è semplice trovare una giusta amalgama: basta poco per eccedere in un ripieno troppo saporito di immagini o troppo pastoso di testi. Il concaggio, cioè la fase di lento mescolamento dei contenuti per renderli omogenei, servirà appunto per permetterci di capire cosa potrà offrire il nostro sito.
Il ripieno non ha forma – sarà con lo strato esterno che ci preoccuperemo di dargli un forma – però non tutte le forme si adatteranno al nostro ripieno.

1.1 Ingredienti

Bisogna sempre tenere a mente che se un contenuto è reso indipendente dal sito web, salvandolo in un database, ed è suddiviso nelle sue componenti principali (titolo, testo, data, descrizione etc.) sarà molto più facile poterlo sfruttare in diverse forme. Fra gli ingredienti di base abbiamo:

• una definizione degli obiettivi che vogliamo raggiungere con il nostro prodotto;
• una ricerca sulle necessità del nostro potenziale pubblico di consumatori;
• testi, fotografie, video, audio, mashup di dati provenienti da altri servizi, tutto ciò che sia pertinente agli obiettivi e requisiti che ci siamo fissati;

1.2 Suggerimenti

Alcuni suggerimenti alla preparazione del ripieno del nostro sito.

• Scegliere vari ingredienti, che contribuiscano a definire il sapore ma che si amalgamino bene fra loro;
• il ripieno non ha forma, ma solo sostanza. Il ripieno deve potersi adattare ugualmente bene in cioccolatini di diverse dimensioni, nello stesso modo che un contenuto deve poter essere visualizzato bene a seconda del mezzo a disposizione;
• poiché gli ingredienti del ripieno devono essere aggiornati periodicamente, è utile studiare l’impatto che l’aggiornamento del sito avrà sui carichi lavorativi del personale assegnato: è meglio avere meno contenuti ma aggiornati piuttosto che tanti contenuti che hanno passato la data di scadenza consigliata.

2. Il rivestimento

Una volta che abbiamo preparato il ripieno possiamo passare allo strato esterno. Si potrebbe pensare che se il ripieno è stato preparato con cura, lo strato esterno serva solo da contenitore. In realtà uno strato esterno scadente, una struttura del sito non adeguata, renderà scadente anche il suo contenuto.

Quando addentiamo un cioccolatino ripieno, i nostri sensi sono protesi al momento in cui l’involucro si spezzerà e permetterà al contenuto di raggiungere le nostre papille gustative. Per questo deve essere resistente per poter racchiudere i contenuti e malleabile per permetterci di recuperarli agevolmente:
dover addentare un cioccolatino per diversi minuti per spezzare l’involucro ci darebbe la stessa frustrazione di dover cercare i contenuti nei meandri di un sito.

In questa fase avviene il temperaggio, il passaggio del cioccolato da una forma irregolare a una cristallizzata. Un sito, come la cioccolata, tende a cristallizzare in forme irregolari a causa delle modifiche che il progetto iniziale subisce nella sua evoluzione: è giusto che un progetto muti nel tempo a patto che questo processo venga controllato e gestito correttamente.
La struttura di un sito, al contrario del contenuto, ha una forma e una consistenza: la forma è l’architettura del sito mentre la consistenza è data dal codice HTML che definisce ogni pagina.

2.1 Ingredienti

La preparazione dell’involucro è un processo delicato che deve tenere conto del processo precedente; fra gli ingredienti più importanti vi sono:

• una definizione di architettura del sistema, che sia dettagliata e facilmente adattabile a nuove esigenze;
• un’analisi semantica delle sezioni del sito per dare una struttura ai contenuti: “Di fatto, si può estrarre un significato da qualunque cosa nel mondo. [...] Dovreste iniziare a vedere etichette semantiche apparire davanti a voi, ovunque guardiate. Se però iniziate a sentire anche delle voci sarebbe opportuno contattare urgentemente il vostro dottore.” :) (da Andy Clarke – Trascending CSS – the fine art of web design);
• un’analisi dei diversi media in cui il vostro sito può essere usufruito: una notizia su uno schermo di pc dovrebbe apparire in modo diverso che sullo schermo di un palmare e possibilmente non consumare tutto il magenta della stampante di un utente che desiderasse imprimerla su carta.

2.2 Suggerimenti

• Provare i cioccolatini della concorrenza. Avete assaggiato un cioccolatino dal ripieno liquoroso che si sposava perfettamente con un rivestimento extra-bitter? Se vi è piaciuto è probabile che anche per il vostro impasto al liquore vada bene lo stesso mix. Ci sono ottimi pasticcieri in attività, è giusto imparare da loro e innovare con qualche tocco personale;
• ricordarsi che l’involucro non è la stessa cosa del ripieno: l’involucro racchiude il ripieno senza mescolarvisi. Tutti i nostri contenuti devono essere esterni al sito, di modo che si possa facilmente decidere un giorno di cambiare la struttura del sito a seconda delle esigenze o dei gusti dei consumatori senza intaccare i contenuti;
• non creiamo un involucro troppo rigido e prevediamo che in futuro nuove esigenze ci spingano ad avere bisogno di nuovi ingredienti;
• l’involucro è quello che dà la forma al cioccolatino. Il modo per far sapere che un testo è un paragrafo piuttosto che una tabella o una lista è di racchiuderlo nel corretto tag HTML. Il linguaggio HTML è un ricettario con circa cinquanta ingredienti e solo alcune combinazioni lecite fra loro: è indispensabile conoscerli e saperli usare nel modo corretto.

3. Il confezionamento

Infine la parte che non si mangia ma che spingerà l’utente a comprare il nostro cioccolatino piuttosto che un altro: la carta che lo avvolge. Possiamo preparare un ottimo cioccolatino, ma una confezione scadente eviterà che i clienti si fermino a guardarlo; allo stesso modo un cioccolatino scadente con una bella confezione attirerà sicuramente molti clienti che diventeranno clienti insoddisfatti.
Per fabbricare la carta che avvolge il cioccolatino è lecito utilizzare tutte le tecnologie – CSS, Flash, javascript (Ajax) – che possono aiutarci a rendere la nostra confezione appetibile.

Una delle esperienze più frustranti è scartare un cioccolatino per scoprire che la carta vi è rimasta appiccicata; il nostro sito deve essere completamente accessibile anche senza la confezione, cioè senza lo strato di presentazione. In fin dei conti quello che si mangia è il cioccolatino, non la carta.

3.1 Ingredienti

• Un wireframing, elaborato preferibilmente da uno studio di usabilità, che permetta al grafico di avere un’idea dell’occupazione che le informazioni avranno all’interno delle pagine;
• un documento di stile, cioè un documento che dia le linee guida generali sugli stili da utilizzare in un sito per i diversi elementi;
• un documento di “etichettatura semantica” degli elementi principali di una pagina (titoli, liste, tabelle ecc.)
• CSS, Flash e Javascript “unobtrusive”: tutto ciò che non è codice HTML non deve mescolarsi con la pagina e il sito (Jeremy Keith – Hijax: Progressive Enhancement with Ajax).

3.2 Suggerimenti

Di solito questa è la fase più coinvolgente, perché sarà quella che darà al prodotto il suo aspetto finale. Alcuni suggerimenti per affrontare questa fase:

• spesso capita di voler iniziare dal confezionamento del cioccolatino senza aver prima fatto il cioccolatino; è un grave errore che spesso porta a preparare confezioni che non riescono ad avvolgere tutto il sito;
• è sempre importante ricordare che il gusto è un senso soggettivo e non tutte le persone lo sviluppano allo stesso modo: non fidiamoci di sottili sfumature per distinguere il nostro cioccolatino ma basiamoci su design patterns consolidati e chiari;
• solo in questa fase iniziate ad usare la parola Ajax ed a considerare cosa possa rendere il vostro sito più gradevole da usare nelle funzionalità che già avete a disposizione. Diffidate da chi prima di parlare di architettura del sito vi parla di effetti Ajax e Web 2.0 perché non è un buon pasticciere.

Se avete seguito con ordine i passi della preparazione e avete utilizzato le giuste persone nelle diverse fasi dovreste trovarvi con un buon sito, o almeno con un buon cioccolatino.
Se i cioccolatini non sono il vostro forte e siete interessati ad approfondire l’argomento vi segnalo The Elements of User Experience di Jesse James Garret.

Post correlati:

• Card sorting e organizzazione dei contenuti web
• Information Foraging – I cacciatori di contenuti
• La nuova About User: l’utente al centro
• Psicologia e orientamento nel Web
• Dare importanza ai contenuti: le priority areas
• Paper prototyping: user testing su prototipi cartacei
• Test di usabilità qualitativo o quantitativo: quale scegliere?
• IA Summit 2007 a Trento
• Ricerca remota: una categorizzazione di tool
• Fare ricerca da remoto nell’usabilità: pro e contro

Tags: Information Architecture, progettazione sito web, semantica, Usabilità

Categorie: Progetti Web