9 modi per creare pagine di prodotti Shopify ad alta conversione

Per i proprietari di negozi di e-commerce, la pagina del tuo prodotto merita molta della tua attenzione. Ci sono così tanti elementi da considerare, ma anche molte opportunità per creare una fantastica esperienza di acquisto per i tuoi clienti.

In questo articolo, esamineremo alcune delle aree su cui puoi concentrarti per ottimizzare davvero le pagine dei tuoi prodotti e-commerce per conversioni più elevate, una migliore esperienza di acquisto e trasformare i tuoi browser in acquirenti.

1. Traccia gli elementi della pagina del tuo prodotto

Il primo passo nella progettazione di una pagina di e-commerce ottimizzata per le conversioni è incorporare gli elementi comunemente utilizzati nelle pagine di e-commerce di successo.

Osservando come esempio un negozio popolare come Asos, possiamo identificare alcuni dei fattori importanti che hanno riscontrato che hanno funzionato bene nella pagina del prodotto.

Con le pagine dei prodotti che hanno un impatto così significativo sulle conversioni, puoi essere certo che Asos dedicherà risorse per testare e ottimizzare ogni singolo componente.

Questa attenzione ai dettagli è evidente se osserviamo come una tipica pagina di prodotto viene caricata al rallentatore, con un limite di 250 kb/s (o una normale connessione 3g). L'ordine di caricamento di ciascun componente fornisce alcune indicazioni sull'importanza di ciascun componente.

L'ordine di caricamento degli elementi va:

• Navigazione e logo . L'utente dovrebbe sempre sapere dove si trova e avere un modo per navigare rapidamente verso altre pagine.
• Miniature dei prodotti. Le immagini comunicano che l'utente è sulla pagina giusta e fornisce loro un'anteprima della pagina prima che sia completamente caricata.
• Titolo del prodotto e breadcrumb. Inoltre, conferma la scelta dell'utente e offri loro una rapida opzione per tornare a una categoria simile
• Immagine del prodotto principale . La foto del prodotto è ciò che il cliente sta cercando. Si noti che questi vengono caricati anche prima dell'invito all'azione, nonostante le immagini siano in genere di dimensioni file maggiori.
• Invito all'azione . Il pulsante Aggiungi al carrello
• Informazioni extra . Ulteriori informazioni sul prodotto che si trovano sotto la piega vengono caricate per ultime.

Analizziamo ulteriormente alcuni dei componenti della pagina del prodotto Asos.

2. Evidenzia le foto del prodotto davanti e al centro

Asos è un sito ricco di contenuti che utilizza la fotografia in vari modi. Quando sei sulla home page, non vedrai foto che collegano a prodotti specifici, ma piuttosto a collezioni.

Ma quando un cliente fa clic su un prodotto, è una storia diversa. La prima cosa che vedono è un'immagine del prodotto in primo piano. I pochi contenuti rimasti above the fold sono tutti allineati attorno a questa galleria fotografica principale.

Parleremo di più dell'importanza della varietà di diverse foto utilizzate da Asos, ma il posizionamento e la prominenza sono ciò che è importante ora. Le foto dei prodotti aiutano i clienti a discernere immediatamente i dettagli di un prodotto più velocemente di qualsiasi descrizione e li aiutano a trovare il prodotto che stanno cercando più rapidamente. Devono essere posizionati in modo ben visibile e caricati rapidamente.

3. Visualizza chiaramente le informazioni sulla spedizione

Asos non solo ha banner di consegna e resi gratuiti, ma si collega anche ai dettagli di spedizione gratuita in tutto il mondo accanto al prezzo. Questi tipi di promozioni e-commerce possono influenzare in modo significativo le decisioni di acquisto.

Gli elevati costi di spedizione sono considerati il ​​motivo principale per cui i consumatori abbandonano il carrello e il 93% dei consumatori afferma che acquisterebbero più prodotti se fosse disponibile la spedizione gratuita. Sapendo questo, Asos fa tutto il possibile per promuovere la sua offerta di spedizione gratuita.

4. Includi dettagli extra

Mentre la pagina del prodotto Asos potrebbe avere informazioni sparse above the fold, una miniera di informazioni extra sul prodotto è prontamente disponibile per il cliente che è interessato a saperne di più.

Poiché i clienti non possono provare fisicamente il prodotto o porre domande a un venditore, devi fare tutto il possibile per aiutarli a istruirli e fornire risposte alle loro domande.

Che tipo di dettagli dovresti includere?

Queste informazioni possono includere dettagli come:

• Il materiale del prodotto
• Lo stile
• Caratteristiche di design significative
• Istruzioni per la cura e la manutenzione
• Informazioni sul marchio o sul produttore
• Meta-informazioni come SKU che possono aiutare il cliente a condurre ulteriori ricerche o a contattarti.

