PWA-SEO-Herausforderungen: Was hindert Ihre PWA-Site am Ranking?

Veröffentlicht: 2022-08-24

Inhaltsverzeichnis

Mit schnellerer Geschwindigkeit und besserer UI & UX kann PWA Ihre Google Core Web Vitals steigern und so Ihre SEO verbessern. Viele Technologie-Blogs und -Nachrichten (einschließlich SimiCart) haben dies behauptet.

Dies ist jedoch nicht das ganze Bild. Tatsächlich kann PWA in einigen Fällen schlecht für die SEO Ihrer Website sein.

In über 10 Jahren Entwicklung von PWA-Websites sind wir auf mehrere Fälle gestoßen, in denen die SEO-Leistung tatsächlich durch PWA negativ beeinflusst wird.

Wir haben bereits einen Artikel über die PWA-Vorteile geschrieben. Damit Sie den Unterwasserteil des Eisbergs sehen können, hier einige große Herausforderungen für die SEO, denen Ladenbesitzer bei der Implementierung von PWA begegnen können.

Das Hauptproblem bei PWA SEO

Dies geht auf grundlegendes Wissen zur Website-Entwicklung zurück: HTML & Javascript. Wir wetten, dass Sie, selbst wenn Sie überhaupt nicht technisch versiert sind, schon einmal richtig von diesen beiden Programmiersprachen gehört haben.

Kurz gesagt, HTML ist die einfachste Programmiersprache, die zum Erstellen der Website-Struktur verwendet wird.

Inzwischen ist Javascript ein fortschrittlicheres, das für mehr Spezialeffekte verantwortlich ist.

Wenn Sie also beispielsweise eine Webseite mit vielen dynamischen Inhalten, einem ausgefallenen Scroll-Effekt oder einem coolen Schieberegler sehen, nutzt diese Webseite Javascript richtig.

html gegen javascript

(Bildnachweis: Reddit)

PWA, berühmt für seine lebhafte UI/UX-Erfahrung, verwendet, wie Sie sich denken können, viel Javascript.

Hier ist das Problem: Google & viele andere Suchmaschinen rendern Javascript-Websites nicht so gut. Javascript-basierte Websites sind oft komplexer und schwerer zu verarbeiten als HTML-Websites. Tatsächlich sind nicht nur Suchmaschinen, auch soziale Medien wie Twitter oder Facebook nicht so begeistert von Javascript.

Infolgedessen können Suchmaschinen-Bots einige Probleme mit der Indizierung Ihrer PWA-Site haben, was zu einer schlechten SEO-Leistung führt.

Daher erfordert es einen erfahrenen Experten, der PWA in- und auswendig versteht, um die Website so zu optimieren, dass sie SEO-freundlich ist.

6 Hindernisse bei der Optimierung von PWA für SEO.

1. Leistungsprobleme

„Aber PWA soll schnell sein?“ – Sie können fragen.

Ja, das ist es, aber es bedeutet nicht, dass PWA keine Leistungsprobleme hat.

Es gibt immer noch einige prominente Geschwindigkeitsprobleme mit PWA. PWA kann jedoch blitzschnell sein, wenn es richtig optimiert ist.

Genau wie Usain Bolt kann er, obwohl er als Supertalent geboren wurde, nicht der Champion sein, wenn er keinen Trainer hat, der seine Fähigkeiten versteht und ihn gut trainiert.

Schauen wir uns jedes Problem genauer an:

Probleme

Javascript-Dateien verbrauchen viele Ressourcen für ihre Analyse, Kompilierung und Ausführung. Darüber hinaus kann der Suchmaschinenfehler aufgrund der schlechten Serverleistung Javascript-Dateien nicht schnell rendern.

Infolgedessen kann es einige Seitengeschwindigkeitsmetriken wie First Meaningful Paint und First Contentful Paint beeinflussen. Da diese beiden Metriken wichtige Rankingfaktoren sind, ist dies schlecht für SEO. Außerdem kann eine verzögerte Website auch niemals gut für die Benutzererfahrung sein.

Da der Service Worker von PWA HTTPS- und SSL-Zertifikate benötigt, um zu funktionieren, kann er Ihre Website außerdem langsamer machen als seine HTTP-Version.

Lösungen

Einige gängige Praktiken zur Verbesserung der Geschwindigkeit sind die Implementierung von AMP (Accelerated Mobile Pages) zusammen mit PWA sowie die Verwendung von HTTP/2 mit HTTPs

Da PWA eine fortschrittliche und Nischentechnologie in der E-Commerce-Landschaft ist, ist es besser, erfahrene PWA-Entwickler die Geschwindigkeit Ihrer Website optimieren zu lassen.

2. Javascript-Fehler

