Afbeeldingen uploaden

Je kunt veel verschillende soorten afbeeldingen gebruiken in je online winkel, waaronder je bedrijfslogo, productafbeeldingen, diavoorstellingen, banners en afbeeldingen van blogposts. Afhankelijk van hoe en waar u een afbeelding wilt gebruiken, is het misschien het beste om deze in een bepaalde grootte of indeling te uploaden.

Afbeeldingen uploaden

Er zijn twee verschillende plaatsen waar je afbeeldingen voor je online winkel kunt uploaden:

Afbeeldingen op de pagina Bestanden uploaden

Je kunt afbeeldingen uploaden op de pagina Bestanden van de Shopify-beheerder. Dit is handig omdat u toegang tot deze afbeeldingen hebt tijdens het bewerken van thema's. Zie Bestanden uploaden naar uw website voor meer informatie.

Afbeeldingen uploaden in de themabewerker

Je kunt afbeeldingen aan uw thema toevoegen in de themabewerker.

Stappen:

  1. Zoek het thema dat u wilt bewerken en klik op Aanpassen.

  2. Klik op de werkbalk van de themabewerker op het gedeelte waaraan u een afbeelding wilt toevoegen. Kies een gedeelte met een afbeeldingskiezer:

    Een gedeelte van de werkbalk van de themabewerker met de afbeeldingskiezer. Er is een knop met de tekst Afbeelding selecteren en een link met de tekst Gratis afbeeldingen ontdekken.

  3. Voeg een afbeelding toe door op Afbeelding selecteren te klikken. Upload de afbeelding naar je computer door op Uploaden te klikken. Als je een gratis stockafbeelding van Burst wilt gebruiken, klikt je op Gratis afbeeldingen.

  4. Klik op Opslaan.

Afbeeldingsindelingen

Shopify ondersteunt de volgende afbeeldingsindelingen:

  • JPEG of JPG
  • Progressive JPEG
  • PNG
  • GIF

Shopify geeft afbeeldingen in WebP-indeling weer op ondersteunde browsers.

Wanneer JPEG-afbeeldingen gebruiken

JPEG-afbeeldingen zijn ideaal voor fotografie en andere stilstaande beelden met complexe kleuren. De JPEG-indeling heeft een palet met miljoenen kleuren. JPEG-afbeeldingen hebben ook een niet-exact omkeerbare compressie (ook wel lossy compression genoemd), wat kan helpen om pagina's zo snel mogelijk te laden zonder een merkbaar verlies aan beeldkwaliteit.

Gebruik de JPEG-indeling voor de volgende soorten afbeeldingen:

  • producten
  • banners of diavoorstellingen
  • pagina's en blogposts.

Wanneer PNG-afbeeldingen gebruiken

PNG-afbeeldingen zijn ideaal voor afbeeldingen en pictogrammen met vlakke kleuren en zonder verlopen. De PNG-indeling ondersteunt ook transparantie.

Gebruik de PNG-indeling voor de volgende soorten afbeeldingen:

  • logo's
  • pictogrammen
  • randen en bijsnijdingen.

Conversiepercentages

Afbeeldingen worden door Shopify gecomprimeerd wanneer ze in je online winkel worden weergegeven ten behoeve van snelle laadtijden. Bij het comprimeren van een afbeelding is de bestandsgrootte verkleind om sneller pagina's te kunnen laden. Met compressie kunnen meer afbeeldingen worden opgeslagen in een bepaalde hoeveelheid schijfruimte of geheugenruimte. Bovendien is de tijd die nodig is om toegang te krijgen tot de afbeeldingen sterk verminderd. Compressie kan resulteren in een verandering in de beeldkwaliteit, afhankelijk van de indeling, het formaat en de oorspronkelijke kwaliteit van je afbeelding.

De beeldkwaliteitsniveaus van Shopify na compressie zijn als volgt:

  • JPEG: tussen 65 - 90
  • PNG: 90
  • GIF: geen verandering in kwaliteit

Voor JPEG-afbeeldingen is het kwaliteitsniveau van een gecomprimeerde afbeelding afhankelijk van de kwaliteit van de originele JPEG-afbeelding en de uitvoergrootte:

Conversiepercentages
Originele kwaliteit Uitvoergrootte Uitvoerkwaliteit
86 of meer Hoogte of breedte van 1024 pixels of meer 85
65 - 85 Hoogte of breedte van 1024 pixels of meer Originele kwaliteit
64 of minder Hoogte of breedte van 1024 pixels of meer 65
76 of meer Hoogte en breedte beide kleiner dan 1024 pixels 75
65 - 75 Hoogte en breedte beide kleiner dan 1024 pixels Originele kwaliteit
64 of minder Hoogte en breedte beide kleiner dan 1024 pixels 65

Limieten voor het uploaden

Bij het uploaden van afbeeldingen naar Shopify gelden beperkingen wat betreft megapixels en bestandsgrootte (gemeten in megabytes). Megapixels worden gebruikt om aan te geven hoeveel miljoenen pixels een afbeelding vormen. Megabytes worden gebruikt om aan te geven hoeveel miljoenen bytes geheugen of schijfruimte een afbeelding in beslag neemt.

