Skip to main content
F-LOG-GE

Responsive Webdesign ist die Zukunft

In seinem Artikel "Warum Responsive Webdesign Schrott ist" rechnet Patrick Voelcker mit dem seiner Meinung nach unberechtigten Trend oder Hype Responsive Webdesign (RWD) ab. Die Kenntnislosigkeit seiner Argumentation wurde in sehr vielen Kommentaren thematisiert. Ausserdem liess sich Marc Hinse zu einer sehr ausführlichen, manchmal polemischen Sezierung des Artikels hinreissen.

Die vielen Missverständnisse des Themas erfordern m.E. eine unaufgeregte Darstellung der Fakten, die ich im Folgenden vornehmen möchte.

Das Web selber ist responsive

Voelcker stellt zu Anfang seines Artikels zurecht fest, dass das Web an sich responsiv ist. Fügt man keine das Layout beschränkenden CSS-Regeln hinzu, passen sich Texte ihrer Umgebung an. Es ist ein Leichtes, auch Bilder und Videos responsiv zu bekommen.

Durch unsere Designentscheidungen beschränken wir diese natürliche Anpassungsfähigkeit von Webseiten. Wir müssen uns deshalb entscheiden, ob uns das interessiert oder nicht.

Unübersichtliche Device-Vielfalt

Eine Fahrt mit öffentlichen Verkehrsmitteln genügt, um zu verstehen, dass wir bei der Konzeption und Gestaltung von Webseiten heute nicht mehr von einem Festrechner mit 1024x768 Pixeln grossem Monitor ausgehen können. Smartphones haben sich stark verbreitet. Für viele ist die Nutzung ihres Smartphones natürlicher und wichtiger, als die ihres PC oder Notebooks. Kunststück: das Smartphone ist sehr transportabel und sehr persönlich.

Aber die meisten Webseiten-Layouts tragen diesen neuen Devices keine Rechnung und kommen mit der Grundannahme eines Festrechners. Und der Dialog zwischen Kunde und Agentur/Dienstleister passiert unter dieser Prämisse.

Aber diese Annahme ist falsch. Mittlerweile werden mehr Tablets als Notebooks verkauft, der Smartphone-Traffic hat gigantische Steigerungsraten und überflügelt auf mancher Seite schon den Traffic stationärer Rechner.

Selbsterkenntnis ist der erste Schritt

Ein RWD-Projekt wird deshalb nur dann erfolgreich sein, wenn es von der Selbsterkenntnis getrieben ist, dass unsere bisherige Arbeits- und Denkweise fehlerhaft ist und korrigiert werden muss.

Seit der kommerziellen Eroberung des Internet haben wir uns meist selber vorgemacht, wir könnten voraussehen, wie jemand unsere Webseiten konsumiert. Dabei haben wir das Web seiner inhärenten Flexibilität beraubt. Wir müssten nun lernen, loszulassen und die Flexibilität als die Stärke des Netzes zu begreifen. Alle müssen dies lernen: Entwickler, Designer, Kundenberater, Konzepter und Kunden. Doch offenbar ist dieser Kontrollverlust für viele Beteiligte ein Gräuel.

Wir sollten aus der rapiden Verbreitung von Smartphones und Tablet-PCs die Lehre ziehen, dass wir eben keine Planungssicherheit besitzen. Weissagungen über die Nutzung einer Seite haben schon in früheren Jahren nicht funktioniert, warum sollte es nun besser werden, wo die technische Landschaft viel komplexer und unübersichtlicher geworden ist?

Genau da setzt RWD an. Responsive Webdesign ist viel mehr, als die Anwendung einiger Techniken. Es ist die Erkenntnis, dass wir den grössten Nutzen aus der Flexibilität des Web ziehen können, indem wir nicht dagegen arbeiten.

Bullshit-Bingo

