Responsive Design bezeichnet die technische und gestalterische Möglichkeit, mit der Webseiten-Layouts für alle Endgeräte des Nutzers (Computer, Tablet, Smartphone …) angepasst werden. Responsives Design findet im Webdesign und bei Applikationen für mobile Geräte Anwendung. Wo wird es verwendet und was ist Responsive Design genau?
Webinhalte können spätestens seit der Verbreitung von Smartphones, Tablets und internetfähigen Fernsehgeräten auf deutlich mehr Endgeräten als nur Computermonitoren dargestellt werden. Damit die Darstellung benutzerfreundlich und immer gut lesbar bleibt, gehört das responsive Design mittlerweile zum Einmaleins der Webdesigner.
Responsive Design im Detail
Die Screens, also die Bildschirme verschiedener Geräte besitzen alle eine unterschiedliche Größe Computer, Notebook, Tablet, Smartphone, Smart-TV … Und genau auf diese muss das Design einer Webseite jeweils optimiert werden.
Responsive, englisch für „reagierend(es)“, Design ermöglicht es, einzelne Elemente von Webinhalten auf verschiedene Gegebenheiten von Endgeräten reagieren zu lassen. Dazu gehören unter anderem:
- die Anordnung (Hochformat/Querformat)
- das Scrolling
- das Scaling
- die Navigation
- diverse Eingabemöglichkeiten über
- Maus
- Touchscreen
- Fernbedienung
Genannte Elemente werden durch das responsive Design automatisch für das entsprechende Anzeigeformat optimiert. So bleiben wichtige Elemente wie beispielsweise Schaltflächen, Buttons, Verweise etc. nutzerfreundlich groß und Bilder werden je nach Endgerät beispielsweise untereinander statt nebeneinander angeordnet.
Texte behalten ihre Schriftgröße bei und horizontales Scrollen wird vermieden. Bei Texteingaben mit virtueller Tastatur wird das Eingabefeld automatisch über der Tastatur angezeigt um den getippten Text nicht zu verdecken.
Warum du unbedingt ein responsives Design nutzen solltest
Würde eine Webseite rein statisch gestaltet werden, so müsste bei der Nutzung eines kleinen Smartphonedisplays entweder permanent gescrollt werden, da immer nur ein Ausschnitt der Originalgröße angezeigt werden könnte, oder aber Texte würden unleserlich klein dargestellt werden.
Gleiches gilt für Eingabeelemente. Liegen die Buttons zum bestätigen und zum abbrechen nah beieinander und würden ihre Größe schlicht herunterskaliert werden, so wäre eine exakte Bedienung per Toucheingabe auf dem Smartphone kaum möglich.
Daher bieten Responsive Websites deinen Nutzern immer das bestmögliche Besuchserlebnis deiner Onlinepräsenz und sorgen für Komfort und Wohlbefinden.
