Fehlerbehebung bei Critical CSS in Jetpack Boost

Wenn ein Fehler auftritt, der darauf hinweist, dass Critical CSS nicht wie erwartet generiert wird, ist es entscheidend, anhand der erhaltenen Fehlermeldung das konkrete Problem zu ermitteln.

Um zu überprüfen, ob Critical CSS funktioniert, können Sie den Quelltext Ihrer Seite anzeigen und nach dieser Zeile suchen:

<style id="jetpack-boost-critical-css">

Um den Quelltext der Seite anzuzeigen, klicken Sie mit der rechten Maustaste auf eine beliebige Stelle Ihrer Website und wählen Sie Quelltext der Seite anzeigen (oder drücken Sie Ctrl+U / Cmd+U auf Ihrer Tastatur).

Wenn Sie diese Zeile sehen, hat Jetpack Boost Critical CSS erfolgreich zu Ihrer Website hinzugefügt. Wenn sie fehlt oder etwas nicht richtig aussieht, sehen Sie auf der Seite zur Fehlerbehebung.

Umleitungsfehler

Dieser Fehler tritt auf, wenn Jetpack Boost während der Generierung von Critical CSS an eine neue URL weitergeleitet wird. Mögliche Ursachen sind:

  • Plugins für den Wartungsmodus, die zu einer „Demnächst verfügbar“-Seite weiterleiten.
  • Plugins zur Einwilligungsverwaltung, die zu einer Einwilligungsseite weiterleiten.
  • Plugins zur Umschreibung von URL entfernen GET-Argumente, wodurch falsche URLs entstehen.

Mögliche Lösungen:

  1. Stellen Sie sicher, dass die URLs korrekt festgelegt sind und keine unbeabsichtigten Weiterleitungen eingerichtet wurden.
  2. Deaktivieren Sie vorübergehend Plugins für den Wartungsmodus, um zu prüfen, ob das Problem dadurch behoben wird.
  3. Konfigurieren Sie Plugins zur Einwilligungsverwaltung so, dass Jetpack Boost auf die erforderlichen Seiten zugreifen kann.
  4. Passen Sie die Einstellungen des Plugins zur Umschreibung von URL an, damit die Ziel-URLs nicht geändert werden.
  5. Wenn die Weiterleitung auf standardmäßige HTTP-301/302-Weiterleitungen zurückzuführen ist, müssen Sie möglicherweise akzeptieren, dass Critical CSS für diese Seiten nicht generiert werden kann.

Wenn die Weiterleitung auf standardmäßige HTTP 301/302 Weiterleitungen zurückzuführen ist, müssen Sie möglicherweise akzeptieren, dass Critical CSS für diese Seiten nicht generiert werden kann.

HTTP-Fehler

Bei der Generierung von Critical CSS kann Jetpack Boost auf verschiedene HTTP-Fehler stoßen. Jeder Fehler weist auf ein bestimmtes Problem hin, das behoben werden muss. Im Folgenden finden Sie häufige HTTP-Fehler, die auftreten können, sowie deren Ursachen und mögliche Lösungen, damit Sie sie effektiv beheben können.

HTTP-Fehler 401, 403

Dieser Fehler weist auf ein Berechtigungsproblem auf der Website von WordPress hin.

Mögliche Lösungen für HTTP-Fehler 401/403:

  1. Überprüfen Sie die Einstellungen von WordPress oder wenden Sie sich an Ihren Hosting-Anbieter, um zu erfahren, warum die URL nicht verfügbar ist.
  2. Stellen Sie sicher, dass die Seite nicht privat, sondern zugänglich ist. Öffnen Sie dazu den Link im „Inkognito-Modus“ oder beim „Privaten Surfen“ und prüfen Sie, ob er wie erwartet geladen wird, wenn Sie nicht angemeldet sind.

HTTP-Fehler 404

Dieser Fehler weist darauf hin, dass die angeforderte URL nicht existiert.

