Un modulo viene inviato e la pagina diventa bianca. Non succede niente. La persona si chiede se il suo invio abbia funzionato. Il server l'ha ricevuto? Il modulo sta ancora elaborando? Deve inviare di nuovo? Quel momento tra il clic su invia e la certezza che l'azione sia riuscita è un momento di grande ansia. L'esperienza del modulo non finisce quando qualcuno clicca invia. Finisce quando sa di avercela fatta. Ciò che accade in quei momenti decide se si fiderà del tuo brand e se i dati raccolti saranno davvero utili.
Tre elementi controllano quel momento finale. Uno stato di caricamento mostra che qualcosa sta succedendo mentre il modulo elabora. Un messaggio di successo conferma che l'invio ha funzionato. Una pagina di ringraziamento guida a ciò che viene dopo. Fatti bene, questi tre elementi fanno sentire sicuri di aver fatto la cosa giusta. Fatti male, creano confusione e sfiducia. Questo articolo spiega cosa fa ciascuno, quando usarlo, cosa dire e come costruirli senza rovinare l'esperienza del modulo.
Perché gli stati di caricamento contano prima che il modulo finisca
L'invio del modulo avviene sul server. Quando qualcuno clicca invia, i suoi dati viaggiano verso un computer da qualche parte, vengono elaborati e torna una risposta. L'intero viaggio di solito richiede da uno a cinque secondi. Un secondo sembra istantaneo. Cinque secondi sembrano un'eternità. In quel tempo la persona è bloccata. Vede il modulo e non sa cosa fare. Inviare di nuovo? Aspettare? Ricaricare la pagina?
Uno stato di caricamento elimina quell'incertezza. Qualcosa di visibile cambia quando qualcuno clicca invia. Il pulsante si disattiva e cambia testo. Compare un indicatore rotante. Una barra di avanzamento mostra movimento. Qualcosa dice alla persona "la tua azione è stata registrata e sta succedendo qualcosa."
La regola più importante per gli stati di caricamento è la regola del secondo. Se l'invio del modulo richiede più di un secondo, mostra un indicatore di caricamento. Se richiede meno di un secondo, puoi saltare lo stato di caricamento visivo perché avviene così in fretta che le persone quasi non lo notano. Per quasi tutti i moduli reali collegati a un server, l'invio richiede più di un secondo. Mostra lo stato di caricamento.
Senza uno stato di caricamento, le persone spesso cliccano invia più volte. L'ansia le porta a pensare che il primo clic non abbia funzionato. Più invii creano dati duplicati, sprecano risorse del server e frustrano gli utenti. Un indicatore di caricamento lo evita segnalando chiaramente che l'azione è in corso.
Come progettare uno stato di caricamento che dà sicurezza
Lo stato di caricamento più semplice è disattivare il pulsante di invio e cambiarne il testo. Il pulsante normalmente dice "Invia". Al clic diventa "Invio in corso..." e si fa grigio o sbiadito. La persona vede che il pulsante non si può più cliccare. Sa che sta succedendo qualcosa. Funziona per la maggior parte dei moduli.
Un passo più avanti è aggiungere movimento visivo. Una piccola icona rotante compare accanto al testo del pulsante o al suo interno. L'indicatore ruota di continuo. Crea un senso di attività e di avanzamento. La velocità di rotazione conta. Un giro completo al secondo sembra regolare. Più veloce sembra frenetico. Più lento sembra bloccato. Mantieni il ritmo di un giro al secondo.
Per i processi più lunghi, una barra di avanzamento funziona meglio di un indicatore rotante. Una barra orizzontale in cima al modulo si riempie man mano che l'elaborazione procede. Se il modulo sa quanti passaggi deve eseguire, può mostrare un avanzamento realistico. Se non conosce la durata totale, usa una barra a percentuale che si riempie fino al 90% e si completa al successo. Questo dice alla persona esattamente a che punto è il processo.
Il colore del tuo indicatore di caricamento dovrebbe risaltare ma non stonare con il design del modulo. Usa il colore del tuo brand o un blu o grigio neutro. Il rosso o l'arancione possono sembrare un errore anche se non lo sono. Il verde potrebbe far pensare che il modulo sia già riuscito.
Tieni gli stati di caricamento essenziali. Il pulsante cambia. Compare un indicatore rotante. Il modulo non deve sfumare, i campi non devono disattivarsi e nuovo testo non deve entrare scorrendo da un lato. La semplicità costruisce fiducia. La complessità crea sospetto.
La differenza tra un messaggio di successo e una pagina di ringraziamento
Dopo che un modulo è stato inviato con successo, l'utente ha bisogno di una conferma. Quella conferma può arrivare in due modi. Un messaggio di successo in linea compare nella stessa pagina in cui c'era il modulo. Oppure il modulo reindirizza a una nuova pagina di ringraziamento con un messaggio di successo. Funzionano entrambi. La scelta dipende dal tuo obiettivo.
Un messaggio di successo in linea tiene l'utente nella stessa pagina. Il modulo sparisce o cambia per mostrare "Abbiamo ricevuto il tuo invio." Una conferma semplice e chiara. Funziona bene per i moduli piccoli o quando vuoi che l'utente resti sulla stessa pagina a esplorare altri contenuti. I moduli di contatto spesso usano messaggi in linea. Le iscrizioni alla newsletter spesso usano messaggi in linea. Veloce, semplice, hai finito.
Una pagina di ringraziamento è una pagina dedicata in cui l'utente arriva dopo l'invio. Esiste solo dopo che il modulo è stato inviato con successo. Ha un suo URL. È utile quando devi tracciare la conversione separatamente nelle statistiche, quando vuoi mostrare altri contenuti dopo l'invio o quando vuoi guidare l'utente verso il passo successivo di un funnel di vendita. I moduli di checkout dell'e-commerce reindirizzano a pagine di ringraziamento. I moduli per raccogliere contatti reindirizzano a pagine di ringraziamento. La pagina dedicata ti dà più spazio con cui lavorare.
La differenza tecnica conta per il tracciamento. Un messaggio in linea mostra la conversione nella stessa pagina del modulo. Una pagina di ringraziamento mostra una visualizzazione di pagina separata e un URL separato. Dal punto di vista del tracciamento, una pagina di ringraziamento è più pulita. È un evento distinto che gli strumenti di analisi possono misurare con precisione.
Cosa deve dire un messaggio di successo
Un messaggio di successo ha un solo compito: dire alla persona che il suo invio ha funzionato. Tutto qui. Non aggiungere testi di marketing, non proporre altri prodotti, non complicarlo.
Parti da una conferma chiara. "Grazie. Abbiamo ricevuto il tuo invio." Non "Il tuo invio è stato ricevuto con successo dal nostro sistema automatico." Il primo sembra umano. Il secondo sembra robotico e aziendale. La conferma dovrebbe sembrare personale e diretta.
Aggiungi subito il passo successivo. Se il modulo era una richiesta di contatto, di' quando la persona avrà una risposta. "Ti risponderemo entro due ore lavorative." Non "Ti ricontatteremo presto." Tempi precisi costruiscono fiducia. "Presto" è vago. Due ore è concreto.
Se l'invio attiva una risposta automatica, menzionala. "Controlla la tua email per il link di conferma." Oppure "Un link per reimpostare la password sta arrivando nella tua casella." Spiega cosa succede dopo senza far indovinare né far temere di aver perso qualcosa.
Facoltativo ma efficace: richiama qualcosa che la persona ha inviato. "Abbiamo ricevuto il tuo messaggio sull'ottimizzazione del sito. Daremo un'occhiata e ti faremo sapere." Rimandare indietro le sue stesse parole crea la sensazione di essere visti e capiti. Conferma che i suoi dati sono stati davvero ricevuti e registrati.
Tieni il messaggio breve. Una o due frasi per un messaggio in linea. Da tre a cinque frasi per il messaggio di una pagina di ringraziamento. I messaggi di successo lunghi sembrano spam o un ulteriore messaggio di vendita.
Usa un linguaggio caldo e colloquiale. "Grazie di averci scritto." Non "Grazie per aver completato l'invio di questo modulo." Il linguaggio colloquiale rende il momento umano, non automatico.
Progettare una pagina di ringraziamento che converte, non un vicolo cieco
Una pagina di ringraziamento è un momento di grande valore. La persona ha appena convertito. È di buon umore. Ha agito. Ha completato ciò che le hai chiesto. È il momento subito dopo il sì. È il momento di guidarla avanti, non di mandarla via.
In cima alla pagina di ringraziamento, ribadisci la conferma. "Grazie. Abbiamo ricevuto la tua richiesta." Sii breve. La persona sa già di avercela fatta. La conferma serve solo a renderlo ufficiale.
Sotto la conferma, aggiungi contenuti coerenti con ciò che ha appena fatto. Se si è iscritta a una newsletter, mostrale cosa riceverà. Se ha richiesto una demo, mostra i prossimi passi. Se ha fatto un acquisto, mostra i dettagli dell'ordine e i tempi di spedizione. Il contenuto deve sembrare la continuazione naturale di ciò che ha appena inviato.
Aggiungi una sola azione facoltativa. Non cinque. Non tre. Una. Cosa dovrebbe fare dopo? Esplorare il tuo sito? Leggere risorse utili? Seguirti sui social media? Prenotare una chiamata? Scegline una e fanne il centro della pagina. Più inviti all'azione in competizione confondono le persone. Hanno appena detto sì. Guidale avanti con un solo passo successivo chiaro.
Se vuoi raccogliere altre informazioni, una pagina di ringraziamento è un buon posto. Non chiederle nel modulo stesso. Chiedile dopo che la persona si è già impegnata inviando una volta. Un secondo modulo più leggero nella pagina di ringraziamento spesso converte meglio che infilare tutto nel primo modulo.
Includi una prova sociale se è pertinente. Una citazione di un cliente soddisfatto. Una statistica sulle persone che hanno fatto la stessa azione. Qualcosa che rafforzi l'idea di aver deciso bene. Non si tratta di convincerla a convertire. Ha già convertito. Si tratta di rafforzare la sua sicurezza in ciò che ha appena fatto.
Assicurati che il design della pagina corrisponda al resto del tuo sito. Una pagina di ringraziamento che ha un aspetto diverso, usa caratteri diversi o ha una combinazione di colori stridente fa sentire l'utente come se avesse lasciato il sito del tuo brand. La coerenza costruisce fiducia. La pagina di ringraziamento dovrebbe sembrare parte del tuo sito.
Gestire i tempi del passaggio dal modulo allo stato di successo
Quando qualcuno clicca invia, per quanto tempo lo stato di caricamento deve restare prima che compaia il messaggio di successo o la pagina di ringraziamento? La risposta è: finché il modulo sta davvero elaborando.
Per i moduli che si inviano molto in fretta, sotto il secondo, tieni comunque visibile lo stato di caricamento per almeno un secondo. Se l'invio dura in realtà 300 millisecondi ma il tuo indicatore sparisce dopo 400 millisecondi, le persone potrebbero pensare che qualcosa si sia rotto. Il passaggio dovrebbe sembrare voluto, non affrettato.
Per i moduli che richiedono da due a cinque secondi, mostra lo stato di caricamento per tutta la durata. Lascia che le persone vedano l'attesa. Non nascondere quanto sta durando il processo. La trasparenza costruisce fiducia.
Non mostrare mai uno stato di caricamento che sparisce e poi ricompare. Crea confusione. Mostralo una volta e tienilo visibile fino al successo. Se devi riprovare dopo un errore, elimina completamente lo stato di caricamento e mostra il messaggio di errore prima di riprovare.
Per i processi molto lunghi, oltre dieci secondi, valuta di mostrare aggiornamenti sull'avanzamento. Non solo un indicatore rotante. Un messaggio che cambia. "Verifica delle tue informazioni." Poi "Elaborazione della tua richiesta." Poi "Completamento dell'invio." Tre o quattro piccoli messaggi durante un processo lungo tengono le persone coinvolte e consapevoli che qualcosa sta ancora succedendo.
Cosa considerare su mobile per stati di caricamento e messaggi di successo
Sullo schermo di un telefono lo spazio è limitato. Un indicatore di caricamento che va bene su desktop può occupare troppo spazio su mobile. Una pagina di ringraziamento lunga su desktop diventa lunghissima su mobile.
Per gli stati di caricamento su mobile, tieni il testo al minimo. "Invio in corso..." invece di "Attendi mentre elaboriamo il tuo invio." Un indicatore rotante occupa meno spazio di una barra di avanzamento. Metti l'indicatore di caricamento dentro il pulsante di invio o direttamente sopra o sotto, non fluttuante al centro della pagina.
Per i messaggi di successo su mobile, tienili brevi. Una frase è l'ideale. Due frasi sono accettabili. Oltre, il messaggio esce dallo schermo.
Per le pagine di ringraziamento su mobile, metti il messaggio di conferma principale nei primi due paragrafi. Non far scorrere le persone in basso nella pagina per scoprire se il modulo è stato inviato davvero. Il messaggio di ringraziamento deve essere subito visibile senza scorrere.
Prova gli stati di caricamento e di successo su telefoni veri, non solo con l'emulazione del browser. La dimensione dello schermo e il rendering del telefono possono cambiare l'aspetto delle cose.
Analisi e tracciamento dei momenti finali del tuo modulo
La pagina o il messaggio di successo è il punto in cui misuri se il modulo ha davvero convertito. Piattaforme di analisi come Google Analytics, Meta Pixel e le piattaforme email possono tracciare con precisione il momento del successo.
Se usi un messaggio di successo in linea nella stessa pagina del modulo, imposta un trigger di conversione sulla comparsa di quel messaggio. Usa JavaScript per tracciare quando il messaggio compare, non solo quando la pagina si carica. Così sai esattamente chi ha inviato con successo, non solo chi ha visitato la pagina.
Se reindirizzi a una pagina di ringraziamento, il tracciamento è automatico. Ogni visualizzazione di quella pagina è una conversione. Per questo molti moduli usano pagine di ringraziamento. L'URL è unico. Gli strumenti di analisi lo capiscono perfettamente. Una visualizzazione di pagina equivale a un invio riuscito.
Aggiungi l'URL della pagina di ringraziamento agli obiettivi di conversione delle tue statistiche. In Google Analytics, crea un obiettivo che scatta quando qualcuno arriva su yourdomain.com/thank-you. Così ogni invio riuscito del modulo viene contato in automatico.
Se usi più moduli sul tuo sito, crea una pagina di ringraziamento unica per ciascuno oppure usa parametri URL per distinguerli. contact-form.com/thank-you contro demo-form.com/thank-you. Oppure usa parametri come /thank-you?form=contact. Così puoi tracciare quali moduli stanno convertendo.
Errori comuni che rovinano il momento del successo
Un messaggio di successo che non conferma che l'azione ha funzionato non è un messaggio di successo. È un vicolo cieco. "Grazie." E basta. Cosa dovrebbe fare la persona dopo? Dov'è la sua conferma? Rifiutarsi di chiarire crea sfiducia.
Gli stati di caricamento troppo lunghi o troppo brevi sembrano rotti. Un indicatore che ruota per 20 secondi fa pensare che qualcosa sia andato storto. Un indicatore che compare e sparisce in 100 millisecondi può passare inosservato.
Pagine di ringraziamento che cercano di vendere invece di riconoscere. Subito dopo che qualcuno converte non è il momento di proporgli qualcos'altro. Riconosci ciò che ha fatto. Guidalo avanti. Vendere può venire dopo.
Un messaggio di successo o una pagina di ringraziamento che ripetono informazioni che il modulo ha già chiesto. La persona ti ha già dato nome ed email. Non farglieli rileggere nella pagina di successo. Usali per personalizzare il messaggio, non per ripetere ciò che è stato raccolto.
Moduli mobile che mostrano stati di caricamento troppo grandi per lo schermo. Un indicatore che occupa metà dello schermo del telefono è opprimente. Tieni gli indicatori visivi proporzionati alla dimensione dello schermo.
Dimenticare di aggiungere un passo successivo chiaro. "Grazie per l'invio." E poi niente. Cosa dovrebbe fare la persona? Senza una direzione, se ne va. Una sola azione successiva chiara la mantiene coinvolta.
Come WEMASY ti aiuta a progettare stati di caricamento ed esperienze di successo
Il creatore di moduli di WEMASY include stati di caricamento integrati che compaiono in automatico quando un modulo viene inviato. Puoi personalizzare lo stile dell'indicatore di caricamento per adattarlo al tuo brand. Scegli tra un messaggio di testo, un indicatore rotante o una barra di avanzamento. Imposta il colore in linea con il tema del tuo brand. Lo stato di caricamento compare mentre i dati del modulo vengono elaborati e sparisce quando l'invio si completa.
I messaggi di successo sono completamente personalizzabili nel creatore di moduli. Scrivi il tuo messaggio. Scegli se compare in linea o se reindirizza a una pagina di ringraziamento. Se reindirizzi, WEMASY ti permette di indicare l'URL della tua pagina di ringraziamento. Il modulo reindirizza in automatico dopo un invio riuscito.
Per le pagine di ringraziamento, crea una pagina nel creatore di siti di WEMASY come qualsiasi altra pagina. Progettala in linea con il tuo brand. Aggiungi testo di conferma, prossimi passi, prova sociale o inviti all'azione secondari. Quando completi la configurazione del modulo, incolla l'URL della pagina di ringraziamento nelle impostazioni di reindirizzamento del modulo. WEMASY gestisce il reindirizzamento in automatico.
La validazione in tempo reale previene molti errori di invio prima che accadano. Quando i dati del modulo arrivano senza errori, l'invio avviene in modo pulito. Lo stato di caricamento compare brevemente e lo stato di successo scatta più in fretta. Meno errori significano invii più rapidi e meno tempo a mostrare stati di caricamento.
L'integrazione con le statistiche è integrata. WEMASY tiene traccia degli invii dei moduli e può attivare in automatico gli obiettivi di analisi. Quando un modulo viene inviato con successo, puoi impostare eventi in Google Analytics o Meta Pixel. Guarda quali campi dei moduli hanno i migliori tassi di conversione, quali moduli convertono più spesso e dove le persone abbandonano.
Guarda quali funzioni per i moduli sono incluse nel tuo piano WEMASY.