Mobile Endgeräte, wie Smartphones oder Tablet-PCs, sind heute bereits ein fester Bestandteil im Leben vieler Menschen. Das Surfen im WWW findet daher zunehmend nicht mehr nur mit stationären Geräten (PC, Laptop), sondern auch mit mobilen Geräten (Smatphone, Netbook) statt. Dieser Umstand muss auch bei der Entwicklung der eigenen Webpräsentation (Homepage, Webseite) bedacht werden. Die Anpassung der Darstellung der Webpräsentation an die verschiedenen Endgeräte spielt dabei eine bedeutende Rolle – man spricht von Responsive Design.
Der Begriff „responsive“ (zu deutsch „reagierend“) verdeutlicht die Idee hinter einem solchen Webdesign: Die Reaktion der Darstellung der Webpräsentation auf die verschiedenen Auflösungen des Endgerätes des Besuchers. Was bedeutet dies in der Praxis? Insbesondere die geringe Auflösung vieler mobiler Endgeräte stellt die Webpräsentation vor die Herausforderung, Inhalte optimiert darzustellen. Wer bereits eine nicht optimierte Webpräsentation mit einem Smartphone besucht hat, der weiß, dass die Benutzerfreundlichkeit stark unter der Fülle an Informationen leidet:
- Die Webpräsentation muss oftmals gezoomt werden, wodurch die Übersichtlichkeit verloren geht.
- Eine optimale Navigation auf der Webpräsentation ist oftmals nicht mehr gegeben.
- Informationen können vom Besucher evtl. nicht gefunden werden.
Genau diese Probleme können mit Hilfe von Responsive Webdesign gelöst werden, indem verschiedene Layouts für verschiedene Auflösungen hinterlegt werden. Mit Hilfe von Media-Queries (CSS3) werden verschiedene Gestaltungsvarianten für minimale und maximale Breiten des Bildschirms verwendet. Für kleine Auflösungen können z.B. große Bilder verkleinert, die Navigation neu positioniert oder Buttons für eine optimale Bedienung mit Touch-Screens vergrößert werden (vgl. dazu Abbildung 1 (Quelle: Eigenproduktion SAW)). Die Idee des Responsive Webdesign kann sogar noch ausgebaut werden, indem für verschiedene Auflösungen, verschieden große Bilder geladen werden – das verringert die Ladezeit bei dem Besucher (vgl. dazu Abbildung 2 (Quelle: http://www.buildwindows.com/)).
Responsive Webdesign weißt somit einige Vorteile gegenüber klassischem Webdesign auf:
- optimale Darstelung der Inhalte für jedes Endgerät,
- schnellere Ladezeiten für mobile Endgeräte,
- bessere Navigation auch bei kleinen Auflösungen,
- es muss keine für mobile Endgeräte gesonderte Domain (Internet-Adresse) eingerichtet werden,
- das Design der Webpräsentation bleibt durchgängig gleich sowie
- einfache Erweiterung für spezielle Auflösungen (z.B. gesonderte Darstellung für besonders große Auflösungen).
Möchten Sie Ihre bestehende Webpräsentation für mobile Endgeräte optimieren? Wir beraten Sie gern über die Möglichkeiten von Responsive Webdesign.
