Über Web, Tech, Games, Art,
Musik, Code & Design

25. Februar 2023

Warum man beim Pflegen einer Website unbedingt auch die Bildgrößen im Blick behalten sollte.

Immer wieder stolpere ich auf Websites über riesengroße Bild-Dateien, die einfach in Orignalgröße unkomprimiert hochladen worden sind. Wenn Fotos unbearbeitet aus der Kamera oder dem Smartphone direkt hochgeladen werden, sind die Bilder häufig mehr als 4000px breit und über 2MB groß. Das ist in den meisten Fällen zwar, dank einer schnellen DSL-Verbindung egal, es gibt aber genug Gründe die Bildgrößen anzupassen:

  1. Ladezeit
    Große Bilder können die Ladezeit einer Website erheblich verlangsamen. Wenn eine Website zu lange lädt, kann dies zu einer schlechten Benutzererfahrung führen und die Besucher abschrecken. Das gilt insbesondere auch für mobile Zugriffe.
  2. Datenvolumen
    Apropos mobile Zugriffe: Viele Datentarife haben ein begrenztes Datenvolumen. Wenn auf jeder Website gleich 10 Bilder mit 3 MB sind, kann das Datenvolumen der Besucher schnell aufgebraucht sein.
  3. Speicherplatz
    Bilder nehmen auf einem Server viel Speicherplatz ein und im Laufe der Jahre sammeln sich häufig viele Bilder an. Wenn man diesen Aspekt völlig außer acht lässt, kann dies zu einem schnellen Verbrauch des verfügbaren Speicherplatzes führen.
  4. SEO (!)
    Suchmaschinen bewerten auch die Ladezeit einer Website und eine langsame Seite kann sich negativ auf das Ranking auswirken. Eine Website mit optimierten Bildgrößen kann schneller geladen werden und damit auch ein höheres Ranking in Suchmaschinen erreichen.

Mit folgendem Tool & Plug-in kann man die Bildgrößen einer Website optimieren.

Resize Image After Upload
Auf WordPress-Websites sollte unbedingt das Plug-in “Resize Image After Upload” installiert werden. “Resize Image After Upload” verkleinert zu große Bilder direkt nach dem Upload auf eine vorher definierte Maximal-Größe. Ich verwende hier häufig 1280px. Das ist aber logischerweise abhängig von der Website. Bei größeren Hintergrundbildern kann durchaus auch 1600px oder mehr sinnvoll sein.
https://wordpress.org/plugins/resize-image-after-upload/


TinyPNG
Auf Landing-Pages und Startseiten mit vielen Bildern, sollte man unbedingt TinyPNG nutzen. TinyPNG ist ein Online-Tool zur Optimierung von Bildern für das Web. Es verwendet eine intelligente Komprimierungstechnologie, um die Größe von PNG- und JPEG-Bildern zu reduzieren, ohne dabei die Bildqualität zu beeinträchtigen. Und die Reduzierung der Bildgrößen ist enorm! Gerade bei PNGs mit Transparenz kann die Bildgröße häufig von z.B. 900kb auf 120kb reduziert werden. TinyPNG gibt´s auch als WordPress-Plugin – hier ist dann allerdings ein API-Key erforderlich.
www.tinypng.com


Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert