Hochladen von Bildern

Sie können viele verschiedene Arten von Bildern in Ihrem Onlineshop verwenden, einschließlich Ihres Firmenlogos, Produktbilder, Slideshows, Banner und Bilder für Blog-Beiträge. Je nachdem, wie und wo Sie ein Bild verwenden möchten, empfiehlt es sich, es in einer bestimmten Größe oder einem bestimmten Format hochzuladen.

Bildformate

Shopify unterstützt die folgenden Bildformate:

  • JPEG oder JPG
  • Progressives JPEG
  • PNG
  • GIF

Wenn Sie ein Bild in einem nicht unterstützten Format hochladen, konvertiert Shopify es in JPEG oder PNG. Die meisten Bildformate werden in JPEG konvertiert.

Hinweis: Mit Ausnahme der Konvertierung nicht unterstützter Formate in unterstützte Formate ändert Shopify Ihre Bilder beim Hochladen nicht.

Wann sollten JPEG-Bilder verwendet werden?

JPEG-Bilder sind ideal für Fotografie und andere Standbilder mit komplexen Farben. Das JPEG-Format verfügt über eine Palette mit Millionen von Farben. Zudem zeichnet sich JPEG durch eine verlustbehaftete Komprimierung aus, die dazu beitragen kann, Seitenladezeiten ohne eine merkliche Abnahme der Bildqualität schnell zu halten.

Verwenden Sie das JPEG-Format für die folgenden Arten von Bildern:

  • Produkte
  • Banner oder Slideshows
  • Seiten und Blog-Beiträge

Wann sollten PNG-Bilder verwendet werden?

PNG-Bilder sind ideal für Grafiken und Symbole mit kontrastarmen Farben und ohne Farbverlauf. Das PNG-Format unterstützt zudem Transparenz.

Verwenden Sie das PNG-Format für die folgenden Arten von Bildern:

  • Logos
  • Symbole
  • Rahmen und Ränder

Komprimierungsraten

Damit die Ladezeiten schnell bleiben, komprimiert Shopify in Ihrem Onlineshop angezeigte Bilder. Das Komprimieren eines Bilds umfasst das Reduzieren der Dateigröße, um ein schnelleres Laden der Seite zu ermöglichen. Mit der Komprimierung können auf gegebenem Festplatten- oder Speicherplatz mehr Bilder gespeichert werden. Außerdem wird die für den Zugriff auf die Bilder benötigte Zeit stark reduziert. Die Komprimierung kann je nach Format, Größe und ursprünglicher Qualität Ihres Bilds zu einer Änderung der Bildqualität führen.

Die Bildqualität von Shopify nach der Komprimierung gestaltet sich wie folgt:

  • JPEG: Zwischen 65 – 90
  • PNG: 90
  • GIF: keine Qualitätsänderung

Bei JPEG-Bildern hängt die Qualität eines komprimierten Bildes von der Qualität des ursprünglichen JPEG-Bildes sowie von der Ausgabegröße ab:

Originalqualität Ausgabegröße Ausgabequalität
86 oder mehr Höhe oder Breite von 1024 px oder mehr 85
65 – 85 Höhe oder Breite von 1024 px oder mehr Originalqualität
64 oder weniger Höhe oder Breite von 1024 px oder mehr 65
76 oder mehr Höhe und Breite beide weniger als 1024 px 75
65 – 75 Höhe und Breite beide weniger als 1024 px Originalqualität
64 oder weniger Höhe und Breite beide weniger als 1024 px 65

Upload-Begrenzungen

Bild-Uploads bei Shopify sind in Bezug auf Megapixel und die Dateigröße (gemessen in Megabyte) begrenzt. Megapixel geben an, aus wie vielen Millionen Pixeln ein Bild besteht. Megabyte werden verwendet, um anzuzeigen, wie viele Millionen Byte Speicherplatz ein Bild belegt.

Bilder, die bei Shopify hochgeladen werden, dürfen die folgenden Größen nicht überschreiten:

  • 20 Megapixel
  • 20 Megabyte

Farbprofile

Wenn Sie ein Bild in Ihrem Onlineshop anzeigen, sehen die Farben im Bild möglicherweise anders als im Original aus, das Sie in Shopify hochgeladen haben. Dies kann passieren, wenn ein Bild ein Farbprofil aufweist. Hierbei handelt es sich um eine Gruppe von Daten, die in einer Datei mit der Erweiterung .ICC oder .ICM gespeichert sind. Farbprofile werden häufig in Bilder eingebettet, um die Darstellung der Farben auf verschiedenen Geräten zu standardisieren. Wenn Bilder in Ihrem Onlineshop angezeigt werden, werden ihre Farbprofile entfernt.

