Fachartikel: Responsive Design – ohne mobile Geräte geht nichts mehr // Richard Albrecht, Mediengestalter // Lesezeit ca. 6 Min.
Responsive Design – ohne mobile Geräte geht nichts mehr
Immer mehr Nutzer greifen mit dem Smartphone oder Tablet auf das Internet zu. Deshalb ist es heute wichtig, Websites gezielt für mobile Endgeräte zu optimieren. Mittlerweile ist das auch für die Suchmaschinenoptimierung von entscheidender Bedeutung, denn Google verschiebt den Fokus zunehmend auf die Mobil-Version einer Site. Wer gar keine Mobil-Variante hat, muss eine dramatische Verschlechterung des Rankings hinnehmen. Die praktikabelste Lösung für dieses Problem ist ein Responsive Design.
Vom exotischen Extra zum Standard
In der Anfangsphase des öffentlichen Internets orientierte sich die Gestaltung von Websites in der Regel an der Darstellung auf einem Desktop-Bildschirm. Zunächst war damit der Computer am Arbeitsplatz gemeint, von dem das World Wide Web hauptsächlich genutzt wurde. Dann kamen der heimische Rechner und der Laptop hinzu. Die stellten im Grunde noch dieselben technischen Anforderungen an das Webdesign. In den letzten Jahren sind allerdings mobile Endgeräte wie Smartphones oder Tablets in den Mittelpunkt gerückt. Im klassischen Computer-Screen sehen die Konsumenten nur noch eine von vielen Möglichkeiten. Auf dem Smartphone oder Tablet sehen Websites aber anders aus als auf dem großen Screen. Die Darstellung ist kleiner und die Seitenverhältnisse weichen ab. Außerdem kann der User sein Gerät sowohl horizontal als auch vertikal halten. Zur Steuerung benutzt er nicht mehr Maus und Tastatur, sondern einen Touchscreen. Wenn eine Website nicht gezielt für mobile Geräte optimiert wurde, ist die Benutzerfreundlichkeit deshalb stark eingeschränkt.
Was ist Responsive Design?
Ein responsives Webdesign stellt die Inhalte einer Webseite in angepasster Variante für unterschiedliche Endgeräte zur Verfügung. Voraussetzung dafür ist die konsequente Trennung von Inhalt und Layout im Backend. Das kann bei der Umstellung zunächst eine Herausforderung sein, denn ältere Websites sind meist anders aufgebaut. Mittlerweile erstellen viele Webdesigner sogar zuerst die Mobil-Variante. Erst danach wird die Desktop-Version daraus entwickelt – dahinter steht das Konzept „Mobile First“. Ein wichtiger Schritt zur Umstrukturierung vorhandener Websites ist das Setzen von Prioritäten. Die bestehenden Elemente werden genau unter die Lupe genommen. Der professionelle Webdesigner fragt: Was kann weiter nach unten rutschen, was wird komplett gestrichen? Und was rückt ins Zentrum? Für diese Evaluierung sollte man sich ausreichend Zeit nehmen. Für die technische Umsetzung bedeutet das: Responsive Design wird in der Regel mit HTML5 und CSS3 realisiert. Mithilfe von Media Queries fragt die Site vom Endgerät gezielt Informationen ab. Das können zum Beispiel Displaygröße, Format und Auflösung sein. Der Code bleibt generell unverändert, doch es kommen unterschiedliche Style-Sheets zur Anwendung – je nach Gerät. So wird immer die passende Version angezeigt.
Lokale Suchen gewinnen an Bedeutung
Um Benutzerfreundlichkeit auch auf mobilen Endgeräten zu gewährleisten, muss die Ladezeit kurz, die Navigation einfach und die Darstellung genau angepasst sein. Denn viele Smartphone-User verlassen eine Site sofort wieder, wenn die Handhabung zu umständlich ist. Das erhöht die Absprungrate – und damit verschlechtert sich das Google-Ranking. Wenn ein Unternehmen die aktuelle Entwicklung jetzt verschläft, hat es eine schwächere Außendarstellung und muss einen Wettbewerbsnachteil hinnehmen. Hinzu kommt die wachsende Bedeutung lokaler Anfragen. Wer mit dem Smartphone auf der Straße unterwegs ist und von dort eine Suchanfrage an Google stellt, bekommt Ergebnisse in seiner unmittelbaren Nähe angezeigt. Wenn man zum Beispiel „Autohändler“ googelt, erhält man eine Liste entsprechender Anbieter, die in wenigen Minuten erreichbar sind. Das ist vor allem für Ladengeschäfte, Restaurants und ähnliche Gewerbe wichtig, die ihre Waren oder Dienstleistungen direkt vor Ort verkaufen.
Wie viel Aufwand macht die Entwicklung?
Wie aufwändig die Entwicklung des Responsive Designs letzten Endes ist, hängt zum einen von der Größe der Website ab und zum anderen von der Komplexität und dem Umfang. Ist die Entwicklung jedoch einmal abgeschlossen, dann lässt sich eine gut strukturierte Site sehr einfach verwalten, denn neue Inhalte müssen jeweils nur ein einziges Mal erstellt werden. Danach sind sie sofort in allen wichtigen Geräte-Varianten verfügbar. Der Aufwand lohnt sich, denn das Responsive Design verbessert die Nutzererfahrung erheblich. Der User kann frei entscheiden, ob er eine Website vom heimischen Rechner oder unterwegs vom Smartphone besuchen möchte. Die Site empfängt ihn jeweils mit einer passenden Version, die sich ebenso einfach navigieren lässt wie alle anderen. So findet sich der User schnell zurecht. Deshalb fühlt er sich wohler, bleibt länger und lässt sich leichter für das Angebot begeistern.
Fazit
Spätestens seit Einführung des mobilen Index als Hauptindex bei Google sind mobile Versionen von Webseiten nicht mehr nur eine Option, sondern unbedingt erforderlicher Standard. Zudem erfolgen abhängig von der jeweiligen Branche im Durchschnitt weit mehr Anfragen über mobile Endgeräte als über Desktop-Bildschirme. Eine voll funktionstüchtige und in gleichem Maße professionelle Version ihrer Webseite wie die Desktop Variante, ist für Webseitenbetreiber aller Art absolute Pflicht. Eine seriöse Agentur bindet die mobile Variante ihrer Webseite automatisch in das Angebot mit ein.