Mögliche Lösungen für den HTTP-404-Fehler:

  1. Bestätigen Sie, dass die Seite erfolgreich geladen wird.
  2. Wenn auf der Seite ein Fehler angezeigt wird, stellen Sie sicher, dass sie zur Website von WordPress gehört und veröffentlicht ist.
  3. Versuchen Sie, den Link im „Inkognito-Modus“ oder beim „Privaten Surfen“ aufzurufen, um zu prüfen, ob der Fehler auftritt, wenn Sie nicht angemeldet sind.
  4. Wenn ein Fehler nur auftritt, wenn Sie nicht angemeldet sind (z. B. im „Inkognito-Modus“), prüfen Sie, ob Plugins möglicherweise Zugriffsberechtigungen für Ihre Seiten erzwingen, etwa indem sie nur authentifizierten Benutzern den Zugriff auf bestimmte Bereiche erlauben.

HTTP-Fehler 418 – Ich bin eine Teekanne

Dieser Fehler wird normalerweise verwendet, um anzuzeigen, dass eine Anfrage aufgrund von Sicherheitsregeln abgelehnt wurde.

Mögliche Lösungen für den HTTP-418-Fehler:

  1. Wenden Sie sich mit einer detaillierten Beschreibung des Problems an Ihren Hosting-Anbieter. Nennen Sie dabei den HTTP-418-Fehler, die betroffenen URL und den Zeitpunkt des Auftretens.
  2. Ihr Hosting-Anbieter sollte Sie zu den nächsten Schritten beraten.

HTTP-Fehler 500 – Interner Serverfehler

Dies weist auf einen serverseitigen Fehler hin, durch den die Anfrage nicht erfüllt werden kann.

Mögliche Lösung für den HTTP-500-Fehler:

Wenden Sie sich an Ihren Hosting-Anbieter und bitten Sie ihn, die Serverprotokolle auf detaillierte Fehlermeldungen zu prüfen.

Cross-Domain-Fehler

Dieser Fehler tritt auf, wenn die Seite auf einer anderen Domain gehostet wird und die Sicherheitseinstellungen des Servers verhindern, dass sie von außerhalb der eigenen Domain aufgerufen oder geladen wird.

Mögliche Lösung für den Cross-Domain-Fehler: 

Rufen Sie die Seite auf und prüfen Sie Protokoll und Hostnamen, um sicherzustellen, dass sie mit den Angaben im Administrationsbereich von WordPress übereinstimmen. Beispiel: In http://jetpack.com entspricht http dem Protokoll, und jetpack.com dem Hostnamen

Seite konnte nicht verifiziert werden (UrlVerifyError)

Damit Critical CSS ordnungsgemäß funktioniert, versucht Boost, während der Generierung von Critical CSS ein Meta-Tag in die Website einzufügen, um die Seite zu verifizieren. Wenn das Hinzufügen des Meta-Tags aus irgendeinem Grund fehlschlägt, wird dieser Fehler zurückgegeben.

Mögliche Lösungen für den Fehler „Seite konnte nicht verifiziert werden“: 

  1. Die häufigsten Gründe dafür sind Plugins mit aktiviertem Wartungsmodus und Seiten, die durch eine Form der Authentifizierung geschützt sind, beispielsweise durch ein Anmeldeformular.
  2. Stellen Sie sicher, dass Sie weiterhin auf die Seite zugreifen können, wenn Sie nicht angemeldet sind.
  3. Wenn dies möglich ist, aber dieser Fehler weiterhin auftritt, verhindert möglicherweise eine Form der Zwischenspeicherung, dass Boost das Meta-Tag für die Generierung hinzufügt.

Critical CSS konnte nicht generiert werden

Dies ist ein allgemeiner Fehler, der aus verschiedenen Gründen auftreten kann. Prüfen Sie die konkrete Fehlermeldung im Boost-Dashboard oder in den Website-Protokollen, um die Ursache zu ermitteln.

