1. Überprüfung der Dateigrösse und Abmessungen des Bildes
Klicke mit der rechten Maustaste auf die Bilddatei, um ein Menü zu öffnen. Unter «Eigenschaften» findest du die Dateigrösse und Abmessungen des Bildes. Diese Informationen sind entscheidend für die Komprimierung.
2. Bestimmung der Bildabmessungen auf der Website
Schau dir an, wie gross wird das Bild auf der Website ungefähr dargestellt wird.
Wie viel Fläche des Bildschirms wird für das Bild verwendet?
Faustregel zu der jeweiligen erlaubten Dateigrösse
1⁄1 Bildschirmgrösse: 600 kB
1⁄2 Bildschirmgrösse: 400 kB
Bis zu 1⁄4 der Bildschirmgrösse: 250 kB
Ermittle die ungefähre Grösse, die das Bild auf der Website einnehmen wird. Wie viel Bildschirmfläche wird das Bild einnehmen?
Hier sind Richtwerte für die maximale Dateigrösse je nach Bildschirmgrösse:
1⁄1 Bildschirmgrösse: 600 kB
1⁄2 Bildschirmgrösse: 400 kB
bis zu 1⁄4 der Bildschirmgrösse: 250 kB
Squoosh.app, dein Freund und Helfer
Mit dieser Website kannst du die nachfolgenden Schritte ausführen und am Ende dein webtaugliches Foto herunterladen.
Resize
Die gewünschten Bildabmessungen angeben.
Compress
Die Bildqualität reduzieren.
3. Anpassung der Bildabmessungen
Sobald du die benötigte Grösse kennst, kannst du das Bild auf die entsprechenden Abmessungen reduzieren. Nutze hierfür die folgenden Schritte:
Suche den ungefähren Anteil des Bildes auf dem Bildschirm.
Merke dir die empfohlene Dateigrösse in Kilobyte (kB).
Passe die groben Abmessungen im Squoosh-Tool an.
Vergleiche die tatsächliche Dateigrösse mit der empfohlenen Grösse.
4. Reduzierung der Qualität
Ist die Dateigrösse immer noch zu hoch? Reduziere die Bildqualität vorsichtig mit dem «Compress»-Regler. Achte darauf, nicht mehr zu komprimieren als unbedingt nötig, um die Bildqualität zu erhalten.
Hoch- oder Querformat
Stelle sicher, dass das Bild im richtigen Format für die Website angezeigt wird. Wenn du ein Bild im Querformat in einem Hochformat platzierst:
Wird das Bild beschnitten, um ins Hochformat zu passen.
Alles, was beschnitten wird, bleibt unsichtbar.
Schneide das Bild vorher selbst im Storyblok-Asset-Manager zu, um zu kontrollieren, was beschnitten und sichtbar ist.