Bij afbeeldingen die zijn geüpload naar Shopify, kunnen de volgende limieten niet worden overschreden:

  • 20 megapixels
  • 20 megabytes

Kleurprofielen

Wanneer u een afbeelding in uw online winkel bekijkt, zien de kleuren in de afbeelding er mogelijk anders uit dan in het origineel dat u naar Shopify hebt geüpload. Dit kan gebeuren wanneer een afbeelding een kleurprofiel heeft, wat een set gegevens is die is opgeslagen in een bestand met een extensie .ICC of .ICM. Kleurprofielen worden vaak ingebed in afbeeldingen om te helpen bij het standaardiseren van de manier waarop de kleuren op verschillende apparaten worden weergegeven. Wanneer afbeeldingen worden weergegeven in uw online winkel, worden hun kleurprofielen verwijderd.

Kleurprofielen worden om een paar redenen verwijderd:

  • Niet alle apparaten kunnen .ICC- of .ICM-kleurprofielen lezen, dus als ze intact blijven, kan dit leiden tot inconsistenties in de afbeeldingskleuren op verschillende apparaten.
  • Wanneer een geüploade afbeelding geen kleurprofiel bevat, wordt sRGB (het meest gebruikte kleurenprofiel dat wordt gebruikt om afbeeldingen op internet weer te geven) aangenomen door de webbrowser. Dit zorgt ervoor dat je afbeeldingen er bij alle belangrijke webbrowsers en apparaten hetzelfde uitzien.
  • Kleurprofielen kunnen veel schijfruimte in beslag nemen, wat kan resulteren in lange laadtijden.

Het kleurprofiel uit een afbeelding verwijderen

Je kunt het kleurprofiel uit uw afbeelding verwijderen door de afbeelding op te slaan zonder het kleurprofiel voordat u deze naar Shopify uploadt. Dit proces varieert, afhankelijk van uw beeldbewerkingsprogramma.

Een kleurprofiel verwijderen met Adobe Illustrator of Adobe Photoshop

Verwijder als volgt een kleurprofiel met Adobe Illustrator of Adobe Photoshop:

  1. Klik op*Bewerken* > Profiel toewijzen.

  2. Selecteer Geen kleurbeheer voor dit document gebruiken.

  3. Klik op*OK*.

Een kleurprofiel verwijderen met Adobe InDesign

Verwijder als volgt een kleurprofiel met Adobe InDesign:

  1. Klik op*Bewerken* > Profiel toewijzen.

  2. Selecteer voor een RGB-profiel en CMYK-profiel Negeren (huidige werkruimte gebruiken).

  3. Klik op*OK*.

Zie de Adobe-documentatie over kleurprofielen voor meer informatie.

Praktische tips voor diavoorstellingen en afbeeldingen op volledige breedte

Veel Shopify-thema's hebben grote afbeeldingen of diavoorstellingen met de hoogte van uw browser (Boundless en Brooklyn) of worden aangepast aan de schermgrootte (Venture).

Als u een van deze thema's gebruikt of een grote diavoorstelling of achtergrondafbeelding hebt, is het belangrijk om te weten welke soorten afbeeldingen er het beste uitzien.

Omdat grote afbeeldingen niet op alle apparaten passen, geeft Shopify soms slechts een deel van de afbeelding weer, afhankelijk van het apparaat dat u gebruikt. Als uw diavoorstelling veel grote afbeeldingen bevat, is het mogelijk dat delen van de afbeeldingen niet zichtbaar zijn.

Aanbevelingen

Om er zeker van te zijn dat je afbeeldingen goed werken met je thema moet je met het volgende rekening houden:

  • Sommige thema's hebben een instelling voor de beeldpositie die u kunt gebruiken om aan te geven welk deel van een afbeelding het focuspunt is. Als je thema niet zo'n instelling heeft, zorg er dan voor dat het focuspunt van elke afbeelding in het midden staat. Wanneer je afbeeldingen op sommige schermen zijn bijgesneden, is het focuspunt zichtbaar, terwijl de gebieden eromheen zijn verborgen.

  • Afbeeldingen die u gebruikt voor diavoorstellingen of achtergronden, mogen geen tekst bevatten. Als de tekst deel uitmaakt van de afbeelding zelf, kan deze worden verplaatst, bijgesneden of aangepast op basis van uw thema. Gebruik de themabewerker om tekst en links aan uw diavoorstellingen toe te voegen.

  • Voor afbeeldingen die u in diavoorstellingen of als achtergrond gebruikt, kiest u eenvoudige afbeeldingen zodat de tekst er bovenop gemakkelijk te lezen is.

Brede afbeeldingen op hoge schermen

Brede afbeeldingen kunnen links en rechts worden bijgesneden wanneer het apparaat waarmee ze worden bekeken een hoog scherm heeft (zoals een mobiele telefoon of tablet):

Brede afbeeldingen op hoge schermen

Hoge afbeeldingen op brede schermen

Hoge afbeeldingen kunnen aan de boven- en onderkant worden bijgesneden wanneer het apparaat waarmee ze worden bekeken, een breed scherm heeft (zoals een laptop of desktop):

Hoge afbeeldingen op brede schermen

Klaar om te beginnen met verkopen met Shopify?

Probeer het gratis