Bildgröße im web

Sie kennen diese Dateiendungen wahrscheinlich: JPG, PNG und GIF. Als Bildformate bieten sie unterschiedliche Vor- und Nachteile. So eignet sich das JPG-Format aufgrund seiner guten Komprimierbarkeit. Das PNG-Format überzeugt durch seine Fähigkeit, Transparenzen darzustellen. Aus diesem Grund wird es vorwiegend für Grafiken, Icons und Logos verwendet. Das GIF- Format wird, durch seine Fähigkeit Animationen darzustellen, eher in Foren und sozialen Medien verwendet.

Wir empfehlen folgende Aufteilung der Dateiformate:

.jpg/.jpeg für Grafiken bei denen eine kleine Dateigröße wichtiger ist, als jedes Detail hochauflösend darzustellen, wie z.B. Teaser-Bilder (Vorschaubilder).

.png für alle anderen Grafiken, wie breite Banner oder Galerie-Bilder usw. Dies wird wohl den Großteil der Bilder ausmachen.

WICHTIG: .svg

SVG-Grafiken sind Vektorgrafiken, die auch im Browser dargestellt werden können. Als Vekrotgrafik haben sie den Vorteil, dass Sie eine kleine Dateigröße haben, die aber auf allen Geräten scharf und deutlich lesbar ist. Daher sind SVG-Grafiken hervorragend für Logos (mit Schrift) geeignet und werden von uns auch für diesen Zweck empfohlen.

Nachtrag: SVGs haben mittlerweile einen großen Schritt nach vorn gemacht, was die Unterstützung in vielen Brwosern angeht. Dadurch sind sie für ICONS, Logos und viele weitere Zwecke nun deutlich den PNGs davon gezogen.

Empfohlene Durchschnittsgrößen von Website-Bildern

Gerade wenn Sie Bilder direkt von einer hochauflösenden Digitalkamera verwenden, dann können diese gerne einmal 4 MB oder größe sein. Das ist für den Online- Einsatz deutlich zu viel „Dateiballast“ um noch ein schnelles Laden zu ermöglichen. Daher ist es ratsam, die Originalbilder entsprechend zuzuschneiden. Diese allgemeinen Größenempfehlungen für unterschiedliche Einsatzzwecke geben Ihnen dabei erste Orientierung:

Kleine Bilder für den Einsatz auf z.B. Smartphones und für „Teaser“ etc.: Breite von circa 370px bis max. 767px
Mittlere Bilder für den Einsatz auf Tablets und im Content: Breite von circa 991px
Große Bilder für Gallerien oder wichtige Details: Seitenlänge von circa 1200px

Wie groß die Bilder für Ihre individuelle Website jedoch tatsächlich sein sollten, hängt vom konkreten Design Ihrer Website ab.

Alles Verstanden? Grafik immer noch zu groß?

Wenn Sie es wirklich darauf anlegen die schnellste und dennoch optisch ansprechendste Darstellung von Grafiken zu erreichen und gleichzeitig Ihr Google-Ranking verbessern wollen, dann können Sie Ihre Grafiken und Bilder (ausgenommen SVG) noch durch das Löschen einiger (unwichtiger) Metadaten optimieren.

Achtung: sollten Sie Bilder mit einem Copyright haben ist dies in einigen Fällen nicht gestattet, da der Uhrheber dadurch oftmals nicht mehr auszumachen ist.

Wie dies im Detail funktioniert wird hier von Google selbst beschrieben (englisch).

Da dies aber ein sehr technischer Prozess ist, empfehlen wir diesen von uns übernehmen zu lassen. Sprechen Sie uns einfach auf das Thema „Google-Optimierung“ (SEO) und im speziellen auf die Bildoptimierung an.