Come avere un e-commerce responsive mobile friendly.

Il tuo e-commerce è un sito web responsive?

Hai prestato attenzione ad ottimizzare il tuo sito web per i dispositivi mobile?

La navigazione e gli acquisti si stanno spostando verso il mobile da qualche tempo. Ecco perchè il tuo store online deve contare su un e-commerce responsive e ottimizzato. Vediamo quali sono i 3 interventi chiave da fare.

ASCOLTA L'AUDIO DEL BLOG-POST:

Secondo i dati ricavati dall’Osservatorio eCommerce B2c in collaborazione con NetComm, il 56% degli italiani ha completato il proprio acquisto da un dispositivo mobile nel 2020.

Gli acquisti si stanno spostando sui dispositivi mobile che richiedono una navigazione diversa e precisa per migliorare le conversioni. Si parla di sito web responsive per indicare un sito che si adatta ai dispositivi come smartphone e tablet. 

Cambia la disposizione degli elementi ma anche il grado di attenzione dell’utente: su uno smartphone non è disposto a perdere tempo nella ricerca di informazioni e il processo di pagamento deve essere ancora più asciutto e lineare della sua versione desktop.

🎯Clicca qui se vuoi prima leggere: Ottimizzare il tuo e-commerce

Ottimizzare un sito web richiede quindi uno sforzo che comprenda la presa in carico di una serie di considerazioni volte ad avere una versione dell’e-commerce facilmente navigabile, chiaro da capire e veloce per acquistare.

Vuoi scoprire come migliorare le performance ecommerce?

Vediamo quali sono i 3 aspetti fondamentali per un e-commerce responsive che possa dirsi davvero mobile friendly.

Design minimalista.

Su uno smartphone o un tablet la navigazione funziona a scorrimento verticale. Se un sito web richiede uno scorrimento praticamente infinito, la causa è da trovare in un eccesso di contenuto che non è mai positivo per un utente. Devi imparare a razionalizzare al meglio gli elementi che desideri pubblicare sul tuo sito: prova a definire un obiettivo per ogni pagina, quindi ogni blocco al suo interno. In questo modo saprai cosa è sacrificabile o meno. 

Il design di un e-commerce responsive deve essere quindi minimalista, ovvero chiaro, semplice e pulito. Ridondanza non va a braccetto con le conversioni, così come a livello visual devi puntare su elementi poco complessi. Scegli un font gradevole da leggere e presenta la categoria prodotto più venduta direttamente sulla Home page. 

Avere un design minimalista vuol dire rendere le informazioni accessibili e la navigazione intuitiva e sul mobile questo diventa ancora più importante. Cosa vuol dire pensare ad un design minimalista per un e-commerce responsive che sarà utilizzato anche (e soprattutto) da mobile?

• Valorizza gli spazi bianchi. 
• Elimina tutti gli elementi superflui.
• Non utilizzare troppi colori.
• Semplifica la navigazione limitando il numero di pulsanti ma inserendoli nel momento giusto.
• Usa un design semplice: senza ombre, transizioni di colore o struttura.
• Non usare più di 3 font per il tuo sito.

Un sito web minimalista riduce anche il lavoro per il browser, con tempi di caricamento più rapidi e migliori prestazioni e dà importanza al contenuto più che alla forma.

Accesso rapido alle informazioni.

In generale, più il tuo sito si carica velocemente, maggiori sono le probabilità di essere in cima alla lista dei risultati di ricerca Google. L'accesso rapido alle informazioni permette di evitare l'abbandono dell'e-commerce da parte degli utenti che si aspettano di accedere alle pagine in meno di 3 secondi. 

🎯Clicca qui se vuoi prima leggere: E-commerce veloce: come migliorare la velocità del sito

Da mobile questo è ancora più importante perchè i tempi di concentrazione si contraggono e l'utente impiega pochissimi secondi per decidere che quell'e-commerce non è abbastanza veloce per lui.

