Responsive Webdesign

Meine Zusammenfassung eines offenen Austausches am Tourismuscamp Eichstätt 2012 angeregt von Rainer Edlinger (Salzburger Land) und Armin Meurer. – Zumindest habe ich die Links genannter Beispiele und Informations-Quellen zusammengetragen. 😉

Wikipedia liefert nicht wirklich viel zum Begriff (aber dafür schon einmal einen guten Link mit Beispielen)

Eine gute Einführung in die Materie findet sich hier. Kurz gesagt, geht es um die dynamische Anpassung des Designs an die anzeigbare Breite im Browser. Im Gegensatz zu einer mobilen Version wird dabei aber nicht quasi ein 2. Portal erstellt, das gezielt angesteuert werden muss, sondern die Webseite reagiert sofort auf jede Änderung der darstellbaren Breite. Damit ist eine Anpassung nicht an Zielgeräte gebunden, sondern an die jeweilige Platz-Situation am Bildschirm des Nutzers.

Mögliche Probleme die angesprochen wurden:

  • Aufwand für das Vorladen der Bilder in allen nötigen Skalierungen
  • Nicht kompatibel mit Internet Explorer
  • Deutlich mehr Aufwand in der Konzeption
  • Mehr-Aufwand bei der Programmierung
  • Festlegung auf fixe Pixel-Breiten für den/die Wechsel
  • Mehraufwand in der Redaktion

Tipps: Ein kleines Test-Tool zur Ansicht einer Webseite in verschiedenen Auflösungen und weitere Beispiel-Seiten (www.eric-horster.de, www.macdonaldhotels.co.uk) zum austesten im Browser.

Wobei die Beispiel-Seiten immer nur einfache Bild- und Textanteile umfasst haben und sich die Runde schnell einig war, dass damit komplexere touristische Seiten (mit interaktiven Bereichen, Formularen etc.) nur schwer umsetzbar wären. Außerdem wurde eingeworfen, dass eine reine Skalierung nach Breite erst wieder nicht auf die speziellen Anforderungen an den Medienkonsum auf einem Tablet eingeht. Auf Dauer wird die Thematik der Anpassung der eigenen Website-Inhalte an verschieden Bildschirmgrößen und Gerätetypen (auch nach oben – Beispiel Smart TV) aber nach allgemeiner Meinung an Bedeutung zunehmen, was – auch bei gleichbleibend höherem Aufwand für die Umsetzung – zu einer höheren Priorität der Thematik führen wird. Geeignet scheint die Methodik jetzt auf jeden Fall schon für einfache Blog-Seiten, Microsites und Landing Pages bzw. wenn Standard-Themes verwendet werden können.

Update: Nach einem zufällig genau passenden Tipp von Eric Holster habe ich mich selbst nach einigem Umschauen und Ausprobieren für das responsive, mobile-first Theme (und sehr günstige!) Pohutukawa von Elmastudio entschieden. Die Standardlösung mit dem WordPress twentyeleven-Theme und WP-Touch (in der kostenlosen Version) war zwar schon sehr gut, aber mir dann doch nicht individuell genug! 😉

Update 2: Beinahe zu erwähnen vergessen hätte ich noch die neue Seite herz.steiermark.com zum 40-Jahr-Jubiläum von „Steiermark – das Grüne Herz Österreichs“! Dank Evelyn Götz von crosseye nicht nur einfach ein toll umgesetztes Projekt, sondern auch gleich mit responsivem Webdesign! 🙂

Update 3: Ein sehr schönes Beispiel für ein responsives Design ist das neue magazin.salzburgerland.com, wobei hier der Fokus scheinbar gezielt auf eine optimale Darstellung am iPad/Tablet gelegt wurde und dann am größeren/kleineren Bildschirm jeweils nur – durch ein dynamisches Spalten-Layout – der Artikelübersicht etwas mehr oder weniger Platz eingeräumt wird!

Update 4: Ein guter aktueller Artikel zum Thema findet sich inzwischen auch hier.


Beitrag veröffentlicht

in

,

von