Große Bilder auf der Website – wer mag schon Ladezeiten?

16. Dezember 2016 | Blog-Werkstatt, Photos

Große Bilder - gibts mit 500 KB oder 50 KB. Wo liegt der richtige Kompromiss zwischen Bildqualität und Datenmenge.

Große Bilder – gibts mit 500 KB oder 50 KB. Wo liegt der richtige Kompromiss zwischen Bildqualität und Datenmenge.

Große Bilder sind für heutige Websites fast schon ein Muss. Wer mag noch kleine Bilder sehen? Moderne responsive Webseiten lassen sich zwar auch klein darstellen, fürs Handy. Aber in der „Normalversion” am Desktop-Rechner kommen sie eben doch groß raus. Retina-Displays und große Bildschirme tun ein übriges, um die Lust an perfekten Bildern zu befördern.

Der Schreck kommt, wenn man seine Website auf Leistungsfähigkeit überprüft. Die Datenmenge ist zu groß, Google findet das nicht schön und lange Ladezeiten lassen das eigene Blog in der Ergebnislisten der Suchmaschinen dann schon einmal nach hinten rutschen.  Wo ist der ideale Kompromiss zwischen Bildqualität und Datenmenge? Und was kann man tun, um die Datenmenge für Bilder zu reduzieren?

Große Bilder sind nur selten wirklich nötig

Wo die Grenze bei Größe und Qualität der Bilder liegen sollte, das ist Geschmackssache. Die Entscheidung fällt schon bei der Auswahl des Layouts für die eigene Website. In den meisten Fällen sind die Demo-Versionen der Layouts ja schon mit Bildern gefüllt. Man erkennt also genau, auf was man sich einlässt.

Richtig große Bilder (mehr als 1000 Pixel Kantenlänge) sind sind vor allem für Foto-Websites interessant. Oder hochwertige, ästhetisch ansprechende Produkte, die detailgetreu dargestellt werden müssen. Und selbst dann lässt sich der Einsatz der großen Bildgrößen beschränken auf ein Header-Bild oder Detail-Ansichten, die per Mausklick vergrößert werden.

Ein Spezialfall sind bildschirmfüllende Hintergrundbilder. Wer die quasi aus der Kamera heraus hochlädt, bremst seine Seite ziemlich aus.

Wer über Themen schreibt, die sich gut illustrieren lassen, der kommt auch bei einzelnen Blogposts schon mal auf 6 bis 10 Bilder. Und wenn auf der Eingangsseite 5 Posts in voller Länge angezeigt werden, dann läppert sich das.

Große Bilder – klein gerechnet

Interessant ist auf jeden Fall, die Möglichkeit, die Bilddaten eines Fotos deutlich zu reduzieren, ohne dass der optische Eindruck leidet. Nun ist dieser Eindruck bei den meisten Betrachtern unterschiedlich. Manche sehen nur ein tolles Motiv, andere Pixel, Kantenunschärfe, chromatische Abberation.

Erste Wahl wenn Bildbearbeitung einen hohen Stellenwert hat, ist Photoshop. Eine vergleichsweise teure Lösung. Fotografen besitzen die Software sowieso, andere überlegen sich die Investition gründlich. Die erste Abzweigung in Richtung weniger Bilddaten nimmt man beim Abspeichern der Bilder. Die Auswahl „Für Web und Geräte speichern” lässt schon mal viel weg, was man in der Internetdarstellung nicht braucht und trotzdem der Optik nicht schadet. Die JPG-Vorgaben von niedrig sehr hoch werden im Ausschnitt angezeigt, und die Bilddatenmenge wird ebenfalls angezeigt. Hoch = Qualität 60 von 100 ist eine gute Wahl, finde ich.

Wer Landschaftsfotos, Produktfotos, Porträts für seine Ansprüche gezielt komprimieren möchte, der probiert alle Versionen aus und stellt die Bilder nebeneinander. Bei 100% am Bildschirm begutachtet, erkennt man seine individuelle Schmerzgrenze recht schnell. Auf GIF und PNG kann man meiner Meinung nach verzichten.

Und wer noch mehr feilen möchte, der kann mit Helligkeit und Kontrast noch ein paar Kilobytes einsparen. Auch der vorsichtige Einsatz der Instrumente zur Schärfung von Bildern nach der Verkleinerung in Photoshop („unscharf maskieren”) sind eine große Hilfe zur Bildverbesserung.

Preiswerte Lösungen

Wie für viele Probleme gibt es auch hier eine kostenlose Lösung im Internet. Auf compressor.io kann man das schnell und einfach erledigen. Auch die Website compressjpeg.com bietet diesen Service. Optisch nicht ganz so ansprechend gelöst, dafür mit Stapelverarbeitung.

Wer seine Bilder nicht aus der Hand geben möchte, der kann auch auf spezielle kleinere Programm zurückgreifen. Die Software jpegmini erlaubt die Bearbeitung am eigenen Rechner (PC, Mac) und ist mit 20 US-Dollar sehr erschwinglich. Die Pro-Version erlaubt größere Bilder und bietet schnellere Verarbeitung.

Mein Favorit bleibt die Photoshop-Lösung für Bildbearbeitung und Datenreduktion. Andere Varianten sind aufwändiger. Ärgerlich finde ich zum Beispiel, dass die Bildverarbeitung in Lightroom zwar noch den Export von kleineren Bildmaßen erlaubt. Aber das 1000-Pixel-Bild hat dann immer noch 500 KB und ich muss mit Photoshop einen weiteren Verarbeitungsschritt machen. Das gilt auch für Snapseed.

Hinzu kommt, dass man für Website, Facebook, Pinterest, Instagram jeweils andere Bildmaße und geringe Bilddaten braucht. Um seine Bilder optimal zu präsentieren brauchts also neben dem Aufwand fürs Fotografieren noch einiges an Nachbearbeitung.

 

Instagram Video Kurs

Kostenloser Video-Kurs: So geht Instagram!

Kostenloser Video-Kurs: So geht Instagram!

Free: E-Book Hochformat-Videos

E-Book Hochformat-Videos & Instagram Reels

Hochformat-Videos & Instagram Reels

Gratis-Downloads

Langzeitbelichtungen mit dem iPhone

Langzeitbelichtungen mit dem iPhone

Als Amazon-Partner verdiene ich an qualifizierten Verkäufen. Bei gekennzeichneten Amazon-Links handelt es sich um Affiliate Links. Durch einen Kauf über den Link werde ich am Umsatz beteiligt. Dies hat für Dich keine Auswirkungen auf den Preis.

Websites von mir

Websites für Physiotherapie-Praxen

Websites für Physiotherapie-Praxen

Aktuelles Beispiel: www.physioplusbayern.de

Website und Shop für Weingüter

Website und Shop für Weingüter

Aktuelles Beispiel: www.biowein-weitzel.de

Kurzer Leitfaden zum Thema Langzeitbelichtungen mit dem iPhone.

Anmeldung

Download des Leitfadens für Langzeitbelichtungen mit dem iPhone.

Dazu gibt es den sofortigen Zugang zu meinem Newsletter, wo ich meine besten Tipps zu den Themen Foto & Video teile. 

Deine Anmeldung war erfolgreich!

so geht Instagram: einkostenloser Videokurs in drei Teilen.

Kostenloser dreiteiliger Video-Kurs

Mit dem Zugang zum Instagram-Kurs erfolgt die Anmeldung zu meinem Newsletter. Du kannst Dich jederzeit abmelden.

Deine Anmeldung war erfolgreich!