Erfolgreicher Website Relaunch – Checkliste für SEO und UX

Um eine fehlerfreie Arbeit im System zu ermöglichen ist ein Testsystem bzw. eine Testumgebung empfehlenswert. Dieses Testsystem sollte in einer Umgebung aufgebaut sein, die für Suchmaschinen nicht zugänglich und zudem passwortgeschützt ist. 

Üblich sind hierfür Subdomains wie bspw. https://dev.domain.de/.

Das Testsystem sollte im Idealfall datensynchron zum Livesystem agieren, sodass sämtliche Änderungen nachvollziehbar und testfähig sind. Es eignet sich zudem ein Deployment/Versionsverlaufs Management zur besseren Übersicht über Anpassungen und Änderungen.

Anforderung
Setzen Sie ein datensynchrones Testsystem parallel zum Livesystem auf. Änderungen und Anpassungen im Testsystem sollten im Idealfall durch wenige Schritte in das Livesystem übertragen werden können. 

Das Testsystem darf unter keinen Umständen für Nutzer oder Suchmaschinen zugänglich und sollte gänzlich von der Indexierung ausgeschlossen und passwortgeschützt sein.

1. Parameter / Filter URLs

Parameter URLs sind Informationen, die innerhalb der URL platziert werden und immer nach einem Fragezeichen auftauchen. Sie entstehen im System z.B. durch Filterungen oder aufgrund einer Session ID. Ein einfaches Beispiel ist die Filterung im Onlineshop nach Farben.
Bsp. https://www-domain.de/bester-shop?farbe=schwarz

Es gilt die Indexierung dieser Parameter Seiten durch Suchmaschinen zu unterbinden, da ansonsten mehrere Seiten mit fast identischen Inhalten entstehen (Duplicate Content). 

Die Unterbindung geschieht durch die Meta Robots Angabe NoIndex sowie einem zusätzlichen Rel Canonical zur Source URL.

Meta Robots NoIndex

<meta name=“robots” content=“noindex, follow”>

Rel Canonical auf Parameter URL zeigend zur Source URL

<link rel=“canonical” href=“https://www.domain.de/bester-shop”>

Hinweis:
Idealerweise sollten Filter (wie Produkteigenschaftsfilter) dynamisch z.B. per Ajax nachgelagert nachgeladen werden, um Suchmaschinen mit begrenztem Crawling Budget pro Website, keine unnötigen Daten zu liefern. Alternativ eignet sich die Link Maskierung mittels Post-Redirect-Get-Patterns Methode.

Anforderung

Parameter URLs erhalten stets ein Meta Robots NoIndex sowie eine Rel Canonical zu Ihrer Source URL. Eine Maskierung dieser URLs sollte per PRGP oder Ajax erfolgen.

2. Paginierungs URLs

Die sogenannte Paginierung wird für Inhalte verwendet, die nicht komplett auf einer Seite dargestellt werden kann. Dies können bspw. Produktauflistungen oder Blogseiten sein. Sollten Paginierungs URLs im System vorkommen, so sind diese von der Indexierung durch Suchmaschinen auszuschließen. Im Wesentlichen müssen dazu die beiden Attribute rel=”next” sowie rel=”prev” auf den betroffenen Paginierungsseiten integriert werden. 

Um die Indexierung durch Suchmaschinen zu vermeiden, sollte auf den Paginierungsseiten ein “NoIndex, Follow” Meta Robots implementiert werden. 

<meta name=“robots” content=“noindex, follow”>

Anforderung

Implementieren Sie das rel=”next” sowie rel=”prev” Attribut auf Paginierungs-URLs, sofern diese im System vorkommen. Zum Ausschluss der Indexierung durch Suchmaschinen, implementieren Sie das Meta Robots NoIndex, Follow auf allen Paginierungs-URLs.

3. Suchergebnis URLs

Sollte die interne Suche nach Begriffen ausgelöst werden, empfiehlt es sich die Suchergebnisseite von der Indexierung durch Suchmaschinen ausgeschlossen werden. Die Suchergebnisseiten erhalten eine Robots Anweisung “NoIndex, NoFollow”. Optional kann ein Rel Canonical zur internen Suchseite (sofern vorhanden z.B. …/search) oder zur Startseite implementiert werden.

