Il Defensive Design che aiuta il Marketing sul web
Ti sarà capitato di navigare in siti internet dalla grafica splendida, in altri mediocri, creati da designer improvvisati, e in altri che urgono di un restyling, perchè decennali, ma ancora in rete nonostante tutto.
La grafica è una componente da non sottovalutare in un sito web, specie di ultima generazione: è stato constatato infatti, a livello statistico, che si apprezza di più un sito dalla grafica piacevole e conciso nei contenuti rispetto ad uno scarno, nei contenuti o, ancora peggio, “arlecchino” nell’aspetto, caratterizzato da mille informazioni tediose.
Nella navigazione sui siti dei quali usufruiamo, i servizi, belli o brutti che possano sembrarci, devono agevolarci nella navigazione.
Purtroppo una simile esigenza non è sempre soddisfatta e, per il sito realizzato in questo modo, o per il brand che lo stesso dovrebbe rappresentare, possono sussistere perdite di accessi, o addirittura di acquisti, per non parlare delle mancate richieste di informazioni sul prodotto visitato.
Quando progettiamo un sito web, una buona grafica da noi realizzata accompagna l’utente nella navigazione, rendendola a lui gradevole, ma la domanda che dobbiamo porci è: abbiamo creato un prodotto funzionale?
Controllo
Dietro una buona architettura nel creare un sito internet, o un portale di grandi dimensioni, ci dev’essere un design “difensivo”, pronto agli urti.
Quali sono questi urti? Ne snocciolerò alcuni:
- Errori nei form
- Aiuti impercettibili sugli errori di compilazione form
- Pagina non trovata (errore 404)
- Errori del Server
- Schermate di ricerca incomprensibili
- Articoli obsoleti, che non portano a nulla
- Immagini non caricate correttamente
- Files corrotti
- FAQ inesistente
Cosa capita quando l’utente si trova uno dei suddetti punti critici d’urto?
- il navigatore, possibile cliente, abbandona il sito
- il navigatore si sente disperso, ma conclude comunque l’acquisto, perdendoci più tempo del previsto e rimanendo insoddisfatto della facilità d’uso: il rischio è che la prossima volta scelga un altro sito per fare lo stesso tipo di acquisto
- il navigatore, se aiutato a risolvere il problema riscontrato, si ricorderà di esser stato “guidato” a dovere e, uscendone soddisfatto, lo interpellerà per altri acquisti
Cosa comporta in termini di Marketing?
- registrazioni dei navigatori fallite e dunque meno contatti per newsletter e quant’altro
- aumento delle richieste di aiuto del navigatore al sito o in email, con conseguente perdita di tempo
- frustrazione del navigatore/cliente e brand reputation declassata
- abbandono del navigatore/cliente nei riguardi del sito
Vediamo alcune schermate di esempio, per rendere l’idea di come il navigatore possa perdersi nei meandri di una semplice compilazione form.
Poniamo il caso che io desideri acquistare un biglietto per un volo che, da Torino Caselle, mi porterà a Roma Fiumicino.
Cerco su Google i migliori siti sui quali comprare voli aerei e clicco dapprima su edreams.it. Vediamo come si comporta il form:

