« Zurück zum Magazine

6 technische SEO-Fehler, die Du bei der Migration von E-Commerce-Websites vermeiden solltest

So manche Migration einer E-Commerce Website ist an technischen SEO-Problemen gescheitert. Von der Blockierung von Crawlern im Staging bis hin zur Optimierung Deiner Facettennavigation und mehr – wir haben 6 Punkte für Dich, die Du beachten solltest.

Die Migration einer E-Commerce-Website ist eine Herausforderung. Für den erfolgreichen Launch der neuen Version Deiner Website hast Du nur eine Chance. Wenn Du sie nicht aus technischer SEO-Sicht optimierst, kannst Du über Nacht alle Deine Rankings und Deinen Traffic verlieren.

Migrations sind schwierig, und selbst große, gut finanzierte E-Commerce-Shops scheitern regelmäßig daran. Der Hauptgrund dafür ist der Mangel an technischer SEO-Qualitätssicherung.

Technisch gesehen steht einer guten Vorbereitung Deiner Website auf den Umzug nichts im Wege. Wenn Du die Migration in einer Staging-Umgebung durchführst, hast Du die Möglichkeit zu testen, wie die Suchmaschinen Deine neue Website zukünftig sehen.

Aber es braucht etwas Erfahrung, um zu wissen, worauf Du achten musst.

In diesem Artikel erfährst Du, worauf Du in Deiner Staging-Umgebung besonders achten solltest, um den Erfolg Deiner neuen Website zu gewährleisten, wenn sie online geht.

Passend dazu kannst Du Dir auch unseren Leitfaden zum Thema E-Commerce SEO ansehen.

1. Lass Crawler nicht auf Deine Staging-Umgebung zugreifen

Bei der Migration Deiner Website ist die beste Vorgehensweise, zunächst eine Staging-Umgebung zu erstellen, in der Du die neue Version Deiner Website entwickeln und testen kannst, bevor sie live geht. Du solltest dabei allerdings bedenken, dass Suchmaschinen Deine Staging-Site crawlen und indexieren, wenn Du sie nicht daran hinderst, darauf zuzugreifen. Nicht gerade ideal.

Lass uns als Quickcheck nachschauen, wie viele Staging-Sites von Google indexiert werden. Hier der Suchoperator, den ich dafür verwendet habe:

site:uat.*.com OR site:*uat.*.com OR site:stage.*.com OR site:staging.*.com OR site:test.*.com OR site:testing.*.com

Suchergebnisse-operator-strings-staging-websites

Abbildung 1: Google Suchergebnisse für Staging Websites

Sieh Dir die Zahl unter der Suchleiste an – all diese Seiten sind indexiert und sollten dringend aufgeräumt werden. Ich habe im Check nur ein paar der beliebtesten Staging-Subdomains verwendet – Du könntest also sicher noch mehr Beispiele finden.

Hier ist der Grund, warum die Indexierung Deiner Staging-Umgebung schlecht ist:

  1. Sie öffnet Sicherheitslücken.

  2. Sie kann zu Problemen mit doppeltem Inhalt führen, da Google Zugriff auf Deine alte Website, Deine Staging-Umgebung und Deine neue Website hat, sobald sie online geht.

  3. Wenn Deine Konkurrenten Deine Staging-Umgebung finden und darauf zugreifen können, wissen sie über Deinen nächsten Schritt Bescheid.

Wie kannst Du das verhindern? Schütze Deine Staging-Umgebung auf Server-Ebene mit HTTP-Authentifizierung.

Wenn Du Deine Staging-Website schützt, indem Du nach Anmeldedaten fragst, können Suchmaschinen-Crawler nicht darauf zugreifen und nichts wird indexiert. Das ist eine einfache Lösung, die nicht nur gut für die Suchmaschinenoptimierung ist, sondern auch Deine sensiblen Daten davor schützt, in falsche Hände zu geraten.

Verbessere Deine technische SEO mit Ryte!

Mehr erfahren

2. Stelle sicher, dass Crawler wichtige Inhalte rendern können