<meta name=“robots” content=“noindex, nofollow”>

Anforderung

Implementieren Sie die Meta Robots Anweisung “NoIndex, NoFollow” auf allen Suchergebnisseiten.

4. Vermeidung von Duplicate Content Problemen

Konkurrieren zwei URLs der gleichen Domain durch Duplicate Content um das gleiche Keyword, straft Google üblicherweise beide URLs ab und gibt den URLs anderer Domains den Vorzug.

Wie entsteht Duplicate Content? 

Oft werden doppelte Inhalte unabsichtlich erzeugt. Folgende Gründe sind typisch:

Anforderung

Implementieren Sie einheitliche URL Formen. Sämtliche URL Formen die dem Konzept nicht Folge leisten, sollten per 301 Redirect auf die korrekte URL Form weiterleiten.

5. Selbstreferenzierendes Canonical

Laut Google sind selbstreferenzierende Canonicals nicht zwingend notwendig, jedoch empfohlen, um Google Crawler zu indexierende Webinhalte eindeutig mitzuteilen. Manchmal existieren mehrere Varianten von URLs, mit denen eine Seite aufgerufen werden kann. Mit Hilfe eines Canonical-Tags können all diese Schreibweisen bereinigt werden. Außerdem schützt dieser in gewisser Hinsicht vor dem Kopieren von Seiteninhalten durch Externe. Wird der Quellcode komplett kopiert, kann Google daran erkennen, wo sich das Original befindet. 

Jede URL die:

• keine Parameter URL ist
• keine Paginierungs URL ist
• nicht per NoIndex von der Indexierung ausgeschlossen werden soll
• nicht per robots.txt von der Indexierung ausgesperrt ist
• keinen 3xx, 4xx, 5xx Statuscode inne hat
• nicht bereits per Canonical Tag auf eine andere URL zeigt

sollte ein selbstreferenzierendes Canonical erhalten.

Beispiel einer Kategorie URL https://www.domain.de/kategorie 

<link rel=“canonical” href=“https://www.domain.de/kategorie”> 

Anforderung

Implementieren Sie selbstreferenzierende Canonical Auszeichnungen auf allen relevanten URLs.

6. Hreflang URLs 

Suchmaschinen wie Google, spielen je nach Sprache oder Ort (Land) der Suchanfrage eine entsprechende URL als Ergebnis der Suche aus. 

Um ein passendes Ergebnis in der korrekten Sprache liefern zu können, ist es wichtig hreflang-Attribute für URLs zu setzen, die in verschiedenen Sprachversionen existieren. Damit kann sichergestellt werden, dass Google die geografische Ausrichtung der Website erkennt und die jeweils entsprechende Sprachversion oder regionale URL eines Inhalts dem Besucher ausgibt. 

Mehr Informationen: https://support.google.com/webmasters/answer/182192  

Jede URL die eine hreflang Auszeichnung erhält, muss entsprechend zurück verlinken, sich selbst mit der jeweiligen Sprachversion sowie weitere Sprachversionen auszeichnen. 

Nur URLs, die nicht per Canonical-Tag auf eine andere URL verweisen, sollten mit hreflang-Auszeichnungen ausgezeichnet werden. Die Verwendung von hreflang in Kombination mit einem selbstreferenzierenden Canonical ist kein Problem.

Anforderung

Implementieren Sie hreflang-Attribute auf allen relevanten URLs mit einem entsprechenden Sprach Pendant.

Für eine suchmaschinenoptimierte Darstellung eines Webauftritts sind kurze sprechende URLs von Vorteil. Sprechend bedeutet in diesem Falle, dass die URL keine kryptischen Zeichen oder Abkürzungen enthält, sondern nur natürlich lesbare Begriffe umfasst. Diverse Ranking Studien legen nahe, dass kurze URLs bzw. die Reduktion der dargestellten Verzeichnispfade ein besseres Ranking erzielen. 

Beispiel einer Produkt URL:

Langform: https://www.domain.de/schuhe/herren/laufschuhe/adidas-laufschuh  

Kurzform:  https://www.domain.de/adidas-laufschuh

Beispiel einer Sub Kategorie URL:

Langform: https://www.domain.de/möbel/betten/ 

Kurzform:  https://www.domain.de/betten

Anforderung