La ricerca viene correttamente caricata e mostra 2 opzioni del volo di ritorno, che io volutamente NON scelgo.
L’esito del sito è la restituzione di un alert, ben evidenziato in rosso, che mi ricorda di scegliere un volo di andata e di ritorno (come opzione già decisa all’inizio della ricerca) all’interno dei pallini a fianco degli orari.
A mio avviso, il sistema potrebbe essere ulteriormente ottimizzato, inserendo un riquadro rosso attorno ai voli di ritorno anzichè evidenziare in giallo il volo corretto già scelto da me per l’andata.
Questo è un buon esempio di aiuto al navigatore sui dati che può aver omesso.
Qui di seguito, una volta scelto correttamente anche il volo di ritorno, ho inserito la schermata dentro cui ho trascritto i miei dati per l’acquisto del biglietto aereo.
Una piccola pecca: gli errori segnalati per i campi obbligatori non compilati correttamente sono appena visibili e non sottolineano opportunamente ove si è dimenticato, nel caso, di compilarli, rendendo il tutto di difficile comprensione.
Altro esempio di form è quello del portale lastminute.com che illustro di seguito.
Allo stesso volo cerco le opzioni da me preferite e proseguo con l’acquisto del biglietto.
La schermata di seguito è la restituzione della mia query di scelta e il prezzo con le varie voci. Il colore, tipico del logo della scritta lastminute, mi identifica d’impatto il prezzo del volo.
Al fondo della stessa schermata del prezzo e dei dettagli, sono presenti delle opzioni di scelta sul volo: assicurazione, annullamento assicurazione e bagaglio in stiva. Non scelgo nulla di tutto ciò e proseguo la lettura.
Al fondo noto l’accettazione, riquadrata in rosa, dei termini e condizioni di vendita e regole del volo. Ovviamente la spunta sulla checkbox dev’essere obbligatoria. Ma non si comprende. La clicco.
Spuntando il checkbox dei termini&condizioni di vendita e cliccando su “continua” mi appare un riquadro a fumetto dentro cui mi si ricorda che non ho scelto la copertura assicurativa.
Essendo un riquadro nero, e non rosso, di errore, mi lascia interdetta e con una domanda: e ora cosa devo fare? Riclicco il bottone “continua”, ma dove devo cliccare?
Cerco la dicitura suggeritami dal fumetto ma è inframezzata tra l’annullamento assicurazione e il bagaglio in stiva, poco visibile e non riquadrata.

Una manciata di secondi nel capire dove si deve cliccare per proseguire, potrebbe far perdere decine di clienti impazienti…
Altro esempio di form è quello del portale booking.com dentro cui decido di acquistare un soggiorno nella città di Firenze.
La grafica appare, a mio parere, più pulita, caratteri più leggibili e molto intuitiva. Il pulsante “trova” lo apprezzo per la visibilità non “inquinante” nel contesto.
La scelta dell’hotel è stata da me attentamente selezionata, per una serie di dati che risultano, all’interno della schermata, ben visibili nella colonna di sinistra e di colore verde.
Con l’applicazione del filtro, il portale mi evidenzia l’hotel che mostra quante camere sono ancora disponibili, in rosso perchè ultime rimaste (associamo ormai al rosso il significato di attenzione o errore), e di che tipologia si stratta. In verde la scritta sui servizi inclusi nel prezzo.
Alla scelta della camera compilo il form che, allo sbaglio della digitazione della email, mi restituisce un messaggio d’errore, caratterizzato da una grafica altamente intuitiva, essendo il sito in blu, e da un alert contornato in rosa. Il messaggio d’errore, ben chiaro sotto le “briciole di pane”, mi fa sentire “guidata”.
Alla compilazione del form di richiesta dei dati per la prenotazione, e, successivamente, della carta di credito con cui pagare, ho volutamente omesso TUTTI i dati.
La stessa schermata di errore viene riportata allo stesso punto, sotto le briciole di pane, e con colorazione del testo rosso contornato in rosa. Si tratta di un’omogeneità di visualizzazione dell’errore che mi dimostra l’affidabilità del sito e della volontà di aiutarmi nell’acquisto. Inoltre le scritte rosse sopra ciascun riquadro, dentro le quali avrei dovuto inserire i dati corretti, richiamano la mia attenzione su cosa andasse realmente scritto all’interno.
Trovo che ben pochi siti abbiano considerato la possibilità di creare una rappresentazione grafica e immediata come questa alla spiegazione del codice CVC della carta di credito.
Si stima che oltre il 40% dei navigatori abbandoni l’acquisto online proprio per la poca chiarezza nella spiegazione sui dati richiesti e nella soluzione al riguardo.
Quest’ultimo esempio è un ottimo risultato di Defensive Design che aiuta il navigatore nella scelta e nell’acquisto di servizi sul web.
Quando i navigatori/clienti vedono il modo in cui è gestito un messaggio di errore, si aspettano una gestione simile per i messaggi futuri. Per questo motivo, indicare nello stesso stile errori o alert è di fondamentale importanza.
I navigatori, apprezzando l’uniformità delle risposte e delle pagine, guadagneranno energie e tempo, ripagandovi con un marketing di passaparola e acquisti successivi.
Un cliente che sceglie il sito dentro cui acquistare un prodotto, constatando la facilità d’uso dello strumento di transazione, proverà fiducia e apprezzamento per quel brand, con il quale sarà portato a compiere un’associazione di idee senz’altro ottima per un futuro acquisto.
Navigando in rete, hai mai cliccato su siti anonimi che ti hanno fatto sentire abbandonato e disperso? Come hai reagito? Quali aiuti vorresti trovare in un sito di acquisti on line?
21 commenti
Trackback e pingback
Non ci sono trackback e pingback disponibili per questo articolo









