Responsive Webdesign

Beim Responsive Webdesign (im Deutschen auch responsives Webdesign genannt oder kurz RWD, englisch responsive ‚reagierend‘) handelt es sich um ein gestalterisches und technisches Paradigma zur Erstellung von Websites, so dass diese auf Eigenschaften des jeweils benutzten Endgeräts, vor allem Smartphones und Tabletcomputer, reagieren können.

Der grafische Aufbau einer „responsiven“ Website erfolgt anhand der Anforderungen des jeweiligen Gerätes, mit dem die Site betrachtet wird. Dies betrifft insbesondere die Anordnung und Darstellung einzelner Elemente, wie Navigationen, Seitenspalten und Texte, aber auch die Nutzung unterschiedlicher Eingabemethoden von Maus (klicken, überfahren) oder Touchscreen (tippen, wischen). Technische Basis hierfür sind die neueren Webstandards HTML5, CSS3 (hier insbesondere die Media Queries) und JavaScript. ¹

Desktop Computers, Laptops, and Tablets¶

Für Desktop-Rechner, Laptops, Notebooks und Tablets im Querformat wird das Haupt-Layout der Webseite beibehalten. Sobald z. B. ein Tablet-Nutzer jedoch seine Gerät in das Hochformat dreht, könnten gewisse Element (wie z. B. eine Seitenleiste) verschwinden oder untereinander dargestellt werden.

Die Inhalte werden je nach Ausgabemedium unterschiedlich angeordnet und angezeigt ²

Mobile Geräte / Smartphones¶

Wird die Webseite auf einem mobilen Gerät angezeigt, wird primär nur der Inhalt angezeigt. Die auf dem Desktop sichtbare obere Navigation und gegenwärtig eine Seitenleiste verschwinden. Dem Nutzer wird ein alternatives mobiles Menu angeboten, welches über das sogenannte "Hamburger"-Symbol (drei horizontale Striche) verfügbar ist.

Oft ignorieren jedoch Smartphone-Nutzer dieses Menu und navigieren eher über den Footer oder vorhandene Textlinks. Unter anderem ist auch deswegen eine sinnvolle Anzahl an Verlinkungen auf einer Seite wichtig.

---

Quellenangaben¶