Core Web Vitals: Googles Messwerte verstehen und optimieren

Stell dir vor, ein potenzieller Kunde in Zürich sucht auf dem Smartphone nach deiner Dienstleistung, klickt auf dein Suchergebnis – und wartet. Drei Sekunden. Fünf Sekunden. Nach sieben Sekunden tippt er auf den Zurück-Button und wählt den nächsten Treffer. Du hast gerade einen Kunden verloren, bevor er überhaupt gesehen hat, was du anbietest.

Core Web Vitals sind Googles Antwort auf dieses Problem. Es sind drei konkrete Messwerte, die messen, wie schnell und stabil deine Website für echte Nutzer ist. Seit 2021 fliessen sie direkt in das Google-Ranking ein. Für Schweizer KMU bedeutet das: Performance ist kein netter Bonus mehr, sondern ein echtes Kriterium für deinen Online-Erfolg.

Dieser Beitrag ist Teil unseres Perfekte Website Guide, der alle Bausteine einer erfolgreichen Unternehmenswebsite abdeckt.

Die drei Core Web Vitals im Detail

Google hat die Core Web Vitals bewusst auf drei Kernmetriken reduziert, die zusammen die wichtigsten Aspekte der Nutzererfahrung abdecken: Ladegeschwindigkeit, Reaktionszeit und visuelle Stabilität.

LCP – Largest Contentful Paint

Der LCP misst, wie lange es dauert, bis das grösste sichtbare Element im Viewport geladen ist. Das ist meist ein Hero-Bild, ein grosser Textblock oder ein Video-Thumbnail.

Die Schwellenwerte:

• Gut: Unter 2,5 Sekunden
• Verbesserungswürdig: 2,5 bis 4 Sekunden
• Schlecht: Über 4 Sekunden

Was den LCP typischerweise verschlechtert:

• Grosse, unkomprimierte Bilder (der häufigste Grund bei KMU-Websites)
• Langsame Server-Antwortzeiten (billiges Shared Hosting)
• Render-blockierendes JavaScript und CSS
• Langsame Webfonts, die den Textaufbau verzögern

Konkrete Optimierungsmassnahmen:

• Bilder im modernen WebP- oder AVIF-Format ausliefern (spart 30-50% Dateigrösse gegenüber JPG).
• Lazy Loading für Bilder unterhalb des sichtbaren Bereichs aktivieren.
• Das Hero-Bild mit priority oder fetchpriority="high" markieren, damit es zuerst geladen wird.
• Schweizer Hosting-Anbieter wie Infomaniak oder cyon nutzen, die schnelle Server in der Schweiz betreiben.
• Ein CDN (Content Delivery Network) einsetzen, damit Inhalte vom nächstgelegenen Server ausgeliefert werden.

INP – Interaction to Next Paint

Der INP (seit März 2024 offizieller Core Web Vital, ersetzt FID) misst die Reaktionszeit deiner Website auf Nutzerinteraktionen. Jeder Klick, jedes Tippen, jede Tastatureingabe wird gemessen. Der schlechteste Wert (abzüglich Ausreisser) bestimmt dein INP.

Die Schwellenwerte:

• Gut: Unter 200 Millisekunden
• Verbesserungswürdig: 200 bis 500 Millisekunden
• Schlecht: Über 500 Millisekunden

Was den INP typischerweise verschlechtert:

• Aufwendige JavaScript-Berechnungen beim Klick
• Zu viele Third-Party-Scripts (Analytics, Chat-Widgets, Tracking)
• Ineffizientes Event-Handling
• DOM-Manipulationen, die den Browser blockieren

Konkrete Optimierungsmassnahmen:

• JavaScript-Bundles aufteilen und nur laden, was auf der aktuellen Seite benötigt wird.
• Third-Party-Scripts asynchron oder verzögert laden (defer/async).
• Schwere Berechnungen in Web Workers auslagern.
• Unnötige Analytics- und Tracking-Scripts entfernen. Brauchst du wirklich fünf verschiedene Tracking-Tools?
• Event-Handler optimieren und teure DOM-Operationen vermeiden.

