Was ist Responsive Design?

 

Unter Responsive (Web-) Design versteht man die automatische Anpassung des Layouts an die Bildschirmauflösung des jeweiligen Ausgabemediums. Das Design wird flexibel konzipiert, damit eine Webseite sowohl auf einem Computerbildschirm, Tablet, Smartphone als auch einem anderen mobilen Endgerät benutzerfreundlich ist. Laut dem Statistischen Bundesamt ist in Deutschland das Smartphone mit 87% das meist verwendete Gerät für die Internetnutzung, daher ist eine responsive Webseite unabdingbar, um Kunden einen gute Nutzererfahrung zu bieten.

 

Vorgehen bei der Konzeption

Die Entwicklung eines responsiven Webdesigns berücksichtigt in der Regel Desktop, Tablet und Smartphone, mitunter auch Smart-TV und weitere Devices.  Die opulenteste Darstellung erfordert natürlich der Desktop, auf dem großflächige und hochauflösende Gestaltung obligatorisch ist. Die Darstellung für mobile Devices (Tablet und Smartphone) muss daher Abstriche bei der Gestaltung, Auflösung und manchmal auch bei der Anordnung von Inhalten machen. Bei der Konzeption responsiver Websites werden u.a. auch Bandbreite und Datenvolumen berücksichtigt. Die Darstellung von Elementen ist auf Smartphone Bildschirmen meist untereinander gelöst:  aus horizontalen Navigationsleisten werden häufig vertikale angeordnete Navigationen. Teilweise werden Inhalte auch „weggeklappt“, um die Gesamtlänge einer Seite zu kürzen. Der Nutzer muss sie auf dem Smartphone dann aufklappen, um sie lesen zu können.

 

Responsive Design - Desktop vs. Mobile

Abbildung: Responsive Design auf Desktop & Mobile

 

Responsive Design und SEO

Auch für das Suchmaschinenranking spielt ein responsives Webdesign eine entscheidende Rolle. Google startete in 2016 seine Mobile First Initiative, um zu berücksichtigen, dass die Mehrheit der Weltbevölkerung auf das Internet via Smartphone zugreift. Seit 2017 wurde dementsprechend ein mobiler Index aufgebaut, welcher seit Juli 2019 dafür sorgt, dass Webseiten, die eine optimierte Darstellung für mobile Endgeräte anbieten, besser als solche ranken, die diese außer Acht lassen. Für gute Rankingpositionen ist Responsive Design darum eine wichtige Voraussetzung.