Responsive Design

Die Gestaltung und technische Umsetzung einer Website hat sich mit dem Einzug von Smartphones, Tablets und anderen mobilen Endgeräten stark verändert. Früher genügte ein einziges Design für den klassischen Desktop, um der Darstellung einer Website gerecht zu werden. Heute betrachten die Besucher*innen Websites mit diversen Displays von unterschiedlicher Grösse und Auflösung.

referenz-tharad.jpg

Gestaltung

Beim Responsive Design wird die Gestaltung auf die unterschiedlichen Displays konzipiert. Dabei wird die Anordnung und die Darstellung der einzelnen Elemente wie Logo, Menüs, Texte und Bilder auf das jeweilige Endgerät angepasst. Die Nutzung der Eingabemethoden werden dabei berücksichtigt; Maus – klicken und mouseover oder Touchscreen – tippen und wischen.

Breakpoints

Bis zu einer gewissen Breite des Browserfensters sind die Inhalte gut sichtbar; wird diese überschritten setzt man einen sogenannten Breakpoint. Dabei werden Elemente neu arrangiert und gestalterische Anpassungen vorgenommen. Eine Website kann mit mehreren solchen Breakpoints ausgestaltet sein - Besucher sehen somit immer eine optimierte Ansicht auf dem jeweils genutzten Endgerät.

Flexibilität im Design

Responsive Design erlaubt es z.B. Elemente, die ganz klar für einen Touchscreen entwickelt wurden, auch nur auf einem solchen anzuzeigen. Seitenfüllende Hintergrundbilder sind im Gegenzug für eine Darstellung auf einem Smartphone eher hinderlich und können somit ausgeblendet werden. 

Unsere Website ist übrigens auch responsive – verkleinere doch mal das Browserfenster und beobachte, was passiert. Und auch Google sieht im Responsive Design die Zukunft.

Hast du Fragen zum Responsive Design?
Wenn ja, kontaktiere uns!