Le esperienze di mobilità sono ormai la norma
Gli smartphone sono ovunque e hanno attirato la nostra attenzione. Forse anche troppo! Basandomi sul vedere i volti dei miei ragazzi quasi costantemente sepolti nei loro schermi, sono sicuro che l'utilizzo del sito web mobile aumenterà ulteriormente in futuro.
Quindi, quando realizziamo il design delle conversioni, dobbiamo essere consapevoli di questa realtà. Dobbiamo renderci conto che lo smartphone non è dove avviene la conversione, ma più spesso dove inizia – il primo o il secondo touchpoint – specialmente quando si tratta di scenari di utilizzo di lead generation, ma anche per l'e-commerce.
In questo post, per prima cosa evidenziamo come le esperienze degli utenti di dispositivi mobili differiscono dalle loro controparti desktop. Poi condivido i miei primi quattro, seguiti dai miei quattro migliori progetti di conversione per dispositivi mobili. Segui questa guida e altre best practice per dispositivi mobili e il tuo sito vedrà presto conversioni e entrate più elevati.
Scarica la nostra risorsa premium – Guida SEO mobile
Quello che devi sapere per vincere con la moderna SEO mobile-first.
Accedi alla guida SEO mobile
Ciò che rende uniche le esperienze mobili
Prima fammi definire cosa intendo per 'mobile'. 'Mobile' include qualsiasi dispositivo di dimensioni che va da uno smartphone a un phablet (un ibrido tablet-telefono), a un mini tablet e un tablet. Negli ultimi due anni, gli smartwatch sono stati aggiunti a questo mix mobile.
Anche se i tablet sono ancora ampiamente utilizzati, spesso si trovano in situazioni stazionarie (ad es. Mentre couchsurfing), che non mettono tanto peso interattivo e di pensiero sui loro utenti. Qui mi concentrerò sugli smartphone poiché vengono utilizzati principalmente "in the wild", in scenari in cui l'utente è spesso:
- In movimento (che diminuisce il coordinamento)
- Usare il telefono all'esterno (in condizioni di abbagliamento)
- Usando il telefono con una mano
- Multitasking
- sospeso
- Di fretta
Quando usiamo i nostri smartphone siamo fondamentalmente dei bambini poster per ADD (disturbo da deficit di attenzione). In effetti, la recente ricerca sui fattori umani ha dimostrato che l'uso di uno smartphone mentre svolge un altro compito equivale a essere intossicato legalmente. Chiaramente, non stiamo "seguendo una linea retta", mentalmente o fisicamente, quando siamo al telefono.
4 DO di del design della conversione mobile
1. FARE un progetto di conversione "mobile first"
Hai già un sito web mobile reattivo? Questo è un ottimo punto di partenza. Tuttavia, per ottenere i migliori risultati di coinvolgimento e conversione dei visitatori, è necessario progettare e implementare un'esperienza utente "mobile first".
Questo approccio è spesso chiamato design "adattativo" poiché esponi funzionalità e funzionalità diverse per schermi di dimensioni di dispositivi mobili più piccoli (quelli che gli sviluppatori Web chiamano spesso "viewport"). Fondamentalmente, è un'ammissione che "una misura non si adatta a tutti" quando si tratta del tuo progetto di conversione. Quindi, come si fa?
Innanzitutto, poniti queste domande:
- Quali funzioni sulla mia esperienza desktop si applicano nel contesto mobile?
- Quali caratteristiche sul mio sito desktop mancano (per i miei visitatori avere una grande esperienza di "primo contatto" con il mio marchio)?
- Quali punti di navigazione e di accesso sono più rilevanti per gli utenti di dispositivi mobili?
- Quali dei miei obiettivi di business posso raggiungere al meglio sui dispositivi mobili (ad esempio, acquisizione e promozione delle e-mail e vendite)?
- Come posso ridurre il mio contenuto per facilitare la scansione e il coinvolgimento rapidi?
Di seguito sono riportati alcuni screenshot dal sito Web EddieBauer.com.
Si noti che sul sito mobile EddieBauer.com:
- Il menu si riduce a un menu "hamburger" in modo che non occupi troppo spazio.
- Per garantire che i pulsanti "shop men" e "shop women" siano visibili nella vista predefinita, non mostrano la barra "Join adventure awards" nella parte superiore.
- Il sito utilizza un'informazione (l'icona 'i') nella barra rossa 'Sale' e omette i collegamenti 'Uomo', 'Donna' e 'Ingranaggio' – al fine di ridurre il disordine.
- I prodotti "Consigliati per te" non si spostano automaticamente verso destra (come accade sul sito desktop), il che riduce la distrazione visiva.
Chiaramente, mentre Bauer ha un aspetto coerente per le proprie esperienze desktop e mobili, ha adattato il sito mobile al suo diverso schema di utilizzo.
2. FARE completamente la velocità di carico del tuo sito
Come ho notato in precedenza, i tuoi visitatori mobili hanno spesso fretta, nel tentativo di completare le attività in breve tempo. E a volte hanno davvero bisogno dell'informazione proprio adesso. Secondo uno studio del 2015 condotto da ComScore Media Metrix:
- Il 53% dei visitatori mobili si interrompe se un sito mobile impiega più di 3 secondi per caricarsi.
- Secondo Google, la velocità della pagina è un elemento chiave delle conversioni della pagina di destinazione e ha un grande impatto sul punteggio di qualità di AdWords.
- La velocità della pagina ha un impatto significativo sulla classifica della pagina dei risultati dei motori di ricerca (SERP) di un sito.
La linea di fondo: quando tu – o il tuo partner di sviluppo mobile – stai sviluppando il tuo sito mobile, devi ottimizzare spietatamente il codice e le chiamate dati. Quindi è necessario testare l'esperienza dell'utente mobile in condizioni realistiche, ad esempio su telefoni di 2 anni collegati a reti wireless meno di 4G. Se non lo fai, rischi che i tuoi visitatori se ne vadano prima ancora di iniziare a fare acquisti.
3. FARE CTA facili da vedere e fare clic
Nella progettazione della conversione, si tratta di portare i visitatori lungo il "percorso felice" verso una conversione (o almeno un passaggio verso una conversione). E per fare questo è necessario disporre di contenuti accattivanti, adattati per dispositivi mobili e inviti all'azione grandi e chiari (CTA).
Ecco la parte inferiore della pagina del prodotto sullo stesso sito mobile EddieBauer.com:
Tieni presente che il pulsante "Aggiungi al carrello" si distingue chiaramente sullo sfondo. Lo farebbe anche se visualizzato in una luminosa giornata di sole. Nota anche che le selezioni 'Tipo di taglia' e 'Dimensione' sono 1-touch, risparmiando al visitatore il lavoro extra – e il focus di interazione – necessario per usare i selettori pop-up.
La pagina include anche l'opzione 'Salva in lista dei desideri', che consente a questo visitatore di navigare più facilmente ora e acquistare in seguito. '
4. FARE Semplificare le voci del modulo di contatto
Il buon design delle conversioni, ovviamente, impone di non includere campi non essenziali nei moduli di contatto o generazione di lead. Questo è doppiamente vero per i siti mobili. È perché:
- Ogni voce ha un carico di pensiero in più – che viene amplificato quando l'utente è in movimento.
- Digitare i campi è un po 'più complicato quando ci si sposta. Richiedere ai visitatori di smettere di digitare allungherà il loro tempo di compilazione.
Entrambi questi fattori aumentano la probabilità di salvataggio della forma. E se il tuo visitatore si impenna, chissà se torneranno mai.
Ricorda il tuo obiettivo per i visitatori della fase iniziale: acquisire un indirizzo email o qualche altra voce a basso impegno in cambio del fatto che tu dia loro qualcosa di valore. È sempre possibile ottenere ulteriori dettagli nelle e-mail di follow-up o altre comunicazioni.
Il fornitore di contabilità basato su cloud Freshbooks mantiene le cose semplicissime nella loro forma di piombo "Provalo gratis"; chiedono solo un'e-mail e una password.
Nella pagina successiva, dicono "per mantenere le tue informazioni sicure e protette", devi verificare la tua email. Questa è una spiegazione chiara – e un buon modo per iniziare a creare fiducia nel loro marchio.
4 NON FARE del design della conversione mobile
Ora che ho coperto ciò che tu dovresti … dovrebbe, Evidenzierò le cose migliori non dovrebbe fare quando realizzi la tua esperienza di conversione da dispositivo mobile.
1. NON costringere i tuoi visitatori a ricordare informazioni
Permettetemi innanzitutto di darvi un primer di memoria veloce: le ultime ricerche indicano che il cervello può contenere solo 4 pezzi di informazioni alla volta nei suoi magazzini temporanei, o "memoria di lavoro", prima che svanisca. (Ciò è contrario a ciò che ci ha riferito la ricerca "sette, più o meno due" di George Miller a metà degli anni '50). Soprattutto quando siamo impegnati, stressati o stanchi, non riusciamo a tenere tanto nelle nostre teste.
Perché lo sto spiegando? Perché troppo spesso le esperienze mobili ci aspettano di ricordare molto di piu di 4 pezzi, per più di 20-30 secondi ci vuole per inserire queste informazioni su un'altra schermata. Ecco alcuni problemi comuni relativi alla memoria, insieme alle soluzioni:
- Più lunghe frasi di livello di lettura dell'ottavo tassano la memoria di lavoro. Scrivi frasi più brevi, con più interruzioni di paragrafo e ad un livello di lettura più basso (ad esempio un livello di quinta elementare è una linea guida più sicura).
- I numeri di telefono sono scomodi da copiare e incollare nei moduli. Salva i tuoi visitatori questa seccatura pre-compilando il numero memorizzato nella SIM del telefono (memoria interna) direttamente nel campo Numero di telefono.
- L'immissione di e-mail o di indirizzi è davvero complicata per i dispositivi mobili. Abilita il "completamento automatico" per le voci del modulo in modo che, quando il visitatore inizia a inserire il proprio indirizzo email, le email e gli indirizzi stradali cucinati dal browser appariranno come scelte disponibili.
Ecco il mio personale problema: i siti web per cellulari che non consentono un oggetto click-to-call per i numeri di telefono di contatto (che, se premuto, aprono direttamente l'app del telefono nativo, con il numero di telefono precompilato). L'implementazione di questo è semplice e può solo aiutare le tue conversioni.
2. NON 'andare per la chiusura' prematuramente
Nelle vendite c'è un detto: 'stai sempre chiudendo'. In molti contesti di acquisto fisico questo può avere senso. Ma in genere nelle esperienze di acquisto di dispositivi mobili in fase iniziale, la chiusura anticipata può essere scoraggiante e danneggiare le conversioni a valle.
Se sei come la maggior parte dei venditori online hai più fonti di lead: lead diretti (di marca), lead organici, lead a pagamento, lead di social media. E ogni fonte di traffico potrebbe aver bisogno di essere nutrita in modo diverso. Tienilo a mente per tutti i tuoi canali: il tuo obiettivo dovrebbe essere prima di tutto inizio una relazione, quindi per sviluppare un altro personalizzato e impegnato relazione, nel tempo, con ciascuno dei tuoi potenziali clienti.
Sfruttate il principio di reciprocità: date loro qualcosa di valore in cambio di qualcosa che volete ottenere in cambio. Per esempio:
- Richiedi un indirizzo email in cambio di uno sconto sul loro primo ordine.
- Richiedi informazioni più specifiche (per chiarire le loro preferenze personali) in cambio di un regalo gratuito (ad esempio una carta di caffè).
- Richiedi l'iscrizione di prova gratuita in cambio di un numero di carta di credito o di altri metodi di pagamento.
Andare per la chiusura troppo presto e ti sarà solo alienare la tua prospettiva. Definisci invece i tuoi obiettivi di "micro-conversione" (le azioni di conversione sul percorso verso la tua conversione definitiva), quindi definisci le campagne email e altre creatività che ti "manterranno" facendo clic su ". In questo modo, imposterai i tuoi visitatori a comprare in un secondo momento.
3. NON usare troppa area dello schermo per la navigazione
Per le esperienze mobili, lo spazio su schermo – ciò che gli sviluppatori chiamano "dimensione del viewport" – è un premio. Quindi è necessario utilizzare ogni pixel di esso con saggezza.
Dovresti solo esporre i tuoi link di navigazione, i pulsanti e gli inviti alla navigazione più utilizzati nella parte principale della pagina. Inserisci altre opzioni di navigazione in un menu "hamburger" in alto a sinistra o a destra. Non sei sicuro di quale sia la navigazione più utilizzata? Controlla le tue analisi per vedere le tue statistiche sui clic.
Inoltre, la grafica banner e altri controlli dovrebbero essere il più piccoli possibile per focalizzare l'attenzione sul contenuto. Dopotutto, questo è ciò che i tuoi visitatori vogliono consumare e ciò che vuoi che facciano clic.
Ecco un esempio di un sito – per un avvocato aziendale – che spreca molto spazio sullo schermo:
Mentre hanno un menu compresso, usano il 90% della loro vista predefinita per dichiarare l'ovvio, piuttosto che dichiarare la loro proposta di valore e un chiaro CTA. il visitatore deve scorrere verso il basso – fino in fondo – per ottenere risposta alle loro domande.
Ed ecco un esempio di un noto marchio legale che utilizza più saggiamente il loro schermo immobiliare:
Nota come dichiarano chiaramente cosa fanno e offrono link di azione diretti a ciascuna delle loro aree di servizio. Anche la loro grafica è minimalista, il che riduce i tempi di caricamento della pagina.
4. NON sforzare gli occhi dei tuoi visitatori
Lo ammetterò – non sono un pollo primaverile, e la mia vista non è più quella di una volta (anche con gli occhiali). Ma a quanto pare non sono solo io. Secondo un rapporto del 2016 del National Health Survey, 25,5 milioni di adulti americani 18 e più anziani hanno riportato di aver subito una perdita della vista. Di questi 25,5 milioni di adulti americani, 15,3 milioni di donne e 10,1 milioni di uomini riferiscono di aver subito una significativa perdita della vista. Ciò significa che quasi l'8% degli americani ha un problema di visione significativo.
Anche le persone con gli "occhi da aquila" non possono facilmente leggere piccoli testi velocemente sullo schermo di uno smartphone in condizioni di alta luminosità. Quindi, cosa dovresti fare?
Per i principianti, rendere i caratteri predefiniti più grandi e più scuri. Il contrasto deve essere abbastanza alto affinché le parole siano leggibili. Anni fa ho appreso da un collega e esperto di tipografia che i caratteri dovrebbero essere alti almeno ¼ di pollice per garantire la migliore leggibilità. E dovrebbero essere testo nero (o grigio molto scuro) su uno sfondo bianco (o quasi bianco). Il principale takeaway: rendi i tuoi stili di carattere chiari e grandi, soprattutto se i tuoi clienti target hanno più di 40 anni.
Dai del tuo sito mobile un po 'd'amore
Ora è un mondo completamente mobile e le nostre esperienze utente devono essere adattate a ciò che rende unici i siti per dispositivi mobili. Il fatto è che i visitatori dello smartphone sono spesso in movimento, distratti e mentalmente sovraccarichi. (Noi umani non possiamo veramente fare il multitasking – questo è un mito, basta cercare su YouTube "per mandare messaggi di testo mentre si cammina male" per vedere la prova di questo).
Quindi, se vuoi catturare più lead, in modo da poterli coltivare in seguito, devi KISS (mantenerlo semplicemente stupido) – ottimizzando i tuoi layout per i dispositivi mobili, e usando una copia più breve e di facile lettura e pulsanti grandi e luminosi . E devi ridurre il pensiero e l'interazione carica il tuo cervello. Solo così puoi guidare i tuoi visitatori lungo il percorso felice verso una conversione downstream, che si tratti di un telefono o di uno schermo più grande.
