Responsive Design ist letztem Jahr das neue Schlagwort im Webdesign Bereich – kein Wunder bei den rasant steigenden mobilen Zugriffen. Aber gab es da nicht auch noch den Begriff der mobilen Website?
Die Frage, ob eine neue Website für Smartphones und Tablets tauglich sein soll, wird sich heute keiner mehr stellen. Eine einfache und klare Antwort, wie dieses Ziel zu erreichen ist, gibt es aber nicht, zu unterschiedlich sind die Anforderungen.
Vielfach ist man der Ansicht, dass für die mobile Ansicht nur eine Teilmenge der auf dem Desktop zur Verfügung gestellten Information sichtbar sein soll. Diese Meinung vertritt im wesentlichen auch der Usability Experte Jacob Nielsen, der es auf seiner Website mit den Worten „Im Zweifelsfall lieber weglassen“ umschreibt. Dafür seien mobile Websites, die von der Desktop-Variante inhaltlich und möglicherweise auch technisch getrennt verwaltet werden, besser geeignet.
Responsive Webdesign der neue Trend
Der Trend geht aber Richtung „Responsive Webdesign“ und das hat vielerlei Gründe. Zum einen ist es die Tatasche, dass bei vielen, vor allem kleineren Websites, die Administratoren und Redakteure zeitlich schon mit einer einmaligen Erstellung und Pflege des Inhaltes zeitlich überfordert sind. Schließlich herrscht in vielen Unternehmensführungen die Meinung vor, dass die „Homepage“ ja eh vom Sekretariat nebenbei mitbetreut werden kann. Das führt zum Ergebnis, dass die Inhalte oft nur im Copy & Paste Verfahren auf den dazu vorgegebenen Platz kopiert werden. Rücksichtnahme auf optimale Textierung für den User aber auch die Suchmaschine ist dabei nicht gegeben, eine weitere Berücksichtigung der unterschiedlichen Gegenheiten von „klassischer“ Website und der mobilen Version noch weniger.
Hier hakt „Responsive Design“ ein: Für die optimale Textierung kann es natürlich nicht sorgen, aber wenigsten müssen die Inhalte nur einmal eingearbeitet werden, die Berücksichtigung auf die unterschiedlichen Ausgabegeräte erfolgt automatisch durch die Website.
HTML5 und CSS3 das Mittel zur Wahl
Der Begriff „Responsive Web Design“ ist von Ethan Marcote, einem amerikanischen Webdesigner und Entwickler, erstmals 2010 im Rahmen eines Beitrags verwendet worden und beschreibt eine Technik, die mit Hilfe von HTML5 und CSS3 die Erstellung von flexiblen Layouts ermöglicht. Dabei werden sowohl die Navigation, als auch die Inhalte automatisch auf die, für das jeweilige Gerät passende Größe optimiert.
Das ist vor allem so wichtig geworden, da die Vielfalt an Geräten mit unterschiedlichen Bildschirmgrößen und -auflösungen, aber auch Bedientechniken immer weiter zunimmt – Touch oder Mouse sei hier nur als Stichwort erwähnt.
Was spricht nun für eine Umsetzung mittels Responsive Design:
- Passende Darstellung der Websites nicht nur auf allen aktuellen, sondern auch auf zukünftigen Displays und Geräten
- Reduzierter Wartungsaufwand, da die Inhalte nur einmal erfasst werden müssen
- Suchmaschinenfreundliche Seitenstruktur, da alle Links die gleiche URL haben. Und mit den neuen „Enhanced Campaign“ Funktionen von Google können Sie dennoch die mobilen Geräte explizit ansprechen.
- Das klingt zwar jetzt nach Mehraufwand, dieser lohnt sich aber ala longe: Die für gutes Responsive Design auf das wesentliche reduzierte Struktur sowie optimierte Inhalte verbessern die Nutzerzufriedenheit
Wann sollte eine Mobile Website in die engere Wahl kommen:
- Möglicherweise schlechtere Performance auf einem Endgerät im Vergleich zu einer Mobilen Website, dei auf dieses Gerät optimiert wurde
- Inhalte, die von einer Desktop-Website übernommen werden, sind oft nicht in der idealen Reihenfolge. Folgen: Der User muss lange scrollen um zu seinem gewünschten Inhalt zu kommen. Im schlechtesten Fall bricht er ab, bevor zum eigentlich vorhandenen Inhalt kommt. Wichtig ist daher, schon bei der Konzeption das „Mobile First“ Prinzip zu beachten.
- Erhöhter Aufwand bei der Konzeption und Umsetzung
Welche Lösung ist nun ideal?
Wie heißt es so schön: Es kommt darauf an. Klären Sie im Vorfeld die grundsätzliche Frage: Unterscheiden sich sinnvollerweise die Inhalte bei stationärer und mobiler Nutzung?
Zum Beispiel können bei einem Restaurant von einem Desktop-Rechner oder einem Smartphone gänzlich andere Informationen gewünscht sein. Bei der Destop-Website steht beipielsweise die Präsentation des Lokals im Vordergrund, wenn ich als User aber von unterwegs über mein Smartphone auf die Restaurantseite zugreife, interessiert mich wahrscheinlich mehr, ob das Lokal gerade geöffnet hat oder welches Mittagsmenü heute angeboten wird. Dieser unterschiedliche Zugang wäre über eine getrennte mobile Website besser zu lösen.
Hallo Christian, danke für den Artikel! Ich würde grundsätzlich davon ausgehen, dass User mobil dieselben Informationen suchen. Wobei „mobil“ auch schon kompliziert ist, da Tablets und Smartphones nicht dasselbe Screen-Erlebnis bieten. Nur wenn wirklich sehr unterschiedliche Nutzungsszenarien zwischen Mobilversion und Desktopversion angenommen werden, würde ich eine mobile Website machen. Und selbst dann ist zu hinterfragen ob der Rest der Website nicht trotzdem responsive sein sollte und die Mobilversion nur zusätzlich angeboten wird.