Aumenta le conversioni con i form
I form sono parte integrante della UI – User Interface: stabiliscono un canale di comunicazione asincrono tra aziende e utenti.
Non c’è alcun dubbio sulla loro importanza, ma in giro per il web si vedono ancora moltissimi form mal realizzati e pieni di errori disastrosi.
Qui troverai tanti consigli pratici per form user-friendly che piaceranno da matti ai tuoi utenti!
Come creare form che convertono davvero: 10 consigli pratici
1. Utilizzare SEMPRE le etichette (labels)
Le labels (o etichette) sono molto importanti per i tuoi form ed è fondamentale utilizzarle e renderle ben visibili.
Magari ti sembra un consiglio ovvio, ma ti assicuro che il web è pieno zeppo di form che non le utilizzano.
C’è qualcosa di peggio del provare a indovinare cosa bisogna scrivere in un determinato campo? Non credo XD
In alcuni casi, è possibile nascondere l’etichetta una volta che il campo è stato completato, ma anche in questo caso si rischia di generare confusione nell’utente.
2. Evitare il design Z-Pattern
Il design Z-Pattern è un tipo di impaginazione che segue il percorso che l’occhio umano percorre quando legge: da sinistra a destra, dall’alto verso il basso, come la lettera Z.
Quando sistemi i campi del form a griglia, costringi l’utente a seguire il layout Z-Pattern.
Meglio evitarlo perché potrebbe confondere l’utente.
Quando i campi del form sono in linea verticale, gli utenti “scansionano” il form con un rapido sguardo ed è più facile per loro compilare i campi.
Anche posizionare le etichette a sinistra del campo da crea un modello Z: è preferibile quindi posizionarle sopra i campi del form.
Tieni presente che se il form ha solo uno o due campi, potrebbe non fare differenza dove posizioni le etichette.
Se decidi di posizionarle a sinistra dei campi, assicurati che il testo sia allineato a destra, perchè facilita a lettura della pagina da parte degli utenti e crea una gerarchia visiva simmetrica per il form.
3. Raggruppare i campi
I form molto lunghi scoraggiano gli utenti dal compilarli, il che porta a una diminuzione delle conversioni per te e la tua azienda.
Un rapido trucchetto visivo per renderli più accattivanti (e meno noiosi) consiste nel raggruppare i campi pertinenti in sottosezioni.
Per aumentare ulteriormente l’usabilità, puoi posizionare una CTA “Salva” in ogni sottosezione per consentire agli utenti di salvare ogni step, senza rischiare di perdere quanto inserito finora.
Quanto è fastidioso dover reinserire tutti i dati da capo? 🙁
4. Rispettare le regole e usare il buon senso!
Quando gli utenti compilano un form, completano un campo dopo l’altro e in fondo si aspettano di poter inviare il modulo con la loro richiesta: questa è una regola di UX e… buon senso.
Rispetta questa regola e posiziona il pulsante con la CTA vicino alla fine del modulo.
Questo è un esempio caratteristico dell’applicazione della Legge di Fitts nella progettazione di UI e UX: il tempo di raggiungimento di un obiettivo (un’area, un bottone) in un compito di puntamento dipende dalla distanza dell’oggetto da raggiungere e dalle dimensioni di tale oggetto. Banalmente, più grande e vicino è l’oggetto, più veloce sarà il movimento continuo che parte da una certa posizione e termina sopra l’obiettivo (Fonte: usabile.it).
Riguardo alla CTA, ricordati di optare sempre per le cose semplici e utilizzane una sola.
Se hai bisogno di più CTA, cerca sempre di inserirle come pulsanti secondari, meno evidenti rispetto alla CTA principale.
Inoltre, se puoi evita di utilizzare parole come “Invia“, “Iscriviti“, “Vai“, ma usa parole che mettano fine videnza l’azione.
Per esempio:
- Per un form di registrazione: “Crea il tuo account“
- Per un form di lista d’attesa: “Unisciti a 1000+ clienti“
- Per un form di feedback: “Inviaci il tuo feedback“
5. Dare spazio
Lo spazio bianco rimane sempre il tuo miglior amico!
Lascia abbastanza spazio tra i campi per rendere il tuo form più gradevole esteticamente.
6. Evitare le ripetizioni
Sempre meglio evitare di ripetere informazioni e dati: nei form in particolare è necessario prestare attenzione e omettere le informazioni che non necessarie.
Per esempio, se hai 3 campi obbligatori e 1 facoltativo, informa l’utente SOLO sul campo facoltativo.
Se hai 3 campi facoltativi e 1 obbligatorio, fai il contrario!
7. I messaggi di errore
Gli errori possono capitare e gli utenti lo sanno.
Ma si aspettano di capire perché c’è un errore e com’è possibile risolverlo.
Spiega sempre il motivo dell’errore con dettagli approfonditi e aiuta le persone a superarli.
8. Usare i menu a discesa solo quando necessario!
Scegliere il giusto elemento UI è fondamentale!
A volte potresti non essere sicuro di quale elemento scegliere, soprattutto tra menu a discesa (dropdown) e pulsanti di opzione.
Una regola comune consiste nell’utilizzare un menu a discesa quando si hanno più di 3 opzioni.
Quando ne hai meno, è meglio scegliere i pulsanti di opzione perchè consentono agli utenti di vedere subito tutte le opzioni.
9. Sfruttare i placeholders
I placeholders sono un ottimo modo per guidare le persone attraverso il form.
Mostra un valore di esempio per chiarire qual è il formato previsto per quel campo.
Placeholders generici non aggiungono alcun tipo di valore all’esperienza dell’utente.
10. Scegliere i campi giusti
Non utilizzare solo i campi di testo!
Adatta i campi al tipo di contenuto e scegli quello più giusto per i dati richiesti, per esempio un numero di telefono, l’URL del sito web, date, ecc.
Alcuni campi hanno delle limitazioni, come un limite massimo di caratteri utilizzabili, un range di numeri o date, ecc.
Avverti in anticipo gli utenti di queste limitazioni in modo da evitare la loro frustrazione.
2 comments
Comments are closed.