Erstellen Sie sprechende Kurz-URLs unabhängig davon in welcher Verzeichnistiefe die Seiten liegen.

Die Breadcrumb Navigation ist ein ideales Mittel um trotz Kurz-URLs eine saubere Struktur der Webseiten an Suchmaschinen wie Google zu übermitteln. Überdies hinaus bietet sie den Nutzern eine Orientierung und vereinfacht die Navigation. Webseitenbesucher wissen so jederzeit, wo sie sich in der Hierarchie einer Domain gerade befinden. Ein positiver Nebeneffekt ist auch der Aufbau der internen Verlinkung nach dem Muster der Seiten-Hierarchie. 

Trotz Verzicht auf die Verzeichnistiefe innerhalb der URL, können durch die Breadcrumb Navigation sämtliche Verzeichnisebenen übergeben werden. Jeden Verzeichnisebene, angefangen bei der Startseite, sollte entsprechend verlinkt werden.
Das letzte Element des Breadcrumbs sollte jedoch nicht verlinkt werden.

Beispiel einer Produkt URL https://www.domain.de/adidas-laufschuh

Home → Schuhe → Herrenschuhe → Adidas Laufschuh

Anforderung

Achten Sie auf eine seitenweite Breadcrumb Navigation inkl. Verlinkung jeder Ebene bis auf das letzte Element der Kette.

Die Sitemap.xml Datei ist ein wichtiges Werkzeug um Suchmaschinen eine Listung wichtiger URLs für die Indexierung mitzuteilen. Sie sollte sich bei jeder Seitenbearbeitung automatisch aktualisieren können und nur folgenden URL Klassifizierungen beinhalten:

URLs die ein Meta Robots “Index” ausweisen und maximal nur ein selbstreferenzierendes Rel Canonical besitzen. In der Sitemap.xml sollten zudem alle Sprachversionen der URL hinterlegt werden. 

Es kann ebenfalls sinnvoll sein verschiedene Sitemap.xml Dateien zu erstellen, die jeweils andere Bereiche der Website wie Kategorie URLs, Produkt URLs, CMS Seiten listen und in einer Index-Sitemap.xml gegliedert werden.

Unter keinen Umständen sollten folgende URL Klassifizierungen in der sitemap.xml gelistet werden:

• URLs mit einem Meta Robots “NoIndex”
• URLs die per Rel Canonical auf andere Seiten zeigen
• URLs die einen 3xx, 4xx, 5xx Statuscode ausgeben
• Parameter URLs jeder Art
• Paginierungs URLs jeder Art
• Suchergebnis URLs jeder Art
• Login / Dev / Warenkorb URLs

Weiterführende Informationen:
https://support.google.com/webmasters/answer/156184
https://support.google.com/webmasters/answer/189077

Anforderung

Ermöglichen Sie die automatische Generierung einer Sitemap.xml Datei, die sich regelmäßig aktualisiert. Sorgen Sie dafür, dass nur URLs aufgelistet werden, die ein Meta Robots Index und/oder ein selbstreferenzierendes Rel Canonical besitzen.

Strukturierte Datenauszeichnungen helfen Suchmaschinen bei der Interpretation von Webseiten. Sie können zudem zu einer verbesserten Darstellung in den Suchergebnissen durch sogenannte Rich Snippets/Features führen.

Eine ausführliche Entwicklungsbeschreibung gibt es hier:
https://developers.google.com/search/docs/guides/search-features 

Bei der Auszeichnungssprache für strukturierte Daten hat sich in den vergangenen Jahren JSON-LD durchgesetzt und wird zukünftig Microdata und RFDa ablösen.

Die Auszeichnung sollte prinzipiell für folgende Seiten / Elemente stattfinden:

1. Startseite (WebSite, Organization)
2. Kategorieseiten / CMS Seiten (WebPage)
3. Kontaktseite (ContactPage)
4. Produktseiten (Product)
5. Navigationspfad (BreadcrumbList)

Anforderung

Zeichnen Sie die Startseite, Kategorieseiten / CMS Seiten, die Kontaktseite, sämtliche Produktseiten sowie alle Navigationspfade (Breadcrumbs) mit strukturierten Daten aus. 

