© prettyboy80/Shutterstock.com
Moderne Benutzeroberflächen im Web 2.0

Moderne Benutzeroberflächen im Web 2.0


Der Schrei nach anpassungsfähigen Layouts in Webanwendungen wird von Jahr zu Jahr lauter. Eine Webanwendung soll nunmehr nicht nur mit dem herkömmlichen PC oder Notebook aufgerufen werden können, sondern sich auch mit einem Smartphone oder Tablet ohne Einschränkungen bedienen lassen. Eine Darstellungstechnik, die genau diesen Kriterien gerecht wird, nennt man Responsive Design.

Resonsive … und zusätzlich mobil

Prinzipiell gilt die Regel, je mehr mobile Endgeräte am Markt an den Verbraucher gebracht werden, desto weiter steigt der Bedarf an Webanwendungen, die die Kriterien eines Responsive Designs erfüllen. Eine Anwendung, die sich mit dem Smartphone oder dem Tablet nicht barrierefrei bedienen lässt, wird von den Nutzern nicht akzeptiert und gemieden. Das war den Betreibern von Webanwendungen bis vor wenigen Jahren noch egal, heute kann es verheerende Auswirkungen auf das Geschäft haben, wenn man sein Angebot nicht direkt auch für mobile Endgeräte verfügbar macht.

Grundlage und Begriff

Bei Responsive Webdesign handelt es sich um eine technische Umsetzung eines anpassungsfähigen Weblayouts. Das bedeutet, dass das Layout automatisch an die Bedürfnisse des jeweiligen Geräts, mit dem die Webanwendung gestartet wurde, angepasst wird. Im Detail betrifft das die einzelnen Module einer Webanwendung, wie beispielsweise die Navigation, die Suche oder den Inhaltsbereich. Technisch möglich macht dies die Einführung von HTML5 und CSS3. Früher wurden mehrere Layouts für ein und dieselbe Webanwendung erstellt. So gab es ein Layout für den herkömmlichen PC und beispielsweise ein angepasstes Layout für ein Smartphone. Je nachdem, mit welchem Endgerät der Anwender die Seite öffnete, wurde das entsprechende Layout herangezogen. Heute werden in einem Layout möglichst viele Endgeräte berücksichtigt und deren Darstellungseigenheiten integriert.

Geräteabhängige Darstellungen

Eine Webanwendung, die beispielsweise auf einem herkömmlichen PC in drei Spalten aufgeteilt ist, wird beim Aufruf mit einem Smartphone lediglich in einer Spalte gerendert und enthält weniger Bereiche und Funktionen als auf dem PC. Somit passt sich die Webanwendung nicht nur an das Display des jeweiligen Geräts an, sondern auch an die zur Verfügung stehenden Ressourcen des jeweiligen Endgeräts. Da einem Smartphone deutlich weniger Rechenleistung und eine schmalere Bandbreite zur Verfügung stehen, ist hier die Funktionalität auf ein erforderliches Minimum begrenzt (Abb. 1 und 2).

bremus_responsive_1.tif_fmt1.jpgAbb. 1: Struktur einer An...

Neugierig geworden?

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang