Be Responsive! – Web- und App-Design für mobile Endgeräte [Gastbeitrag]
Kommentare

Technologische Weiterentwicklungen beeinflussen das Nutzerverhalten und bringen einen neuen Trend ins Gespräch: Responsive Design. Doch was bedeutet Responsive Design eigentlich und wie kann es Corporate Design unterstützen?

Die neuesten Einflüsse aus der Mobiltelefon-Branche bringen frischen Wind in die Segel des Webdesigns. Bereits jeder dritte Deutsche geht per Smartphone oder Tablet ins Internet. Damit ist die Verbreitung dieser Geräte im Vergleich zum Jahresbeginn 2013 bereits um 26,6 Prozent gestiegen. Aktuelle Zukunftsprognosen deuten auf ein stetiges Wachstum der Benutzerzahlen dieser Devices in den nächsten Jahren hin. Dabei verlangt der mobile Zugriff auf das Web nach anspruchsvollem und vor allem benutzerfreundlichem Design auf allen Endgeräten.

Responsive Design – was ist das?

Wer über das Smartphone eine Webseite aufruft, stößt immer wieder auf das gleiche Problem: Die Webseite wird nicht an den verkleinerten Bildschirm angepasst, sodass alle Elemente entweder verkleinert dargestellt werden oder man nur einen Bruchteil der Webseite sieht. Dies macht eine schnelle Navigation für den User so gut wie unmöglich. Webseiten-Entwickler haben hierfür eine Lösung gefunden – Responsive Design.

Responsive Design bedeutet wörtlich übersetzt “anpassendes” Design. Sprich, das Design einer Webseite passt sich der Bildschirmgröße des Endgerätes an. Die Auflösungen für mobile Devices variieren von 320px eines Smartphones bis hin zu 1024px und mehr für Desktop-Endgeräte. Die unterschiedlichen Bildschirmgrößen verlangen eine ständige Anpassung des Designs an den Bildschirm. Um die höchstmögliche Benutzerfreundlichkeit für jede Auflösung zu gewährleisten, muss für jedes Endgerät ein entsprechendes Design entwickelt werden. Auch wenn diese spezielle Designform mit einem höheren Aufwand verbunden ist, macht sich diese Investition oft bezahlt. Responsive Design erhöht nämlich nicht nur die mobile Benutzerfreundlichkeit der Webangebote, sondern geht auch einen Schritt in die Zukunft des Internets.

Technische Anforderungen an Responsive Design

Responsive Design wird durch sogenannte Media Queries möglich gemacht. Mit HTML5 und den CSS Media Queries lassen sich die Werte programmieren, die die Anpassung des Webseiten Designs an alle Endgeräte ermöglichen. Smartphones und Tablets haben schließlich andere „Ansprüche“ als Desktop-Geräte. Nicht nur die Auflösung ist kleiner, der User kann zudem zwischen Hoch- und Querformat wechseln und bedient das Endgerät via Touchscreen.

Mit den Media Queris können alle benötigten Werte individuell festgelegt werden. Es lassen sich sowohl Höhe und Breite des Anzeigenbereiches, als auch die des Endgerätes festlegen sowie Einstellungen zum Hoch- und Querformat oder der Auflösung des Anzeigegeräts vornehmen. Die technischen Möglichkeiten des Responsive Designs befinden sich zur Zeit zwar noch in Entwicklung, doch sie versprechen bereits jetzt eine erleichterte Bedienung  mobiler Webseiten.

Warum brauchen wir Responsive Design? 

Der Hauptgrund für die Anwendung eines Responsive Designs liegt eindeutig in der Benutzerfreundlichkeit. User Experience Design, das sich mit der Gestaltung von Nutzungserlebnissen bei Geräten auseinandersetzt, beweist, dass der Nutzer großen Wert auf die Erscheinung einer Webseite auf dem von ihm verwendeten Endgerät legt. Browst der User gerade mit seinem iPad auf einer Webseite, will er diese so navigieren können, dass er innerhalb kürzester Zeit an die benötigten Informationen kommt. Eine schnelle Informationsbeschaffung kann bei der mobilen Internetnutzung entscheidend sein und begründet die kurze Verweildauer auf entsprechenden Webangeboten.

