26.01.2023
Mit diesen Tipps kannst du die Datenmenge auf deiner Website schön gering halten und auch die Chancen erhöhen, über Suchmaschinen besser gefunden zu werden.
Deine Website sollte eine schnelle Ladezeit haben und Bilder machen einen großen Teil davon aus, ob Foto, Illustrationen, Logos oder Icons. Mit diesen Tipps kannst du die Datenmenge auf deiner Website schön gering halten und auch die Chancen erhöhen, über Suchmaschinen besser gefunden zu werden.
JPEG, SVG, WEBP
Die besten Formate fürs Web sind JPG, SVG oder WebP. Achte darauf, dass du eins von den Formaten benutzt. SVG sind besonders gut geeignet für Icons oder Logos. WebP sind nochmal wesentlich kleiner und auch von Google sehr empfohlen. Leider haben alte Browser immer noch ab und zu Probleme, dieses Format darzustellen.
PNG
PNG ist natürlich nicht verboten, aber man sollte sie möglichst nur dann benutzen, wenn das Bild einen transparenten Hintergrund besitzt. Zudem haben sie eine größere Datenmenge als beispielsweise JPG und sollten sparsam verwendet werden.
600 - max. 2000 px
600px – 2000px sollten ein guter Anhaltspunkt sein, immer angemessen zu der Stelle, an der das Bild platziert wird. Bei Headerbildern, die ja eher eine etwas größere Pixelzahl haben können, würde ich etwa 2000px empfehlen. In einem zweispaltigen Abschnitt, in dem sich ein Bild und ein Text befinden, würde ich 600px für das Bild wählen.
3000 px
Achte darauf, dass die Bilder nicht allzu riesig sind. Stockbilder z.B. sind im Original immer super groß und sollten vorher auch verkleinert werden. Beachte aber: Je kleiner das Bild, desto kleiner auch die Datei. Bilder mit mehr Pixeln sind natürlich schöner. Man muss also einen Kompromiss finden.
Max. 150 - 200 KB
Auch die Änderung der Dateigröße kann beim Heraus speichern einiges ausmachen. Ich schaue immer, dass meine Bilder maximal 150 - 200 KB groß sind. Die optimale Dateigröße liegt hier meiner Ansicht nach zwischen 1 KB und 150 KB. Bei Headerbildern, darf es natürlich auch bis zu 200 KB hoch gehen.
200 KB
Alles, was darüber hinausgeht, erhöht das Volumen der Website stark und sorgt für längere Ladezeiten. Vor allem auf einer Seite, auf der mehrere Bilder zu sehen sind, kann man sich ja ausrechnen, wie viel größer die Seite dadurch werden kann.
70 % - 95 %
Achte darauf, dass die Bilder nicht zu viel an Qualität verlieren, da sonst unschöne Artefakte durch zu starke Komprimierung entstehen können. 70 – 95 % ist da ein guter Richtwert.
100 %
Qualität und Dateigröße stehen im Verhältnis zueinander. Je weiter man die Qualität des Bildes verringert, desto geringer wird die Dateigröße.
Ich hoffe diese Tipps konnten dir dabei weiterhelfen deine Bilder zu optimieren und die Ladezeit deiner Website zu verbessern. Wenn du noch Fragen hast, melde dich gerne bei mir!