FAQ unserer Kund:innen #4 – Bilder im Web richtig einsetzen

Wie gross dürfen Bilder für Websites sein?

Die wichtigste Regel vorweg: Die längste Bildseite sollte maximal 2400 Pixel betragen – unabhängig davon, ob es sich um ein kleines Inhaltsbild oder ein grosses Headerbild handelt.

Warum das so entscheidend ist:

• Zu grosse Bilder belasten das CMS und verlangsamen die Website
• Hohe Pixelmengen führen zu unnötigem Speicherverbrauch
• Browser-Skalierung ersetzt keine saubere Vorbereitung
• Grössere Bilder bringen keinen sichtbaren Qualitätsvorteil

Wichtig: Nicht die Dateigrösse in MB ist entscheidend – sondern die Pixelanzahl.

Was bestimmt die Bildqualität im Web?

Im Web spielt dpi keine Rolle. Entscheidend sind:

• die effektive Pixelanzahl
• die Schärfe bei 100 % Darstellung

Achte darauf, dass Bilder:

• nicht hochskaliert werden
• in der Zielgrösse scharf wirken
• nicht übermässig nachgeschärft sind

Welches Bildformat ist das richtige?

Die Wahl des Formats hat grossen Einfluss auf Ladezeit und Qualität:

WebP (Empfehlung)

Das Standardformat für moderne Websites. Bietet hohe Qualität bei kleiner Dateigrösse und unterstützt Transparenz sowie Animationen. In den meisten Fällen die beste Wahl.

SVG

Ein Vektorformat – ideal für Logos, Icons und Illustrationen. Beliebig skalierbar ohne Qualitätsverlust, aber nicht für Fotos geeignet.

JPEG

Weit verbreitet, aber technisch überholt. Für Fotos nutzbar, jedoch weniger effizient als WebP und ohne Transparenz.

PNG

Verlustfrei, aber oft sehr gross. Sinnvoll bei Transparenzen oder klaren Grafiken – nicht für Fotos.

GIF

Veraltet und ineffizient. Für Animationen besser auf WebP oder Video setzen.

Welchen Farbraum brauche ich für Webbilder?

Ganz einfach:

• RGB verwenden
• CMYK vermeiden

CMYK führt im Web zu falschen Farben, grösseren Dateien und technischen Problemen. Mehr dazu in unserem Blogbeitrag über Farbräume: RGB, CMYK, WTF?

Was muss ich vor dem Upload ins CMS beachten?

Eine kurze Checkliste für die Praxis:

• längste Bildseite maximal 2400 px
• bevorzugt im WebP-Format speichern
• RGB-Farbraum verwenden
• unnötigen Leerraum entfernen
• keine Druckprofile einbetten

Welche Tools eignen sich zur Bildaufbereitung?

Für die richtige Vorbereitung brauchst du kein kompliziertes Setup:

• Affinity Photo / Affinity Suite
  Ein professionelles Tool für präzises Zuschneiden, Skalieren und Exportieren in Webformate wie WebP. Ideal für saubere, kontrollierte Bildaufbereitung.
• bulkresizephotos
  Perfekt für schnelle Anpassungen. Besonders praktisch, um mehrere Bilder gleichzeitig auf die richtige Grösse zu bringen.

Sauber vorbereitete Bilder sind entscheidend für eine performante Website. Nicht maximale Qualität oder grosse Dateien machen den Unterschied – sondern die richtigen Dimensionen und das passende Format.

Deine Frage ist noch offen?

Dann melde dich gerne bei uns – wir freuen uns auf deine Nachricht!

Kontakt aufnehmen