Responsive Design (vom englischen responsive, „reagierend“) passt die Anzeige einer Website auf das aktuell genutzte AnzeigegerĂ€t und die GrĂ¶ĂŸe des Bildschirms an. Das Webdesign reagiert also darauf, wenn eine Website einmal vom heimischen PC mit großem Monitor und ein anderes Mal unterwegs vom Smartphone aufgerufen wird.


Responsives Webdesign ist nach und nach immer wichtiger geworden und heute unerlĂ€sslich. Denn es sind immer mehr internetfĂ€hige GerĂ€te mit kleineren Displays im Einsatz, und außerdem werden die Übertragungsgeschwindigkeit und VerfĂŒgbarkeit von mobilen Internetverbindungen immer besser.

Was macht Responsive Design so besonders?

Eine nicht responsive Website wird auf jedem GerĂ€t und jedem Bildschirm gleich dargestellt. Auf einem großem Monitor mit einer Diagonale von 20 Zoll oder mehr sieht sie genauso aus wie auf einem Smartphone mit einem 3,5 Zoll-Display. Was auf dem großen Monitor toll wirkt und angenehm lesbar ist, wird fĂŒr das Smartphone einfach verkleinert – Texte, Bilder und Videos ebenso wie MenĂŒs und Links fĂŒr die interne und externe Navigation.

Ist die Website allerdings nach dem Resonsive Design-Paradigma entwickelt, reagiert sie dynamisch auf das GerĂ€t, von dem aus sie aufgerufen wird. Die Seite passt sich an die Bildschirmauflösung des EndgerĂ€tes an. Inhalts- und Navigationselemente sowie der strukturelle Aufbau der Seite werden auf jedem Bildschirm so angezeigt, dass mit der Maus oder dem Touchscreen einfach zu bedienen sind. Responsive Websites sind damit „mobile friendly“, was seit einigen Jahren auch ein wichtiger Ranking-Faktor bei Google ist.

Was gibt es fĂŒr Alternativen zum Responsive Design?

Eine mögliche, aber nicht besonders empfehlenswerte Alternative ist der Verzicht auf responsives Webdesign. Allerdings wirst du mit einer nicht responsiven Seite schlechter in den Suchergebnissen von Google und Co. gefunden. Und wer deine Website oder deinen Webshop mit dem Smartphone von unterwegs aus besucht, wird das vermutlich kein zweites Mal probieren. Sondern sich entweder auf den Weg zum nÀchsten Desktop-PC mit Monitor machen oder eben bei deinem Wettbewerber vorbeisurfen. Denn dessen Website ist bereits mobile friendly und responsive.

Oder du entwickelst zwei Websites – eine fĂŒr den großen Monitor, eine fĂŒr die mobile Nutzung. Dann musst du allerdings bei jeder Anpassung an beide Seiten ran, verdoppelst also den Pflegeaufwand fĂŒr deine InternetprĂ€senz.

Wie lÀsst sich Responsive Design einfach umsetzen?

Eine responsive Website arbeitet mit HTML5 und CSS3. In CSS3 lassen sich sogenannte Media Queries programmieren, die bei jedem Aufruf deiner Website zunĂ€chst das EndgerĂ€t identifizieren und dann jeweils das passende Design ausliefern. Damit das klappt, mĂŒssen Inhalte und Layout einer Website strikt voneinander getrennt werden.

Moderne Content Management- und Onlineshop-Systeme bieten diese strikte Trennung und sind damit bereits ab Werk mobile friendly. Damit aber wirklich alles auf jedem Bildschirm optimal dargestellt wird und bedienbar ist, muss immer noch einiges angepasst und nachbearbeitet werden.

Du brauchst eine Website, die auch auf dem Smartphone reibungslos funktioniert und gut aussieht? Oder einen Webshop, der mobile Internetnutzer begeistert, statt sie mit friemeliger Navigation und unnötigem Gescrolle vom Kauf abzuhalten? Wir helfen dir gern, egal ob beim Redesign oder kompletten Neuaufbau. Dann ist deine (neue) Website vollstĂ€ndig responsive und mobile friendly – so wie unsere eigene und die vielen Seiten, mit denen wir schon andere Kunden glĂŒcklich gemacht haben.