Was Shop-Betreiber in Sachen SEO bei der mobile-Optimierung beachten müssen

Dank iPad, iPhone & Co. greifen immer mehr Kunden auf Shops mit mobilen Endgeräten zu. Was auf einem Desktop-Browser gut aussieht, kann dann mit einem kleinen Screen schnell zur Qual werden und zu einem Kaufabbruch führen. Shop-Betreiber müssen ihre Shops also an mobile Endgeräte anpassen. Dabei geht es natürlich auch in Bezug auf SEO darum, hier die Weichen richtig zu stellen.
Wer sich einige Online-Shops anschaut, wird schnell entdecken, dass diese bei der Ausrichtung auf mobile Endgeräte durchaus unterschiedliche Wege gehen. Manche Shops errichten eine separate mobile Version des Shops, während andere auf das Trendthema "Responsive Webdesign" setzen.
Bevor es in diesem Artikel gleich um die verschiedenen Möglichkeiten und deren Vor- und Nachteile in Bezug auf SEO geht, sei natürlich eine Option genannt: die Unterlassungsalternative. Wer z. B. kaum mobile Besucher hat, kann diese Alternative durchaus in Betracht ziehen. Wenn man in den Analytics-Auswertungen sieht, dass 90% der mobilen Besucher per iPad kommen und für diese der Shop durchaus akzeptabel aussieht und funktioniert, kann sich natürlich auch dafür entscheiden, einfach nichts zu tun. Denn die im Folgenden genannten Maßnahmen verursachen zum Teil auch erhebliche Kosten –und die muss man ja erstmal zusätzlich erwirtschaften, damit sich der Aufwand rentiert.
One-URL-Strategie
Wer sich trotzdem dafür entscheidet, seinen Online-Shop explizit an mobile Nutzer anzupassen, muss ein wichtiges Konzept verstehen: One URL. Damit ist gemeint, dass ein Desktop- und ein mobiler Nutzer unter derselben URL eine bestimmte Seite abrufen können.
Das hat in Bezug auf SEO ganz klare Vorteile. Wenn man nämlich nicht "One URL" implementiert, gibt es ja zwei unterschiedliche URLs: eine für die mobile und eine für die Desktop-Version der Seite (z. B. m.website.de/pfad und www.website.de/pfad). Das erzeugt Duplicate Content – und das ist vor allem nachteilig, weil man so Signale auf zwei Seiten verteilt. Besser wäre es in der Regel, wenn man diese Signale auf einer einzigen URL vereinen könnte.
Möglichkeit 1: Responsive Webdesign
Responsive Webdesign ist die eine gängige Möglichkeit, auf eine One-URL-Strategie zu setzen. Dabei wird die Seite jeweils in der Maximalversion geliefert. Heißt: In der Seite befinden sich unterschiedliche Blöcke wie die obere Navigation, die linke Navigation, die Produktinfos, etc. Der Browser entscheidet dann mittels der CSS-Anweisungen, ob und wie die einzelnen Blöcke dargestellt werden müssen.
Wie das in der Praxis aussieht, kann man in den Abbildung 1 und 2 sehen. Die Website Verlobungsring.de passt sich der Breite des Bildschirms an. Während in der "normalen" Version oben ein Menü und links eine Filter-Sektion zu sehen ist (Abbildung 1), entfällt das in der "schmalen" Version (Abbildung 2).
Responsive Webdesign: Vor- und Nachteile
+One-URL-Implementierung (Vermeidung von Duplicate Content, alle Signale auf einer URL vereint)
- Sehr alte Browser bzw. primitive Browser (auf manchen veralteten Handys) können mit den Anweisungen nichts anfangen und stellen die Website dann in der Desktop-Version oder vollkommen falsch dar.
- Es wird immer die Maximalversion einer Seite im HTML-Code übertragen, auch wenn bestimmte Elemente von einem Endgerät gar nicht angezeigt werden. Die übertragene Datenmenge kann also im Einzelfall sehr hoch sein, was bei mobilen Endgeräten nachteilig sein kann.
- Beim Responsive Webdesign geht man davon aus, dass die Struktur der Website gleich bleibt und sich nur das Layout einer Seite ändert. In bestimmten Fällen ist das allerdings nicht optimal, da man so die Struktur der mobilen Website nicht oder nur mit hohem Aufwand anpassen kann.
Möglichkeit 2: Dynamic Serving
Während beim Responsive Webdesign der Browser entscheidet, was er wie darstellt, übernimmt das beim Dynamic Serving der Server. Dieser stellt also – z. B. anhand des so genannten User-Agents und einer angeschlossenen Datenbank – fest, welches Endgerät mit welchen Eigenschaften (z. B. Bildschirmbreite) die Anfrage stellt.
Damit Google mit dieser Methode klarkommt, muss allerdings ein HTTP-Header ("Vary: User-Agent") mitgeliefert werden. Das signalisiert der Suchmaschine, dass die ausgelieferte Seite vom konkreten Endgerät abhängt. Und das muss man Google schon mitteilen, da ja auch Google die Seite abruft.
Dynamic Serving: Vor- und Nachteile
+ One-URL-Implementierung (Vermeidung von Duplicate Content, alle Signale auf einer URL vereint)
+ Server kann jeweils hinsichtlich der Code-Menge und der Funktionalität eine optimal angepasste Version ausliefern.
- Technisch aufwendig
- Zum Teil auch recht unsicher, da natürlich permanent neue Endgeräte auf den Markt kommen, die evtl. nicht immer absolut zielsicher erkannt werden können.
Möglichkeit 3: Separate mobile Website
Einige Websites gehen aber auch den Weg, dass sie neben ihrer Desktop-Website eine separate mobile Website anlegen (also z. B. m.meinshop.de). Damit verlassen Sie den One-URL-Pfad, da es dann eben jede Seite zweimal gibt.
Grundsätzlich spricht aber nicht viel gegen eine solche Implementierung. Einige Shop-Betreiber nutzen ja auch Angebote wie Shopgate, bei denen der Anbieter eine mobile Version der Desktop-Website erstellt, ohne dass man sich darum aktiv kümmern muss.
Wer eine mobile Website erstellt, muss allerdings über den HTML-Code abbilden, dass es zwei Versionen einer Seite gibt:
- Die Desktop-Version der Seite verlinkt per rel-alternate-Tag auf die mobile Version (="Schau mal Google: Hier findest Du alternativ zu der Desktop-Version die mobile Seite")
- Die mobile Seite verweist per Canonical-Tag auf die Desktop-Seite (="Es handelt sich hier um Duplicate Content und das Original dieser Inhalte findest Du auf der Desktop-Site")
Übrigens: In der Praxis spricht man immer davon, dass es nur eine mobile Version der Website gibt. Es spricht aber auch nichts dagegen, unterschiedliche mobile Websites zu erzeugen, z. B. eine für Smartphone und eine für alte WAP-Browser. Und auch hier kann man Dynamic Serving einsetzen, also die Möglichkeit nutzen, dass die mobile Version der Website abhängig vom Endgerät erzeugt wird.
Separate mobile Website: Vor- und Nachteile
+ Mobile Website kann hinsichtlich Code-Menge und Funktionalität optimal angepasst werden.
- Keine One-URL-Implementierung
- Technisch aufwendig und zum Teil auch fehleranfällig
Eine Entscheidungshilfe
Die drei Lösungswege (bzw. vier, wenn man die Unterlassungsalternative hinzunimmt) sind recht unterschiedlich. Wofür sollten sich Shop-Betreiber nun entscheiden?
Das hängt zunächst mal vom Shop-System und den Möglichkeiten ab. Manche Shops bieten bestimmte Möglichkeit "out of the box", so dass man diese dann auch bevorzugt nutzen sollte. Und manche Shop-Betreiber wollen vielleicht ohnehin einen Relaunch angehen, so dass sie in diesem Rahmen dann auch die Umstellung auf Responsive Webdesign vornehmen können.
Grundsätzlich kann man in jedem Fall sagen, dass keine der drei Methoden unbedingt vorteilhafter ist. Sicherlich ist eine One-URL-Implementierung gut, aber dank der von Google und anderen Suchmaschinen bereitgestellten Möglichkeiten kann man auch eine separate mobile Website optimal für Suchmaschinen abbilden.
Shop-Betreiber können sich insgesamt an den folgenden Aspekten orientieren:
- Wenn ein Shop eine bestimmte Möglichkeit bereits "von Haus aus" anbietet, sollte diese genutzt werden. Dabei muss natürlich sichergestellt werden, dass die jeweiligen technischen Anforderungen (siehe oben, z. B. Canonical-Tag) erfüllt sind.
- Wer eine Lösung sucht, bei der man sich mit der mobilen Optimierung gar nicht beschäftigen muss, ist oft gut damit bedient, einen separaten mobilen Shop durch ein Tool oder einen Dienstleister erstellen zu lassen.
- Responsive Webdesign ist in der Praxis – vor allem für kleinere Online-Shops – eine sehr gute Möglichkeit, für mobile Endgeräte angepasste Seiten auszuliefern. Dabei gibt es natürlich einige Nachteile (siehe oben) – aber eben auch klare Vorteile (One-URL-Implementierung).
Übrigens: Auf der Seite https://developers.google.com/webmasters/smartphone-sites/?hl=de liefert Google alle relevanten Informationen zur Implementierung mobiler Websites.
Fazit
Wie man sieht gibt es verschiedene Möglichkeiten, von denen jede ihre ganz eigenen Vor- und Nachteile hat. Insgesamt muss man hier eine gesunde Balance zwischen dem Aufwand und dem Nutzen finden. So ist Responsive Webdesign eine pragmatische Möglichkeit, die sicherlich nicht alle technischen Potenziale ausschöpft, aber dennoch für viele Shop-Betreiber wegen der einfachen Implementierung und der damit verbundenen Kosten attraktiv ist.

Autor
Markus Hövener
Markus Hövener ist geschäftsführender Gesellschafter und Head of SEO der SEO-/SEM-Agentur Bloofusion. Darüber hinaus bloggt er zu SEO-Themen für die Internetkapitäne, ist Chefredakteur vom SEO-/SEM-Magazin suchradar, hält Vorträge auf Konferenzen (SMX, Conversion Conference, SEOkomm, Search Conference, …) und ist Autor vieler Studien und Analysen.
www.bloofusion.de
markus.hoevener(at)bloofusion.de
twitter.com/bloonatic