Optional: Ermöglichen Sie wenn möglich eine manuelle Eingriffsmöglichkeit zur individuellen Anpassung der Datenauszeichnung auf der Startseite und auf Kategorie / CMS Seiten. 

Für eine präzise Messung des Nutzerverhaltens ist ein gut durchdachtes Tracking essentiell. Insbesondere bei Onlineshops genügt die Implementierung des Standard Trackings z.B. via Google Analytics nicht aus, um alle Prozesse eines Nutzers zu messen.

Google bietet speziell für den E-Commerce Bereich das sogenannte Enhanced Ecommerce Tracking als Erweiterung zum normalen Google Analytics an, um beispielsweise detaillierte Informationen über einen Kaufprozess oder Produktspezifische Nutzerinteraktionen betrachten zu können.

Weiterführende Informationen: https://support.google.com/analytics/answer/6014841  

Um den Programmieraufwand für spezielle Trackingkonzepte zu reduzieren, bietet es sich zudem an, das gesamte Google Analytics Tracking mit Hilfe des Google Tag Managements zu implementieren.

Anstelle des Google Analytics Code Snippets wird hierbei der Google Tag Manager Container als Snippet eingebunden.

Weiterführende Informationen: https://support.google.com/tagmanager/answer/6103696

Über den Google Tag Manager wird wiederum der Google Analytics Code implementiert und ausgegeben.  

Weiterführende Informationen: https://support.google.com/tagmanager/answer/6107124

Die Implementierung des Google Analytics Trackings erfordert nach DSGVO einen Hinweis (Cookie Hinweis) für den Nutzer, sowie eine Möglichkeit zur Deaktivierung des Trackings (Opt-Out Cookie), welches in der Datenschutzerklärung klickbar hinterlegt werden sollte.

Anforderung

Implementieren Sie seitenweit den Google Tag Manager und binden Sie Google Analytics mithilfe des Google Tag Managers rechtskonform ein.

Es ist notwendig individuelle Pflegemöglichkeiten vorab in das System zu integrieren um ein aufwändiges Nachfassen bei Änderungen zu vermeiden. 

Die individuellen Pflegemöglichkeiten beziehen sich dabei auf folgende Aspekte der Suchmaschinenoptimierung und sollten über das Backend bzw. im Content Management zugänglich und kalibrierbar sein.

1. Meta Title

Die Möglichkeit zur individuellen Eingabe eines Meta Title muss für jede Seite gegeben sein.

Ein Title sollte maximal 569 Pixel lang sein. Das entspricht in etwa 65 Zeichen. Zur Sicherheit sollte das Title Eingabefeld auf 100 Zeichen ausgelegt sein bzw. 100 Zeichen zulassen. 

Weiterhin ist es wichtig, dass Zeichensätze wie Emojis verwendbar sind. ?
<meta name=“title” content=“Awesome Website with a customizable Title”>

2. Meta Description

Die Möglichkeit zur individuellen Eingabe einer Meta Description muss für jede Seite gegeben sein.

Eine Meta Description sollte maximal 145 Zeichen lang sein können. Zur Sicherheit sollte das Description Eingabefeld auf 200 Zeichen ausgelegt sein bzw. 200 Zeichen zulassen. 

Weiterhin ist es wichtig, dass Zeichensätze wie Emojis verwendbar sind. ? 

<meta name=“description” content=“Awesome Website with a customizable Description”>

3. Meta Robots

Die Möglichkeit zur individuellen Vergabe einer Meta Robots Anweisung sollte gegeben sein. Der Bearbeiter sollte entscheiden können wann eine Seite welchen Status erhält. 

Dabei sollten die Optionen
NoIndex + NoFollow ; Index + Follow; NoIndex + Follow; Index + NoFollow  frei wählbar sein.

<meta name=“robots” content=“index, follow”>
<meta name=“robots” content=“noindex, follow”>
<meta name=“robots” content=“index, nofollow”>
<meta name=“robots” content=“noindex, nofollow”>

4. Link Rel Canonical

Um schnell und kurzfristig auf Ranking Veränderungen reagieren zu können, ist es notwendig manuell eine Canonical URL im System festlegen zu können. 

Befindet sich der Bearbeiter beispielsweise auf Seite https://www.domain.de/seite-a

so soll er die Möglichkeit bekommen eine Canonical URL z.B.  https://www.domain.de/seite-b manuell eintragen zu können.

