Responsive Webdesign – 5 Tipps, die für Klarheit auf dem Smartphone sorgen

Im Gegensatz zu einer WebApp, die eine eigene, auf mobile Endgeräte zugeschnittene Version einer Webseite beschreibt, steht „Responsive Webdesign“ für das anpassungsfähige Layout einer Webseite. Die Webseite passt sich automatisch an die Gegebenheiten des mobilen oder nicht mobilen Endgerätes eines jeden Nutzers an. Ob Tablet, Smartphone oder PC: Die unterschiedlichen Größen der Displays und die grundverschiedene Handhabung der Geräte verlangen Flexibilität. Die folgenden Punkte verraten Ihnen die Möglichkeiten, die Responsive Webdesign dem Besucher Ihrer Webseite bietet und welche Voraussetzungen erforderlich sind, falls Sie sich für Responsive Webdesign entscheiden.

1. Prioritäten setzen

Auf einem Smartphone oder Tablet können nicht alle Informationen so detailgetreu wiedergegeben werden, wie auf einer Webseite. Die Fülle an Informationen ist auf dem wesentlich kleineren Display überfordernd. Die Frage „Was ist wirklich wichtig?“ bietet hier einen guten Anhaltspunkt.

2. Für mobile Endgeräte optimieren

Bei der üblichen Aufteilung in Spalten kann es je nach Größe des Endgerätes dazu kommen, dass Inhalte weit nach unten verschoben werden. Es ist daher wichtig, dass die Inhalte der Webseite so übersichtlich sind, dass der Nutzer nicht zu viel scrollen muss. Responsive Webdesign sorgt dafür, dass sich Inhalte, wie Texte, Grafiken und Tabellen oder Strukturelemente, wie die Seitennavigation, an die verschiedenen Auflösungen anpassen.

3. Benutzerfreundlichkeit!

Die einfache Bedienbarkeit einer Seite auf dem Smartphone sollte in jedem Fall beachtet werden. Zu kleine, oder zu viele Buttons erschweren dem Verbraucher die Nutzung. Responsive Webdesign ermöglicht dem Nutzer einen übersichtlichen, dynamischen Zugang zu Ihren Inhalten.

4. Die verschiedenen Auflösungen beachten!

Die unterschiedlichen Auflösungen von Grafiken auf Desktop PCs, Tablets, oder Smartphones müssen im Responsive Webdesign unbedingt beachtet werden, um eine benutzerfreundliche Darstellung zu gewährleisten. Gerade bei Innovationen wie dem Retina-Display fällt eine Nichtbeachtung der Auflösung stark auf.

5. Media Queries

Mit so genannten Media Queries lassen sich verschiedene Versionen einer Webseite programmieren. Dabei orientieren sich die Webseiten an der vorgegebenen Breite der Endgeräte. Die Inhalte passen sich so automatisch an die benötigte Breite an. Das trifft auch zu, wenn ein Tablet beispielsweise im Hoch- oder Querformat gehalten wird. Zusätzlich werden die Inhalte an die Funktionalitäten des Mediums angepasst. Es wird erkannt, ob es sich beispielsweise um ein Touchpad handelt, oder um einen Maus-navigierten PC.

Responsive Webdesign oder WebApp? Was für Sie die passende Lösung ist…

Für die Erstellung einer Webseite, die auch auf mobilen Endgeräten optimal nutzbar sein soll, steht eine Frage im Raum: WebApp oder Responsive Webdesign? Die Beantwortung ist relativ simpel. Responsive Webdesign lohnt sich für all diejenigen Webseiten, die sich erst in der Planung befinden und deren Inhalte eine gewisse Länge nicht überschreiten werden. Die Benutzerfreundlichkeit, oder Usability, wird somit aufrecht erhalten. Im Bezug auf suchmaschinenoptimierte Webseiten ist zudem ein absoluter Vorteil, dass die Internetadresse bei der Verwendung von Responsive Webdesign die gleiche sein wird, egal von welchem Gerät aus man die Webseite besucht. Eine WebApp lohnt sich vor allem für die Nutzer, die bereits eine Webseite haben, da für Responsive Webdesign auch die bereits bestehende Seite neu programmiert werden müsste. Zusätzlich spricht für eine WebApp, dass lange Inhalte der einzelnen Unterseiten übersichtlich dargestellt werden können, ohne den Nutzer lange Scrollen lassen zu müssen.

Wie auch immer Sie sich entscheiden. Unsere Media Company berät Sie gerne bei der für Sie passenden Lösung.

Thumbnail Image: Mockups going for HTML von Martin Dubé via CC BY-SA 2.0.