Ein immer wieder gehörter Vorwurf - Einwand kann man es nicht nennen - gegenüber RWD ist, dass es sich dabei um einen Modetrend, ein Buzzword handele. Tatsächlich wird es heiss und oft diskutiert. Unter Entwicklern und Designern wird dies mit grossem Ernst und auch mit Problembewusstsein gemacht. Was im Marketing, also einem themenfernen Bereich, daraus gemacht wird, ist eine andere Sache.

Die unglückliche Angewohnheit des Marketings, wichtige technische Fakten auf Worthülsen und Heilsversprechen zu reduzieren, kennen wir aber schon aus der Vergangenheit. Da betraf es “Multimedia”, “RIA”, “Apps”, “SaaS”, “Cloud Computing” und viele andere mehr.

Man sollte also nicht eventuelles Marketing-Gewäsch mit der Realität verwechseln. Das ist nie gut. Und die Marketingverantwortlichen sollten vermehrt ermutigt werden, sich über die Realität zu informieren, anstatt sie zurechtzubiegen.

Anpassung an die Umgebung

Responsive Webdesign (RWD) ist nicht “mobiles Webdesign” oder “Design für das iPad”. RWD möchte sicherstellen, dass eine Webseite sich an die jeweilige Umgebung anpassen kann. Das Ziel ist dabei eine bessere Bedienbarkeit für die Nutzer und über diesen Umweg eine bessere Akzeptanz der eigenen Site.

Denkt man genauer über diese einfache Definition nach, so kommen nach und nach Problemfelder in den Sinn, die es zweifelsohne gibt. Das beginnt bei der Auslieferung der passenden Bilder in den passenden Größen und Ausschnitten und endet bei der richtigen Usability. Es ist nicht einfach, jede x-beliebige Seite responsiv zu erstellen. Für manche Probleme gibt es heute auch noch keine vollkommen befriedigende Lösung. Unsere Techniken hängen den Anforderungen der Realität hinterher.

Mobile First? Content First!

Wenn man erst einmal begriffen hat, dass sich ein Layout nicht gleichförmig und gleich gut auf einem kleinen Smartphone wie auf einem grossen Notebook darstellen lässt, verschiebt sich der Fokus. Nicht die Hülle sollte als Erstes im Blick sein, sondern der Inhalt der Seite.

Dienstleister und Kunde sollten also als Erstes den Inhalt und eventuelle Interaktionen besprechen, planen und gewichten. So könnte man beispielsweise Inhalte als untauglich oder weniger wichtig für kleine Bildschirme definieren. Danach entscheidet man sich für eine Strategie, das Layout aufzubauen und den Content zu integrieren. Bei “mobile first” geht man vom kleinsten gemeinsamen Nenner, dem Smartphone, aus und fügt mittels AJAX neue Inhalte für größere Bildschirme hinzu. Gestaltet man erst für breite Bildschirme, muss man oft auch JavaScript nutzen, um Inhalte für kleine Bildschirme nicht zu laden.

Es gibt hierfür noch keine elegante und allgemein gebräuchliche Lösung. Jede Lösung hat einen anderen Nachteil. Passt man hingegen das Layout überhaupt nicht für kleine Bildschirme an, hat man den größten Nachteil überhaupt: die Nutzung der Webseite wird anstrengend durch ständiges pinchen und zoomen.

Responsive Werbung

Die Banner-Industrie hat ein Problem mit RWD. Das verwundert nicht, schliesslich wäre Kreativität und technische Exzellenz gefragt. Wer sich schonmal den Quellcode von Werbannern angeschaut hat weiss, dass es mit der technischen Exzellenz nicht weit her ist.

Mittlerweile gibt es zarte Ansätze, responsive Werbung zu erstellen und die Bezahlmodelle der veränderten Lage anzupassen. Was bringt es denn auch, wenn eine Seite im Smartphone auf fast mikroskopische Größe verkleinert wird, damit sie in den Browser passt und der Nutzer dann weder Inhalte noch Werbung erfassen kann? Damit ist niemandem geholfen.

Die werbetreibende Industrie darf sich nicht faul ausruhen, sondern muss sich den technischen Realitäten stellen und die passenden Antworten finden. Diesmal hoffentlich mit gutem Quellcode.

