Beim adaptiven Design erkennt die Website den Gerätetyp des Nutzers und passt die verwendete Vorlage an den jeweiligen Bildschirm an. Der Vorteil ist, dass der Designer eine größere Kontrolle über die Elemente und das Erlebnis hat, wobei die Anpassung an jeden Gerätetyp zeitaufwändiger ist. Adaptive ist nützlich für die Nachrüstung einer bestehenden Website, um sie mobilfreundlicher zu machen. So können Sie die Kontrolle über das Design übernehmen und für bestimmte, mehrere Ansichtsfenster entwickeln.
Die Anzahl der Ansichtsfenster, für die Sie sich entscheiden, hängt ganz von Ihnen, Ihrem Unternehmen und Ihrem Gesamtbudget ab. Es bietet Ihnen jedoch ein gewisses Maß an Kontrolle (z. B. über Inhalt und Layout), das Sie mit responsivem Design nicht unbedingt haben werden.
Adaptives Webdesign ist weniger populär als ein responsiver Designansatz, kann aber für viele Websites von Vorteil sein. Bei adaptiven Websites werden mehrere feste Designs verwendet, die automatisch auf den entsprechenden Bildschirmen erscheinen. Eine Größenänderung des Browsers hat also keine Auswirkungen auf das Design selbst. Es wird ein Design für die sechs gängigsten Bildschirmbreiten erstellt, von großen Desktops bis hin zu mobilen Geräten.
Auf diese Weise kann der Designer das Design speziell auf die Bedürfnisse von Nutzern abstimmen, die eher ein mobiles Gerät als einen Laptop verwenden oder umgekehrt. Der Begriff "Responsive Design" ist in der Design-Community ein Modewort. Das Wort Responsive Design wurde erstmals in dem Buch Responsive Web Design von Ethan Marcotte geprägt. Bei einer responsiven Website wird der Inhalt auf der Grundlage des verfügbaren Browserplatzes angezeigt.
Responsive Designs reagieren auf die Veränderung der Browserbreite und passen die Platzierung der Elemente an den verfügbaren Platz an. Der Inhalt wird dynamisch verschoben, um sich optimal für das Browserfenster anzuordnen. Einfach ausgedrückt: Responsive ist fließend und passt sich an die Größe des Bildschirms an, unabhängig vom Zielgerät. Responsive verwendet CSS-Medienabfragen, um die Stile auf der Grundlage des Zielgeräts wie Anzeigetyp, Breite, Höhe usw. zu ändern.
