Bilder, Schriften, Skripte: die drei größten Bremsen und was hilft
900 KBBilder lädt eine typische Startseite auf dem Smartphone, mehr als jede andere Dateiart (Median 2024) [1]
Bilder machen den größten Teil einer Seite aus, Schriften verzögern den Text, fremde Skripte blockieren die Bedienung. Was wir beim Bau dagegen tun und was Agenturen im Briefing gleich mitgeben können.
Wo das Gewicht steckt
Eine typische mobile Startseite
Bilder: das Titelbild zuerst
Das größte Element oben auf der Seite ist meist ein Bild, und davon hängt der LCP ab [2]. Drei Regeln bringen am meisten:
- Das Titelbild sofort laden. Bilder weiter unten werden verzögert geladen, das Titelbild nie. Es bekommt hohe Priorität, damit der Browser es zuerst holt [2].
- Die richtige Größe liefern. Ein Foto direkt aus der Kamera hat oft mehrere Megabyte. Wir erzeugen je Bild passende Größen und moderne Formate wie AVIF oder WebP, das Telefon bekommt die kleine Variante.
- Feste Maße angeben. Kennt der Browser Breite und Höhe vorab, springt beim Laden nichts. Das hält den CLS niedrig.
Schriften: lokal, schlank, mit Plan B
Webfonts machen Seiten schöner und langsamer, wenn man nicht aufpasst. web.dev empfiehlt das Format WOFF2, das Vorladen nur der wichtigsten Schrift und das Weglassen ungenutzter Zeichen, was die Dateien deutlich verkleinert [3]. Mit der passenden Einstellung erscheint der Text sofort in einer Systemschrift und wechselt, sobald die Webfont da ist [3].
Wir binden Schriften lokal vom eigenen Server ein, nicht über einen fremden Dienst. Das ist auch eine Frage des Datenschutzes. Fürs Tempo bringt es nur dann etwas, wenn der Server modern ausliefert, mit HTTP/2 und gutem Caching [3]; das prüfen wir mit. Mehr zur Auswahl von Schriften steht in Typografie im Web.
Skripte: später, weniger, abgeschottet
Chat-Fenster, Karten, Videos, Tracking, Cookie-Banner: Jedes fremde Skript kostet Zeit und kann die Bedienung blockieren. web.dev rät, Skripte von Drittanbietern immer asynchron oder verzögert zu laden, sofern sie nicht für die erste Darstellung nötig sind [4]. Eingebettete Inhalte wie Karten oder Werbung lädt man erst, wenn sie ins Bild kommen [4].
Wir gehen einen Schritt weiter: Eine Karte oder ein Video erscheint zunächst als Vorschaubild und lädt erst beim Klick. Das ist schneller und datenschutzfreundlicher, weil vorher nichts an fremde Server geht. Und bei jedem Skript fragen wir, ob die Seite es wirklich braucht.
Was Sie im Briefing gleich mitgeben können
| Kriterium | Warum es hilft |
|---|---|
| Bilder in voller Auflösung, unbearbeitet | Wir erzeugen daraus die passenden Größen und Formate, statt schon verkleinerte Bilder noch einmal zu verschlechtern. |
| Welche Schriftschnitte wirklich nötig sind | Jeder Schnitt ist eine eigene Datei. Zwei bis drei reichen fast immer. |
| Liste der Dienste: Tracking, Chat, Karten, Videos | So planen wir von Anfang an, was später lädt und was über das Cookie-Banner läuft. |
Eine Orientierung aus unseren Projekten.
Fragen zu Bildern, Schriften und Skripten
Welches Bildformat ist das richtige?
Für Fotos AVIF oder WebP, beide sind deutlich kleiner als JPEG und werden von allen aktuellen Browsern unterstützt. Für Logos und Symbole SVG, weil es in jeder Größe scharf bleibt. Die Redaktion muss sich darum nicht kümmern: Sie lädt das Bild hoch, die passenden Formate und Größen erzeugen wir automatisch.
Dürfen wir Google Fonts direkt von Google laden?
Wir raten davon ab. Beim direkten Laden geht die IP-Adresse der Besucher an Google, und das Landgericht München hat dafür 2022 Schadenersatz zugesprochen. Wir binden Schriften deshalb lokal vom eigenen Server ein. Das ist eine Orientierung, keine Rechtsberatung.
Wie viele Tracking- und Marketing-Skripte verträgt eine Website?
So wenige wie möglich. Jedes Skript kostet Ladezeit und kann die Bedienung bremsen. Wir sammeln am Anfang, welche Dienste wirklich nötig sind, laden sie verzögert und erst nach der Einwilligung im Cookie-Banner. Das hilft dem Tempo und dem Datenschutz.
Für Agenturen
Lassen Sie die Website Ihres Kunden white-label messen. Sie bekommen die drei Werte, die größten Bremsen und einen Fixpreis für die Behebung, in Ihrem Branding.
Sie sind ein Unternehmen? Rückruf vereinbaren
Weiterlesen
- Warum Ladezeit Geld kostet: Tempo als VerkaufsargumentSchnellere Seiten verkaufen messbar besser, und Google nutzt die Core Web Vitals in der Suche. Für Agenturen ist Tempo deshalb kein Technikdetail, sondern ein Argument im Angebot.
- Astro: Warum statische Seiten so schnell sind und wann es sich lohntAstro liefert fertiges HTML und lässt JavaScript weg, wo es keins braucht. Das macht Seiten schnell und robust. Wann sich Astro lohnt, wann WordPress oder Statamic allein reichen und wie die Redaktion arbeitet.
- Core Web Vitals verständlich: LCP, INP und CLS ohne FachchinesischDrei Messwerte entscheiden, ob Google eine Seite für schnell hält: Laden, Reagieren, Stillhalten. Was sie bedeuten, wo die Grenzen liegen und warum ein Lighthouse-Wert allein nichts beweist.
Quellen
- HTTP Archive, Web Almanac 2024: Page Weight (30.12.2024) · abgerufen am 29.10.2026
- web.dev, Optimize Largest Contentful Paint · abgerufen am 29.10.2026
- web.dev, Best practices for fonts · abgerufen am 29.10.2026
- web.dev, Load Third-Party JavaScript · abgerufen am 29.10.2026
Recherchiert mit KI-Unterstützung, mit Quellen belegt und inhaltlich geprüft von Mike Joerihsen am .
Diese Inhalte sind eine Orientierung und keine Rechtsberatung. Bei konkreten Fragen zu Ihrer Situation wenden Sie sich an eine Rechtsberatung oder die zuständige Behörde.