Responsive Design
Menü
Homepages
Templates
Redaktionssysteme
Responsive Design

Wie funktioniert Responsive Design

Responsive Design bedeutet, dass eine Website auf die Bildschirmgrößen unterschiedlicher Endgeräte (PC's, Tablets oder Smartphones) reagieren kann - engl. responsive bedeutet "reagierend". Wer einmal mit dem Tablet oder dem Smartphone eine Website aufgerufen hat, weiß, dass viele Websites entweder sehr verkleinert dargestellt werden oder dass man das Gefühl hat, die Website durch ein Schlüsselloch betrachten zu müssen. Bis vor Kurzem löste man dies Problem, indem man für eine Website eine besondere "mobile Website" erstellte, in der Regel eine sehr aufwendige und daher teure Lösung.

Was ist das Neue an Responsive Design

Durch die Aktualisierung der zentralen Internettechnologien (HTML5 und CSS3) ist es nun möglich, eine einzige Website zu programmieren, die sich an die Bildschirmgrößen automatisch anpassen kann. Die Texte der Websites bleiben weiterhin gut lesbar, wenn Sie auf Tablets oder Smartphones aufgerufen werden, das Design passt sich an, ohne dass der Wider­erken­nungs­wert der Website verloren geht - siehe die Grafik rechts.

Ein Beispiel: die w2media-Website

Was über Worte schwer zu erklären ist, lässt sich wunderbar anhand der Website von w2media zeigen: Schauen Sie sich unsere Website in einem Responsive-Design-Simulator* an.

Auf den ersten Blick öffnet sich diese Seite einfach erneut, aber schauen Sie an den oberen Rand, dort finden Sie eine Reihe kleiner Buttons:

Gehen Sie mit der Mouse darüber und Sie erfahren, für welches Endgerät Sie nach Klick diese Seite betrachten können. Der vorletzte Button simuliert eine Drehung um 90° - dies funktioniert natürlich nur für die Simulation von Tablets und Smartphones.

Ihre Website umstellen auf Responsive Design?

Im Prinzip ja, die Website www.schloss-gelting.de ist ein gutes Beispiel hierfür: nur die Startseite dieser Website wurde von w2media im Design leicht verändert, alle weiteren Seiten wurden unverändert in Responsive Design überführt. Was in diesem Falle gut gelingen konnte, da das ursprüngliche Design und die ursprüngliche Programmierung ohne größeren Aufwand umgewandelt werden konnten. Schauen Sie selbst: www.klages-kollegen.de im Responsive-Design-Simulator*.

Wieweit dies auch für Ihre Website möglich ist, hängt vom Alter und der Programmierung Ihrer Website ab:
w2media checkt Ihre Website unverbindlich für Sie. Schicken Sie uns einfach Ihre Website-Adresse zu: websitecheck@w2media.de

* Der Responsive-Design-Simulator funktioniert leider nur unvoll­stän­dig im Microsoft Internet Explorer: Das betrifft aber nur die Simu­la­tion, das Responsive Design selbst klappt tadellos. Der Simul­ator stammt von groundword.css.