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 Widererkennungswert 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.