Heutzutage ist es üblich, E-Commerce Websites auf moderne JavaScript-Frameworks zu migrieren. Diese Frameworks bieten zwar fantastische Funktionen, aber Du solltest unbedingt sicherstellen, dass Google Deine neue JavaScript-gestützte Website erfolgreich rendern und alle Deine Inhalte sehen kann, bevor Du live gehst.

Dazu kommt, dass Google JavaScript zwar gut verarbeitet, aber das gilt nicht für alle Suchmaschinen. Manche Suchmaschinen verarbeiten JavaScript überhaupt nicht. Das heißt, wenn Du Inhalte auf Deiner Website hast, für die JavaScript verarbeitet werden muss, um sie zu laden, werden einige Suchmaschinen die Inhalte nicht indexieren und Du wirst in ihren Suchergebnissen nicht auftauchen.

Vor kurzem bin ich auf eine E-Commerce-Seite gestoßen, die mit Büro- und Schreibwaren handelt. Leider war die Website so aufgebaut, dass Google den eigentlichen Inhalt der Kategorieseiten nicht sehen konnte. Warum? Weil sie mit falsch konfiguriertem JavaScript injiziert wurde.

Broken-rendered-version-of-a-websites-category-page-1

Abbildung 2: Kaputte gerenderte Version einer Webseite-Kategorieseite

Der Screenshot oben zeigt die gerenderte Version der Kategorieseite der Website. Der Googlebot hat außer der Schaltfläche „Alle anzeigen“ nichts gesehen. Der wichtige Inhalt wurde nicht gerendert, was zu einer leeren Seite führte. Wie Du Dir wahrscheinlich denken kannst, wurde diese Seite für nichts Sinnvolles gerankt.

Im Fall dieser Website können wir folgendes annehmen:

  • Die Crawler haben die Kategorieseiten möglicherweise nicht unterschieden, da sie alle ähnlich – oder ähnlich leer – waren.

  • Canonical-Direktiven könnten ignoriert worden sein, da alle Kategorieseiten identisch aussahen.

  • Die Autorität innerhalb der Website wurde möglicherweise nicht angemessen verteilt, da die Links zu den Produkten nicht auffindbar waren.

Was ist hier die Lektion? Bevor Du Deine Website live schaltest, musst Du sicherstellen, dass Crawler Deine wichtigen Inhalte rendern können. Ich weiß, das hört sich vielleicht geekig an, aber hier ist eine Schritt-für-Schritt-Anleitung, der Du folgen kannst:

Überprüfe als erstes den gerenderten HTML-Code und den Raw-HTML-Code der Seite in Chrome DevTools. Wenn Du beide Versionen vergleichst, erkennst Du die Unterschiede bei fehlenden Inhalten und Linkelementen, die im gerenderten HTML-Code enthalten sein sollten, es aber nicht sind.

Um die Chrome DevTools aufzurufen, klicke mit der rechten Maustaste auf ein beliebiges Element und wähle „Untersuchen“. Oder Du drückst Command+Shift+C oder Command+Option+C (Mac) und Control+Shift+C (Windows.)

Als Nächstes musst Du den User Agent in Googlebot ändern, wofür Du die Registerkarte „Netzwerkbedingungen“ aufrufst.

