Quando un potenziale cliente arriva sul tuo Shopify sito web, useranno le immagini per decidere se desiderano effettuare un acquisto. Il tuo lavoro come commerciante, quindi, è di assicurarti che le immagini non intasino la velocità di caricamento del sito (così da allontanare le persone) e di formattare e dimensionare le immagini in modo appropriato.
In questo modo, le immagini non appaiono allungate o tagliate. Nel nostro massimo Shopify guida alle dimensioni delle immagini, ti mostriamo l'importanza di dimensioni specifiche delle immagini per Shopify fotografie e fornisci le dimensioni ideali per cose come il tuo logo, l'immagine del banner e le immagini dei prodotti.
Continua a leggere per saperne di più Shopify dimensioni dell'immagine!
Perché dovrebbe interessarti Shopify Dimensioni dell'immagine?
È noioso gestire e caricare le immagini. Tuttavia, sono spesso i principali trasgressori quando si tratta di velocità del sito lente, problemi SEO e basse conversioni su un sito di e-commerce.
E la parte difficile di tutti i costruttori di siti Web e piattaforme di e-commerce è che devi attenersi a dimensioni di immagine molto particolari per assicurarti che siano ottimizzate e abbiano un aspetto presentabile.
Per riassumere, ecco perché Shopify le dimensioni delle immagini contano:
- Ogni tipo di immagine in Shopify richiede dimensioni uniche, come il modo in cui i loghi dovrebbero avere dimensioni diverse rispetto alle immagini banner.
- È più probabile che gli utenti si convertano in clienti paganti quando possono vedere chiaramente le immagini nel formato giusto.
- Immagini di dimensioni adeguate e ottimizzate possono aumentare il tuo potenziale SEO.
- La fotografia di dimensioni scadenti può causare immagini allungate o ritagliate, portando a un brutto sito web.
- Potresti scoprire che le immagini con le dimensioni sbagliate causano il rallentamento del tuo sito o impediscono ai clienti di voler aspettare del tutto.
Insieme a questi punti: immagini nitide e ben dimensionate presentano un certo livello di professionalità, offrendo reazioni emotive ai clienti che sei un'azienda di fiducia e che i tuoi prodotti sono della massima qualità. Le brutte foto sembrano semplicemente come se non fossi preoccupato per i tuoi prodotti o per il modo in cui vengono visualizzati. I tuoi clienti potrebbero chiedere: "dove altro stanno tagliando gli angoli?"
Detto questo, dai un'occhiata alla nostra guida di riferimento rapido sui migliori Shopify dimensioni delle immagini per aree come pagine di prodotti, immagini banner e loghi.
Il Migliore Shopify Dimensioni delle immagini (in base a dove vengono utilizzate le immagini)
Non tutte queste sono regole rigide, ma è meglio attenersi il più possibile alla "dimensione ideale". I temi hanno occasionalmente i propri standard di immagine, quindi teneteli d'occhio. Altrimenti, vi spiegheremo quando avrete un po' di margine di manovra in termini di dimensioni.
Esiste una dimensione dell'immagine da utilizzare in tutto Shopify?
No, ma se prevedi di adottare questo approccio, ecco cosa ti consigliamo:
- Assicurati che tutte le immagini siano abbastanza grandi da mostrare i dettagli intricati del prodotto.
- Tuttavia, mantieni le immagini abbastanza piccole da non ostacolare le prestazioni del sito.
- Una buona regola pratica è quella di attenersi a 2048 × 2048 pixel per le immagini quadrate.
- Per le immagini quadrate, evitare dimensioni inferiori a 800 × 800 pixel.
- Per le immagini quadrate, evitare dimensioni superiori a 4472 × 4472.
Per le immagini non quadrate, consigliamo vivamente di usare le guide qui sotto. Vale anche la pena notare che alcuni temi ritagliano le immagini in modo diverso, quindi potresti dover indovinare e controllare per vedere quali dimensioni delle immagini funzionano meglio per il tuo negozio online.
Per la migliore guida, dai un'occhiata all'ideale Shopify dimensioni delle immagini di seguito, tutte classificate in base al tipo di immagine:
1. Shopify Dimensione dell'immagine del prodotto (dimensione ideale: 2048 × 2048 pixel)
Le immagini dei prodotti fungono da forme primarie di media utilizzate per effettuare vendite. ShopifyI temi di fanno un ottimo lavoro nel ritagliare e ottimizzare le immagini dei prodotti per te, ma non dovresti mai fare affidamento sugli strumenti automatizzati.
Lo strumento dimensioni consigliate per le immagini del prodotto su Shopify sono 2048 x 2048 pixel.
Questo è un posto meraviglioso per garantire che le tue immagini non rallentino la velocità della tua pagina, garantendo al contempo ai clienti di vedere la ricchezza di dettagli delle tue foto originali.
Proponiamo un'immagine quadrata per le foto dei prodotti, per evitare ritagli indesiderati da Shopify temi.
Lo screenshot seguente mostra un'immagine caricata come 2048 × 2048 pixel e non ha comportato alcun ritaglio.
Immagini più lunghe e larghe possono ancora funzionare per le foto dei prodotti, ma c'è meno controllo su cosa il tema fa alle tue immagini. Potresti scoprire che le foto paesaggistiche sono ridotte in dimensioni rispetto al formato ritratto.
2. Shopify Dimensione dell'immagine della raccolta (dimensione ideale: 2048 × 2048 pixel)
L'aggiunta di una collezione non richiede necessariamente un'immagine, ma così facendo puoi creare una pagina separata per quella collezione, quasi come una pagina di destinazione creata solo per un piccolo sottoinsieme di prodotti.
Un'immagine della raccolta viene caricata sotto il file Crea raccolta sezione in Shopify.
Successivamente, puoi aggiungere un prodotto a quella raccolta e visualizzarlo in un blocco di contenuto sulla home page o come pagina a sé stante.
Se lasci il Immagine campo vuoto su una pagina di collezione, prenderà una delle immagini del prodotto in primo piano da quella collezione come predefinita.
La raccomandata Shopify la dimensione dell'immagine per le raccolte è 2048 × 2048 pixel.
Le dimensioni quadrate aiutano a stabilire un formato standardizzato per tutte le collezioni, soprattutto quando sono esposte una accanto all'altra.
Scoprirai inoltre che è più facile lavorare con le immagini quadrate quando utilizzi blocchi di contenuto che mostrano le raccolte.
Come sempre, i risultati possono variare in base al tema utilizzato. Alcuni temi, infatti, offrono ulteriori funzionalità con le immagini della tua raccolta, permettendoti di condividere l'immagine come un banner su una pagina di raccolta separata. In questo caso, la dimensione ottimale dell'immagine della tua raccolta potrebbe essere completamente diversa da quella di cui abbiamo parlato qui. Nel complesso, il tuo miglior piano d'azione è testare il tuo tema. Carica diverse immagini di dimensioni uniche nelle tue raccolte. Annota quelli che funzionano, quindi usa sempre quelle dimensioni. Assicurati solo che le immagini non siano troppo grandi o troppo piccole e starai bene.
3. Shopify Dimensione immagine logo (dimensione ideale: 450 W × 250 H pixel)
Il logo si distingue come tendone del tuo negozio di e-commerce. Viene mostrato proprio quando qualcuno arriva sulla tua home page e in tutto il sito Web, considerando che di solito è visibile nell'area dell'intestazione.
Shopify gli utenti che hanno problemi con le dimensioni del logo potrebbero scoprire che il logo non è abbastanza grande o che deforma in qualche modo il menu di navigazione. Oppure potresti scoprire che il logo lascia molto spazio bianco sotto o sopra.
Per risolvere la maggior parte di questi problemi, suggeriamo di utilizzare dimensioni del logo di 250 pixel di altezza per 450 pixel di larghezza.
Infatti, Shopify raccomanda di non superare mai queste dimensioni per larghezza e altezza. Detto questo, puoi diventare più piccolo, purché il tuo tema lo consenta.
Ogni tanto, la barra laterale getta via le cose, o forse il tuo menu di navigazione ha troppi elementi che spingono il logo in una strana direzione. Indipendentemente da ciò, è meglio giocare con le dimensioni del logo e le impostazioni del sito per ottenere l'aspetto migliore.
In alternativa, alcuni temi hanno un aspetto fantastico con loghi quadrati, ma è meglio mantenerli sotto i 250 x 250 pixel, in modo che non occupino troppo spazio.
Per la massima versatilità, vai a Impostazioni > Marchio in Shopify per aggiungere a Predefinito e Square Immagine. In questo modo, puoi caricare entrambi a seconda della situazione.
4. Shopify Dimensione immagine banner (dimensione ideale: 2000 W × 600 H pixel)
Chiamate regolarmente immagine Hero o banner immagine, queste sono le immagini più grandi che potresti posizionare nella parte superiore di una home page per mostrare nuovi prodotti e includere testo con un pulsante. È essenziale che le immagini dei banner siano ad alta risoluzione per evitare granulosità dopo il ridimensionamento e quando vengono visualizzate su dispositivi diversi.
Shopify ha anche un testata sezione contenuto, che funziona in modo simile al Immagine banner sezione dei contenuti.
Indipendentemente da quale scegli, ti consigliamo di attenersi alle dimensioni di 1200 pixel di larghezza x 600 pixel di altezza per i banner e le immagini hero.
Detto questo, spesso puoi farla franca ovunque da 1200-2000 pixel per la tua larghezza e 400-600 pixel per l'altezza. E come sempre, dipende dal tuo tema.
Infine, è anche saggio regolare le impostazioni per tutti i banner di immagini e le immagini eroe. Puoi modificare l'altezza del banner per la maggior parte dei temi e dire Shopify dove desideri posizionare il contenuto del banner, ad esempio nell'angolo in basso a destra o in alto, per ottenere una visione migliore dell'immagine dietro il contenuto.
5. Shopify Dimensione dell'immagine della presentazione (dimensione ideale: 2000 W × 600 H pixel)
Proprio come un banner, devi utilizzare immagini ad alta risoluzione nelle presentazioni. Queste sezioni di contenuto consentono di visualizzare più fotografie in un'area di una pagina. Quindi passano all'immagine successiva in successione.
Dal momento che sono così simili ai banner, in realtà manterrai la stessa larghezza e altezza che avresti per un'immagine hero o banner. La raccomandazione è una larghezza di 2000 pixel e un'altezza di 600 pixel. Tuttavia, l'altezza può variare da 400 a 600 pixel e la larghezza da 1200 a 2000 pixel.
Assicurati di gestire tutte le impostazioni della presentazione per stabilire la formattazione migliore per la tua presentazione. Potresti dover spostare la casella del contenuto in una posizione diversa, o forse la presentazione apparirebbe migliore se estendessi un po' l'altezza.
Una delle regole principali di una presentazione è caricare sempre immagini della stessa dimensione per la stessa presentazione. Sei più che benvenuto per regolare le dimensioni durante la creazione di una presentazione separata, ma assicurati solo che le immagini combinate insieme in una presentazione abbiano tutte le stesse dimensioni, per la continuità e l'esperienza dell'utente.
Come ottimizzare Shopify Immagini
L'ottimizzazione delle tue immagini ti aiuta a migliorare il modo in cui le foto vengono caricate sul tuo negozio di e-commerce. Ti aiuta anche a creare un'esperienza più user-friendly sul sito web, visto che le immagini dovrebbero integrare l'esperienza di acquisto, non sopraffarla.
Ci sono diversi aspetti da considerare quando ottimizzi le tue immagini per Shopify. Queste aree includono formati immagine ottimali, compressioni, fonti immagine, stile e altro ancora. Continua a leggere per scoprire tutto sulle best practice e i passaggi da seguire per ottimizzare le immagini in Shopify.
Passaggio 1: scegli l'immagine ottimale Format
Shopify Le dimensioni delle immagini sono importanti, ma il primo passo in qualsiasi ottimizzazione fotografica dovrebbe riguardare la scelta del formato immagine migliore.
Esistono numerosi formati di immagine che Shopify permette.
Ecco cosa li rende speciali:
- JPEG/JPG: Forse il formato file più comune per le immagini, e giustamente. I JPEG si comprimono bene e forniscono un'eccellente qualità. Li consigliamo per le pagine dei prodotti, specialmente quando ci sono dettagli fini nelle foto.
- PNG: questo tipo di file è in realtà migliore dei JPEG nel mantenere la qualità dopo aver ridotto le dimensioni dell'immagine. Tuttavia, potresti scoprire che i PNG non si comprimono tanto. Sono i migliori quando hai bisogno di uno sfondo trasparente (non supportato da JPEG), quindi ci piacciono per i loghi e alcune immagini banner.
- GIF: GIF è un formato di immagine per animazioni. È essenzialmente come trasformare un breve video in un'immagine in movimento, utile per spiegare brevemente un prodotto senza le dimensioni ingombranti di un video. Ci piacciono nelle home page, nelle pagine dei prodotti e nei post dei blog. Non abusare delle GIF, però, perché non hanno la qualità di colore ricca che si trova in altri formati come JPEG, TIFF e PNG.
- WebP: forse il più versatile di tutti i formati di immagine, WebP sta diventando sempre più comune poiché offre una compressione e una qualità più forti sia di JPEG che di PNG, insieme ai vantaggi di trasparenza di PNG. Per non parlare del fatto che puoi anche creare animazioni con WebP. Considera di usare WebP per tutti i tipi di immagini in Shopify. Ci aspettiamo di vedere WebP utilizzato più frequentemente su Internet in futuro.
Oltre a quello, Shopify supporta formati come HEIC, JPEG progressivo e AVIF. HEIC è lo standard di formato immagine utilizzato sui dispositivi Apple. È estremamente compatto, può contenere più immagini in un'unica immagine e offre una qualità eccellente. Tuttavia, è incompatibile con la maggior parte dei dispositivi non Apple, il che lo rende difficile da consigliare. Il formato immagine AVIF ha vantaggi piuttosto forti grazie alla sua alta qualità e ai suoi tassi di compressione drammatici. In breve, le tue prestazioni con un AVIF dovrebbero essere in realtà più forti rispetto alle immagini JPEG e WebP. Tuttavia, ci sta mettendo un po' di tempo prima che i browser desktop e mobili lo adottino come standard di formato file. Quindi, non possiamo consigliarlo in questo momento. Non finché quasi tutti coloro che hanno una connessione Internet non potranno effettivamente visualizzare le immagini online.
In base a cosa intendi usare per l'immagine, scegli il formato adatto da sopra. Poi, passa al passaggio successivo in modo che gli stili delle tue immagini rimangano gli stessi in tutto il tuo sito web.
Passaggio 2: scatta per lo stesso stile su tutte le fotografie
La continuità è la chiave per la fotografia nell'e-commerce. Stabilisce l'aspetto generale del tuo marchio e crea un'atmosfera standardizzata in tutto il tuo sito web.
Ad esempio, è comune per i marchi utilizzare un colore di sfondo per tutte le immagini dei prodotti.
Questo vale anche per le dimensioni e lo stile delle immagini. Se la maggior parte delle immagini dei tuoi prodotti sono in orientamento orizzontale, evita di mescolare alcune foto con orientamento orizzontale. Sei più che benvenuto a incorporare sia lo stile di vita che le foto dei prodotti nel mix, ma è meglio attenersi a uno stile per la maggior parte dei tuoi scatti.
Passaggio 3: creare un mix di fotografia di prodotto e lifestyle
Come accennato, molto probabilmente vorrai utilizzare un tipo di stile fotografico per la maggior parte delle foto dei tuoi prodotti. Tuttavia, è essenziale includere alcune foto di stile di vita per completare le foto standard dei prodotti con sfondi monocromatici e una diversa visualizzazione dei prodotti.
Le aziende di e-commerce hanno uno svantaggio in cui i clienti non possono provare o toccare i prodotti proprio lì. È qui che entrano in gioco le foto lifestyle. Gli utenti possono vedere come appaiono i prodotti in azione. Come una maglietta drappeggia sul corpo o le dimensioni di uno skateboard con qualcuno che ci sta sopra.
Passaggio 4: scegli nomi di file e titoli adatti
Ogni file immagine ha un nome e Shopify prende quel nome file e lo pubblica nei metadati del tuo sito web (ogni piattaforma di e-commerce lo fa).
Quindi, se salvi le foto come nuova-foto(1).jpg sul tuo computer e caricarle sul tuo negozio, i motori di ricerca non avranno informazioni sul contenuto della foto. Questo potrebbe danneggiare la tua SEO.
Quando ottimizzi le immagini, segui questi passaggi per assicurarti che i motori di ricerca (e quelli con disabilità visive) possano capire cosa sta succedendo nell'immagine:
- Aggiungi un nome file che ricordi il contenuto dell'immagine.
- Se ti capita di caricare un nome di file generico, cambia l'immagine Titolo in Shopify. Questo sostituisce il valore predefinito.
- Usa i tag alt per una rappresentazione ancora più forte di ciò che viene mostrato nell'immagine. Questi sono gli elementi principali che i motori di ricerca guardano, poiché mostra che la tua esperienza utente è migliorata per i non vedenti.
Passaggio 5: comprimi le immagini prima o durante il caricamento
Shopify offre la compressione automatica per tutte le immagini caricate sui suoi server, ma non dovresti affidarti interamente a questo.
La soluzione migliore è utilizzare uno strumento di terze parti per comprimere le immagini prima di caricarle Shopifyo installare un Shopify plugin che comprime automaticamente le foto al momento del caricamento.
È molto più facile seguire il percorso dell'app, ma la maggior parte di esse richiede un abbonamento, quindi capiamo se devi rimanere con un budget limitato.
Alcune app che funzionano bene per la compressione delle immagini includono:
Prova queste app con le loro prove gratuite per capire quanto bene comprimono le immagini e quanto è automatizzato il processo per te. Successivamente, puoi impegnarti in un abbonamento. Per gli strumenti di terze parti, consigliamo TinyPNG e Image Resizer.
Passaggio 6: considera le app gratuite per la ricerca di immagini
Sebbene sia altamente raccomandato che i marchi di e-commerce scattino le proprie foto (invece di trovare alternative gratuite o di prenderle dal sito Web di un produttore), ci sono alcune aree di un negozio online adatte all'uso con immagini gratuite.
Ad esempio, potresti aver bisogno di una ripresa panoramica di qualcuno che osserva un canyon per completare un post sul blog. D'altra parte, potresti voler utilizzare una foto come sfondo per un'immagine principale, consentendoti di rilasciare l'immagine e la descrizione del prodotto effettivo sopra lo sfondo.
Per queste situazioni, suggeriamo di utilizzare alcuni di questi siti di immagini con licenza Creative Commons:
- Unsplash
- scoppiare (Da Shopify)
- Pexels
- Verso aperto
È importante sottolineare che una licenza Creative Commons non significa che puoi semplicemente prendere l'immagine gratuitamente e metterla sul tuo sito web. Occasionalmente è così, ma devi controllare ogni immagine per assicurarti di quali diritti hai per il suo utilizzo.
Ad esempio, la licenza Creative Commons ti dice:
- Se è possibile utilizzare l'immagine per scopi commerciali o non commerciali
- Quando devi accreditare il creatore, o se ti è semplicemente consigliato di farlo
- Se sei autorizzato a modificare l'immagine in qualsiasi modo
Inoltre, ci sono molte app gratuite di modifica delle immagini per assumere il controllo del ridimensionamento, dei filtri e del ritaglio senza pagare un centesimo:
Consigliamo:
Passaggio 7: eseguire test A/B per individuare le immagini migliori e Formats
Dopo aver assegnato nomi di file pertinenti alle tue foto, averle ridimensionate, ritagliate e scelto il formato e la dimensione perfetti, è il momento di vedere come appariranno nel tuo negozio.
Fortunatamente, non devi incrociare le dita e sperare che le immagini siano le migliori per le conversioni. Hai la possibilità di caricare più varianti delle stesse immagini su pagine di prodotto, pagine di destinazione e home page, quindi vedere quali di esse ottengono i risultati migliori in termini di conversioni.
Entrambi Scienziato del tema e Shogun offrire funzionalità di test A/B per diverse parti del tuo Shopify progettazione.
La cosa fantastica del test A/B è che l'esperimento non finisce mai. Ti permette di tenere d'occhio ogni aspetto del tuo sito web. Puoi sostituire le immagini che perdono slancio nel tempo ed eseguire più test in un periodo di tempo.
Shopify Guida alle dimensioni dell'immagine: la nostra conclusione
Attenersi alle immagini quadrate è un modo per garantire che la fotografia del tuo e-commerce rimanga non ritagliata. Tuttavia, potresti scoprire che questa regola non è sempre vera quando si tratta del tuo Shopify tema.
Pertanto, consigliamo di caricare più dimensioni di immagini per prodotti, collezioni e banner per capire cosa il tuo tema può gestire meglio. Altrimenti, preferiamo lo standard 2046 × 2046 pixel. Ma per banner, loghi e slideshow, vorrai usare le dimensioni più specifiche menzionate sopra in questo articolo.
Fateci sapere nei commenti qui sotto se avete bisogno di chiarimenti in merito Shopify dimensioni dell'immagine!
Commenti Risposte 0