Auch Suchmaschinenoptimierung spielt beim Responsive Design eine große Rolle. Diese Design-Form ermöglicht es, alle Suchanfragen an ein Ziel weiterzuleiten und Inhalte somit besonders gut bei Suchmaschinen zu indexieren. Weiterhin konnte bereits beobachtet werden, dass responsiv gestaltete Webseiten sich auch positiv auf die Desktop-Variante auswirken, weil Google davon ausgehen kann, dass Unternehmen mit einer repsonsiven Variante in ihren Internetauftritt investieren und diesen besonders ernst nehmen.

Responsive Design hat auch Nachteile

Dass Responsive Design einen erhöhten Aufwand mit sich bringt, ist zwar ein Nachteil gegenüber Adaptive Design, sollte jedoch kein Hindernis darstellen. Das größte Problem mit Responsive Design liegt in der Darstellung der Inhalte, da mobile Endgeräte zum Teil nicht alle Features einer Desktop-Webseite wiedergeben können. Auch die Inhalte einer Webseite übersteigen meist die Kapazitäten mobiler Endgeräte, sodass für eine konsequente Umsetzung auch der Content reduziert werden müsste.  Nutzer bewerten Responsive Design vor allem dann besonders gut, wenn es ihnen genau die Informationen liefert, nach denen sie suchen. Eine Beschränkung auf das Wesentliche kann daher auch ein Vorteil sein. Übersichtlichkeit und Benutzerfreundlichkeit sollten bei einem Responsive Design daher immer im Vordergrund stehen. 

Essentielle Features einer Webseite, die nicht auf die mobile Variante übertragen werden können, sollten möglicherweise in Form einer App den Weg in die Mobilindustrie finden. Damit können auch aufwändige Funktionen programmiert und von den Nutzern direkt auf ein Smartphone oder Tablet geladen werden. Der vereinfachte Zugriff auf diese Programme ist vor allem für Features, wie Musik- oder Videostreaming, vorteilhaft. Kann aber auch einfach als Shortcut zu einem bestimmten Hauptdienst der Webseite dienen.

Auch im Bereich Suchmaschinenoptimierung birgt Responsive Design einige Fallen

Zukunft des Responsive Designs

Mobile Webseiten sind die Zukunft. Bereits heute übersteigt der Absatz mobiler Endgeräte den von Desktop-Computern – Tendenz steigend! Einmal auf Responsive Design umgestellt, kann dieses auch an kommende Generationen mobiler Endgeräte angepasst werden. So ermöglicht Responsive Design eine einheitliche Darstellung des Corporate Designs auf allen Endgeräten. Egal, ob mobile Webseiten oder Apps, die Verbindung zum Unternehmen sollte stets gewährleistet sein und bringt Vorteile in der Kundenbindung.

Beim Responsive Design sollte man speziell darauf achten, dass die Verhältnisse eingehalten werden und Benutzerfreundlichkeit tatsächlich gegeben ist. Entsprechende Tests von Endnutzern sind somit fast unvermeidbar, aber bringen langfristig viele Vorteile, denn Responsive Design ist langlebig und zeitsparend.

Der Weg zum perfekten Responsive Design

Wer nach einer effektiven Möglichkeit sucht, um die statische Webseite auf Responsive Design umzustellen, sollte sich einmal über Design per Crowdsourcing, wie zum Beispiel 99designs es anbietet, informieren. Hierbei hat man die Möglichkeit, mehrere Design-Vorschläge von vielen verschiedenen Designern zu erhalten, um sich für das Design zu entscheiden, das am meisten überzeugt. 

Auch für weitere Entwicklungsphasen des Responsive Designs findet man in der Crowdsourcing Community entsprechende Angebote: Vom Design über die Entwicklung bis hin zu professionellen Usability Tests können hier alle Leistungen kostengünstig in Anspruch genommen werden.

 

Aufmacherbild: Responsive Design ,Vector cartoon business Foto via Shutterstock / Urheberrecht: Pornwipa.P

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -