Ihre Website lädt möglicherweise schnell. Reagiert sie aber genauso schnell, wenn Ihr Besucher einen Produktfilter auswählt, das Menü öffnet oder Angaben in ein Angebotsformular einträgt?
Wer auf eine Schaltfläche tippt und danach keine Veränderung auf dem Bildschirm sieht, hat schnell das Gefühl, dass die Aktion nicht ausgeführt wurde. Gerade bei Kauf- und Anfrageschritten ist diese Wartezeit ein Problem der Nutzererfahrung, das Ihr Unternehmen im Blick behalten sollte.
Die INP-Optimierung ist eine Performance-Optimierung, mit der die visuelle Rückmeldung auf Interaktionen der Besucher beschleunigt wird. Ziel ist es, dass die Oberfläche ohne Verzögerung reagiert, sobald der Nutzer eine Aktion ausführt.
In diesem Leitfaden erklären wir, was INP misst, wie es mit SEO zusammenhängt und wie sich die Optimierung anhand eines Beispielszenarios aus dem E-Commerce planen lässt.
Was ist INP und was misst es?
INP steht für „Interaction to Next Paint“. Die Metrik bewertet die Zeit zwischen einer Interaktion des Nutzers per Klick, Tippen oder Tastatur und dem Moment, in dem der Browser das nächste Bild darstellt.
Berücksichtigt werden die Interaktionen während des gesamten Seitenbesuchs, nicht nur der erste Klick. Scrollen und das Überfahren eines Elements mit der Maus gehören hingegen nicht direkt zu den INP-relevanten Interaktionen.
Ein wichtiger Unterschied: INP misst nicht die Gesamtdauer, bis ein Vorgang vollständig abgeschlossen ist. Nach dem Absenden eines Formulars erscheint die Ladeanzeige beispielsweise möglicherweise schnell, während der Server für die Verarbeitung länger braucht. Für eine gute Nutzererfahrung sollten beide Zeiten bewertet werden.
Welcher INP-Wert gilt als gut?
| INP-Wert | Bewertung |
|---|---|
| 200 Millisekunden oder weniger | Gut |
| Über 200 Millisekunden, bis 500 Millisekunden | Verbesserungsbedarf |
| Über 500 Millisekunden | Schlecht |
Bei der Bewertung anhand echter Nutzerdaten wird das 75. Perzentil herangezogen. Liegt dieser Wert bei 200 Millisekunden oder darunter, erfüllen mindestens 75 Prozent der gemessenen Erfahrungen diesen Schwellenwert. Mobile und Desktop-Ergebnisse sollten getrennt betrachtet werden.
Warum ist die INP-Optimierung für Unternehmen wichtig?
Wie gravierend ein Performance-Problem ist, hängt davon ab, welchen Schritt des Kunden es betrifft. Ein Aufklappmenü im Blog und eine Schaltfläche auf der Bezahlseite haben nicht unbedingt dieselbe geschäftliche Priorität.
Um die INP-Arbeit mit Ihren Unternehmenszielen zu verknüpfen, sollten Sie die kritischen Interaktionen bestimmen:
| Unternehmenstyp | Vorrangige Interaktionen | Ergebnis, das parallel überwacht werden kann |
|---|---|---|
| E-Commerce | Filtern, Variantenauswahl, In-den-Warenkorb-Legen | Warenkorb- und Kaufquote |
| Dienstleistungsunternehmen | Angebotsformular, Leistungsauswahl | Anzahl abgeschlossener Anfragen |
| B2B-Unternehmen | Demo-Formular, Lösungsmenüs | Anzahl qualifizierter Anfragen |
| Publisher | Websuche, Kategoriemenü | Content-Entdeckung und Besuchstiefe |
Eine Oberfläche, die schneller reagiert, kann es Besuchern erleichtern, ihren Vorgang fortzusetzen. Ein Anstieg der Conversions sollte jedoch nicht als selbstverständlich angenommen werden. Auch Faktoren wie Preis, Kampagnen, Traffic-Quelle und Formulargestaltung beeinflussen die Ergebnisse.
Deshalb sollten Performance- und Geschäftskennzahlen gemeinsam beobachtet und die Wirkung der Optimierung anhand vergleichbarer Zeiträume oder geeigneter Experimente bewertet werden.
Wie hängen INP und SEO zusammen?
INP ist eine der Core-Web-Vitals-Metriken. Google gibt an, dass Core-Web-Vitals-Daten in seinen Ranking-Systemen verwendet werden. Gute Werte garantieren allerdings keine Spitzenplätze in den Suchergebnissen. Ebenso wichtig sind, dass der Inhalt die Suchintention erfüllt, und die übrigen Ranking-Faktoren.
Die INP-Optimierung sollte als Teil der Arbeit an technischem SEO und Nutzererfahrung verstanden werden. Für Unternehmen lautet der richtige Ansatz: Besucher mit relevanten Inhalten gewinnen und ihnen anschließend ermöglichen, auf der Website reibungslos zu agieren.
Bei den Leistungen von SEO Performans besteht das Ziel darin, neben den Werten im Bericht auch die tatsächliche Nutzererfahrung zu verbessern. Eine Bewertung, die nur auf der Startseite basiert, reicht deshalb möglicherweise nicht aus, um Probleme auf Produkt-, Kategorie- oder Angebotsseiten aufzudecken.
Wie werden INP-Probleme erkannt?
Eine belastbare Analyse kombiniert echte Nutzerdaten mit kontrollierten Tests.
1. Echte Nutzerdaten auswerten
PageSpeed Insights zeigt bei ausreichender Datenmenge Felddaten aus dem Chrome User Experience Report an. Diese Ergebnisse umfassen die vorangegangenen 28 Tage.
Im Bericht sollte geprüft werden, ob sich die Daten auf die jeweilige URL oder auf die Origin-Ebene beziehen, die die gesamte Website repräsentiert. Fehlen Daten für eine Seite, bedeutet das nicht, dass sie schnell ist; möglicherweise wurden schlicht nicht genügend Stichproben erfasst.
2. Die langsame Interaktion reproduzieren
Der nächste Schritt besteht darin, herauszufinden, welche Nutzeraktion verzögert wird. Zum Beispiel:
- Hakt das mobile Menü beim ersten Öffnen?
- Entsteht beim Auswählen des Produktfilters eine Wartezeit?
- Gibt es Verzögerungen beim Tippen in Formularfelder?
- Tritt das Problem erst auf, nachdem das Chat-Tool geladen wurde?
Eine Aufzeichnung der Interaktion mit den Chrome DevTools hilft, die drei Phasen der Verzögerung zu unterscheiden: die Wartezeit, bis das Ereignis verarbeitet wird, die Ausführungszeit der Event-Handler und die Zeit bis zur Darstellung des nächsten Bildes. So lässt sich die Lösung gezielt auf die Ursache der Verzögerung ausrichten.
3. Den Lab-Wert richtig interpretieren
Der Performance-Score von PageSpeed Insights und der INP-Wert echter Nutzer sind unterschiedliche Messungen. Ein hoher Lab-Score beweist nicht, dass alle Interaktionen während eines Besuchs schnell sind.
Lab-Tests dienen dazu, Probleme zu untersuchen; Felddaten dienen dazu, die tatsächlich erlebte Nutzererfahrung zu bewerten.
Wie wird INP optimiert?
Welche Lösung zum Einsatz kommt, richtet sich nach dem Engpass, der in der Messung sichtbar wird.
JavaScript-Last reduzieren
Aufgaben, die den Haupt-Thread des Browsers lange blockieren, können dazu führen, dass Nutzerinteraktionen warten müssen. Sinnvoll können das Entfernen von überflüssigem Code, das Aufteilen langer Tasks und das Verschieben nicht zwingend erforderlicher Aufgaben während einer Interaktion sein.
Vorgänge während der Interaktion vereinfachen
Werden beim Klick auf eine Schaltfläche gleichzeitig viele Berechnungen, Analytics-Ereignisse und Oberflächenaktualisierungen ausgeführt, kann sich die Verzögerung erhöhen. Vorrang sollten die für die Aktion des Nutzers notwendigen Aufgaben und ein rechtzeitiges visuelles Feedback haben.
Rendering-Kosten senken
Unnötig große Seitenstrukturen und häufige Layout-Berechnungen können die Aktualisierung der Darstellung verzögern. Geprüft wird, ob nur die erforderlichen Bereiche aktualisiert und wiederholte Layout-Vorgänge reduziert werden können.
Drittanbieter-Tools prüfen
Die Kosten von Chat-, Werbe-, Analyse- und Personalisierungstools zum Zeitpunkt der Interaktion sollten gemessen werden. Ungenutzte Integrationen zu entfernen oder deren Ladezeitpunkte anzupassen, kann Teil der Lösung sein. Bei diesen Änderungen müssen Tracking und die grundlegenden Funktionen der Website erhalten bleiben.
Fallbeispiel: Verzögerung beim mobilen Produktfilter
Dieses Szenario dient dazu, die Arbeitsweise zu erläutern. Es handelt sich weder um ein reales Kundenprojekt noch um ein gemessenes Erfolgsergebnis.
Bei einem Onlineshop öffnet sich die Kategorieseite schnell. Wählt ein Besucher jedoch den Markenfilter aus, reagiert die Oberfläche kurzzeitig nicht. Da der Nutzer nicht erkennen kann, ob seine Auswahl erfasst wurde, tippt er erneut.
Analyseplan
Zunächst wird die problematische Interaktion auf einem repräsentativen Mobilgerät aufgezeichnet. In der Untersuchung werden folgende Möglichkeiten geprüft:
- Übermäßig viele Produkte werden beim Filtern berechnet.
- Für eine einzige Auswahl erfolgen mehrere Oberflächenaktualisierungen.
- Die gesamte Produktliste wird neu aufgebaut.
- Umfangreicher Drittanbieter-Code läuft gleichzeitig mit der Interaktion.
Das sind Ausgangshypothesen; ohne Messung werden sie nicht als gesicherte Ursache dargestellt.
Umsetzungsplan
Bestätigt sich, dass der Engpass im unnötigen Neuaufbau der Produktliste liegt, konzentriert sich die Änderung auf dieses Verhalten. Überflüssige Berechnungen werden reduziert, und es wird geprüft, ob nur die betroffenen Bereiche aktualisiert werden können.
Dem Nutzer wird rechtzeitig angezeigt, dass seine Filterauswahl erkannt wurde. Kommen die Ergebnisse vom Server, wird der Ladezustand zusätzlich kenntlich gemacht; zudem wird gemessen, wie lange die Ergebnisse tatsächlich bis zur Bereitstellung brauchen.
Wie wird der Erfolg bewertet?
| Messung | Beantwortete Frage |
|---|---|
| Wiederholter Interaktionstest unter gleichen Bedingungen | Hat die Änderung die angestrebte Verzögerung verringert? |
| Mobiler INP-Wert aus Felddaten | Kommt die Verbesserung bei echten Nutzern an? |
| Bereitstellungszeit der Filterergebnisse | Gelangt der Nutzer schneller zu den gewünschten Produkten? |
| Fehler- und Funktionstests | Funktionieren die Filter weiterhin korrekt? |
| Conversion der Besucher, die Filter nutzen | Gibt es eine aussagekräftige Veränderung bei den Geschäftsergebnissen? |
Dieser Ansatz zeigt, welches Problem gelöst wurde und wie das Ergebnis überprüft wird, statt nur zu behaupten, die Website sei schneller geworden.
Was sollte eine INP-Optimierung als Leistung umfassen?
Bei der Festlegung des Leistungsumfangs für ein INP-Projekt sollten Sie auf folgende Ergebnisse achten:
- Erstbewertung: Prioritäre Seiten, Gerätegruppen und vorhandene Messwerte.
- Interaktionsanalyse: Vorgänge, bei denen Verzögerungen auftreten, und technische Erkenntnisse.
- Priorisierter Maßnahmenplan: Auswirkung auf Nutzer, Umsetzungsaufwand und Abhängigkeiten.
- Technische Umsetzung: Änderungen, die auf die bestätigten Ursachen zielen.
- Ergebniskontrolle: Performance-Vergleich und Funktionstests.
- Monitoring: Beobachtung, wie sich neue Funktionen oder Integrationen auf die Performance auswirken.
Wertvoll für Unternehmen ist vor allem ein verständlicher Entscheidungsplan: Welches Problem sollte zuerst gelöst werden, warum hat es Vorrang und wie wird der Erfolg gemessen?
Häufig gestellte Fragen
Ist die INP-Optimierung dasselbe wie eine Beschleunigung der Website?
Die INP-Optimierung konzentriert sich auf den Teil der Website-Performance, der die Reaktion auf Interaktionen betrifft. Ladegeschwindigkeit, visuelle Stabilität und Serverantworten sind weitere Bestandteile der umfassenderen Performance-Arbeit.
Reicht es aus, nur ein Speed-Plugin zu verwenden?
Das hängt von der Ursache des Problems ab. Allgemeine Optimierungseinstellungen können helfen; Verzögerungen, die von einem bestimmten Filter, einem Formular oder individuellem Code verursacht werden, erfordern jedoch unter Umständen die direkte Untersuchung dieser Komponente.
Wann sind die Ergebnisse der Optimierung sichtbar?
In kontrollierten Tests lässt sich nach der Änderung ein Vergleich durchführen. Da die Felddaten von PageSpeed Insights einen Zeitraum von 28 Tagen umfassen, spiegelt sich die Wirkung der neuen Version erst nach und nach im Bericht wider.
Steigt das Google-Ranking, wenn der INP-Wert besser wird?
Ein sicherer Anstieg lässt sich nicht versprechen. INP ist ein Teil der Seitenerfahrung; die organische Sichtbarkeit sollte gemeinsam mit Inhalt, Suchintention, technischer Zugänglichkeit und den übrigen Ranking-Faktoren betrachtet werden.
Finden Sie die Interaktions-Performance Ihrer Website heraus
Möglicherweise warten Ihre Besucher, wenn sie ein Menü öffnen, ein Produkt auswählen oder ein Formular ausfüllen. Zu bestimmen, auf welchen Seiten diese Verzögerungen auftreten, ist der erste Schritt zur richtigen Optimierungsentscheidung.
Senden Sie Ihre Analyseanfrage, um mit SEO Performans den aktuellen Stand Ihrer Website zu bewerten und den Bedarf an INP-Optimierung zu besprechen. Hilfreich für die Erstbewertung ist es, wenn Sie zusammen mit Ihrer Website-Adresse die Seite oder den Vorgang nennen, bei dem Ihnen eine Verlangsamung aufgefallen ist.
Kostenlose SEO-Analyse anfordern