CLS – Cumulative Layout Shift

CLS misst, wie stark sich Layout-Elemente während des Ladevorgangs verschieben. Kennst du das: Du willst auf einen Button klicken, und im letzten Moment springt die Seite nach unten, weil ein Werbebanner geladen wurde? Genau das misst CLS.

Die Schwellenwerte:

• Gut: Unter 0,1
• Verbesserungswürdig: 0,1 bis 0,25
• Schlecht: Über 0,25

Was den CLS typischerweise verschlechtert:

• Bilder und Videos ohne definierte Grösse (width/height)
• Dynamisch eingefügter Inhalt (Cookie-Banner, Newsletter-Popups)
• Webfonts, die das Layout beim Laden verschieben (FOUT)
• Werbebanner, die nachträglich Platz beanspruchen

Konkrete Optimierungsmassnahmen:

• Immer width und height Attribute für Bilder und Videos setzen.
• Platz für dynamische Inhalte (Banner, Ads) vorab reservieren.
• font-display: swap für Webfonts verwenden und Fallback-Schriften mit ähnlichen Massen definieren.
• Cookie-Banner als Overlay gestalten, nicht als Element, das den restlichen Inhalt nach unten schiebt.

So misst du deine Core Web Vitals

Es gibt zwei Arten von Daten: Labordaten (simulierte Tests) und Felddaten (echte Nutzerdaten). Beide sind wichtig.

Labordaten: Kontrollierte Tests

• PageSpeed Insights: Googles offizielles Tool. Zeigt sowohl Labor- als auch Felddaten und gibt konkrete Optimierungsvorschläge.
• Lighthouse: In Chrome DevTools eingebaut. Ideal für detaillierte Analysen während der Entwicklung.
• WebPageTest: Erlaubt Tests von verschiedenen Standorten und Geräten. Du kannst sogar aus Zürich oder Bern testen.

Felddaten: Echte Nutzererfahrung

• Chrome User Experience Report (CrUX): Googles Sammlung echter Nutzerdaten. In PageSpeed Insights als «Felddaten» angezeigt.
• Google Search Console: Zeigt deine Core Web Vitals für alle Seiten und meldet Probleme.
• Web Vitals Chrome Extension: Zeigt die Core Web Vitals in Echtzeit beim Surfen an.

Warum Felddaten wichtiger sind

Labordaten sind nützlich für die Entwicklung, aber Google nutzt Felddaten für das Ranking. Das bedeutet: Deine Website muss für echte Nutzer schnell sein, nicht nur in einem Labortest. Ein schneller Test aus Zürich mit Glasfaser-Internet sagt wenig aus, wenn deine Kunden im Emmental mit durchschnittlichem Mobilfunk surfen.

Performance-Budget: Grenzen setzen

Ein Performance-Budget ist eine Vereinbarung, die festlegt, welche maximalen Werte deine Website nicht überschreiten darf. Das klingt simpel, ist aber eines der wirksamsten Werkzeuge für nachhaltig schnelle Websites.

Beispiel für ein KMU-Performance-Budget

• Gesamte Seitengrösse: Maximal 1,5 MB (inkl. Bilder, CSS, JavaScript)
• JavaScript-Bundle: Maximal 200 KB (komprimiert)
• LCP: Unter 2 Sekunden
• INP: Unter 150 Millisekunden
• CLS: Unter 0,05
• Anzahl HTTP-Requests: Maximal 50

Warum ein Budget für Schweizer KMU besonders sinnvoll ist

Die Schweiz hat zwar eine hervorragende Netzinfrastruktur, aber:

• Mobile Nutzer machen über 60% des Traffics aus. Mobilfunk ist langsamer als Glasfaser.
• Touristen in touristischen Regionen surfen mit ausländischen Mobilfunknetzen, die oft langsamer sind.
• Ältere Geräte sind weiter verbreitet, als man denkt. Nicht jeder hat das neueste iPhone.