Guarda questo articolo capita a fagiolo :)
Proprio ieri, cercavo un prodotto su internet. Un software per l’architettura abbastanza famoso a quanto pare.
Mi credi se ti dico che su google l’unica pagina che trovavo era quella del sito del produttore, ma cliccando su “Acquista” o “Download Trial” non succedeva NIENTE? Era testo e non link?! Ho pensato che fosse una pagina vecchia dato che la grafica era completamente diversa da tutto il resto del sito. Fatto sta che però in tutto il sito non sono riuscito a trovare quel software anche se su Google mi mandava sempre alle sue pagine…
Ciao Nicola!
Eh….purtroppo capita ancora.
Questi motori di ricerca, dagli algoritmi impensabili, dovrebbero affinare un qualcosa che possa setacciare link nulli e depennarli dalla ricerca!!! E’ una cosa fastidiosissima!
Immagino quanto tu sia stato poco felice di aver perso del tempo inutile…
A dir la verità i motori di ricerca hanno queste potenzialità. Se continuano a scansionare link nulli, dopo un pò di tempo li eliminano dalle loro liste (almeno Google lo fa) e volendo puoi dirgli anche tu di farlo tramite gli strumenti per webmaster.
Scusa il doppio commento ma una cosa la devo aggiungere!
Aruba… Penso di aver detto tutto solo nominandolo. E non fate finta che non avete avuto mai problemi!!!
Io fin ora non sono ancora riuscito a trovare la pagina per comunicare i pagamenti dal sito stesso, mi affido sempre al buon vecchio Google.
Son sincero io spesso non uso questi siti per prenotare in quanto in passato non mi son trovato bene e ancor più di ora erano un casino. Un’esempio diverso mi succede quando prenoto delle stampe su un service e, se cambio dei dati, difficilmente mi ricalcola il prezzo giusto, problemi di cache a volte da risultati pessimi e non aggiornati, urge chiusura browser a volte!! Una buona analisi comunque. Molto interessante. Grazie!
Ciao!
Ho trovato che certi browser, tipo Firefox, abbiano cache sempre ostiche da svuotare…
Secondo me Chrome e Safari vanno decisamente meglio.
Grazie a te del commento! :)
Avendo a che fare molto con la progettazione di siti tipo Booking.com, mi capita spesso di vedere situazioni come quelle da te descritte, dove gli errori sono posizionati senza criterio o a volte la scelta ricade su fastidiose alert. Molte volte purtroppo non si ha potere decisionale e bisogna ingoiare il rospo e fare come vogliono :(
Quello che manca a mio parere è una figura che analizzi al meglio la User Experience e il Defensive Design in fase di progettazione; nella maggior parte delle piccole/medie web agency Italiane si usa partire subito mettendo mani al codice e modificarlo in corso d’opera con richieste del cliente che si aggiungono fino a che non si capisce più qual’è il requisito principale. Quando lavoravo per una multi-nazionale americana questo non succedeva, il progetto seguiva un suo filo logico legato alla qualità del prodotto finale; anche se la parte burocratica era noiosa alla fine usciva fuori un prodotto ben fatto.
Comunque complimenti, ottimo articolo!
Ciao Giuseppe,
e grazie del tuo commento!
Hai ragione nel dire che serve un’analisi in fase di progettazione e non nella fase già avviata!
Purtroppo non si vede ancora, almeno in Italia e per medi-grandi progetti, una dovuta attenzione a questo “percorso” di sviluppo.
Che poi, a mio parere, le web agency dovrebbero farsi due conti:
- quanto costa un dipendente a rifare lo stesso lavoro 2 volte se qualcosa non è funzionale?
- quanto costa fare una bella analisi iniziale e poi andar spediti?
Ritoccare più volte uno stesso progetto vuol dire perderci soldi e tempo…
Ho rinunciato a comprare un biglietto aereo da Expedia (o simili) per un altro motivo è molto difficile farti fatturare i biglietti.
Mentre mi trovo benissimo ad acquistare su Booking.com: semplice e veloce. In più fanno buoni sconti sulle ultime stanze disponibili degli hotel
Ciao Arianna!
Booking.com è davvero facile da usare e molto intuitivo.
Chi lo ha progettato è stato/a davvero attento/a all’usabilità.
Non trovi?
Su Amazon.it mi sono trovato molto bene con i form…ma ho riscontrato un problema….Mi sembra di capire che il sito non ti chieda il codice segreto della carta di credito quando la usi…non è pericoloso?…per i ladri intendo.
Ciao Marco
e grazie del commento!
No, non è che sia pericoloso.
E comunque il sito di Amazon.it è costantemente monitorato e dotato di certificazioni SSL
Io penso che, col continuo aumento di utilizzatori di servizi web, questo discorso sia sempre più importante per un’azienda che vuole avere una clientela il più possibile vasta, soprattutto nei campi dove c’è più concorrenza, e quindi è maggiore la possibilità che il cliente insoddisfatto rivolga altrove le sue attenzioni…
D’altronde, facendo un discorso più da utente/navigatore con una certa esperienza, pur essendo magari abituato a scontrarmi talvolta con siti non particolarmente ottimizzati, e quindi a sforzarmi di risolvere ogni inconveniente si possa presentare pur di arrivare alla conclusione dell’affare (evidentemente perché allettato dal prezzo o dalla “rarità” del bene in oggetto), sicuramente è apprezzabile da chiunque un servizio curato nei minimi particolari, perché ci predispone all’acquisto con una certa serenità, sicuri di poterlo concludere in brevissimo tempo e con la massima soddisfazione.
Ciao JustV,
hai perfettamente ragione.
Uscire “appagati” da una certa transazione, oltre che per l’oggetto o il servizio acquistato, è un buon lasciapassare per quelle ditte, che hanno più spesso, negozi virtuali on line…
Bell’articolo Monica, interessante e pieno di spunti. Basta davvero poco per perdere un cliente che passando parola può far valere la propria voce, su internet soprattutto.
Ciao Francesco!
Bisogna sempre mettersi nei panni di un navigatore e non solo dello sviluppatore.
E far testare a chi, come ad esempio mia madre, di internet ne capisce poco :)
Hai fatto benissimo ad evidenziare un problema piuttosto diffuso e di cui, in certi ambiti, si tiene ancora troppo poco in considerazione.
Per poter ottenere il massimo dalla propria presenza online, va rivolta un’attenzione davvero particolare alla User Experience, sia in fase di analisi, sia in fase di test a prodotto finito, momento in cui si possono scoprire eventuali aspetti trascurati in precedenza, magari ingaggiando “persone comuni” e invitandoli a fare, ad esempio, un acquisto di prova.
Per quanto riguarda poi l’ecommerce nello specifico, aggiungerei un altro punto critico a cui spesso non si dà peso: la distrazione! Se un utente è già impegnato nel processo di acquisto (ad esempio è già capitato nella pagina del prodotto di suo interesse o addirittura nella fase di revisione del carrello e checkout), l’ultima cosa che bisogna fare è distogliere la sua attenzione da quello che sta facendo, come ad esempio proporgli di andare a leggere un articolo del nostro blog piuttosto che invitarlo a leggere la presentazione dell’azienda o quant’altro.
Inoltre più il processo per portare alla transazione finale è semplice e veloce e più è probabile che questa avvenga, per questo è importante che gli “intoppi”, si presentino solo quando effettivamente giustificati dalla fase in cui mi trovo, come ad esempio la richiesta dei dati personali deve avvenire solo in fase di checkout e non nel momento in cui voglio aggiungere un prodotto al carrello (cosa che, per principio, mi fa sistematicamente abbandonare un negozio online); non solo è importante “come” ti propongo il form, ma anche “quando” ti chiedo di compilarlo.
Grazie del commento Daniele!
Eh sì!
Hai fatto bene a sottolineare il fattore “quando” oltre che al modo in cui si propone la compilazione del form.
Grazie dell’intervento :)
Nella mia esperienza, da realizzatore di siti e da utente, quanto descritto è “pratica comune”. Non c’è ancora, almeno in Italia, l’abitudine di affidarsi a figure professionali (ma nemmeno per la realizzazione). Per qualche oscuro motivo, quando si entra nel campo dell’ICT sono tutti esperti, nati tali. Il vetrinista al quale è affidato il compito dell’allestimento, ad esempio, viene limitato da un budget e da un tempo concordati, e all’interno gli viene permesso di estrinsecare la sua professionalità. Chi si occupa di fare siti funzionali e funzionanti, al contrario, deve dibattere e concordare, perorare e convincere ciascun dettaglio dell’allestimento (per tacere del funzionamento) del sito, e ho assistito ad oscenità degne di uno stupidario.
Ci sono due tipi di committenti: i “chiavi in mano”, i quali guarderanno i risultati, e i “co-protagonisti” i quali vorranno entrare nel merito e assoggettare ad approvazione le scelte, quando non intendono entrare anche nel tecnico. Vanno gestiti in modo differente, con contratti differenti: ai primi andrà bene il consueto modo di procedere, simile al vetrinista per dire; ai secondi bisognerà associare responsabilità a quelle approvazioni, e quindi prevedere una tipologia completamente diversa di contratto ed una metodologia in grado di tenere conto del loro atteggiamento (faccio l’esempio di Extreme Programming, famiglia Agile, per darne uno, ma si dovrebbero considerare le differenti condizioni). Per questi ultimi, non sarà possibile fare alcuna analisi a priori: il loro “desiderio”, apparentemente chiaro in sede di preventivo, emergerà con il concretizzarsi del prodotto – e sarà drammaticamente diverso dal primo -, pertanto qualsiasi considerazione a priori è tempo sprecato, è il modo sicuro di fare le cose tre volte.
Dico sempre come ciascuna cosa sia creata due volte, cioè “pensata” e “realizzata”, ma nell’ICT ed in particolare nella sfera Web assisto a tendenze diverse ed inefficienti, quando non disfuzionali, capaci di fatto di annichilire la competenza e forzare il prodotto ad una qualità compromessa anziché “di compromesso”. In Italia e nell’ICT le competenze ci sono, e sono molto solide: è davvero sconcertante l’incapacità di selezionarle di molte funzioni HR (per tacere di come mantenerle), ed è scandaloso come la stessa PA illuda i disoccupati con corsi da 100 ore in seguito ai quali rilascia “qualificazioni professionali” del tutto fuori scala (vedi postacertificata.gov.it e piangi).
Ciao Marco!
Non posso far altro che darti ragione. Molte figure sono senza dubbio di alta professionalità, e dunque inclini ad avviare un progetto ben studiato a tavolino e traslarlo infine sul web.
Purtroppo non tutti riescono ad avere un budget sufficiententemente idoneo per potersi permettere tutte le figure preposte ad un progetto come si deve, ciò però non toglie che chi ha il progetto in mano cerchi di portarlo a termine nel migliore dei modi ed un form è un cavallo di battaglia per un’azienda.
Riguardo l’aggiornamento informatico delle PA è risaputo che limino all’osso cosa davvero serve, ma non se ne sono ancora resi conto…
Thanks a lot and I hope to see again here :) … Happy New Year !!!