Layouts - Responsiv, Adaptiv, Fixed

Es ist noch nicht lange her, da wurden Websites ausschließlich für das klassische Internet entwickelt, geeignet für die Ansicht mit großen Bildschirmen via PC oder Laptop. Mit der rasanten Verbreitung kleiner mobiler Endgeräte eröffnen sich für Unternehmen inzwischen jedoch ganz neue Möglichkeiten, aber auch Herausforderungen, mit ihren Kunden und Interessenten in Verbindung zu treten. 
Ob in der U-Bahn, auf dem Gehweg oder in Geschäften, überall ist die omnipräsente Nutzung der handlichen Smartphones und Tablets zu sehen. Mit Ihnen möchte sich der moderne Verbraucher schnell und übersichtlich Informationen beschaffen oder Käufe tätigen. 
Auf kleinen Endgeräten verliert jedoch jeder schnell die Lust, wegen "übergroßer" klassischer Internet-Seiten ständig auf dem Display hin und her wischen zu müssen, nur um das Wichtige vom Unwichtigen herausfiltern zu können oder zum gewünschten Menüpunkt zu kommen.
Die sogenannten "fixed layouts" der Websites für das klassische Internet, mit fester Pixel-Angabe und starrem Gestaltungslayout, sind das Grauen für jeden Smartphone-Nutzer. Eine solche Seite wird er vermutlich nicht nochmal besuchen.  

Smrtphones durchdringen unseren Alltag

Das Smartphone mutiert zum persönlichen Berater und Wegweiser. Telefonie ist mittlerweile nur eine der Möglichkeiten "Distanz" zu einem Gesprächspartner aufzuheben. Ob per Email, Chat, öffentliche oder halböffentliche Kommunikationskanäle, die Verbreitung persönlicher oder werblicher Botschaften, alles fokussiert sich in unseren Smartphones. Und das ist nur ein Anfang.
Grundvoraussetzung für diese Verschmelzung  ist die Berücksichtigung und Einhaltung von Richtlinien die eine einwandfreie Darstellung der Anwendungen gewährleisten.

Inhalte passen sich an

Adaptive oder responsive Designs schaffen da Abhilfe. Es muss nicht extra eine ‚kleine Ausgabe‘ der Website geschaffen werden. Stattdessen wird mit adaptiven oder responsiven Layouts der bisherigen Website der Schwerpunkt auf die Inhalte einer Seite gesetzt, unabhängig vom Ausgabegerät des Betrachters. 

Informationen werden nach Wichtigkeit und Relevanz dargestellt und für die Ausgabe auf kleineren Displays optimiert. Unwichtige Informationen wie übergroße Kopfgrafiken, Slider oder "Moodboards" werden entweder verkleinert dargestellt oder auch komplett ausgeblendet. Text-Layouts passen sich dem Ausgabegerät an, die Schriften bleiben dabei weiterhin lesbar. Der Betrachter erhält so die gewünschten Informationen in aufs Wesentliche reduzierter Form. 

FLIPS

Der Einzug unterschiedlichster Devices, Ausgabegeräte in unsere Haushalte und Büros erfordert eine strukturierte Reduktion auf das Wesentliche. Hierbei spielen Usability, Handhabung und Readability, Lesbarkeit eine wichtige Rolle.

Responsive Layout smartphone

Überall und jederzeit, Smartphone, Tablets, SmartTV, Notebooks und Desktop PC - der spontane Zugriff auf die digitalen Informationen eines Unternehmens und deren Leistungen, ist jederzeit möglich 

Smartphone Verkauf weltweit (ca. Millionen Einheiten)
2013 - 969 (212 1q 225 2q 241 3q 291 4q)
2012 - 687 (143 1q 152 2q 175 3q 217 4q)
2011 - 477
2010 - 284
2009 - 180
2008 -136
2007 - 120
2006 - 16,35
Responsiv oder Adaptiv - Gibt es da Unterschiede?

Während das adaptive Verfahren gezielt für einen oder mehrere bestimmte Viewports optimiert ist, zielt das responsive Verfahren auf die Nutzung des gesamten Viewports des Anzeigegerätes.
Ein weiterer Unterschied ist das zugrunde liegende Layout: Fixed oder Fluid.

Liegt der Schwerpunkt auf einem starren Gestaltungsraster, so empfiehlt sich die adaptive Umsetzung des Layouts. Mithilfe von "media queries" werden Layout Alternativen definiert, die jeweils die optimale Darstellung der Inhalte garantieren.
Das responsive Verfahren hingegen ist auf die optimale Ausnutzung der Displaygrösse ausgerichtet. Das Layout sollte in diesem Fall "variable" oder auch "fluide" Spalten berücksichtigen.

Begrifflichkeiten

Beide Herangehensweisen haben Ihre Berechtigung, genauso wie eine Verwendung beider Verfahren heutzutage üblich ist.
Die Nutzung zukünftiger Geräte kann mit dem responsiven Ansatz besser gelöst werden, wohingegen die exakte Umsetzung eines Layouts feste "Breakpoints" erfordert.

Neueste Projekte
ATR-ELEKTRONIK

B2B Shop in Magento

ENGELMANN-MESSEBAU

Engelmann in TYPO3 und Ken Burns

SPD BAD OLDESLOE

Bootstrap und TYPO3

WORD ROWING JUNIOR CHAMPIONSHIPS 2014

HOTELSTARS EU

Klassifizierte Hotels in Europa

DEHOGA HOTELSTERNE

Sterne klassifizierte Hotels in Deutschland