Core Web Vitals sind kein Nice-to-have

Es gibt eine Zahl, die mehr über die Qualität einer Website aussagt als jedes Design-Award-Badge: die Ladezeit auf einem durchschnittlichen Android-Telefon im Mobilfunknetz.

Warum Performance Design ist

Eine Website, die 4 Sekunden lädt, hat kein Technik-Problem. Sie hat ein Entscheidungs-Problem: zu viel JavaScript, zu große Bilder, zu viele Fonts, Animationen auf der falschen Ebene.

Jede dieser Entscheidungen fällt im Design- und Entwicklungsprozess — nicht danach. Deshalb behandeln wir Performance-Budgets wie Gestaltungsregeln: Sie stehen am Anfang, nicht im Nachbesserungs-Sprint.

Die drei Zahlen, die zählen

• LCP (Largest Contentful Paint): Wann sieht man den Hauptinhalt? Ziel: unter 2,5 s, besser unter 1,5 s.
• INP (Interaction to Next Paint): Wie schnell reagiert die Seite auf Eingaben? Ziel: unter 200 ms.
• CLS (Cumulative Layout Shift): Springt das Layout beim Laden? Ziel: praktisch null.

Wie man sie erreicht — auch mit Animationen

Aufwendige visuelle Experiences und gute Vitals schließen sich nicht aus. Sie erfordern Disziplin:

• Server-Rendering für Inhalte, Client-JavaScript nur für Interaktivität.
• Animationen auf transform und opacity — GPU statt Layout.
• Canvas-Szenen pausieren, wenn sie unsichtbar sind. Ein Tab im Hintergrund braucht keine 60 fps.
• Adaptive Qualität: Ein fünf Jahre altes Mittelklasse-Telefon bekommt weniger Partikel — und merkt es nicht.
• prefers-reduced-motion ist ein Befehl, keine Empfehlung.

Performance ist das Feature, das alle anderen Features benutzbar macht.