Design dei Moduli Web: Campi, Errori e Conversione

Ogni campo aggiuntivo è un punto di attrito che aumenta la probabilità che il visitatore abbandoni il modulo. In un modulo di richiesta servizio, nome, telefono e una breve descrizione di solito bastano; indirizzo, ruolo o budget si possono raccogliere in un secondo momento, in una chiamata successiva, non al primo contatto.

Alcuni settori fanno eccezione; lì un'informazione mancante rallenta il lavoro. Il modulo di prenotazione di un'azienda di noleggio auto non può gestire una richiesta senza data e tipo di veicolo; qui l'obiettivo non è il numero minimo di campi ma quelli giusti.

Se un campo contiene un errore, il visitatore dovrebbe vederlo nel momento in cui lo lascia, non dopo aver inviato l'intero modulo. Un campo email che segnala subito un formato errato stanca molto meno di dieci errori che compaiono tutti insieme dopo l'invio.

Ma un avviso a ogni tasto premuto è altrettanto fastidioso; se il visitatore vede «non valido» prima ancora di finire di digitare la parola, il modulo risulta inutilmente severo. Il momento giusto è quando il campo perde il focus.

Un messaggio generico come «input non valido» non dice al visitatore cosa fare. Uno concreto, come «l'indirizzo email deve contenere una @», evita che lo stesso errore si ripeta.

Se il formato del numero di telefono cambia in base al paese in un modulo di iscrizione a un'associazione, il messaggio di errore dovrebbe mostrare il formato atteso con un esempio; un'indicazione come «inserire nel formato 345 123 4567» evita al visitatore di dover indovinare.

La maggior parte dei moduli oggi viene compilata da telefono; dimensione dei campi, tipo di tastiera e area di tocco meritano quindi attenzione separata. Un campo telefono dovrebbe aprire la tastiera numerica, un campo email una tastiera con la @ a portata di dito; dettagli come questi si sommano e rendono un modulo sensibilmente più facile da completare.

• Il numero di campi resta limitato a ciò che il primo contatto richiede davvero
• La validazione scatta all'uscita dal campo, non a ogni tasto premuto
• I messaggi di errore indicano in modo concreto cosa correggere
• Tipo di tastiera corretto e aree di tocco sufficientemente grandi su mobile
• Cosa succede dopo l'invio (ringraziamento, email, chiamata) è indicato con chiarezza

Dove finiscono i dati dopo l'invio merita di essere trattato come parte del design tanto quanto l'aspetto visivo. Una richiesta che finisce direttamente in un CRM viene seguita più in fretta di una sepolta in una casella email; senza questo collegamento, anche un modulo ben progettato può trasformarsi in una richiesta che si perde silenziosamente lato team.

Tanto quanto la destinazione dei dati conta chi risponde e in quanto tempo; un'azienda che impiega tre giorni a rispondere dopo l'invio di un modulo lascia la stessa impressione di una che il modulo non lo propone affatto.

Un modulo lungo su un'unica schermata può risultare scoraggiante; suddividerlo in due o tre passaggi con un indicatore di avanzamento può migliorare il tasso di completamento. Ma suddividere in passaggi un modulo corto con pochi campi produce l'effetto opposto, aggiunge solo clic inutili.

In un ordine di prodotto digitale, separare la scelta del prodotto, poi i dati di fatturazione, poi il pagamento in passaggi distinti rende ciascuno più leggero; ma questo conviene solo a partire da cinque o sei campi.

Poco dopo la pubblicazione, un modulo può iniziare a ricevere invii da bot; un campo nascosto che solo un bot compilerebbe (honeypot) filtra la maggior parte dello spam senza far percepire a un visitatore reale un passaggio in più.

Se il modulo di contatto di uno studio legale riceve ogni settimana decine di invii senza senso, di solito la causa non è l'assenza di captcha ma la mancanza di qualsiasi protezione anti-bot di base; un campo honeypot e un limite di frequenza sugli invii bastano nella maggior parte dei casi.

Un captcha visibile va aggiunto solo come ultima risorsa, quando queste misure non bastano; perché ogni captcha è anche un punto di attrito in più per un visitatore autentico.