Was ist Responsive Webdesign?

Es ist immer mehr im kommen Websites responsive zu Erstellen. Responsive Webdesign bedeutet, dass sich alle Inhalte der Seite reaktiv zur Displaygröße verhalten. Sprich, wird die Seite auf einem mobilen Gerät dargestellt, oder das Browserfenster in der Breite verkleinert, passen sich alle Inhalte dementsprechend an. Inhalte umbrechen anders und werden auch zum Teil in der Größe anders dargestellt.

Üblich ist auch, dass die Standard-Navigation für Mobilgeräte komplett ausgeblendet wird. Stattdessen gibt es eine Navigation die speziell für das Webdesign auf Mobilgeräten optimiert ist. Da der Platz eines Smartphone-Displays begrenzt ist, wird die Navigation erst dargestellt wenn der Navi-Button geklickt wurde. Dieser befindet sich üblicherweise oben rechts oder links in der Ecke und besteht meist aus drei horizontalen Balken. Wird der Button betätigt öffnet sich die komplette Navigation, aufgelistet in einem Togglemenü.

Es gibt einige Möglichkeiten der technischen Umsetzung. Die unterschiedlichen Darstellungen lassen sich auf verschiedene Arten umsetzen. Eine prozentuale Berechnung der verschiedenen Objekten ist mit CSS und JavaScript möglich. Eine weitere Möglichkeit ist der Einsatz von Boilerplates, wie z. B. Skeleton welches auf CSS Media Queries basiert. Weitere bekannte CSS Boilerplates sind „Bootstrap“, „Less Framework“ und „Foundation“.

Responsive Webdesign wird immer wichtiger da der Marktateil an Smartphones und Tablets weiterhin stark am steigen ist. Das Wachstum ist brachial: ca. 40 % der Deutschen nutzen bereits das mobile Web . 27 % waren es bereits im Jahr zuvor. Somit ist ein Umdenken bei der Umsetzung und Gestaltung von Websites dringend erforderlich.

Quellen: creativeconstruction , 23.06.2021, http://www.creativeconstruction.de/blog/websites-mobil-responsive-website-mobile-website-native-app-im-vergleich-infografik/