Per i marchi di moda, questi dettagli extra possono essere particolarmente importanti. Asos include anche le misure del modello e la taglia che indossa in modo che il cliente possa valutare con maggiore precisione come questo prodotto si adatterà a lui.

Perché queste informazioni extra sono così importanti?

Per uno, avere descrizioni di prodotti uniche può essere un ottimo modo per aumentare il traffico del tuo motore di ricerca organico. Ma dovrebbero anche aiutare a rispondere alla domanda sul motivo per cui un cliente dovrebbe scegliere i tuoi prodotti o negozio rispetto a uno concorrente. Fornire questi dettagli aggiuntivi mostra che hai un livello di competenza sul prodotto maggiore rispetto al semplice elenco dei dettagli di base riconoscibili da una foto del prodotto.

Maggiori informazioni significano anche che un cliente può fare una scelta informata in modo indipendente, e questo non è solo un bene per loro. Aiutare il cliente a effettuare un acquisto in cui è fiducioso può contribuire a ridurre l'assistenza clienti e a ridurre i resi.

5. Presenta un chiaro invito all'azione

Un'altra caratteristica del design delle funzionalità del sito Web Asos è il chiaro invito all'azione disponibile sulle pagine dei prodotti.

Non è coinvolto alcun processo di ordinazione contorto. Infatti, tutte le informazioni di cui il cliente ha bisogno sono veicolate nelle foto, nel titolo e nella descrizione del prodotto. Il cliente deve semplicemente selezionare la propria taglia e fare clic sul pulsante in evidenza Aggiungi al carrello. In tal modo, vengono accolti con un popup discreto che conferma la loro selezione. Questo popup consente loro di completare il pagamento più rapidamente o di continuare a fare acquisti, prima di svanire dopo pochi secondi.

Molti negozi optano per una forma o l'altra di avviso, reindirizzandoli al carrello o mostrando un carrello pop-up non appena un articolo è stato aggiunto o, in alternativa, non scegliendo alcuna opzione e lasciando al cliente il compito di vai alla cassa. Questo approccio sembra essere una buona via di mezzo.

Se il cliente non è pronto per l'acquisto, Asos ha anche incluso un modo semplice per consentire ai clienti di aggiungere l'articolo ai preferiti. La maggior parte dei negozi ora ha una sorta di funzione della lista dei desideri, ma la cosa fantastica dell'esecuzione di Asos è il fatto che l'utente non ha bisogno di creare un account affinché l'articolo venga salvato per 60 giorni nella cache del browser.

Tuttavia, facendo clic sul pulsante si invia comunque una richiesta ad Asos, in modo che sappiano dettagli come il tipo di utente che sta salvando l'elemento, quale elemento viene salvato e quando è stato salvato: tutte le fantastiche informazioni che possono utilizzare per retarget cliente sui social.

6. Usa uno sfondo bianco sulle immagini dei tuoi prodotti

In Pixc, oltre il 90% dei nostri clienti sceglie di modificare le proprie foto per rimuovere lo sfondo dalle immagini e sostituirlo con il bianco. E non siamo solo noi. Avere uno sfondo bianco (o almeno coerente) per tutte le immagini dei tuoi prodotti è diventato uno standard per qualsiasi negozio di eCommerce di successo.

Allora perché è così importante?

Ti fa risparmiare denaro

Mantenere uno sfondo coerente accelera il processo di introduzione di nuovi prodotti, fotografia e modifica. Negozi come Asos possono permettersi di avere uno studio, un fotografo e un editor a disposizione per garantire un layout e un'illuminazione coerenti tra i loro prodotti, ma anche per i grandi negozi di eCommerce l'utilizzo di uno sfondo bianco può far risparmiare molto tempo.

Invece di avere un team interno, puoi semplicemente fotografare i tuoi prodotti e modificarli per coerenza. O meglio ancora, inviali a un servizio come Pixc per automatizzare ulteriormente il tuo processo.

Sottolinea meglio il tuo prodotto

Senza uno sfondo, non ci sono distrazioni da portare via dal prodotto stesso. Uno sfondo bianco consente di mostrare meglio i dettagli più fini del prodotto e le caratteristiche specifiche che altrimenti potrebbero passare inosservate.

Aiuta i clienti a sfogliare i tuoi prodotti

Quando le foto dei prodotti sono tutte simili, un cliente può facilmente scansionare le pagine della tua collezione e scegliere il prodotto che sta cercando.

7. Incorpora un buon mix di fotografia

Aumenta il numero di foto che stai mostrando