Du hast zwei Möglichkeiten, entweder:

  • Verwende die Option DevTools Command Run (drücke Control+Shift+P (Windows) oder Command+Shift+P (Mac), oder

  • Verwende die Option Anpassen und Steuern der DevTools (siehe unten).

Customize-and-Control-Chrome-DevTools-1

Abbildung 3: Anpassen und Steuern in Chrome-DevTools

Deaktiviere das Kontrollkästchen „Browser-Standard verwenden“. Wähle dann den gewünschten User-Agent aus und aktualisiere die Seite, aber klicke während des Tests nirgendwo auf die Seite.

User-agent-settings-in-Google-Search-Console-1

Abbildung 4: User-Agent-Einstellungen in den Chrome-DevTools

Wichtig ist, dass Du einen Link oder ein Fragment Deines wichtigen Inhalts auswählst, anhand dessen Du die Darstellung Deiner Seite testen willst. Versuche dann, eventuelle Unterschiede zwischen den beiden Versionen Deiner Seite zu erkennen.

Der Bereich „Elemente“ zeigt Dein gerendertes HTML, auch bekannt als DOM (ursprüngliches HTML und alle Änderungen, die JavaScript vorgenommen hat). Prüfe nun, ob die Links oder Inhalte, die vorhanden sein sollten, in diesem Code sichtbar sind (ohne auf die Seite zu klicken).

Elements-panel-in-Google-Chrome-DevTools-1

Abbildung 5: Elemente Panel in Google Chrome DevTools

Gehe anschließend zum Panel „Netzwerk“, aktualisiere die Seite und klicke auf das HTML-Dokument. Navigiere zum Codeabschnitt „Antwort“ und suche nach Deinem Inhalt oderLink (dies ist der ursprüngliche HTML-Code).

Network-panel-in-Google-Chrome-DevTools-1

Abbildung 6: Netzwerk Panel in Google Chrome DevTools

Du kannst das gerenderte HTML und das Roh-HTML auch ganz einfach mit einer Chrome-Erweiterung vergleichen: View Rendered Source.

3. Hilf Crawlern, auf Registerkarten-Inhalte zuzugreifen

Website-Elemente, die erst auf die Seite geladen werden, nachdem ein Nutzer geklickt oder gescrollt hat, sind für Crawler normalerweise nicht zugänglich. Der Googlebot klickt oder scrollt nicht.

E-Commerce Websites zeigen aber oft technische Spezifikationen, Produktmerkmale und zusätzliche Informationen hinter Registerkarten an. Es ist wichtig, dass Google diese Inhalte (Tabbed Content) erfassen kann, aber manchmal sind sie eben so aufgebaut, dass sie erst durch einen Klick geladen werden können.

Tabbed-section-of-ecommerce-website-1

Abbildung 7: Inhalte in Registerkarten (Tabbed Content) auf einer E-Commerce Website

Hast Du sogenannten Tabbed Content auf Deiner Website? Wenn ja, überprüfe, ob er gerendert werden kann.

Kopiere dazu ein Textfragment aus Deinem Tabbed Content. Verwende die Registerkarte „Netzwerkbedingungen“ in Chrome DevTools und wähle den Googlebot User Agent aus. Aktualisiere dann die Seite und achte darauf, dass Du während des Tests auf keine Elemente klickst. Überprüfe, ob sich das von Dir gewählte Fragment im Tab „Elemente“ finden lässt.

Checking-Elements-tab-in-Chrome-DevTools-1

Abbildung 8: Elemente prüfen in Chrome DevTools

Wenn Du es nicht finden kannst, bedeutet das, dass Googlebot es auch nicht finden wird. Nimm Änderungen an Deiner Website vor, damit dieser Inhalt im Quellcode verfügbar ist, ohne dass JavaScript gerendert werden muss. So können Crawler schnell auf wichtige Inhalte zugreifen und Rendering-Probleme vermeiden.

4. Biete verschiedenen Crawlern denselben HTML-Code an

Wenn Deine neue Website falsch konfiguriert ist, erhalten verschiedene User Agents (z. B. der Googlebot im Vergleich zu einem normalen Nutzer) möglicherweise unterschiedliche Werte in den HTML-Elementen, die aus SEO-Sicht wichtig sind.

Oft enthält die ursprüngliche HTML-Datei einen Satz von Werten, die beim Rendern von JavaScript ersetzt werden. Das ist für Suchmaschinen-Bots sehr verwirrend, weil sie nicht wissen, welche Elemente sie berücksichtigen sollen.

Folgenden Elementen solltest Du besondere Aufmerksamkeit schenken:

Diese HTML-Elemente sind für die Suchmaschinenoptimierung unerlässlich und Du solltest sicherstellen, dass die Crawler die von Dir gewünschte Version erhalten, sowohl mit als auch ohne das Rendern von JavaScript.

5. Optimiere Deine facettierte Navigation

Eine facettierte Navigation erleichtert es den Nutzern, die Produkte zu finden, nach denen sie suchen. Aber aus SEO-Sicht kann sie gefährlich werden, wenn Du sie nicht richtig optimierst.

Die Filter in Deiner facettierten Navigation können mehrere Versionen der gleichen Kategorieseite erzeugen. Wenn Google uneingeschränkt auf diese Kopien zugreifen kann, wird es versuchen, sie alle zu indexieren, was zu Problemen mit Duplicate Content führt.

Botify hat eine E-Commerce-Website mit weniger als 200 Tausend Produktseiten analysiert. Aufgrund einer nicht optimierten Facettennavigation hatte diese Website über 500 Millionen Seiten, auf die der Googlebot zugreifen konnte.

Wie kann man dieses Problem lösen? Indem Du festlegst, welche Facetten-Filter crawlbar und indexierbar sein sollen.

Jede E-Commerce Website sollte eine Indexierungsstrategie für Seiten mit Facettenfiltern haben. Einige dieser Seiten können für wichtigen organischen Traffic sorgen, während andere Duplikate sind, nach denen niemand je suchen wird und die daher nicht indexiert werden sollten.

Die folgenden zwei Fragen solltest Du für jede facettierte Kategorieseite beantworten:

  1. Beantwortet diese Seite eine sinnvolle Suchanfrage?

  2. Gibt es genügend Produkte auf dieser Seite, um ihre Indexierung zu rechtfertigen?

Befolge außerdem die Best Practices von Google für die facettierte Navigation.

6. Teste Deine Weiterleitungen

Vergiss nicht zu prüfen, ob alle Weiterleitungen korrekt implementiert sind, bevor Deine neue Website online geht.

Die Implementierung von Weiterleitungen ist nicht schwierig, aber jeder Fehler kann teuer werden:

  • Wenn Du Deine Nutzer:innen zu Inhalten weiterleitest, die nicht ihren Bedürfnissen entsprechen, schadest Du der User Experience und hältst sie davon ab, Deine Website zu nutzen.

  • Wenn Du fälschlicherweise Umleitungsketten oder Umleitungsschleifen erstellst, verschwendest Du die Zeit der Crawler und sendest ein negatives Signal bezüglich der technischen Qualität Deiner Website.

Bevor Deine Website online geht:

  • Erstelle einen Weiterleitungs-Plan, in dem Du die Seiten aufführst, die nach der Migration der Website nicht mehr erreichbar sein werden.

  • Wenn Du Deine Staging-Site auf einer separaten Domain oder Subdomain hast, ersetze alle URLs in Deiner Weiterleitungsliste entsprechend, um sie zu testen.

  • Überprüfe, ob alle Deine 301-Weiterleitungen zu einer Seite mit Statuscode 200 führen.

  • Vermeide Weiterleitungsketten, indem Du absolute URLs verwendest.

  • Stelle sicher, dass die Absicht der Nutzer:innen mit dem Zweck der umgeleiteten Seiten übereinstimmt.

Abschließende Überlegungen

Die Migration einer Website ist komplex und jeder Fehler kann kostspielig sein. Das heißt aber nicht, dass Du Deine E-Commerce Website nicht erfolgreich migrieren kannst. Alles, was Du tun musst, ist, Dir im Voraus einen guten Plan zurechtzulegen und ihn gründlich umzusetzen.

Ich hoffe, dieser Artikel hat Dir geholfen, die Themen kennenzulernen, auf die Du bei Deiner Staging-Website achten solltest. Kümmere Dich um anfallende Probleme, bevor Du Deine neue Website launchst, um Ärger von vornherein zu vermeiden.

Verbessere Deine technische SEO mit Ryte!

Mehr erfahren

Ryte-Nutzer erzielen +93% Klicks nach 1 Jahr. Erfahre wie!

Veröffentlicht am Sep 29, 2022 von Jasmita D'Souza