Keine relevanten CSS in externen Stylesheets gefunden

Boost verwendet externe Dateien mit CSS, um Critical CSS zu generieren. Wenn Ihre Seite keine solchen Dateien lädt, kann Boost die erforderlichen Stile nicht extrahieren. Möglicherweise verwenden Sie ein Optimierungs-Plugin, das alle CSS inline einfügt, anstatt sie aus externen Dateien zu laden.

Was zu tun ist: Sie können diese Meldung gefahrlos ignorieren, wenn die Website aus Performancegründen bereits CSS inline verwendet.

Verbindungs- oder Zugriffsproblem

Manchmal kann Boost Ihre Website nicht erreichen oder wird daran gehindert, Seiten ordnungsgemäß zu laden.

Mögliche Lösungen:

  • Stellen Sie sicher, dass die Website nicht sowohl über HTTP als auch über HTTPS geladen wird. Leiten Sie den gesamten Website-Traffic zur Behebung an HTTPS weiter. Ihr Host kann Ihnen dabei helfen, oder verwenden Sie ein Plugin wie Really Simple SSL.
  • Prüfen Sie, dass es von der Startseite keine Weiterleitungen gibt, etwa von https://yourjetpack.blog zu https://yourjetpack.blog/en. Ihr Host kann Sie bei unerwünschten Weiterleitungen unterstützen.
  • Bestätigen Sie, dass die Website online und öffentlich sichtbar ist. „Demnächst verfügbar“- und „Baustellenseiten“ verhindern, dass Jetpack kritische CSS generiert.
  • Wenn du all dies bestätigt hast und weiterhin ein Problem auftritt, könnte ein Plugin-Konflikt die Ursache sein. Konfliktverursachende Plugins können die Verbindung zu Jetpack beeinträchtigen oder verhindern, dass erforderliche Styles ordnungsgemäß geladen werden. Um dies zu testen, folge dem Leitfaden zum Testen auf Plugin-Konflikte.

Mögliche Konflikte mit anderen Performance-Plugins

Konflikte können auftreten, wenn ein anderes Performance- oder Caching-Plugin – etwa LiteSpeed Cache – verändert, wie CSS geladen oder optimiert wird. Diese Änderungen können die Generierung von Critical CSS durch Jetpack Boost beeinträchtigen und zu Layout-Problemen führen, insbesondere nach der Aktualisierung des Plugins oder Themes.

Mögliche Lösungen:

  • Deaktiviere vorübergehend die Optimize CSS Loading-Funktion von Jetpack → Boost. Wenn das Layout wieder normal aussieht, könnte das Problem durch einen Konflikt mit den Optimierungen für CSS eines anderen Plugins verursacht werden.
  • Wenn du LiteSpeed Cache verwendest, gehe zu LiteSpeed Cache → Seitenoptimierung → Einstellungen für CSS, und deaktiviere die Option zum asynchronen Laden von CSS.
  • Alternativ kannst du die CSS-Optimierung von Jetpack Boost deaktiviert lassen und stattdessen die Optimierungsfunktionen deines Caching-Plugins verwenden – oder umgekehrt.
  • Du kannst auch versuchen, bestimmte Stylesheets oder Klassen in deinem anderen Plugin von der Optimierung auszunehmen, sofern dies unterstützt wird.

Wenn du dir nicht sicher bist, welches Plugin das Problem verursacht, deaktiviere sie nacheinander und teste das Layout jedes Mal erneut.

Fehler: Ladezeitüberschreitung

Dies kann an einer Umleitungsschleife liegen, die durch eine Fehlkonfiguration des Servers oder ein fehlerhaftes Plugin (oder benutzerdefinierten Code) verursacht wird. Wir haben auch Fälle gesehen, in denen das Laden von Anzeigen zu lange dauerte und Boost beim Warten darauf eine Zeitüberschreitung erreichte.

