Komm zur dunklen Seite der Macht, wir verwenden Cookies! Alles zum Datenschutz findest du hier: Datenschutz.

Was ist responsive Webdesign?

Mit responsive Webdesign können Benutzeroberflächen von Online Applikationen und Webseiten dynamisch, barrierefrei, nachhaltig und geräteübergreifend angezeigt werden. Durch HTML5 und CSS3 Media Queries wird responsive Webdesign, also das einheitliche Anzeigen von Inhalten auf einer Webseite, überhaupt erst möglich. Das Layout einer Webseite wird so flexibel gestaltet, dass es auf einem Desktop-, Tablet- und Smartphone-Display gleichbleibende Benutzerfreundlichkeit bietet und der Inhalt automatisch den verschiedenen Auflösungen angepasst wird.

Welche Bedeutung hat responsive Webdesign?

Im übertragenden Sinne bedeutet “Responsive Webdesign”, dass das Layout auf die Spezifikationen des Anzeigegeräts reagiert und die Layoutstruktur, Textfluß, Bilder und Navigationselemente der Bildschirmauflösung anpasst.

Bei einer nicht responsive fähigen Webseite entsteht ein deutlich höherer Pflegeaufwand für redaktionelle Inhalte und Bildmaterial. Für Smartphone und Tablet Besucher muss eine separate Version der Webseite vorgehalten und gepflegt werden.

Mobiler Aspekt

Der steigende Marktanteil von Smartphones und Tablets, wie z.B. das iPhone, iPad oder Galaxy Tab erfordern das Umdenken bei der Gestaltung von Webseiten und online Applikationen. Früher wurde bis zu einer Bildschirmauflösung von 1000px optimiert, heute müssen viele verschiedene Auflösungen für eine Webseite in Betracht gezogen werden.

Standardauflösungen von Smartphones und Tablets:

Smartphones

320x480px, 640x940px, 640x1136px

Tablets

1024x768px, 2048x1536px, 1280x800

Warum Responsive Webdesign?

Für Unternehmen und Website-Betreiber stellt der Lösungsansatz “Responsive Webdesign” einen wesentlichen Faktor in der Online Strategie dar. Mit optimierten Webseiten können alle Nutzergruppen einheitlich bedient werden. Responsive Webdesign ist ein vielversprechender und kosteneffizienter Ansatz für Online Kommunikation.

Immer mehr Menschen nutzen das Internet über mobile Endgeräte im Gegensatz zu Desktop Geräten. Diese Entwicklung zwingt den Webseiten Betreiber auf die Bedürfnisse seiner Besucher und Zielgruppen einzugehen.

Mehr zum Thema Responsive Webdesign?

Nicht alle Inhalte sind für jedes Gerät zur Anzeige geeignet. Daher bietet es sich an, im Vorfeld bereits einen inhaltlichen Strukturplan zu erstellen der die Inhalte für verschiedene Auflösungen bestimmt.

Die Grundlage bildet die kleinste mobile Auflösung. Weiterhin ist wichtig zu wissen dass die mobilen Endgeräte meist nur über langsame Internetverbindungen verfügen. Daher sollten die Datenmengen möglichst klein gehalten werden, um ein schnelles Laden auf mobilen Endgeräten zu gewährleisten.

Um die reibungslose Funktionalität einer responsive optimierten Webseite sicherzustellen, muss sie ausgiebig getestet werden. Bei der großen Anzahl an mobilen Endgeräten werden die Testprozesse mit Emulatoren, Simulatoren und realen Endgeräten durchgeführt. Diese Projektphase ist, im Gegensatz zu konventionellen Webseiten für Desktop PCs, sehr Zeitaufwendig da jedes erdenkliche Scenario mit mobilen Geräten getestet werden muss.

Konventionelle Endgeräte

  • Apple iMac
  • Apple Macbook
  • Google Chromebook
  • Microsoft Windows PC
  • Linux PC

Mobile Endgeräte

  • Apple iPhone
  • Apple iPad
  • Samsung Galaxy Tab
  • Samsung Galaxy Smartphone
  • Google Nexus
  • Sony xperia
  • Blackberry Curve
  • usw.