Caricamento immagini

Puoi utilizzare molti tipi diversi di immagini sul tuo negozio online, inclusi il logo della tua azienda, le immagini di prodotto, le presentazioni, i banner e le immagini dei post dei blog. A seconda di come e dove si desidera utilizzare un'immagine, è consigliabile caricarla in una determinata dimensione o formato.

Carica delle immagini

Esistono due posti differenti dove puoi caricare delle immagini per il tuo negozio online:

Carica delle immagini dalla pagina File

Puoi caricare delle immagini dalla pagina File del tuo pannello di controllo Shopify. Questa opzione è utile perché puoi accedere a tali immagini mentre modifichi uno dei tuoi temi. Per maggiori informazioni, vedi Caricare dei file sul tuo sito web.

Carica delle immagini dall'editor del tema

Puoi aggiungere delle immagini al tuo tema attraverso l'editor del tema.

Procedura:

  1. Trova il tema che desideri modificare e clicca su Personalizza.

  2. Nella barra degli strumenti dell'editor del tema clicca sulla sezione a cui vuoi aggiungere un'immagine. Scegli una sezione che include un selettore di immagini:

    Sezione della barra degli strumenti dell'editor del tema che mostra il selettore di immagini. È presente un pulsante con la scritta Seleziona immagine e un link con la scritta Esplora immagini gratuite.

  3. Aggiungi un'immagine cliccando su Seleziona immagine. Per caricare un'immagine dal computer, clicca su Carica. Per usare un'immagine d'archivio gratuita di Burst, clicca su Immagini gratuite.

  4. Clicca su Salva.

Formati Immagine

Shopify supporta i seguenti formati di immagine:

  • JPEG o JPG
  • JPEG progressivo
  • PNG
  • GIF

Se carichi un'immagine che non è in un formato supportato, Shopify la converte in JPEG o PNG. La maggior parte dei formati di immagine viene convertita in JPEG.

Quando usare le immagini JPEG

Le immagini JPEG sono ideali per la fotografia e altre immagini fisse con colori complessi. Il formato JPEG offre una gamma di milioni di colori, ed è inoltre caratterizzato da compressione lossy, il che aiuta a mantenere veloci i tempi di caricamento delle pagine senza che ci sia perdita della qualità dell'immagine.

Usa il formato JPEG per i seguenti tipi di immagini:

  • Prodotti
  • banner o presentazioni
  • pagine e articoli di blog.

Quando usare le immagini PNG

Le immagini PNG sono ideali per la grafica e le icone con colori piatti e senza sfumature. Il formato PNG è anche in grado di supportare la trasparenza.

Usa il formato PNG per i seguenti tipi di immagini:

  • loghi
  • Icone
  • Bordi ed elementi decorativi.

Rapporti di compressione

Per mantenere rapidi i tempi di caricamento, Shopify comprime le immagini del tuo negozio online. Comprimere un'immagine significa ridurre le dimensioni del file per consentire un caricamento più veloce della pagina. Con la compressione, è possibile memorizzare più immagini in una determinata quantità di spazio su disco o memoria. Inoltre, il tempo necessario per accedere alle immagini è notevolmente ridotto. La compressione potrebbe comportare un cambiamento nella qualità dell'immagine, in base al formato, alle dimensioni e alla qualità originale dell'immagine.

Con Shopify, i livelli di qualità delle immagini dopo la compressione sono i seguenti:

  • JPEG: tra 65 e 90
  • PNG: 90
  • GIF: nessun cambiamento di qualità

Per le immagini JPEG, il livello di qualità di un'immagine compressa dipende dalla qualità dell'immagine JPEG originale e dalla dimensione di output:

Qualità originale Dimensione di output Qualità di output
86 o superiore Altezza o larghezza pari a 1024 px o superiore 85
65 - 85 Altezza o larghezza pari a 1024 px o superiore Qualità originale
64 o inferiore Altezza o larghezza pari a 1024 px o superiore 65
76 o superiore Altezza e larghezza entrambe inferiori a 1024 px 75
65 - 75 Altezza e larghezza entrambe inferiori a 1024 px Qualità originale
64 o inferiore Altezza e larghezza entrambe inferiori a 1024 px 65

Limiti di caricamento

Il caricamento di immagini su Shopify presenta delle restrizioni sia in termini di megapixel che di dimensioni dei file (misurate in megabyte). I megapixel sono usati per indicare quanti milioni di pixel compongono un'immagine. I megabyte vengono utilizzati per indicare quanti milioni di byte di memoria o spazio su disco occupa un'immagine.

