[vc_row][vc_column][vc_column_text]

Best practice e consigli utili per realizzare l’E-Commerce perfetta

La necessità di avere un sito responsive è ormai in cima alla tua lista: altrimenti rischi di rinunciare a una bella fetta di utenti, lettori e (probabilmente) clienti.

Ma di cosa stiamo parlando? Un sito responsive offre un design che si adatta perfettamente a qualsiasi schermo, a qualsiasi device. Lo apri su desktop? Si naviga alla grande e fin qui nulla di speciale. Lo apri su tablet? Sorpresa, si vede e si legge bene.

La prova del nove: apri il sito con uno smartphone e navighi senza problemi. Non devi ingrandire lo schermo, non devi adattare il font e costringere gli occhi a una lettura sacrificata. In altre parole, il design responsive è perfetto per la tendenza del web.

Una tendenza che vede gli smartphone e i tablet centrali nella fruizione dei contenuti online. Le persone leggono, sfogliano foto e cataloghi, acquistano su tablet, smartphone e device mobili.

Ecco i punti fondamentali da rispettare per una tipologia di sito particolarmente delicata: gli e-commerce.

Base di partenza

Il primo punto da rispettare è la griglia fluida. Gli elementi non devono rimanere fissi ma adattarsi e riposizionarsi all’interno dello spazio disponibile sulllo schermo. Inoltre non devono mancare immagini flessibili e le istruzioni delle media queries che permettono di individuare le caratteristiche del device utilizzato.

Nella parte superiore del sito, nel masthead, ci sono diversi elementi da studiare con attenzione. Qui si trovano diverse componenti come il logo e l’header, ma lal più importante è la navigazione primaria. Semplicemente perché permette ai futuri acquirenti di scoprire ogni sezione del sito.

Immagini della galleria

Impossibile rinunciare alla galleria immagini perché permette di valutare e visionare il prodotto. Puntare sulle immagini vuol dire facilitare la vita del cliente: lascia la preview e permetti alla singola immagine di ingrandirsi una volta cliccata.

Descrizione dei prodotti

La descrizione del prodotto è fondamentale perché permette all’utente di decidere. Deve dare tutte le indicazioni possibili senza appesantire la pagina, senza parole e frasi inutili. Una buona norma: accompagnare la descrizione con il rating, le famose stelline, e i bottoni per la condivisione sui social.

Dettagli da non dimenticare sono i prodotti correlati e le recensioni degli utenti. Anche se stai lavorando su una versione responsive del tuo e-commerce, e quindi da adattare anche a schermi più piccoli, ricorda che questi elementi possono fare la differenza. Quindi devi trovare il giusto spazio.

Footer

Quali sono i punti da rispettare per un e-commerce responsive? La presenza di un menu principale per permettere alle persone di raggiungere altre risorse, i dati necessari per contattare anche via telefono il servizio clienti (fa sempre comodo avere un riferimento reale quando si acquista online) e un link/pulsante per ritornare all’inizio della pagina.

Prevedi un main menu mobile con labeling esplicito (MENU)

Oppure una icona facilmente riconoscibile: tipo le 3 linee orizzontali ormai sono uno standard per ogni applicazione mobile e sicuramente risultano familiari agli utenti, ma da alcuni nostri test la scritta MENU vera e propria è più intuitiva.

Il main menù deve essere fixed

Cioè ancorato nella parte alta dell’header e sempre visibile anche scrollando la pagina web, in modo che l’utente abbia un rapido accesso alle voci di menù principali.

Call to action principali sempre in vista e a portata di click.

Prevedi un’icona o un pulsante associato alle azioni più importanti che vuoi vengano effettuate dall’utente: chiama (click to call), prenota, acquista. Stesso discorso per le sezioni del sito riguardanti il processo di acquisto, come il carrello.

Utilizza un pre-loader

Dato che tablet e smartphone non sempre navigano in Wi-Fi ma vengono utilizzati anche con connessioni mobile non velocissime, spesso il caricamento delle pagine web può essere lento e frustrante, causando l’abbandono da parte dell’utente. Inoltre può accadere che le pagine web vengano caricate a pezzi, penalizzando la resa grafica e l’esperienza di navigazione di un sito. Per questo motivo è consigliabile utilizzare un preloader che indica all’utente il caricamento in corso ed evita di svelare la pagina quando è incompleta.

Ottimizza le performance

Questo è il consiglio più importante di tutti! Un sito responsive per essere veramente efficace deve essere il più veloce possibile, così da ridurre i tempi di caricamento al minimo. Gli utenti in generale, ma ancor di più quelli mobile, sono poco pazienti, per cui un sito lento verrà abbandonato inesorabilmente dalla stragrande maggioranza dei visitatori.

Ricerche evidenziano che ogni secondo di ritardo nel caricamento di una pagina web corrisponde ad una riduzione del tasso di conversione del 7%. 

