Was bedeutet eigentlich ...?
Interessante Fragen und Antworten im Webdesign-Glossar

Responsive Webdesign

Für eine gute Website ist ein Fluides Design seit Jahren eine Selbstverständlichkeit. Das Webdesign der Webseite passt sich der Größe des aufgezogenen Browserfensters an. Mit der zunehmenden Verwendung von Smartphones und Tablets reicht das aber nicht mehr aus.

Responsive Webdesign geht weiter und reagiert auf die Größe des Ausgabegerätes, des Smartphones, Tablets, Laptops oder Desktop-Computers.

Smartphones oder Tablets haben nicht nur teilweise wesentlich kleinere Bildschirme – sie haben Touchscreens. Herkömmliche Navigationselemente sind auf einem Touchscreen nur umständlich zu bedienen. Die Ansicht muss immer wieder verkleinert oder vergrößert werden um sich Stück für Stück die Seite zu erschließen.

Hier setzt Responsive Webdesign an: Je nach Darstellungsfähigkeit kommen zum Beispiel mehrere Stylesheets (CSS) zum Einsatz. Bei der Responsive Webdesign Variante Mobile First wird der Webdesigner das Weblayout zunächst so gestalten, dass es auf einem Smartphone im Hochformat (hochkant gehalten) bestmöglich benutzbar ist. Die Navigationselemente sind Buttons, relativ groß und untereinander angeordnet, und auf einem Touchscreen gut zu bedienen. Seitenleisten erscheinen erst am Ende unter dem eigentlichen Seiteninhalt, gefolgt von eventuellen Servicemenüs und dem Seitenfuß.

Wird das Smartphone nun gedreht und im Querformat gehalten, kommt ein anderes Stylesheet zum Tragen und die Navigation wechselt beispielsweise von Buttons zur normalen Textdarstellung.

Auf einem Tablet-Computer (Tablet Hochformat oder Tablet Querformat) wiederum können schon links oder rechts Seitenleisten eingeblendet werden.

Weitere Abstufungen sind zum Beispiel Laptop oder Desktop. Hier wird das größere Format ausgenutzt und die Seite erscheint in voller Schönheit.

Rufen Sie mich an unter 04532 991 94 40 oder schreiben Sie mir: webdesign@michael-rabe.de
Gern mache ich Ihnen ein interessantes Angebot für die professionelle Gestaltung Ihrer neuen Website.