<link rel=“canonical” href=“https://www.beispielseite.de/”>

Per Default sollte jede URL, die mit einem Meta Robots “Index” ausgestattet ist, ein selbstreferenzierendes Canonical tag besitzen.

Bsp.:

https://www.domain.de/seite-a referenziert sich per Default selbst, da sie auf “Index” steht  

<link rel=“canonical” href=“https://www.domain.de/seite-a”>

Seiten die per Robots als NoIndex gekennzeichnet sind, sollten weder per Canonical auf eine andere URL zeigen, noch eine Selbstreferenzierung besitzen.

Ausgenommen sind Suchergebnisseiten. 

5. Dokumentenkontur (<H1> <H2> <H3>)

Sämtliche H-Tags kommend durch Widgets oder Plugins sind zu vermeiden. Allein der Content Manager soll anhand eines Text/Content Editors die Möglichkeit haben entsprechende H Überschriften zu deklarieren. 

6. Medien Upload

Das System sollte den Upload von sämtlichen Medieninhalten wie JPG, PNG, GIF, SVG, MP4 etc. ermöglichen, sodass diese möglichst einfach z.B. durch den Editor in den Inhalt eingefügt werden können. Bei Bilddateien ist es wichtig, dass Image Name, Image Title und ALT Attribute manuell gepflegt werden können.

7. Content Aufbereitung

Es sollte dem Content Manager möglich sein Seiteninhalte wie Teaserbild (z.B. Hero Image), Überschriften, Absätze, Verlinkungen innerhalb von Texten, Medien innerhalb von Texten sowie andere gestalterische Elemente bearbeiten zu können.

Anforderung

Sorgen Sie für individuelle Anpassungsmöglichkeiten des Shops. Entwickeln Sie dynamisch ladende Elemente wie Produktboxen und Filter Menüs. 

Ein Bearbeiter sollte idealerweise mittels eines Backend Editors Content bearbeiten und formatieren können.

Empfehlungen:

• Ressourcen beseitigen, die das Rendering blockieren
• Bilder richtig dimensionieren
• Nicht sichtbare Bilder aufschieben
• CSS komprimieren
• JavaScript komprimieren
• Nicht verwendete CSS entfernen
• Bilder effizient codieren 
• Bilder in modernen Formaten bereitstellen
• Textkomprimierung aktivieren
• Vorverbindung zu erforderlichen Ursprüngen aufbauen
• Serverantwortzeiten (TTFB) niedrig halten
• Mehrere Weiterleitungen auf die Seite vermeiden
• Wichtige Anforderungen vorab laden
• Videoformate für animierte Inhalte verwenden
• Große Netzwerknutzlasten vermeiden – Dokumentengröße kleiner als 1 MB
• Verwendet eine effiziente Cache-Richtlinie für statische Inhalte 
• Vermeidet eine übermäßige DOM-Größe
• JavaScript-Ausführungszeiten gering halten
• Aufwände für den Hauptthread gering halten

Weiterführende Informationen: https://developers.google.com/web/tools/lighthouse
PageSpeed Testing: https://developers.google.com/speed/pagespeed/insights/

Anforderung

Achten Sie bei der Entwicklung des Shopsystems auf die Ladezeiten. Mithilfe des Google PageSpeed Tools können die Ladezeiten überprüft werden. Realistisch und erstrebenswert ist ein Score zwischen 80-90.

Der Relaunch einer Website birgt zahlreiche Potentiale, solange er konzeptionell und strukturell vollzogen wird. Die genannten Anforderungen dienen als Hilfestellungen und zur Orientierung, um Ihrer entstehenden Website nicht nur eine neue Optik zu verschaffen, sondern auch zu mehr Auffindbarkeit in Suchmaschinen und besseren Rankings zu verhelfen. 

Infolgedessen können auch Produkte besser präsentiert und Kunden auf der Seite intuitiver geführt werden. Trotzdem ist nach einem Website Relaunch eine Kontrollphase notwendig, die die Umstrukturierung prüft. Monitoren Sie die Ihre Seite in den ersten Tagen regelmäßig, um Fehlerquellen schnell ausfindig zu machen und Probleme zu beheben. Nur so können Sie langfristig von einem Website Relaunch profitieren.