Prepare to Rock

Responsive Design oder separate Mobilwebsite

Mittlerweile dürfte den meisten klar sein, dass mobile Web auf dem Vormarsch ist und es wichtig ist, Websites mobile accessible zu machen. Sobald man etwas in das Thema eintaucht, stellt man schnell fest, dass es grundsätzlich zwei Möglichkeiten dafür gibt: Eine separate Mobilewebsite (die z.B. unter der Subdomain m.mydomain.com liegt) oder eine Responsive Design Website (das Layout bzw. Design der Website passt sich an die Größe des Screens dynamisch an). Übrigens: dieser Blog ist responsive! Besucher, die dies auf einem Desktop oder Laptop lesen, können zum Test jetzt das Browserfenster kleiner und größer machen und sehen, wie sich das Layout verändert.

Vor kurzem gab es zu diesem Thema bei Google Developers Live eine Session mit Brad Frost - seines Zeichens Webdevelopment Pro und Spezialist für mobile Websites. Das Video ist diesem Blogpost angehängt (oder vielmehr übergestellt). Wem die knapp 70 Minuten jedoch zu lange sind (obwohl sie sehr kurzweilig sind), hier die wesentlichen Inhalte (Die Slides gibts übrigens auch auf Slideshare; um genau zu sein hier).

Auch wenn Responsive Design meist aufwendiger ist als eine separate Website hat sie vor allem zwei große Vorteile:

  • Durch dynamische Anpassung an Auflösungen werden automatisch mehr Devices bedient
  • Die URL von einzelnen Seiten ist die selbe, egal ob die Seite auf einem Tablet, Mobiltelefon oder Desktop aufgerufen wird

Angelehnt an die Maslow'sche Bedürfnispyramide stellt Frost außerdem eine "Hierachy of mobile needs" auf (siehe Grafik). Webdeveloper und -designer (die beim Responsive Design immer enger zusammenwachsen) sollen sich diese gut einprägen und sich immer erst dann um die nächst höhere Ebene Gedanken machen, wenn die darunter liegende bedient ist.

Anforderungen an responsive Design

  • Zugriff: Inhalte müssen mobil zugänglich gemacht werden. Das klingt zwar selbstverständlich, aber besonders, wenn die mobile Variante einer Website nicht sämtliche Inhalte der "normalen" Website abdeckt, können Querverlinkungen schnell ins Leere führen
  • Interaktion: Die wichtigste Form der Interaktion ist die Navigation. Bei Mobile Websites scheinen sich hier zwei Versionen heraus zu christallisieren: Akkordeonartige Menüs oder das von Facebook Mobile bekannte "Seitenmenü".
    Des weiteren sollte man für Scrolling darauf achten, immer nur einen Inhaltsblock anzuzeigen. Versucht man meherere unterschiedliche Inhalte auf eine Seite zu packen, muss der Besucher durch einen Block durchscrollen um zu den Inhalten zu kommen, den er eigentlich aufrufen wollte.
  • Performance: Eine Website sollte in 5 Sekunden aufgebaut sein. Das ist natürlich abhängig von der Geschwindigkeit des jeweiligen Netzwerks, als Faustregel wird deshalb eine maximale Seitengröße von 1MB empfohlen.
  • Optimierung: Frost empfielt eine "Mobile first" Strategie beim Webdesign. Also anstatt eine Desktop-Seite zu designen und dann zu versuchen, die Elemente in einer mobile Variante unterzubringen, soll man mit der mobilen Version beginnen und die andere Richtung wählen.

Let's Talk!

Schicken Sie uns direkt eine Nachricht oder kontaktieren Sie uns unter hallo@pulpmedia.at

Pulpmedia verpflichtet sich, Ihre Privatsphäre zu schützen und zu respektieren. Wir verwenden Ihre persönlichen Daten nur zur Verwaltung Ihres Kontos und zur Bereitstellung der von Ihnen angeforderten Produkte und Dienstleistungen.

Um Ihnen die gewünschten Inhalte bereitzustellen, müssen wir Ihre persönlichen Daten speichern und verarbeiten. Wenn Sie damit einverstanden sind, dass wir Ihre persönlichen Daten für diesen Zweck speichern, aktivieren Sie bitte das folgende Kontrollkästchen.

Sie können diese Benachrichtigungen jederzeit abbestellen. Weitere Informationen zum Abbestellen, zu unseren Datenschutzverfahren und dazu, wie wir Ihre Privatsphäre schützen und respektieren, finden Sie in unserer Datenschutzrichtlinie.

* Pflichtfelder

Related Posts.

30 Website-Tipps

Da bei der Umsetzung einer Website einiges falsch laufen kann, habe ich 30 nützlichen Tipps erstellt, die den Weg von Konzept zu Website erleichtern werden.

  • 31.10.2014

Let's Talk!

Schicken Sie uns direkt eine Nachricht oder kontaktieren Sie uns unter hallo@pulpmedia.at

Pulpmedia verpflichtet sich, Ihre Privatsphäre zu schützen und zu respektieren. Wir verwenden Ihre persönlichen Daten nur zur Verwaltung Ihres Kontos und zur Bereitstellung der von Ihnen angeforderten Produkte und Dienstleistungen.

Um Ihnen die gewünschten Inhalte bereitzustellen, müssen wir Ihre persönlichen Daten speichern und verarbeiten. Wenn Sie damit einverstanden sind, dass wir Ihre persönlichen Daten für diesen Zweck speichern, aktivieren Sie bitte das folgende Kontrollkästchen.

Sie können diese Benachrichtigungen jederzeit abbestellen. Weitere Informationen zum Abbestellen, zu unseren Datenschutzverfahren und dazu, wie wir Ihre Privatsphäre schützen und respektieren, finden Sie in unserer Datenschutzrichtlinie.

* Pflichtfelder