Was ist überhaupt Responsive Webdesign?

Dieses Wort „responsive Webdesign“ (reagierendes Webdesign) ist aus dem heutigen Webdesign-Sprachgebrauch nicht mehr wegzudenken. So selbstverständlich es ist, so tückisch ist responsive Webdesign auch. Durch die Zunahme an sogenannten „mobile devices“ (zu deutsch mobile Endgeräte) wie zum Beispiel Tablets und Smartphones, stellen sich die Webdesigner einer neuen Herausforderung:

• Die Webseite muss auf allen dieser Endgeräte in der optimalen Darstellung erscheinen.
• Die User müssen von überall an die Inhalte Ihrer Webseite gelangen können.
• Die mobile Internetnutzung stellt mittlerweile einen hohen Stellenwert dar.

Waren es 2011 noch in etwa 13%, die Webseiten mobil besuchten, finden heute schon über 70% aller Sitzungen auf Webseiten mit mobilen Endgeräten statt. Ob und wie oft Ihre Webseite von mobilen Endgeräten besucht wird, lässt sich ganz einfach über Google Analytics herausfinden.

Media-Queries

Mittels HTML5 und CSS3 Media-Queries wird das Design auf die Standard Auflösungen prozentual angepasst und optimiert. Es werden im CSS-Code Breakpoints gesetzt die dem Content sagen, an welcher Stelle er umbrechen soll und den Bildern in welcher Größe sie dargestellt werden sollen. Diese Breakpoints verändern das Seitenlayout und sind dafür verantwortlich, dass beispielweise ein Kontaktformular, ab einer schmalen Auflösung, unter einen Textelement angeordnet wird.

Wenn die Seitenbreite kleiner wird, wird automatisch das passende Layout zugeordnet und angezeigt. Das gewährleistet so immer eine optimale Darstellung der Inhalte Ihrer Webseite. Ihre Webseite merkt so ganz genau, mit welcher Auflösung das Endgerät Ihre Webseite besucht und zeigt sich im optimalen graphischen Aufbau. Der Platz auf dem kleinen Bildschirm wird somit perfekt ausgenutzt.

Muss die Webseite wirklich im responsive Webdesign umgesetzt werden?

Zweimal ja! Zum einen nimmt die Zahl der Besucher, die über ein mobile Endgeräte Webseiten besuchen kontinuierlich zu, zum anderen ist es mittlerweile ein wichtiger Rankingfaktor der Suchmaschinen wie zum Beispiel Google und Bing. Eine Webseite, die responsive ist, wird somit beispielsweise innerhalb der organischen Suchergebnisse bei Google besser gerankt als eine statische Webseite.

"mobile Friendly"

Google vergibt sogar das Siegel „mobile Friendly“, wenn sich der Content dynamisch auf die jeweilige Bildauflösung anpasst und rankt die Seite innerhalb der mobilen Suchergebnisse entsprechend besser. Die Seite wird also gegenüber einem Mitbewerber, der keine Webseite im responsive Webdesign hat, weiter oben angezeigt. Des Weiteren könnte ein lästiges Vergrößern mittels swipen und wischen, die meisten User ganz schnell wieder von Ihrer Webseite verscheuchen. Und wer einmal weg ist, kommt so schnell nicht wieder.

Es gibt keine zweite Chance für den ersten Eindruck!

Ihre Webseite ist die Visitenkarte und das Aushängeschild Ihres Unternehmens und verantwortlich für den ersten Eindruck. Mit einer Webseite im responsive Webdesign, zeigen Sie Ihren Besuchern Ihre Webseite stets in der besten Auslösung. Responsive Webdesign gewinnt immer mehr an Wichtigkeit, da die Anzahl der internetfähigen Endgeräte einen stätigen Zuwachs erlebt.

Der Unterschied

Der Unterscheid zu einer statischen Webseite ist das dynamische Anordnen und optimieren von Bildern und Content auf den Webseite in der jeweiligen Bildauflösung, mit der man die Webseite besucht. Die Desktopansicht weicht also von der auf dem Tablet ab und diese wiederum von der auf dem Smartphone.

Texte und Bilder werden, je kleiner die Auflösung wird, nicht mehr nebeneinander, sondern untereinander angeordnet. Teilweise ist es auch üblich, Inhalte im Rahmen des responsive Webdesign auf dem mobilen Endgerät ganz und gar auszublenden, wenn sich beispielsweise Elemente nicht mehr lesen oder bedienen lassen würden.

Gute Usability (Benutzerfreundlichkeit)

Alternativ dazu kann man, um eine gute Usability (Benutzerfreundlichkeit) zu erreichen, Elemente auch speziell für die Anwendung auf mobilen Endgeräten konzeptionieren um somit die bestmögliche User Experience zu gewährleisten. Es ist sinnvoll, im Rahmen der Konzeptionierung, die Seiteninhalte zu priorisieren und diese in jedem Fall bei der Tablet-oder Smartphoneansicht darzustellen.

Je leichter und intuitiver die Bedienung Ihrer Webseite oder Ihrem Online-Shop auf egal welchem Endgerät ist, umso größer wir die Wahrscheinlichkeit, dass eine Conversion ausgelöst und ein Kauf getätigt wird. In einigen Fällen ist auch eine Trennung von Mobil und Desktopvariante möglich.

Erhöhter Pflegeaufwand

Dies erfordert jedoch einen erhöhten Pflegeaufwand, da somit zwei Webseiten entsprechend befüllt und gepflegt werden müssen. Kommt Content dazu oder ändert sich beispielsweise ein Angebot, müssen diese Änderungen auf beiden Seiten vorgenommen werden. Somit sind zwei Versionen deutlich kosten- und zeitintensiver. Ein weiterer Vorteil des responsive Webdesign ist, es gibt nur eine URL (Webadresse) unter der Ihre Seite von überall aus erreichbar ist. Das schafft Vertrauen und steigert den Wiedererkennungswert Ihrer Webseite.

Die Entwicklung einer Webseite im responsive Webdesign ist zwar mit einem höheren Zeitaufwand verbunden, da es zahlreiche Tests erfordert, der Kunde wird es Ihnen jedoch aufgrund der Benutzerfreundlichkeit danken. Sie haben eine Webseite, die nicht im responsive Webdesign programmiert ist? In vielen Fällen ist kein Relaunch nötig. Viele Projekte können angepasst werden. Sprechen Sie uns einfach an!

Ist Ihre Webseite responsive?

Wo würden Sie kaufen? In einem unübersichtlichen dunklen Laden oder in einem aufgeräumten Geschäft mit einem freundlichen Verkäufer? Wir sind die richtige Agentur, um Ihr Projekt zukunftsorientiert umzusetzen und Ihren Kunden Ihre beste (Web-) Seite zu präsentieren.