Problem

Beim Parsen können Browser wie Google Chrome automatisch die HTML-Syntax wie schließende Tags korrigieren. Dies ist jedoch nicht dasselbe wie bei Javascript-Fehlern.

Infolgedessen können alle Fehler in Javascript Suchmaschinen-Spider daran hindern, Ihre Webseiten zu crawlen und zu indizieren.

Lösungen

Es ist wichtig, dass Entwickler saubere und gut strukturierte Javascript-Codes für Ihre Website schreiben, um später viele zeitaufwändige Korrekturen zu vermeiden.

Wenn auf der Website Javascript-Fehler auftreten, müssen Entwickler diese manuell bereinigen und Suchmaschinen informieren, nachdem sie behoben wurden.

3. Hyperlink/Bild aufgrund von Cloaking-Inhalten nicht gecrawlt

verdeckter Inhalt
(Foto: Sitechecker.com)

Cloaking-Inhalte sind solche, die von menschlichen Augen gesehen werden, aber nicht von Suchmaschinen. Zum Beispiel Text, der sich hinter der Schaltfläche „Mehr anzeigen“ verbirgt, oder Lazy-Loading-Menülinks. Dies sind oft dynamische Inhalte und Links, die in Javascript geschrieben sind

Problem

Da Google immer noch einige Schwierigkeiten hat, Javascript zu verstehen, kann es sein, dass einige PWA-JavaScript-Inhalte nicht von Google abgerufen werden.

Wenn Ihre Inhalte (z. B. ein wichtiger Link, ein Produktbild) für die Suchmaschinen unsichtbar sind, können sie diese nicht indexieren. Dies wirkt sich folglich negativ auf Ihr SEO-Ranking aus.

Lösung

Sie können sich immer auf Tools wie Sitechecker oder Small SEO Tool verlassen, um zu sehen, ob Ihre Webseite getarnte Inhalte enthält. Stellen Sie sicher, dass alle wichtigen Inhalte wie Texte, Bilder und Links, die Ihren Nutzern bereitgestellt werden, mit dem übereinstimmen, was Googlebot bereitgestellt wird.

4. Modulkompatibilität

Problem

Als relativ neue Technologie nutzt PWA häufig die neuesten Module. Dies kann zu Konflikten mit Google oder anderen Browsern führen, die normalerweise auf die weniger modernen Module setzen. Einige bemerkenswerte Beispiele hierfür sind ES6, Fetch API oder neue Syntaxen oder Methoden.

Lösung

Vor der Implementierung sollten Sie deren Kompatibilität prüfen. Es ist kein großes Problem, wenn einige Module Ihrer PWA nicht mit dem Googlebot funktionieren, denn es gibt Tools oder Polyfills, um dies zu beheben.

Polyfill besteht aus einigen Javascript-Codezeilen, die es älteren Browsern ermöglichen, moderne Funktionen zu verwenden, auch wenn sie diese Funktionen nicht nativ unterstützen.

Je nachdem, mit welchen Modulen der Googlebot in Konflikt gerät, gibt es möglicherweise auch ein Transpiling-Tool dafür.

Zu Ihrer Information: Transpilieren (übersetzen + kompilieren) bedeutet das Übersetzen und Interpretieren einer Programmiersprache in eine andere. Nehmen wir das ES6-Modul als Beispiel, Dienste wie Babel können moderne C6-Javascript-Dateien nach ES5 transpilieren, wodurch ältere Browser damit reibungslos laufen können.

5. Problem mit serverseitigem Rendering

Um Javascript-basierte Websites besser darzustellen, verwendet der Googlebot sowohl serverseitiges als auch clientseitiges Rendering.

Kurz gesagt, der Rendering-Prozess ist wie folgt:

  1. Der Googlebot durchsucht Ihre Website zum ersten Mal nach Links und Inhalten
  2. Der Server rendert Links und Inhalte, die nach dem 1. Crawl gefunden wurden. Diese Links & Inhalte werden kurz darauf indexiert
  3. Google crawlt die Website zum zweiten, dritten Mal usw
  4. Ab sofort werden die restlichen Links & Inhalte vom Client gerendert, d.h. sie werden auf den Geräten Ihrer Nutzer gerendert.
  5. Nachdem das Rendern abgeschlossen ist, indiziert Google Ihre Webseiten.

Problem

Auf den ersten Blick erscheint der Rendering-Flow des Googlebot ziemlich plausibel, aber es gibt einige große Nachteile:

  • Niedrigere Indexiergeschwindigkeit :

Google kann HTML-Dateien mit serverseitigem Rendering schnell indizieren, aber es kann Tage dauern, Javascript-Dateien mit clientseitigem Rendering zu indizieren

  • Priorisieren Sie die falschen Seiten :

