Skip to main content

Adaptive Webdesign

Was bedeutet Adaptive Webdesign?

Der englische Begriff Adaptive Webdesign beschreibt eine Methode, mit der die Wiedergabe von Webseiten und Internetinhalten auf unterschiedliche Displaygrößen hin optimiert wird. Geprägt wurde der Terminus durch den Computerexperten Aaron Gustafson, der 2011 ein Buch mit dem Titel “Adaptive Web Design – Crafting Rich Experiences with Progressive Enhancement” veröffentlichte. Das englische Adjektiv “adaptive” bedeutet übersetzt in etwa “anpassungsfähig“. Design ist in diesem Fall als technisches Design zu verstehen und nicht als Layout. Verwechselt wird Adaptive Webdesign häufig mit Responsive Webdesign. Beide Herangehensweisen haben zwar das gleiche Ziel, nämlich bei der Darstellung von Webinhalten verschiedene Endgeräte mit ihren jeweiligen Bildschirmgrößen zu berücksichtigen. Die dahinter steckenden Techniken unterscheiden sich aber grundlegend.

Wie unterscheiden sich Adaptive und Responsive Webdesign?

Spätestens mit der weiten Verbreitung von Smartphones und Tablets nach 2007 stehen Internetanbieter vor der Frage, wie sie damit umgehen, dass ihre Webseiten nicht mehr nur auf gewöhnlichen Monitoren angezeigt werden sollen, sondern häufig auch mobil und beispielsweise im Hochformat abgerufen werden. Für normale Monitorgrößen optimierte Webinhalte wirken im kleinen Format auf Smartphones häufig unübersichtlich und sind unpraktisch zu bedienen. Seit etwa 2013 behelfen sich viele Online-Dienste deshalb mit Responsive Webdesign. Auf Basis von HTML 5 oder CSS3 sorgen Programmroutinen dafür, dass Webseiten auch als Mobile Content angeordnet werden können.

Adaptive Webdesign geht einen anderen Weg. Hier werden die an sich unverändert gelassen Webinhalte nicht automatisch an Displaygrößen angepasst. Vielmehr werden beim Adaptive Webdesign auf dem Server unterschiedliche Versionen einer Webseite vorgehalten und stets diejenige ausgeliefert, die dem durch den Browser gemeldeten Monitorformat am nächsten kommt. Meistens sind jeweils eine Version für Desktop, Tablet und Smartphone vorbereitet. Viele Anbieter orientieren sich dabei an iPhone und iPad, da bei Mobilgeräten, welche unter Android laufen, die Bildschirmgrößen stark variieren.

Vorteile von Adaptive Webdesign

Als das größte Plus von Adaptive Webdesign gilt, dass diese Methode im Bestfall zu einem optimalen Nutzungserlebnis bei der Darstellung von Webseiten führt. Da eben nicht wie beim Responsive Webdesign eine Webseite für alle Geräte gilt, können die Inhalte spezifisch angeordnet werden, beispielsweise Menüpunkte oder Eingabefelder. Ein weiterer Vorteil ist ein verringertes Datenvolumen, welches schneller Auslieferung der mobilen Webseiten garantiert. Ein Smartphone mit kleinem Bildschirm wird etwa nur ein kleine Foto-Datei zugeschickt. Den Desktop-Displays wird jedoch das hoch aufgelöste Foto ausgeliefert. Responsive Webdesign bedient sich immer bei den gleichen Dateien und verursacht so häufig mehr zu übertragende Daten als eigentlich notwendig.

Aus Sicht von Programmieren ist Adaptive Webdesign eine eine einfache Lösung der Entwicklung zu Mobile First. Es ist technisch gut umsetzbar, da mit starren Rastern gearbeitet wird. Dies führt gleichzeitig zu großer gestalterischer Freiheit, was sich je nach Zielgruppe sehr positiv auswirken kann. Im Endeffekt bedeutet Adaptive Webdesign zudem häufig Zeitersparnis bei der Entwicklung und damit niedrige Kosten.

Nachteile von Adaptive Webdesign

