Themenvorschlag – Responsive Webdesign

Responsive Webdesign wird mit dem wachsenden Angebot an verschiedenen Endgeräten und Auflösungen immer wichtiger. Eine Website wird nicht mehr ausschließlich auf dem Heimbildschirm betrachtet – Smartphones und Tablets ergänzen inzwischen das Mediale Angebot in fast jedem Haushalt. Auch die Auflösungen der Devices verändern sich immer rascher. Webdesigner und Webentwickler können diese Entwicklung nicht ignorieren und müssen Wege finden, die Websites an nahezu jede Größe anzupassen. In diesem Zusammenhang hat sich Responsive Webdesign als guter und effektiver Ansatz herausgestellt.

Es existieren viele Blogs, Diskussionen und Artikel im Web die dieses Thema aufgreifen und erklären. Zudem gibt es verschiedenste Literatur, die dem Leser Responsive Webdesign näher bringen soll. Ein gemeinsames Problem ist, dass die Visualisierung des Sachverhaltes fast immer zu kurz kommt. Wir wollen deswegen das Thema Responsive Webdesign mit einer Interaktiven Infografik erklären.

Warum ist die „Interaktive Infografik“ hierfür besonders gut geeignet?

Eine Infografik dient dazu, Informationen zu liefern – vor allem jene, die dem Auge nicht zugänglich sind. Informationen müssen nicht zwangsläufig numerische Daten sein. Ähnlich wie in der Infografik zum Ballwurf (http://www.nytimes.com/interactive/2010/06/29/magazine/rivera-pitches.html?ref=marianorivera) bezwecken wir das Erklären eines Sachverhaltes: Was ist Responsive Webdesign? Wie funktioniert es? Was muss beachtet werden? Welche Ansätze gibt es? Wieso ist es gerade jetzt so wichtig?

Die Interaktive Infografik eignet sich hier besonders gut, weil Responsive Webdesign abstrakt, nicht greifbar also „unsichtbar“ ist.
Für Viele sind beispielsweise abstrakte Werte/Größen wie relative Größenangaben im Vergleich zu fixen Größen schwer vorstellbar ist. Wenn sie dies allerdings sehen und vor allem selbst testen können, wird es ihnen leichter fallen diesen Unterschied zu verstehen.
Auch mir fiel es beim Lesen teilweise schwer zu verstehen, wie sich gewisse Code-Anpassungen auf das Layout auswirken. Hier möchte ich beispielsweise die Media Queries und Breakpoints nennen. Wenn man über längere Textpassagen hinweg darüber informiert wird, welche Standart-Größen existieren und welche Breakpoints (und Media Queries) sich daraus für das Layout bzw. den Code ergeben, fällt es sehr schwer den Überblick zu behalten.

Eine interaktive Infografik kann hier helfen:

Anstatt dem Nutzer nur Codefetzen zu zeigen und textuell zu erklären, wie sich dieser Codeabschnitt auf das Aussehen auswirkt, könnte man mit einer Interaktive Infografik visualisieren was tatsächlich passiert. Der Nutzer könnte sich die Auswirkung auf verschiedenen Endgeräten simulieren lassen – selbst wenn er dabei am Rechner sitzt.

Advertisements
Getaggt mit , ,

Kommentar verfassen

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s

%d Bloggern gefällt das: