Responsive Design par ex­cel­lence
Kommentare

Responsive Design zählt zwar immer noch zu den heißen Trends für 2014, dabei wenden bereits zahlreiche Webseiten diesen technischen Ansatz an, um auf die Anforderungen des benutzten Endgerätes zu reagieren und sich entsprechend gestalterisch aufzubauen. Diese Eigenschaft wird immer mehr zur Voraussetzung, denn die Größe und die Auflösung der Displays auf Laptops, PCs, Tablets oder Smartphones variiert erheblich.

Mit steigenden technischen Möglichkeiten und der Anzahl mobiler Endgeräte, schnellen auch die Erwartungen der Nutzer an die Usability der Seite in die Höhe. Zwar gibt es immer noch die Möglichkeit, spezielle Apps für die mobile Version der Webseite anzubieten, diese sind allerdings oft vereinfacht und können mit der ursprünglichen Desktop-Version nicht konkurrieren. Die Anwendung von Response Design löst geschickt dieses Problem.

Ein Beispiel exzellenter Umsetzung des „reaktionsfähigen“ Designs ist die von der Werbeagentur Saatchi & Saatchi Oslo gelaunchte Webseite www.provminhybrid.no. Diese erschien im November letzten Jahres begleitend zu der prämierten Toyota-Werbecampagne „Try my Hybrid“.  

Je nach genutztem Gerät ordnen sich die einzelnen Elemente der Webseite neu, sodass der Aufbau immer übersichtlich und benutzerfreundlich bleibt. Dabei wird der Look der Seite beibehalten. Wird das Display kleiner, wechseln die losen Content-Kacheln einfach ihre Position und stellen sich automatisch so auf, dass keine Information verloren geht, und immer noch ein einheitliches Bild entsteht. Auch andere graphische Elemente reagieren auf die Anforderungen der verfügbaren sichtbaren Fläche des Endgerätes, dem sogenannten Viewport. Eine nach rechts geschwungene Linie, die durch das Bild verläuft und mit verschiedenen integrierten Icons die Inhalte der Seite visualisiert, verändert je nach Anforderungen ihre Ausrichtung. So werden keine Teile abgeschnitten und das gesamte Bild kann erhalten bleiben.

Die Seite besteht aus zwei Ebenen, die sich überlappen. Die vordere, teilweise transparente Ebene ist für die Inhalte vorgesehen, die hintere zeigt ein Hintergrundbild. Auch dieses ist responsive und schrumpft beziehungsweise vergrößert sich je nach Bildschirmgröße.

Responsive Design Surftip

Screenshot: www.provminhybrid.no

Wenn Ihr Lust auf aktuelle Informationen zu Responsive Design erfahren wollt, haben wir einen Konferenz-Tipp für Euch: die MobileTech Conference 2014, die vom 17. bis zum 20. März 2014 in München stattfindet.

Mit ihrem plattformübergreifenden Konzept gehört die MobileTech Conference zu den wichtigsten Treffpunkten der Mobile-Branche im deutschsprachigen Raum.

Bei Anmeldung bis Donnerstag, den 23. Januar, gibt es ein Gratis-Tablet plus 100 Euro Frühbucher-Rabatt. 

MobileTech Conference 2014

© Software & Support Media

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -