Handbuch für Digital-Publishing

Adaptiv? Responsiv? Oder was?

Für den Nutzer einer WebSite/App/WebApp ist es unerheblich, ob die Seite responsiv oder adaptiv aufgebaut wurde. Für ihn stehen die Nutzbarkeit des Interfaces und die gute Darstellung des Inhalts im Vordergrund. Doch beide Begriffe werden immer wieder verwendet, also:

Adaptives Design

Adaptives Layout richtet sich nach den Endgeräten und den entsprechenden Aspect-Ratios der Screens. Im Vorfeld werden bestimmte Geräte definiert. Aus dieser Definition ergeben sich bestimmte Viewports oder Breakpoints, also Größendefinitionen, unterhalb oder oberhalb derer sich das entsprechend definierte Layout in ein neues, wiederum fest definiertes Layout ändert.
Beim adaptiven Web-Design kann das so weit gehen, dass die Abfrage, welches Datenpaket geliefert werden soll (also welches Endgerät verwendet wird, deshalb: großes/kleines Bild, Navigation da oder dort, breiter/schmaler Text), serverseitig passiert. Dadurch wird unter Umständen die Performance verbessert.

Pro:
  • Prima für die Designer, da mit festen Rastern gearbeitet werden kann.
  • feste, exakte Abmessungen. Wireframes und Mock-ups funktionieren gut
  • Layout und Inhalt müssen nur für die definierten Geräte optimiert werden
  • technisch relativ einfach umzusetzen
  • bessere Performance
Contra:
  • Es wird nur für bestimmte Endgeräte optimiert.
  • evtl. fehlerhafte Darstellung auf nicht definierten Geräten
  • aufwändige Analyse zur Bestimmung der relevanten Viewports/Breakpoints

 

Responsives Design

Responsives Layout richtet sich nach dem Inhalt und dem dafür zur Verfügung stehenden Raum – auf jedem verwendeten Display. Lediglich nach oben sind meistens Begrenzungen gesetzt, um z. B. zu vermeiden, dass der Text im Browser auf dem Desktop über die gesamte Breite läuft und damit unlesbar wird. Für den Designer bedeutet responsives Layout einen erheblichen Mehraufwand (und ein komplett anderes Denken) im Vergleich zum Pixel/mm-genauen Layout und auch zum adaptiven Design – schon einfach deshalb, weil in den gängigen Layout-Programmen die sich dauernd verändernden Varianten (gerne auch Fluid-Layout genannt) nicht dargestellt werden können. Wenn der Gestalter nicht selbst codet, muss er/sie also sehr früh und intensiv mit dem Entwickler zusammen (sic) arbeiten.

Pro:
  • Jedes Endgerät/jede Displaygröße wird entsprechend bespielt – auch zukünftige.
  • Der Fokus liegt auf dem Inhalt.
Contra:
  • sehr früher und häufiger Einsatz von Prototypen
  • sehr komplexe Gestaltung
  • aufwändige Technik
  • zeitintensiv in der Umsetzung

 

Die Agentur kulturbanause® hat den Unterschied hier sehr schön in einem Video dargestellt.

Tagged in:,
Über den Autor: 
Designer aus Leidenschaft, „Handwerker“ mit Hingabe.

0 Kommentare

Antworten