Poiché la fotografia del tuo prodotto è così importante, è importante includere una varietà di scatti diversi del tuo prodotto. Una foto in più può trasmettere più informazioni di qualsiasi descrizione.

Solo lo 0,52% dei consumatori desidera vedere una singola foto, mentre il 33,16% preferisce vedere più foto e il 58,03% desidera vedere le foto del prodotto che mostrano il prodotto per intero a 360°.

Ciò significa che devi includere un mix di foto del prodotto per mostrare ogni angolo del prodotto e utilizzare una varietà di fotografie per enfatizzare i punti chiave del prodotto. Ad esempio, per prodotti come le scarpe, utilizza i primi piani della suola e le cuciture per trasmettere i principali punti di forza del prodotto.

Considera le riprese contestuali

Le foto contestuali che mostrano il tuo prodotto in azione possono aiutare a stimolare l'immaginazione del cliente. Dà loro anche la possibilità di vedere come appare al di fuori di uno showroom.

8. Ottimizza i metadati dell'immagine

Troppi negozi di e-commerce sono delusi dalle immagini dei loro prodotti. Mentre piattaforme come Shopify e BigCommerce stanno aiutando a portare compressione e proporzioni adeguate alle masse, ci sono alcune altre buone abitudini che dovresti sempre mantenere.

Includere le metainformazioni appropriate

I metadati corretti si riducono a tre cose. Assicurati che le tue immagini abbiano:

1. Correggere i tag ALT che descrivono accuratamente l'immagine
2. Tag del titolo appropriati
3. Un nome file rilevante che utilizza i trattini (ad es. mia-immagine.jpg)

Le meta informazioni sono importanti per l'accessibilità, quindi il keyword stuffing è disapprovato (e anche inefficace). Tuttavia, fornisce un contesto a Google, che utilizzerà i metadati dell'immagine, nonché il contenuto circostante, per aiutare a comprendere il contenuto della pagina.

Assicurati che le tue immagini abbiano una dimensione appropriata

Assicurati che abbiano la stessa altezza e larghezza. In generale, le immagini quadrate verranno visualizzate meglio su tutti i dispositivi. L'uso di immagini rettangolari può anche iniziare a sembrare imbarazzante se hai prodotti particolarmente lunghi o larghi.

Assicurati che siano abbastanza grandi da consentire lo zoom. A seconda di come è progettato il tuo sito di e-commerce, il tuo sito utilizzerà versioni di dimensioni diverse della stessa immagine per le miniature, le immagini della raccolta, le immagini dei prodotti e la funzionalità di zoom. Vuoi assicurarti che le tue immagini siano abbastanza grandi da consentire a questa funzione di zoom di funzionare senza essere inutilmente grandi. Le immagini comprese tra 1.000 px e 1.600 px sono in genere di buone dimensioni.

9. Crea il tuo modello di fotografia del prodotto

Tenendo presente i suggerimenti di cui sopra, uno dei modi più semplici per garantire che le immagini dei prodotti siano coerenti è utilizzare un modello. Un modello ti consente di allineare ripetutamente le tue foto correttamente e garantire che il layout e le dimensioni rimangano gli stessi.

Raggiungere questo obiettivo in Photoshop è relativamente semplice.

• Crea un nuovo file in Photoshop. Assicurati che la modalità colore sia impostata su Colore RGB: 8 bit, la risoluzione è di almeno 72 pixel/pollice e il contenuto dello sfondo è bianco o trasparente.

• Crea una nuova guida. Seleziona "Nuova guida" dal menu "Visualizza".

• Crea le tue guide ai margini. Crea una guida 10% verticale, 90% verticale, 10% orizzontale e 90% orizzontale. Puoi anche impostare i tuoi margini.

• Crea le tue guide di centraggio. Crea una guida verticale al 50% e orizzontale al 50%.

Dovresti finire con questo.

Al termine, salva il file modello come un tipico documento di Photoshop. Le tue guide rimarranno a tua disposizione la prossima volta che apri il documento.

Avere un modello ti consente di posizionare tutte le immagini dei tuoi prodotti esattamente nella stessa posizione. Garantisce inoltre che le tue immagini siano tutte ridimensionate correttamente e che vengano salvate con dimensioni coerenti.

In questa guida, abbiamo esaminato gli elementi che contribuiranno a creare una pagina del prodotto ben progettata e alcuni dei passaggi che puoi intraprendere oggi per migliorare l'esperienza di acquisto per i tuoi clienti.

Con i consigli in questa guida, ora hai suggerimenti attuabili che puoi implementare per iniziare a migliorare la pagina del tuo prodotto. Ora tocca a te applicare questi suggerimenti al tuo negozio di e-commerce per iniziare a incrementare le vendite!