Aus den Vorteilen von Adaptive Webdesign leiten sich auch die Nachteile ab. Nur auf vorher definierten Displaygrößen werden Webseiten optimal dargestellt. Bei Formaten, die nicht den genau definierten Standards entsprechen, kommt es häufig zu Fehldarstellungen. Responsive Design reagiert bereits von sich aus automatisch auf jede Displaygröße und deckt damit schon jetzt künftige Mobilgeräte ab. Bei Adaptive Webdesign werden die Entwickler in Zukunft neue Webseiten programmieren und gestalten müssen, um auf immer hochauflösender Displays und neue Formate zu reagieren.

Adaptive Webdesign Beispiel

Beispiel für ein Adaptive Webdesign – Die Website passt sich nicht an das Mobilgerät an

Die Hybrid-Lösung RESS

Um die Vorteile von Adaptive und Responsive Webdesign zu bündeln, nutzt man zunehmend RESS. RESS steht für Responsive Webdesign with Server Side components. Hierbei wird zum einen das Layout einer Webseite meist per Responsive Webdesign ausgeliefert, aber es besteht auch gleichzeitig die Möglichkeit vonseiten des Servers, dabei Ausnahmen zu machen. Dies bezieht sich nicht nur auf Grafiken, Text, Fotos und ähnliche Gestaltungsmittel, sondern auch auf Bedienmittel wie Maus oder Touch. Interessant ist RESS deshalb auch für neue Bedienmöglichkeiten wie Sprachkommandos und neue Formate wie Augmented Reality.

Adaptive Webdesign in der Praxis

An die Stelle von Mobile First tritt bei vielen Internetdiensten bereits Mobile Only. Tatsächlich scheint es so, dass gerade Privatleute auf einen klassischen Desktop-Computer oder Laptop verzichten und sich für ihre Nutzung des Internets ganz auf Mobilgeräte verlassen. Google etwa trägt dem Trend bereits Rechnung mit seinem Programm für Accelerated Mobile Pages (AMP), das im Grunde eine spezielle Form von Adaptive Webdesign ist, da es sich um eine serverseitige Lösung handelt. In diesen Bereich fallen auch bestimmte Angebote von Facebook, etwa Instant Articles für Medienunternehmen. Aktuelle Studien zufolge haben schon mehr als 50 Prozent der größeren Internetdienste ihre Angebote für Mobilgeräte optimiert, überwiegend auf Basis von Responsive Webdesign. Eine genauere Analyse wird dadurch erschwert, dass durch RESS und andere Methoden viele Mischformen von Adaptive und Responsive Webdesign existieren.

Klar ist allerdings: Professionelles SEO muss sich an den Algorithmen von Google und Co. orientieren. Diese bevorzugen Inhalte, von denen dezidierte mobile Versionen vorhanden sind und die dadurch auch Nutzerzufriedendheit erzielen. Es gibt kaum einen stichhaltigen Grund, daran zu zweifeln, dass sich diese Entwicklung noch einmal in Richtung Desktop-Displays umkehrt. Unter dieser Prämisse ist Adaptive Webdesign eine vielversprechende Alternative zu Responsive Webdesign, welches oft nicht das hält, was es theoretisch verspricht.

Es empfiehlt sich, bei jedem Internet-Projekt genau zu prüfen, mit welcher Technik das jeweilige Vorhaben bestmöglich umzusetzen ist. Denn erst die Balance zwischen fehlerfreier Darstellung von Webinhalten bei einfacher Bedienbarkeit führt zum Erfolg. Adaptive Webdesign ist ein Weg dafür. Der Nutzer interessiert sich im Normalfall nicht für die Begrifflichkeit der Technik, sondern dafür, dass sie funktioniert. Hier hat Adaptive Webdesign deutliche Vorteile im Vergleich zu Responsive Webdesign, welches es – vereinfacht gesagt – allen Recht machen will und dabei schnell an seine Grenzen stößt.

Sie haben noch Fragen?

Kontaktieren Sie uns

Adaptive Webdesign
Beitrag bewerten