Responsive vs. Adaptive Design

Jeder Onlineauftritt muss heutzutage unter der Berücksichtigung einer sehr fundamentalen Frage erstellt stellen: Wie stelle ich es an, dass mein Webauftritt auf verschiedenen mobilen Endgeräten optimal dargestellt wird? Die ansteigende Anzahl von verschiedenen mobilen Endgeräten (Smartphone, Tablet, Laptop, PC, Smartwatch usw.) erhöht einerseits die Möglichkeit des mobilen Zugriffs auf Ihren Inhalt extrem. Damit dieser Vorteil andererseits jedoch wirklich so positiv wie gewünscht ausfällt, ist es wichtig, dass der angezeigte Inhalt auch zum Screenlayout des einzelnen Endgeräts passt. Hierbei ist es ganz egal, welcher Inhalt dargestellt werden soll: Wollen Sie also z.B. Ihre Website auch mobil zugänglich machen oder geht es vielleicht um einen spannenden E-Learning Kurs, der zum Mobile Learning bereitgestellt werden soll? Hierbei ist anzumerken, dass in 2017 bereits 47% aller Firmen Mobile Learning auf mobilen Endgeräten in ihr offizielles Training integrieren.¹ Wichtige Gründe, wieso Mobile Learning ebenfalls eine gute Idee für Sie sein könnte, gibt es hier.

Jetzt aber zurück zum ursprünglichen „Problem“: In diesem Artikel möchten wir Ihnen den Unterschied zwischen „Responsive Design“ und „Adaptive Design“ erklären. Beide Designarten stellen Möglichkeiten dar, Ihren Online-Content mobilfreundlich zu veröffentlichen. Neben einer generellen Begriffserklärung, möchten wir Ihnen ebenfalls Pros und Cons für beide Techniken mitgeben, sodass Sie eine fundierte Entscheidung für Ihre individuelle Situation treffen können.²

Damit Ihr Mobildesign nicht aussieht, wie auf diesem Bild, müssen Sie sich entscheiden: „Responsive“ oder „Adaptive“ Design?³

„Responsive“ Design

Wie der Name bereits andeutet, handelt es sich bei diesem Design, um ein Webdesign, das auf die jeweiligen Screenbedingungen des einzelnen Endgeräts „antwortet“. Somit wird das Design auf eine bestimmte Art und Weise programmiert, die es erlaubt, dass ein und dasselbe Layout an verschiedene Bildschirmgrößen angepasst werden kann.⁴

Das responsive Mobildesign passt den Inhalt an die Screengröße des jeweiligen Gerätes an.

„Adaptive“ Design

Beim „Adaptive“ Design, werden einzelne Layouts an die Bedingungen der verschiedenen Endgeräte angepasst. Wenn also z.B. von fünf verschiedenen Endgerätarten ausgegangen wird, werden auch fünf verschiedene Layouts erstellt. Öffnen Sie nun Online-Content, wird der vorhandene Screen-Platz identifiziert und dann das passende Layout ausgewählt. Im „Responsive“ Design würde an dieser Stelle das generelle Layout an die jeweilige Größe angepasst werden.³

Beim adaptiven Design werden verschiedene Layouts für verschiedene Devices genutzt.