Farbprofile werden aus folgenden Gründen entfernt:

  • Nicht alle Geräte können die Farbprofile .ICC oder .ICM lesen. Wenn sie also bestehen bleiben, kann dies zu einer uneinheitlichen Farbgebung auf verschiedenen Geräten führen.
  • Wenn ein hochgeladenes Bild kein Farbprofil enthält, wird sRGB (das am häufigsten verwendete Farbprofil für die Anzeige von Bildern im Internet) vom Webbrowser übernommen. Dadurch wird sichergestellt, dass Ihre Bilder auf allen gängigen Webbrowsern und Geräten gleich aussehen.
  • Farbprofile können viel Speicherplatz belegen, was zu hohen Ladezeiten führen kann.

Das Farbprofil aus einem Bild entfernen

Sie können das Farbprofil aus Ihrem Bild entfernen, indem Sie es ohne das Farbprofil speichern, bevor Sie es in Shopify hochladen. Die Vorgehensweise hängt von Ihrem Bildbearbeitungsprogramm ab.

Ein Farbprofil mit Adobe Illustrator oder Adobe Photoshop entfernen

So entfernen Sie ein Farbprofil mit Adobe Illustrator oder Adobe Photoshop:

  1. Klicken Sie auf Bearbeiten > Profil zuweisen.

  2. Wählen Sie Farbmanagement auf dieses Dokument nicht anwenden aus.

  3. Klicken Sie auf OK.

Ein Farbprofil mit Adobe InDesign entfernen

So entfernen Sie ein Farbprofil mit Adobe InDesign:

  1. Klicken Sie auf Bearbeiten > Profil zuweisen.

  2. Wählen Sie für die Profile RGB und CMYK die Option Verwerfen (Aktuellen Arbeitsfarbraum verwenden).

  3. Klicken Sie auf OK.

Weitere Informationen finden Sie in der Adobe-Dokumentation zu Farbprofilen.

Best Practices für Slideshows und Bilder in voller Breite

Viele Shopify-Themes bieten große Bilder oder Diashows, die sich an die Höhe Ihres Browsers (Boundless und Brooklyn) oder Ihre Bildschirmgröße anpassen (Venture).

Wenn Sie eines dieser Themes verwenden oder eine große Diashow oder ein Hintergrundbild haben, ist es wichtig zu verstehen, welche Arten von Bildern am besten aussehen.

Da große Bilder nicht auf alle Geräte passen, zeigt Shopify abhängig vom verwendeten Gerät manchmal nur einen Teil des Bildes an. Wenn Ihre Slideshow viele große Bilder enthält, werden Sie möglicherweise feststellen, dass Teile der Bilder nicht sichtbar sind.

Empfehlungen

Um sicherzustellen, dass Ihre Bilder gut zu Ihrem Theme passen, sollten Sie Folgendes beachten:

  • Einige Themes haben eine Einstellung für die Bildposition, mit der Sie festlegen können, welcher Teil eines Bilds das Zentrum ist. Wenn Ihr Theme keine solche Einstellung hat, stellen Sie sicher, dass das Zentrum jedes Bilds in der Mitte liegt. Wenn Ihre Bilder auf einigen Bildschirmen abgeschnitten werden, ist das Zentrum sichtbar, während Bereiche um es herum verborgen sind.

  • Bilder, die Sie für Slideshows oder Hintergründe verwenden, sollten keinen Text enthalten. Wenn der Text Teil des Bildes selbst ist, wird er möglicherweise basierend auf Ihrem Theme verschoben, zugeschnitten oder angepasst. Verwenden Sie den Theme-Editor, um Ihren Slideshows Text und Links hinzuzufügen.

  • Wählen Sie für Slideshows oder den Hintergrund einfache Bilder aus, damit überlagernder Text einfach zu lesen ist.

Breite Bilder auf hohen Bildschirmen

Breite Bilder können links und rechts abgeschnitten werden, wenn das verwendete Gerät einen hohen Bildschirm hat (wie z. B. ein Handy oder Tablet):

alt

Hohe Bilder auf breiten Bildschirmen

Hohe Bilder werden möglicherweise oben und unten abgeschnitten, wenn das für die Anzeige verwendete Gerät einen breiten Bildschirm hat (wie z. B. ein Laptop oder ein PC):

alt

Sind Sie bereit, mit Shopify zu verkaufen?

Probieren Sie es kostenlos aus