Ein Performance-Budget hilft dir, bei jeder Änderung an der Website bewusst zu entscheiden: Ist dieses neue Feature den Performance-Verlust wert?

Typische Performance-Probleme bei KMU-Websites

Aus unserer Erfahrung bei D3 Webstudio in Solothurn sehen wir bei KMU-Websites immer wieder dieselben Performance-Probleme:

Problem 1: Unkomprimierte Bilder

Ein einziges Foto direkt aus der Kamera kann 5-10 MB gross sein. Multipliziere das mit zehn Bildern auf der Startseite, und du hast eine 50-MB-Website. Die Lösung: Automatische Bildoptimierung mit modernen Formaten (WebP/AVIF) und responsiven Grössen.

Problem 2: Zu viele Plugins und Scripts

Jedes WordPress-Plugin, jedes Chat-Widget, jedes Analytics-Tool fügt JavaScript hinzu. Wir sehen regelmässig KMU-Websites mit 20+ externen Scripts, die die Ladezeit um mehrere Sekunden verlängern. Prüfe kritisch: Welche Tools brauchst du wirklich?

Problem 3: Billiges Shared Hosting

Hosting für CHF 3.95 pro Monat klingt verlockend, aber wenn sich hundert Websites einen Server teilen, leidet die Performance. Schweizer Anbieter wie Infomaniak oder cyon bieten deutlich bessere Performance zu fairen Preisen von CHF 10-20 pro Monat.

Problem 4: Fehlende Caching-Strategie

Ohne Browser-Caching muss jeder Besucher bei jedem Seitenaufruf alle Ressourcen neu laden. Mit einer intelligenten Caching-Strategie werden statische Inhalte (Bilder, CSS, Fonts) lokal gespeichert und nur bei Änderungen neu geladen.

Schritt-für-Schritt-Optimierung

Hier ist ein pragmatischer Fahrplan, um deine Core Web Vitals zu verbessern:

FAQ

Wie stark beeinflussen Core Web Vitals das Google-Ranking?

Core Web Vitals sind ein Ranking-Faktor, aber nicht der wichtigste. Relevanter Inhalt und gute Backlinks wiegen schwerer. Allerdings: Bei zwei gleichwertigen Seiten gewinnt die schnellere. In kompetitiven lokalen Märkten kann das den Unterschied machen.

Meine Website hat schlechte Core Web Vitals. Muss ich sie neu bauen?

Nicht unbedingt. Oft reichen gezielte Optimierungen wie Bildkomprimierung, Hosting-Upgrade und Script-Audit. Wenn die Website aber auf einem veralteten Baukasten basiert und fundamental langsam ist, kann ein Neubau mit moderner Technologie langfristig die bessere Investition sein. Auf unserer Seite Website erstellen lassen erfährst du, was ein Neubau kostet.

Wie oft sollte ich meine Core Web Vitals prüfen?

Mindestens monatlich über die Google Search Console. Nach grösseren Änderungen (neues Plugin, Design-Update, neue Inhalte) solltest du sofort testen. Am besten richtest du ein automatisches Monitoring ein, das dich bei Verschlechterungen warnt.

Welche Core Web Vital ist am wichtigsten?

Alle drei sind wichtig, aber LCP hat den grössten wahrgenommenen Effekt auf die Nutzererfahrung. Wenn du priorisieren musst, starte mit dem LCP, dann CLS, dann INP.

Fazit: Performance als Wettbewerbsvorteil

In der Schweiz, wo Kunden hohe Qualitätsstandards gewohnt sind, wirkt eine langsame Website unprofessionell. Gute Core Web Vitals signalisieren: Hier kümmert sich jemand um Details. Und genau das erwarten Schweizer Kunden.

Mehr dazu, wie du deine Website ganzheitlich für den Erfolg aufstellst, findest du in unserem Perfekte Website Guide.

Willst du wissen, wie schnell deine Website sein könnte? Lass deine Website von uns erstellen und erhalte ein massgeschneidertes Angebot für eine performante, moderne Website. Inklusive optimierter Core Web Vitals von Anfang an.