1c185f4121
All checks were successful
Production Build & Deploy / build-and-deploy (push) Successful in 25s
11 lines
901 B
Markdown
11 lines
901 B
Markdown
---
|
|
name: core-web-vitals-perfection
|
|
description: Optimiert den generierten Code auf maximale Ladegeschwindigkeit und erzwingt Werte von >95% in Google Lighthouse / Core Web Vitals.
|
|
---
|
|
|
|
# Core Web Vitals Perfection Guidelines
|
|
|
|
* **LCP (Largest Contentful Paint):** Hero-Bilder müssen immer das Attribut `loading="eager"` und `fetchpriority="high"` erhalten. Niemals Lazy-Loading im sichtbaren Bereich über dem Falz.
|
|
* **CLS (Cumulative Layout Shift) verhindern:** Jedes Bild und jedes interaktive Element (wie Slider oder Akkordeons) MUSS feste Breiten- und Höhenangaben (`width`, `height` oder `aspect-ratio`) besitzen, damit das Layout beim Laden nicht springt.
|
|
* **Semantisches HTML & CSS-First:** JavaScript-freie Alternativen bevorzugen. Animationen und interaktive States (wie Dropdowns oder Modals) wenn möglich über reines CSS (:hover, :focus-within, Details/Summary-Tags) lösen.
|