Performance

Gerne wird das Gespenst schlechter Performance von RWD-Gegnern an die Wand gemalt. Schliesslich benötigen wir mehr Styles und große Bilder würden einfach nur klein skaliert. Es ist eine Frage der Planung und Konzeption, ob diese Anwürfe zutreffen. Denn schliesslich gibt es durchaus mehrere Strategien, einem kleinen Bildschirm auch kleine Bilder auszuliefern. Diese sind optimalerweise nicht nur kleiner, sondern haben auch einen passenden Ausschnitt.

Mittels JavaScript kann man zudem entscheiden, welche JavaScript- und CSS-Dateien für welche Umgebung ausgeliefert werden. Aber auch eine leicht aufgeblähte CSS-Datei ist immernoch keine so große Perfomancebremse, wie ein paar nicht optimierte Bilder. Die sind aber die Regel.

Braucht jeder RWD?

Glaubt man dem Marketing, dann benötigt natürlich jeder eine responsive Webseite. Aber in Wahrheit sollte man eine genaue Abwägung vornehmen. Gerade jetzt, da wir am Anfang der Entwicklung stehen und die meisten Designer und Entwickler noch keine Ahnung vom Thema, geschweige denn Erfahrung haben, ist eine responsive Seite sicherlich mit höherem Aufwand und dadurch auch höheren Kosten verbunden. Aber die Übung wird auch hier den Meister machen.

Können Sie nachweisen, dass es nur minimalen Zugriff mobiler Endgeräte auf das fragliche Projekt gibt, kann eine responsive Gestaltung eine geringe Priorität bekommen. Wägen Sie immer Kosten und Nutzen ab. Ein Nutzen kann übrigens auch sein, dass die bessere Bedienung einer responsiven Seite mobile Nutzer erst anlockt.

Aber grundsätzlich können wir davon ausgehen, dass in naher Zukunft jedes kommerzielle Projekt mit einem hohen Prozentsatz mobiler Zugriffe konfrontiert ist. Möchte man die Nutzer dann nicht auf “pinchen” und “zoomen” verweisen, sollte man eine responsive Webseite entwickeln lassen.

Allein bei Seiten mit ausufernden Navigationen (bspw. Megamenüs) und sehr hohem Datenbestand mit hoher Detailtiefe (Shops wie Amazon) kann es sein, dass eine spezielle Aufbereitung in Form einer speziellen mobilen Webseite oder App (zur Freude des Marketings) angebracht ist. Aber das sind wenige Ausnahmen.

Quantifizierbarer Nutzen

Es gibt bislang wenig belastbares Zahlenmaterial zu responsiven Webseiten. Die von Herrn Voelcker zitierte Studie von Jakob Nielsen gehört definitiv nicht dazu, denn solche Seiten wurden darin nicht untersucht.

Luke Wroblewski führt einige Daten von e-commerce Seiten auf, die aufhorchen lassen. So stieg beim Shop von O’Neill die Konversionsrate von iOS-Geräten um 65,7%, von Android-Geräten sogar um 407,3%. Das ist kein Wunder, denn schliesslich stellt RWD sicher, dass man eine Seite auch auf kleine Displays vernünftig bedienen kann. Insbesondere beim Ausfüllen von Formularen ist dies wichtig. Wer auf solche Steigerungsraten verzichten möchte, kann sich natürlich die Investition in eine responsive Website sparen.

Fazit

Responsive Webdesign ist ein Ansatz, um die flexible Natur des Webs zur Geltung zu bringen. Ein fundamentales Umdenken und ein veränderter Workflow sind dafür wichtig. Natürlich kann ein jeder in der gewohnten Weise weiterarbeiten und die technischen Realitäten ignorieren, es wird nur keine positiven Ergebnisse erzeugen. Responsive Webdesign ist die Zukunft, daran ändern auch die Rückzugsgefechte Ewiggestriger nichts.

Dies ist ein Archiv meines alten Weblogs, das von Oktober 2006 bis Dezember 2022 als Wordpress-Instanz existierte.