Migliorare la velocità di caricamento di un e-commerce responsive è quindi un'azione fondamentale per migliorare di conseguenza le possibiltà di conversione (passando prima dalla diminuzione del bounce rate). Puoi verificare la velocità del tuo sito web con diversi strumenti online e gratuiti, come GTMetrix o PageSpeed ma è importante che analizzi i risultati per capire quali sono le cause del rallentamento delle tue pagine. Vediamo come in due passaggi.

Attenzione alle immagini.

Puoi intervenire in prima persona per migliorare la velocità di caricamento direttamente sui contenuti da te caricati. Ad esempio, pensa alle immagini che hai usato: è buona norma usare immagini nel formato webp, uno standard aperto per la compressione con perdita di grafica di 24 bit sul web. Le immagini in questo formato sono circa il 30% più piccole dei file PNG o JPEG a parità di qualità dell’immagine.

Un'altra azione che puoi fare è quella di utilizzare la tecnica del lazy-loading, che consiste nel non caricare immediatamente tutti i contenuti della pagina, ma solo quelli visibili dall’utente. Gli altri elementi saranno caricati progressivamente mentre l’utente scorre la pagina.

Disposizione degli elementi.

Adottare una strategia mobile first vuol dire offrire contenuti semplici, accessibili e veloci da leggere. Questi contenuti devono essere ben organizzati tra le pagine: poiché un sito web resposive deve essere navigabile anche con un dispositivo ad orientamento verticale, metti gli elementi più importanti e attraenti nella parte superiore della pagina (quella cosiddetta “above the line”). 

🎯Clicca qui se vuoi prima leggere: User experience per e-commerce

Da mobile devi semplificare il più possibile l’esperienza di navigazione degli utenti. Devi quindi pensare a tutti gli elementi del tuo e-commerce responsive perchè siano inseriti in modo tale da adattarsi agli schermi di smartphone e tablet, ad esempio il menu deve includere tutte le categorie del tuo negozio ed essere in grado di adattarsi ai dispositivi mobili senza occupare più di 1/5 della pagina. 

Ricordati inoltre di lasciare un’icona di contatto sempre visibile, una chat, un numero diretto Whatsapp o i link alle pagine social.

Pagamenti rapidi.

Il momento del pagamento di un acquisto è cruciale e determina la fidelizzazione o l'abbandono definitivo dell'utente. Da mobile non c'è storia: se il flusso che porta al check-out non è lineare, se i metodi di pagamento sono scarsi e/o se il sito crolla o manca di certificati di sicurezza, l'utente è perso (e così la vendita). 

La tappa del pagamento dovrebbe essere la più rapida e semplice possibile. L'utente non deve perdere il suo tempo ad inserire i suoi dati, a capire se il sito è sicuro, a rodersi il fegato perchè manca Paypal.  

Cosa puoi fare per rendere più fluida la tappa del pagamento?

• Fai in modo che la soluzione di pagamento riconosca il tipo di carta di credito utilizzata durante il checkout così che l'utente possa risparmiare tempo.
• Assicurati che possa attivare automaticamente la tastiera numerica del cellulare al momento dell’inserimento dei dati della carta di credito.
• Proponi il pagamento con un click (i dati della carta di credito vengono salvati in occasione del primo acquisto così da non ripetere l'operazione per gli acquisti successivi).
• Rassicura i visitatori al momento del pagamento in merito alla sicurezza dei dati bancari mettendo bene in evidenza i sigilli di sicurezza.

Presta però attenzione anche alla resa visiva del processo di pagamento: personalizza la tua pagina di pagamento mettendo in evidenza il tuo logo, le diverse modalità di pagamento disponibili, l’icona del “pagamento sicuro”, così da infondere fiducia ed evitare l’abbandono del carrello al momento del checkout.

Conclusioni.

Quando si parla di sito web mobile friendly si fa riferimento ad un sito che si visualizzi correttamente da mobile. Non si dovrebbe nemmeno fare distinzione tra i siti che lo sono e quelli che non lo sono, perchè chi non ha un e-commerce responsive non ha un e-commerce che funziona.

Gli acquisti si stanno spostando dai dispositivi come smartphone e tablet, è un dato di fatto, quindi se ancora non l’hai fatto, accertati di avere un sito web ottimizzato per coloro che oggi stanno definendo sempre di più il numero complessivo di vendite online.