Bilder und Medien

Bilder machen in den meisten Projekten den größten Teil des übertragenen Datenvolumens aus. Sie sind damit die erste Stellschraube, wenn eine Seite langsam wirkt.

TYPO3 erzeugt aus einem hochgeladenen Original automatisch die Varianten, die im Frontend gebraucht werden. Du gibst im Template die gewünschten Breiten an, der Browser sucht sich über das srcset die passende aus. Ein Bild mit 4000 Pixel Breite landet damit nicht mehr ungefragt auf einem Telefon.

Zwei Dinge gehören immer dazu. Erstens ein festes Seitenverhältnis, damit der Platz schon reserviert ist, bevor das Bild geladen wurde – sonst springt das Layout beim Nachladen, und genau das misst Google als Cumulative Layout Shift. Zweitens Lazy Loading für alles, was beim Aufruf nicht sichtbar ist.

Alternativtexte pflegst du in den Dateimetadaten, nicht im Content-Element. Dann stehen sie überall, wo das Bild verwendet wird.