Mögliche Lösungen für den Fehler „Ladezeitüberschreitung“:

  1. Leere den Cache deines Browsers, damit Boost die aktuellste Version der Seite lädt.
  2. Rufe die Seite auf, ohne bei WordPress angemeldet zu sein, um zu sehen, ob das Problem weiterhin besteht.
  3. Prüfe, wie lange das Laden dieser Seite im Vergleich zu anderen Seiten deiner Website dauert.
  4. Wenn diese Seite langsamer ist als andere, ermittle, welche Plugins auf dieser Seite aktiv sind.
  5. Deaktiviere alle Plugins, die deiner Meinung nach dazu führen, dass die Seite langsam geladen wird.

XFrameDeny-Fehler

Jetpack Boost verwendet Iframes, um dein kritisches CSS zu generieren. Dieser Fehler tritt auf, wenn die Website einen speziellen Konfigurations-Header enthält, der das Laden in einem Iframe verhindert. Der Header heißt X-Frame-Options: DENY. Dies kann auf einer Website von WordPress entweder durch ein Plugin oder durch die Serverkonfiguration hinzugefügt werden.

Mögliche Lösungen für den XFrameDeny-Fehler:

  1. Stelle sicher, dass du keine Plugins verwendest, die der Website von WordPress zusätzliche HTTP-Header hinzufügen, und deaktiviere sie gegebenenfalls.
  2. Wenn du nicht weißt, um welche Header es sich handelt oder woher sie stammen, wende dich an deinen Hosting-Anbieter und bitte ihn, den Header mit dem Namen X-Frame-Options von deiner Website zu entfernen.

InvalidURL-Fehler

Jetpack Boost hat beim Generieren von Critical CSS eine oder mehrere ungültige URLs gefunden. Beachte, dass es manchmal unproblematisch ist, solche URLs zu ignorieren. Dies kann viele verschiedene Ursachen haben, daher lässt sich nur schwer eine Lösung angeben, die immer funktioniert.

Mögliche Lösungen für den InvalidURL-Fehler:

  1. Stelle sicher, dass alle benutzerdefinierten Umschreibungen auf deiner Website ordnungsgemäß funktionieren.
  2. Möglicherweise ist ein Plugin aktiv, das eine oder mehrere URLs ungültig macht. Gehe die Liste der Plugins durch und deaktiviere solche Plugins, bis das Problem behoben ist.

Provider-Fehler

Dies geschieht, wenn etwas Jetpack Boost daran hindert, das von ihm für eine bestimmte Seitengruppe generierte Critical CSS zu speichern. Meistens liegt dies an einer Web Application Firewall (WAF) oder an einem Sicherheits-Plugin, das die Anfrage blockiert.

