Home » Wissensdatenbank » Bilder weboptimiert speichern
Bilder für Web speichern mit Adobe Photoshop
Wissen teilen
Für Websites sind Bilder ein wichtiges Designmerkmal, seien es Hintergrundgrafiken, Illustrationen oder Teamfotos. Dabei ist es wichtig, dass die hochgeladenen Bilder nicht zu gross sind und somit die Ladezeiten der Website verlängern. Wir zeigen in drei Schritten, wie man mit Adobe Photoshop Bilder richtig abspeichert.
Schritt 1: Bilder suchen und zuschneiden
Aus SEO-Sicht ist es wichtig, dass man eigene Bilder auf seiner Website veröffentlicht (Unique Content). Oftmals hat man aber keine eigens erstellten Grafiken zur Hand. In diesem Fall kann man auch auf Online-Datenbanken ausweichen und entweder Bild-Lizenzen erwerben oder kostenloses Bildmaterial verwenden (z.B. von pexels oder unsplash). Hat man passende Bilder gefunden oder erstellt, kann man sich in Photoshop mit dem Freistellungswerkzeug alles zurecht schneiden.
Schritt 2: Bilder exportieren
Um die Bilder in der richtigen Grösse abzuspeichern, exportiert man die Datei in einem webtauglichen Format, beispielsweise JPEG oder PNG. Via Datei » Exportieren » Für Web speichern (oder mit der Tastenkombination Alt+Umschalt+Strg+S) kann man die Bilder weboptimiert abspeichern.
Schritt 3: Qualität wählen und Grösse reduzieren
Wie bereits erwähnt ist es wichtig, dass die hochgeladenen Bilder eine kleine Dateigrösse haben, wobei 200 KB nicht überschritten werden sollten. Um das zu erreichen, ändert man entweder die Auflösung in Schritt 1 oder reduziert die Qualität, wie in folgendem Bild:
Die Qualität des bearbeiteten Bildes sollte mindestens «Hoch» sein bzw. den Wert «60» nicht unterschreiten. Verpixelte Bilder sollten in jedem Fall vermieden werden.