Altro dato emblematico è questo:  il 40% degli utenti abbandonano un sito se impiega più di 3 secondi a caricarsi.

A te la parola

Tu hai già adottato un design responsive per i tuoi siti, i tuoi blog e il tuo e-commerce? Secondo te è diventato indispensabile? Possiamo ancora lavorare online senza responsive design?

Cosa possiamo fare per te?

Komunikasi, agenzia di riferimento a Modena nell’ambito della realizzazione di piattaforme ecommerce di successo, si pone l’obiettivo di soddisfare i bisogni dei propri clienti sostenendo gli stessi durante tutto il processo di digitalizzazione e sviluppo del business, in Italia e all’Estero.[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row” ct_row_class=”row-bg-gradient” bg_image_position=”bg-image-ps-center” css=”.vc_custom_1552661485306{padding-top: 57px !important;padding-bottom: 120px !important;background-image: url(https://komunikasi.it/wp-content/uploads/2019/03/bg-map.png?id=901) !important;background-position: 0 0 !important;background-repeat: no-repeat !important;}”][vc_column ct_column_class=”rm-padding-lg” css=”.vc_custom_1540915378656{padding-top: 64px !important;padding-right: 0px !important;}” offset=”vc_col-lg-6 vc_col-md-6″][ct_heading text=”Contattaci per qualunque tipo di informazione” font_size_md=”48″ font_size_sm=”36″ font_size_xs=”32″ font_weight=”” text_color=”#ffffff” subtitle=”Contatti” subtitle_color=”#ffffff” margin_bottom=”66″][ct_contact_info title_type=”tel” icon_fontawesome=”fa fa-phone” contact_list=”%5B%7B%22icon_list%22%3A%22fontawesome%22%7D%5D” social_list=”%5B%7B%7D%5D” title=”059 97 81 817″ description=”+98(897)67 43 67″ subtitle=”Telefono”][vc_empty_space height=”35px”][ct_contact_info title_type=”email” icon_fontawesome=”fa fa-envelope” contact_list=”%5B%7B%22icon_list%22%3A%22fontawesome%22%7D%5D” social_list=”%5B%7B%7D%5D” title=”info@komunikasi.it” description=”+98(897)67 43 67″ subtitle=”Email”][vc_empty_space height=”35px”][ct_contact_info icon_fontawesome=”fa fa-map-marker” contact_list=”%5B%7B%22icon_list%22%3A%22fontawesome%22%7D%5D” social_list=”%5B%7B%7D%5D” title=”Via Poletti 18, Modena (MO)” description=”+98(897)67 43 67″ subtitle=”Indirizzo”][/vc_column][vc_column ct_column_class=”rm-padding-lg” css=”.vc_custom_1540915383273{padding-top: 60px !important;padding-left: 110px !important;}” offset=”vc_col-lg-6 vc_col-md-6″][vc_empty_space height=”70px”][ct_contact_form id=”94″][/vc_column][vc_column][ct_heading text=”Vieni a Trovarci” align_lg=”align-center” align_md=”align-center-md” align_sm=”align-center-sm” align_xs=”align-center-xs” font_size_md=”48″ font_size_sm=”36″ font_size_xs=”32″ font_weight=”” text_color=”#ffffff” subtitle=”Mappa” subtitle_color=”#ffffff”][vc_gmaps link=”#E-8_JTNDaWZyYW1lJTIwc3JjJTNEJTIyaHR0cHMlM0ElMkYlMkZ3d3cuZ29vZ2xlLmNvbSUyRm1hcHMlMkZlbWJlZCUzRnBiJTNEJTIxMW0xOCUyMTFtMTIlMjExbTMlMjExZDI4MzguNDc2MDQ3NTI5MTA4JTIxMmQxMC45MzQ5NTc2MTU4MDAzODclMjEzZDQ0LjY0ODYyNDY5NTUxMDA2NSUyMTJtMyUyMTFmMCUyMTJmMCUyMTNmMCUyMTNtMiUyMTFpMTAyNCUyMTJpNzY4JTIxNGYxMy4xJTIxM20zJTIxMW0yJTIxMXMweDQ3N2ZlZjNjNmEwNzhkZmIlMjUzQTB4OTk0M2YxMjEyMDIwMGRlOCUyMTJzVmlhJTJCTHVpZ2klMkJQb2xldHRpJTI1MkMlMkIxOCUyNTJDJTJCNDExMjElMkJNb2RlbmElMkJNTyUyMTVlMCUyMTNtMiUyMTFzaXQlMjEyc2l0JTIxNHYxNTUzMTg2NjA2MDI4JTIyJTIwZnJhbWVib3JkZXIlM0QlMjIwJTIyJTIwc3R5bGUlM0QlMjJib3JkZXIlM0EwJTIyJTIwYWxsb3dmdWxsc2NyZWVuJTNFJTNDJTJGaWZyYW1lJTNF” size=””][/vc_column][/vc_row]