Mögliche Lösungen für den Provider-Fehler:

  1. Prüfe, ob Sicherheits-Plugins installiert sind, und deaktiviere sie. Prüfe anschließend, ob die Generierung funktioniert, indem du sie erneut ausführst. Wenn sie funktioniert, prüfe, ob du im Sicherheits-Plugin eine Ausschlussregel für URLs hinzufügen kannst, die set-provider-cssenthalten.
  2. Wenn du keine Sicherheits-Plugins installiert hast, blockiert möglicherweise der WAF deines Hostings die Anfrage. Du kannst dies überprüfen, indem du diesen curl-Befehl in einem Terminal bzw. an der Eingabeaufforderung ausführst (ersetze unbedingt https://yourjetpack.blog/ durch die URL deiner Website):
    curl --location 'https://yourjetpack.blog/' \ --data '<svg xmlns'
  3. Wenn der obige Befehl Forbiddenanzeigt, musst du dich an deinen Hosting-Anbieter wenden und ihn bitten, die Anfrage freizugeben.

Fehlerhafte Generierungsbibliothek

Dies ist zwar unwahrscheinlich, aber wir haben für diesen Fall eine entsprechende Fehlermeldung. Wenn die Bibliothek zur Generierung von kritischem CSS in Boost beschädigt wurde oder ein anderes Plugin die Generierung beeinträchtigt, wird dieser Fehler angezeigt.

Mögliche Lösungen für den Fehler „Fehlerhafte Generierungsbibliothek“:

  1. Schalte das Modul aus und wieder ein, um zu prüfen, ob der Fehler weiterhin auftritt.
  2. Wenn der Fehler weiterhin auftritt, installiere Jetpack Boost neu, um sicherzustellen, dass alle zugehörigen Dateien in Ordnung sind.
  3. Wenn die Neuinstallation nicht hilft, verursacht möglicherweise ein anderes Plugin einen Konflikt. Deaktiviere in diesem Fall die Plugins nacheinander, bis das Problem behoben ist.

Ein assoziatives Array wurde erwartet, aber „NULL“ empfangen

Dieser Fehler kann auftreten, wenn Boost aufgrund eines serverseitigen Problems während der Anfrage kein Critical CSS generieren kann.

Mögliche Lösung für den „NULL“-Fehler:

  • Dies kann durch eine Fehlkonfiguration oder ein Problem mit dem Memory Node deines Hosts verursacht werden.
  • Wende dich an deinen Hosting-Anbieter und bitte ihn zu prüfen, ob der Memory Node ordnungsgemäß funktioniert.
  • Wenn du kürzlich Plugins installiert oder aktualisiert hast oder Boost zuvor problemlos funktioniert hat, könnte ein vorübergehendes Serverproblem die Ursache sein.
  • Wenn du Cloudflare verwendest, deaktiviere es vorübergehend, um zu sehen, ob der Fehler dadurch behoben wird.

Sobald das Serverproblem behoben ist, solltest du Critical CSS erfolgreich neu generieren können.

PayloadTooLargeError

Dieser Fehler tritt auf, wenn das generierte Critical CSS größer als 1 MB ist. Häufig geschieht dies auf Seiten, die mit Page-Builder-Plugins erstellt wurden.

Wenn Jetpack Boost das Critical CSS enthalten würde, würde die Seite dadurch größer und tatsächlich langsamer. Daher wird es absichtlich nicht eingebunden. Es wird nicht einmal auf deiner Website gespeichert.

Mögliche Lösungen für den PayloadTooLargeError:

  1. Prüfe, ob du deine Seiten so aktualisieren kannst, dass sie dieselben Blöcke verwenden.

Wenn Seiten dasselbe Layout verwenden, stellst du sicher, dass das generierte Critical CSS kleiner ist.

Wenn das Teilen derselben Blöcke keine Option ist und das Layout der Seiten zu einzigartig ist, können Sie die Funktion „Critical CSS“ auf den Seiten dieser Gruppe nicht nutzen.

Unbekannter Fehler

Dies geschieht, wenn beim Erzeugen von Critical CSS für die angegebene Seite ein unerwarteter Fehler auftritt. Jetpack Boost hat dieses Problem nicht vorhergesehen.

Mögliche Lösungen für „Unbekannter Fehler“:

  1. Öffnen Sie die URL, um zu prüfen, ob die Seite korrekt geladen wird.
  2. Stellen Sie sicher, dass die Seite ohne Fehler oder Probleme geladen wird.
  3. Wenn die Seite korrekt geladen wird, Critical CSS jedoch weiterhin fehlschlägt, kontaktieren Sie uns bitte, damit wir das Problem weiter untersuchen können.

Indem Sie anhand der Fehlermeldung das konkrete Problem identifizieren und diese Lösungen befolgen, können Sie häufig auftretende Probleme mit der Funktion „Critical CSS“ von Jetpack Boost beheben und so sicherstellen, dass Ihre Website effizient geladen wird und eine optimale Benutzererfahrung bietet.

Still need help?

Please contact support. We’re happy to advise.