Von Judith: Responsive Webdesign und SEO

In diesem Blogartikel erfahren Sie, was „Responsive Webdesign“ bedeutet und welche Vorteile diese Technik bietet. 
Als Inspiration dient der Artikel „The SEO of Responsive Web Design“ auf SEOmoz.org.

Smartphone, Tablet und Co. – Webnutzung im Wandel

Immer mehr Menschen verwenden Smartphones oder Tablets, um schnell aktuelle Nachrichten zu lesen, die Öffnungszeiten ihres Zahnarztes zu finden oder den Tisch im Restaurant zu reservieren.
Dieser Wandel stellt gleichzeitig neue Anforderungen an Websites.

Was ist Responsive Webdesign?

Der Nutzer erwartet auf seinem Smartphone dasselbe Webangebot, wie auf seinem Desktop-PC. In der Vergangenheit haben viele Unternehmen deshalb eine zweite, für Mobilgeräte optimierte Website erstellt. 

Eine Website, die „responsive“ (engl. = reagierend) programmiert ist, verfolgt einen anderen Ansatz und passt sich dem jeweiligen Bildschirmmedium an, auf dem sie aufgerufen wird. Egal, ob Miniaturbildschirm oder XXL-Display – Textblöcke, Navigation und Bilder werden benutzerfreundlich positioniert.

Wie funktioniert Responsive Webdesign?

Als Beispiel teilen wir eine fiktive Website in ein Grundraster auf und geben jeder Zelle einen Buchstaben.

Wenn wir nun die Website auf einem kleineren Display betrachten, rutschen einzelne Elemente in eine tiefere Position.

Die Inhalte werden immer optimal dargestellt, ohne dass der Nutzer horizontal scrollen muss. 

Auf einem noch kleineren Display könnten sich die Elemente wie folgt platzieren…

Probieren Sie das doch einmal auf der wwwe-Website aus.

Was einfach aussieht ist eine Wissenschaft für sich

Bei der Konzeption, Gestaltung und Programmierung einer responsive Website ist deutlich mehr Aufwand gefordert, als bei einer herkömmlichen Website. Der Webdesigner muss genau planen wo er welche Inhalte anordnet, damit diese sich auch bei einer veränderten Displaygröße nicht gegenseitig behindern.

Für jede erdenkliche Bildschirmgröße muss die passende Anzeige ermöglicht werden. Erreicht wird das bei der Programmierung mit so genannten Media Queries. Der Browser bekommt mitgeteilt, in welchem Format und welcher Größe er die Inhalte bei der jeweiligen Auflösung anzuzeigen hat.

Je nach Umfang einer Website sind der Programmiertechnik jedoch Grenzen gesetzt. Eine responsive Website ist also nicht in allen Fällen sinnvoll.

Selbsttest: Benötigen Sie eine responsive Site?

In drei einfachen Schritten finden Sie eine Antwort auf diese Frage. Als Basis für den Test dient das Tracking-Tool „Google Analytics“.

Mobile Besucher – Test A:

In Google Analytics haben Sie die Möglichkeit zu unterscheiden, welche Besucher Ihre Website über Desktop-PCs aufgerufen haben und welche über mobile Endgeräte.
Wenn der Anteil an „mobilen“ Besuchern unter fünf Prozent Ihres totalen Traffics liegt, reicht meist eine normale Website.

Conversion Rate – Test B:

Bestenfalls haben Sie verschiedene Ziele und Aktionen festgelegt, für die Sie die sogenannte Conversion Rate erfassen, zum Beispiel wenn ein Websitebesucher das Anfrageformular für einen Beratungstermin bei seinem Steuerberater absendet.
Auch hier können Sie in Analytics zwischen dem Anteil an „mobilen“ und normalen Besuchern unterscheiden.
Prüfen Sie, ob die Mobile-Conversion-Rate kleiner als die Hälfte der Desktop-Conversion-Rate ist.

Displayauflösung – Test C:

Wählen Sie den Menüpunkt “Besucher > Mobil > Übersicht“. Dort stellen Sie unter „Sekundäre Dimensionen > Technologie“ auf „Seitenauflösung“ um. Sie sehen eine Auflistung der Bildschirmauflösungen Ihrer Besucher.
Testen Sie nun die Ansicht Ihrer Website, beispielsweise mit dem kostenlosen Tool „Screenfly“ für die zehn gängigsten Auflösungen. Finden Ihre Besucher, was sie suchen?

Responsive Websites und SEO

Keine Probleme mit Duplicate Content:

Google fordert einzigartige Inhalte und reagiert empfindlich, wenn Texte unverändert vervielfältigt werden. Diese Sorge haben Sie mit einer responsive Website nicht.

Backlinks perfekt ausgeschöpft:

Auch bei den Links zu Ihrer Domain ergibt sich ein klarer Vorteil: die Website ist nicht in zwei verschiedene Versionen aufgeteilt, somit stärken die Links zugleich die mobile und die Desktop-Version.

Ranking für „mobile Suche“:

Sobald Sie bei Google über ein Mobilgerät suchen, erhalten Sie in den Suchergebnissen vorwiegend Webangebote, welche auch für Mobilgeräte optimiert sind. Ihre Responsive Website rankt also besser als einen nicht für die mobile Suche optimierte Site.

Ein Schritt, der gut überlegt sein sollte

Der Wechsel zu einer responsive programmierten Website fordert einen deutlich höheren Aufwand sowohl für Ihren Webdesigner als auch für die Programmier-/Eintwicklungsabteilung. Damit steigen die Kosten für die Erstellung. Ich hoffe dieser Artikel ist Ihnen eine Hilfe bei der Entscheidung, ob Responsive Webdesign für Sie aktuell ein Thema ist.

Hinterlassen Sie mir gerne einen Kommentar und teilen Sie Ihre Gedanken, Anregungen oder Fragen zum Thema Responsive Webdesign mit.