Beispiele für Responsive Webdesign auf der Showcase-Seite mediaqueri.es (Mediaqueri.es 2014)
Das mobile Internet umfasst die beiden Bereiche Technik (d.h. mobile Übertragungstechnologien und Endgeräte) sowie die über diese Technologien abgewickelten Mobile Businesses, also die Gesamtheit der ortsflexiblen, datenbasierten und interaktiven Informations- und Kommunikationstechnologien (vgl. Proff 2012, S. 614f). Das browserbasierte Web stellt dabei lediglich einen kleinen Teilbereich dar und umfasst in erster Linie die Nutzung von Websites über ein hierfür vorgesehenes Programm – den Browser.
Eine Website besteht aus mehreren zusammenhängenden und oftmals durch Links verknüpften Dokumenten (Webseiten), die ihrerseits zumeist aus strukturiertem Text und Multimedia-Elementen bestehen (vgl. Jendryschik 2009, S. 25). Im Hinblick auf die Entwicklung mobiler Websites ist es wichtig, die Begriffe „Desktop-Website“, „Mobile Website“ und „Responsive Website“ zu differenzieren.
Desktop-Website
Mit dem Begriff Desktop-Website sind Internetauftritte gemeint, die für die Darstellung auf herkömmlichen Desktop-PCs optimiert sind. Diese werden in der Regel auf dem bzw. am Schreibtisch (Englisch: desktop) mit externen Monitoren genutzt. Da Desktop-PCs meist schwer transportabel und somit an einen Einsatzort gebunden sind, werden sie auch als stationäre PCs und Desktop-Websites analog hierzu als stationäre Websites bezeichnet (vgl. ITWissen 2012). Im Zusammenhang mit Desktop-Websites werden oftmals jedoch auch Laptops mit einbezogen, weshalb die Bezeichnung nicht eindeutig ist. Das Gegenstück zur Desktop-Website stellt die mobile Website dar (vgl. Lawson 2012b).
Separate mobile Website
An anderer Stelle wurde bereits die Relevanz mobiler Endgeräte für Websitebetreiber aufgezeigt. Die offensichtlichste Lösung um Nutzern anderer Geräteformate eine optimale Seitendarstellung zu bieten, stellt die Umsetzung einer separaten mobilen Seite dar. Im Englischen spricht man hierbei auch von dedicated mobile sites, also dedizierten mobilen Seiten. Normalerweise legt man eine Website für Anfragen von stationären PCs sowie eine Variante für mobile Endgeräte an. Oftmals wird die mobile Website als eine reduzierte Variante der stationären Website umgesetzt, d.h. sie enthält meist weniger Grafiken und Inhalte als die stationäre Seite. Es sei jedoch darauf hingewiesen, dass auch dedizierte mobile Websites mit gleichwertigen oder sogar umfangreicheren Inhalten denkbar sind (vgl. Maurice 2012a, S. 331; Trakken 2014).
Die japanische Firma NTT DoCoMo war im Jahr 1999 das erste Unternehmen, welches kommerziell Websites speziell für mobile Nutzer erstellte (vgl. Yañez, S. 269). Inzwischen – im Jahr 2014 – ist es vollkommen normal geworden, Nutzer auf eine gesonderte mobile Website (meistens erkennbar an der Subdomain „m.“) umzuleiten (vgl. Google Inc. 2012a). Umgekehrt werden Desktop-Nutzer, welche die mobile Variante ansteuern, i.d.R. auf die stationäre Website umgeleitet. Meistens gibt es zudem auf den verschiedenen Layouts Links, um manuell auf die jeweils andere Version zu wechseln (vgl. Maurice 2012a, S. 331). Zur Realisierung der automatisierten Erkennung und Weiterleitung der verschiedenen Geräte analysiert eine Website den sog. „User-Agent-String“, welcher bei jeder HTTP-Anfrage vom Browser mitgesendet wird.
Responsive Website
Als Alternative zur Erstellung mehrerer Websites für die verschiedenen Geräteformate hat sich das sog. Responsive Webdesign (RWD) etabliert. Unter Responsive Webdesign versteht man einen Ansatz, bei dem das Layout einer Webseite sich an äußere Gegebenheiten, d.h. insbesondere die Größe, Auflösung und das Format eines Displays anpasst. Übersetzen lässt sich der Begriff am besten mit der Bezeichnung reaktionsfähige Webseitengestaltung (vgl. Zillgens 2013, S. 7).
Bei der Begriffsfindung ließ sich der amerikanische Webdesigner Ethan Marcotte 2010 von der Architektur inspirieren. Dort verwendete man bereits seit geraumer Zeit die Bezeichnung Responsive Architecture für die Entwicklung von Gebäudeelementen, die in der Lage sind, auf äußere Einflüsse (Wind, Schnee, sich nähernde Personen, etc.) zu reagieren und ihre Form anzupassen (vgl. Zillgens 2013, S. 7–8).
Im Internet und in der Literatur wird oftmals zwischen den Begrifflichkeiten Responsive Webdesign (= reaktionsfähige Webseitengestaltung) und Adaptive Webdesign (= anpassungsfähige Webseitengestaltung) differenziert. Beiden Verfahren ist gemein, dass sich ihr jeweiliges Layout an bestimmten Umbruchpunkten abhängig von der Displaygröße verändert. Der Unterschied liegt gemäß einem Großteil der Quellen nun darin, dass Responsive Websites zusätzlich ein sog. flexibles Grid nutzen, während die für unterschiedliche Displaygrößen optimierten Layouts adaptiver Websites jeweils auf fixen Pixelangaben fußen. Ein Grid teilt eine Seite in regelmäßige vertikale (manchmal auch horizontale) Spalten, Zeilen und Abstände und sorgt für visuelle Konsistenz (vgl. Roberts 2008). Demnach wären responsive Layouts eine spezielle Form adaptiver Layouts. Flexible Grids reagieren stufenlos auf jede Änderung der Fensterbreite und verhalten sich daher geschmeidiger als fixe Raster, die sich nur an bestimmten Umbruchpunkten anpassen (vgl. Zillgens 2013, S. 14).
