Viele angehende Webmaster wissen nicht, auf was sie eigentlich achten sollen, wenn ein Bild für das Web optimieren sollen. Es gibt heutzutage zwar viele Bildbearbeitungsprogramme, die diese Option bereits beinhalten - trotzdem kann man das Nonplusultra nicht einfach mit einem Mausklick auf die Option "Optimieren" erwarten. 

Die Software ist zwar äußerst hilfreich - gerade, was das Optimieren von vielen Bildern anbelangt - aber trotzdem ist eine Software immer nur so gut, wie derjenige, der sie bedient.

Deshalb haben wir Ihnen hier eine Übersicht über die "Basics" in Sachen Bildoptimierung zusammengestellt. Bitte beachten Sie aber, dass eine Sicherungskopie Ihrer Daten absolut notwendig ist und Sie vor ungewolltem Datenverlust schützt.

Geringe Ladezeit durch professionellen Bilder-Content

Wer ein potentiell trafficintensives Projekt online stellen will, der sollte sich vor allem über die Wirtschaftlichkeit der Webseite von vornherein Gedanken machen - Nachdenken spart in diesem Falle bares Geld.

Des weiteren sollte man sich gerade auch schon beim Fertigen des Layouts einer Webseite [ besteht oftmals aus Bildern ] Gedanken darüber machen, ob und wenn ja -  welche Bilder darin unbedingt enthalten sein sollen. 

Je monotoner die Bilder sind, desto mehr reduziert sich bei optimaler Optimierung die Ladezeit der Webseite. Aufwendige Farbverläufe sollten weitgehend vermieden werden, da diese am meisten Speicherplatz "fressen". 

Überlegen Sie sich, wie viele Bilder in welcher Auflösung absolut notwendig für die Darstellung der Inhalte Ihre Webseite sind.

Wenn Bilderserien online gestellt werden sollen, dann ist eine Vorschauseite mit sog. Thumbnails absolut zu empfehlen - der User öffnet dann nur das Bild, dass er in der Großansicht auch sehen möchte und nicht wahllos alle Bilder.

Optimierung der Ladezeit durch die richtige Wahl der Bildformate

Die wichtigsten Formate, die eine qualitativ gute und trotzdem größenreduzierte Darstellung von Bildern im Web zulassen sind zweifelsohne die Formate GIF und JPEG.

Meist verwendet man das GIF-Format für weniger farbintensive Bilder, da die maximale Farbanzahl bei diesem Bildformat bei 256 Farben liegt.

Wenn man also ein Logo, Buttons und Banner auf einer Webseite hat, dann sollten diese - sofern sie relativ monoton sind - unbedingt als GIF gespeichert werden. Bei den meisten Bildbearbeitungsprogrammen kann man auch die Farbanzahl eingeben, in der ein Bild als GIF gespeichert werden soll - je weniger Farben ausgewählt werden, desto weniger Speicherplatz benötigt das Bild.

Das geniale am GIF-Format ist, dass man transparente Bereiche darstellen kann. Man kann also z.B. einen Button so gestalten, dass er eine Rundung enthält. Diese Rundung muss aber nicht mit einer Hintergrundfarbe hinterlegt werden. Ein Erstellen von Bildern, die absolut unabhängig von der Hintergrundfarbe [ oder vom Hintergrundbild ] sind, ist also problemlos möglich. Der transparente Bereich muss aber im Bildbearbeitungsprogramm angegeben werden.

Ein JPEG verwendet man dann, wenn Bilder mit größerer Farbbrillianz also z.B. Fotos oder Collagen aller Art in eine Webseite integriert werden sollen. Die maximale Farbanzahl dieses Formats liegt bei ca. 16 Millionen Farben. Da die Bildgröße direkt proportional zur Farbanzahl und auch zur Bildqualität ist, sollte man eine Farbanzahl wählen, die einen Kompromiss mit der Qualität und der Bildgröße darstellt. Wenn dies nicht sofort möglich ist, dann sollte man das zu optimierende Bild in der Größe verringern. 

Wenn man das JPEG-Format verwendet, um Bilder mit wenigen Farben zu speichern, so ist das Bild in der Regel deutlich größer, als wenn man ein GIF verwenden würde - die Vorteile beider Formate liegen also deutlich auf der Hand.

Meist gibt es aber nicht nur die Bilder, die eindeutig einem der beiden gängigsten Formate zuzuordnen sind, sondern vor allem auch Bilder, bei denen man im Endeffekt beide Formate auf einmal wählen könnte. Bei Bildern dieser Art kann man einen Trick anwenden - das Slicen. Man "schneidet" das Bild mit dem jeweiligen Bildbearbeitungsprogramm gezielt in mehrere Teile. Die Grenzen eines Bildteiles [ auch Slice genannt ] werden aufgrund der Vorteile des Formates festgelegt, in dem man das Bildteil speichern will. Mittels einer [unsichtbaren] Tabelle kann man diese Bilder lückenlos auf der HTML-Seite wieder zusammensetzen. Diese Vorgehensweise verringert die visuelle und auch die tatsächliche Ladezeit der Webseite und trägt somit aktiv zur benutzerfreundlichen, trafficsparenden Gestaltung einer Webseite bei. Übung macht hier den Meister.

Optimierung durch professionelle Bildbearbeitung

Bei der professionellen Bildbearbeitung ist es mit der Wahl des richtigen Formates nicht getan. Man kann mit einer professionellen Bildbearbeitungs-Software Bilder so bearbeiten, dass sie noch wenige Speicherplatz verbrauchen.

Es gibt unzählige Methoden, die von Programm zu Programm variieren. Trotzdem kann man folgende softwareübergreifenden Faktoren feststellen :

Je mehr ein Bild aufgehellt wird, desto mehr eignet sich ein Speicherung als GIF

Je monotoner ein Bild dargestellt wird, desto mehr eignet sich ein Speicherung als GIF

Kontrastreiche, inhaltlich umfangreiche Bilder eignen sich besonders zur Speicherung als JPEG

Längere Farbverläufe lassen sich sehr gut als JPEG speichern.

Wer nun denkt, dass es die Anleitung zur professionellen Bildbearbeitung gibt, den müssen wir leider enttäuschen. Damit man auf einen Blick erkennen kann, wie man welches Bild nachbearbeitet und in welchem Format man das Bild nun abspeichert, benötigt man eine jahrelange Erfahrung im Umgang mit Bildern im Web.

Bitte wählen Sie nun einen der folgenden Artikel zum Thema Ladezeit-Optimierung :

Wie groß sollte die Ladezeit einer Webseite sein ?

Optimierung durch Bilddearbeitung

Optimierung von Bildern

Optimierung von Editoren-Quelltext

Zurück zur Ladezeit Übersichtsseite