AngelStone
Web

Responsive Design

Auch bekannt als: Mobile First · Adaptives Layout

Gestaltungsansatz, bei dem sich das Layout automatisch an die verfügbare Bildschirmbreite anpasst.

Responsive Design ist ein Gestaltungsansatz, bei dem sich das Layout einer Website automatisch an die verfügbare Bildschirmbreite anpasst, statt für jedes Gerät eine eigene Seite auszuliefern. Umgesetzt wird das mit flexiblen Rastern, skalierbaren Bildern und sogenannten Media Queries im CSS, die je nach Breite andere Gestaltungsregeln greifen lassen. Praktisch heißt das: Ein dreispaltiges Layout am Desktop wird am Smartphone zu einer Spalte, das Menü klappt zusammen, Schaltflächen werden groß genug für den Daumen.

Da der überwiegende Teil der Zugriffe heute mobil erfolgt, hat sich der Entwurfsweg umgekehrt; Mobile First bedeutet, zuerst die kleine Ansicht zu gestalten und sie nach oben zu erweitern. Auch Google bewertet Seiten primär in ihrer mobilen Fassung, weshalb eine am Handy unbrauchbare Seite unabhängig von ihrer Desktopqualität an Sichtbarkeit verliert.

Die häufigsten Fehler liegen weniger im Umbruch als im Detail: zu kleine Schrift, zu eng gesetzte Links, breite Tabellen und Bilder, die in voller Auflösung über Mobilfunk geladen werden. Barrierefreiheitsseitig zählt außerdem, dass Inhalte auch bei starker Vergrößerung ohne horizontales Scrollen nutzbar bleiben, was die harmonisierte Norm EN 301 549 in Umsetzung der Vorgaben zur Barrierefreiheit fordert.

Aus der Praxis

Begriffe sind das eine. Umsetzung das andere.

Wir übersetzen Technologie in Lösungen, die zu deinem Geschäft passen — aus Wien für den DACH-Raum.

Projekt besprechen