Responsive Webdesign:
Smartphones, Tablets, PCs & Co

Übersetzt lautent der neue Terminus „reaktionsfähiges Webdesign” (kurz RWD) und wurde in einem Artikel bei alistapart.com erstmals verwendet. Dank der neuen CSS3 Media Queries und HTML5 ist es nun wesentlich leichter möglich, optimierte Screendesigns für verschiedene Viewportbreiten von Ausgabegeräten wie Desktop-PCs, Laptops, Smartphones und Tablets aber auch Fernseher anzubieten.

Quelle: newadventuresconf.com

 
Insbesondere stellt die Strukturierung der einzelnen Elemente wie z.B. Navigation und Texte unter Berücksichtigung der neuen Anforderungen unterschiedlicher Geräte und deren Eingabemöglichkeiten (wie Tastatur, Fingergesten/Touch, Sprache) eine neue Herausforderung an alle ambitionierten Designer dar. Das Kriterium für das angepasste Erscheinungsdbild ist in der Regel die Anzahl der Pixel, die der Browser in der Breite zur Verfügung hat.

Trend: Mobile First

Manche Designer gehen schon einen Schritt weiter und sehen einen neuen Ansatz darin, Internetauftritte aus der Sicht des kleinsten Endgeräts zu planen und mit der mobilen Variant einer Website zu beginnen. Der Gedanke scheint nicht verkehrt wenn man bedenkt, dass die Anzahl der Zugriffe via mobiler Endgeräte rasant ansteigt und laut verschiedener Statistiken irgendwann im Jahr 2013 diese die der Desktop Rechner überholt haben dürfte. Darüber hinaus gibt es immer mehr Nutzer, welche die mobile Version bevorzugen - wie dies zum Beispiel aktuell bei Facebook der Fall ist. Damit können Reichweite und Zielgruppe einer Website dramatisch erhöht werden.

Die Ausrichtung von Layouts auf verschiedene Ausgabegeräte hat erheblichen Einfluß auf den Gestaltungsprozess. Überladene Websites mit unübersichtlicher und auf pixelgenaue Darstellung ausgerichtete Designs sind ungleich schwerer für mobile Endgeräte aufzubereiten als jene, die grundsätzlich mit etwas mehr optischer Flexibiliät ausgestattet wurden. Designer müssen nun mehr als je zuvor jedes einzelne Element auf seine Daseinsbereichtigung prüfen und gegebenenfalls entfernen oder umstrukturieren. Ein gutes Beispiel dafür liefert die Website New-Adventures-Konferenz (siehe oben), die in diesem Jahr noch aufgeräumter und reduzierter daher kommt als im letzten, wodurch sie gleichzeitig flexibler für verschiedene Displaygrößen wird.

Fokus auf das Wesentliche

Noch mehr als in der Vergangenheit müssen Designer angebotene Elemente, Services und Informationen einer Website schnell zugänglich und verständlich präsentieren. Es gilt, klare Aussagen zu formulieren und Ladezeiten (und damit die Anzahl von Bildern) gering zu halten. Auf diese Weise macht man jeglichem unnötigen Schnickschnack relaitv rasch den Garaus. Das schlanke Design wirkt sich natürlich auch positiv auf die anschließend zu gestaltende Desktop-Variante aus, denn grundsätzlich ändert sich ja an der Bedeutung bestimmter Kernfunktionen und Informationen nichts. Vielmehr kann der Designer die Desktopvariante großzügiger auslegen - das Resultat ist eine schlankere Website, die nicht jeden zur Verfügung stehenden Platz beinhart ausnützt und dem Kunden trotzdem eine optimale Darstellung der gewünschten Inhalte gewährleistet.

Fazit: es wird noch enger für unprofessionelles Webdesign; Firmen müssen sich mehr denn je die Frage stellen, ob sich der Schritt zu Billig-Websites tatsächlich (noch) lohnt, oder ob der damit einher gehende Imageverlust bei relevanten User-Groups nicht in eine Sackgasse führt, aus der so mancher nur schwer wieder heraus findet.