Le immagini caricate su Shopify non possono superare i seguenti limiti:

  • 20 megapixel
  • 20 megabyte

Profili colore

Quando visualizzi un'immagine nel tuo negozio online, i suoi colori potrebbero apparire diversi da quelli presenti nell'originale caricato su Shopify. Ciò può verificarsi quando un'immagine è dotata di un profilo colore, che è un insieme di dati memorizzati in un file con estensione .ICC o .ICM. I profili colore sono spesso incorporati nelle immagini per aiutare a standardizzare il modo in cui i colori appaiono sui diversi dispositivi. Quando le immagini vengono visualizzate nel tuo negozio online, i loro profili colore vengono rimossi.

I profili colore vengono rimossi per alcuni motivi:

  • Non tutti i dispositivi sono in grado di leggere i profili colore .ICC o .ICM, quindi mantenerli può causare incongruenze nei colori delle immagini sui vari dispositivi.
  • Quando un'immagine caricata non include alcun profilo colore, il browser usa automaticamente il sRGB (profilo colore comunemente utilizzato per visualizzare le immagini nel web). Ciò garantisce che le immagini abbiano lo stesso aspetto su tutti i principali browser e dispositivi.
  • I profili colore possono occupare grandi quantità di spazio su disco, il che può comportare tempi di caricamento elevati.

Rimuovi il profilo colore da un'immagine

Puoi rimuovere il profilo colore dall'immagine salvandola senza profilo colore prima di caricarla su Shopify. Il processo varia a seconda del programma per l'editing delle immagini utilizzato.

Rimuovi il profilo colore usando Adobe Illustrator o Adobe Photoshop

Per rimuovere il profilo colore usando Adobe Illustrator o Adobe Photoshop:

  1. Fai clic su Modifica > Assegna profilo.

  2. Seleziona Non gestire colore in questo documento.

  3. Clicca OK.

Rimuovi il profilo colore usando Adobe InDesign

Per rimuovere il profilo colore usando Adobe InDesign:

  1. Fai clic su Modifica > Assegna profilo.

  2. Per il Profilo RGB e il Profilo CMYK seleziona Elimina (Usa spazio di lavoro corrente).

  3. Clicca OK.

Per informazioni più dettagliate, puoi visualizzare la documentazione di Adobe sui profili colore.

Best practice per presentazioni e immagini a larghezza intera

Molti temi di Shopify presentano immagini o presentazioni ampie, che si adattano all'altezza del browser (Boundless e Brooklyn) o alle dimensioni dello schermo (Venture).

Se utilizzi uno di questi temi oppure una presentazione o un'immagine di sfondo di grandi dimensioni, è importante che tu sappia quali tipi di immagini avranno un aspetto migliore.

Poiché le immagini di grandi dimensioni non si adattano a tutti i dispositivi, talvolta Shopify mostra l'immagine solo in parte, a seconda del dispositivo dell'utente. Se una presentazione contiene molte immagini di grandi dimensioni, è possibile che alcune parti di esse non siano visibili.

Raccomandazioni

Per scegliere immagini adatte al tuo tema, tieni presente quanto segue:

  • Alcuni temi dispongono di un'impostazione di posizione dell'immagine che puoi usare per specificare quale parte di un'immagine costituisce il punto focale. Se il tuo tema non dispone di questa impostazione, allora assicurati che il punto focale di ogni immagine si trovi al centro. Quando su alcuni schermi le immagini vengono ritagliate, il punto focale è visibile mentre le aree intorno sono nascoste.

  • Le immagini che usi per presentazioni o sfondi non devono contenere testo. Se il testo è incorporato nell'immagine, potrebbe essere spostato, ritagliato o regolato, a seconda del tema che utilizzi. Usa l'editor del tema per aggiungere testo e link alle tue presentazioni.

  • Per le presentazioni o gli sfondi, scegli immagini semplici, in modo che il testo sovrastante sia facile da leggere.

Immagini larghe su schermi alti

Le immagini larghe potrebbero essere ritagliate a destra e a sinistra se il dispositivo utilizzato per visualizzarle ha uno schermo alto (come nel caso di un telefono o tablet):

Immagini larghe su schermi alti

Immagini alte su schermi larghi

Le immagini alte potrebbero essere ritagliate in alto e in basso se il dispositivo utilizzato per visualizzarle ha uno schermo largo (come nel caso di un laptop o desktop):

Immagini alte su schermi larghi

Sei pronto/a per iniziare a vendere con Shopify?

Provalo, è gratis