Stellen Sie sich vor, Sie haben eine Webseite, die auf einige andere Seiten verlinkt. Diese werden als interne Links bezeichnet. Google verlässt sich auf die Struktur dieser internen Links, um die Beziehung zwischen den Links zu verstehen und welche Links sie priorisieren sollten.

Bei in Javascript eingefügten Links muss Google jedoch warten, bis das clientseitige Rendering abgeschlossen ist, bevor es mit der Indizierung beginnen kann. Anders ausgedrückt: Google kann die interne Linkstruktur der Website erst nach Abschluss des clientseitigen Renderings vollständig auswerten.

Infolgedessen werden einige nicht so wichtige Links, die kein clientseitiges Rendering benötigen, möglicherweise zuerst und häufiger gecrawlt. So kann Google Ihre Nebenseite priorisieren und die Verkaufsseiten ignorieren.

  • Konflikt zwischen serverseitigem Rendering und clientseitigem Rendering:

Es gibt oft Probleme zwischen serverseitigem Rendering und clientseitigem Rendering. Beispielsweise werden einige wichtige Seitenelemente (Meta-Tags, Canonical-Tags) nicht indexiert. Darüber hinaus können die beiden Phasen einige gemischte Signale an Google senden, sodass die Suchmaschine nicht weiß, wie sie mit Ihren Seiten fortfahren soll.

Lösung

Ein effizienterer Server ist eine wichtige Lösung für diese Probleme. Entwickler müssen den Server möglicherweise optimieren, damit er sofort auf Deep-Linking-Anfragen reagiert. Außerdem müssen sie für gut gerenderte HTML-Dateien funktionieren, insbesondere für wichtige Seitenelemente wie Navigation, Links, Inhalt, Meta-Tags und Bilder.

Moderne Technologie kann uns auch dabei helfen, den Konflikt zwischen Javascript und Webbrowsern zu lösen. Beispielsweise kann die isomorphe Technik Browsern das Rendern von Javascript-Dateien erleichtern.

6. Häufige SEO-Fehler

Es gibt über 200 SEO-Ranking-Faktoren, von denen einige sehr technisch sind, wie z. B. kanonische Tags, rebot.txt usw. Aus diesem Grund können Händler diese Konfigurationen leicht ignorieren und damit am Ende der SEO ihrer Website schaden.

Bevor Sie mit der Reparatur Ihrer PWA-SEO beginnen, stellen Sie am besten sicher, dass Ihre aktuellen Websites den besten SEO-Praktiken folgen.

>> Mehr sehen: Best Magento SEO-Praktiken

Kommen wir nun zur spannendsten Frage:

Sollte ich auf PWA upgraden?

… wenn ich dem SEO meiner Website nicht schaden möchte.

Es muss für Händler, die an die Implementierung von PWA denken, sehr verwirrend sein, insbesondere wenn die organische Suche ein wichtiger Website-Traffic-Kanal ist.

Diese Herausforderungen bedeuten jedoch nicht, dass Google-Bots keine PWA-Sites crawlen können, noch ordnen sie PWA-Sites aufgrund ihrer Programmiersprache anders ein.

Es ist nur so, dass sich Händler bei der Implementierung einer SEO-freundlichen PWA-Site einiger technischer Herausforderungen bewusst sein müssen.

Tatsächlich können PWA-Websites in Suchmaschinen absolut gut ranken, wenn nicht sogar besser als ihre entsprechenden Nicht-PWA-Websites. Wie bereits erwähnt, verbessert die Web-App die Core Web Vitals von SEO.

Ist PWA in Bezug auf SEO also ein Held oder eine Null? Es hängt davon ab, ob ihre Entwickler die PWA-Technologie und Website-Entwicklung genau verstehen.

Wegbringen

PWA kann ein zweischneidiges Messer für das SEO-Ranking Ihrer Website sein. Auf der anderen Seite können die verbesserte Geschwindigkeit und das Kundenerlebnis dazu beitragen, die zentralen Web-Vitals von SEO zu verbessern. Auf der dunklen Seite ist PWA mit seinem reichhaltigen Javascript-Inhalt für Suchmaschinen wie Google komplizierter zu handhaben. Daher kann eine schlechte Implementierung ohne tiefes PWA-Verständnis zu einem Ranking-Einbruch führen.

Es ist durchaus möglich, eine SEO-freundliche PWA-Website zu erstellen. Der Schlüssel liegt darin, PWA-Entwickler zu finden, die mit diesen Herausforderungen vertraut sind und wissen, wie man sie schnell löst.

Wir haben 10 Jahre Erfahrung in der Entwicklung von Headless PWA für Magento