Responsive Webdesign

Responsive Webdesign

pluusdesign Werbeagentur aus Köln

Seit dem Jahr 2013 gehört der Begriff “Responsive Webdesign“ zu einem sehr stark gestiegenen Trend. Immer mehr Leute nutzen heute Smartphones oder andere mobile Geräte, mit denen auch sehr oft Webseiten besucht werden.

Responsive Webdesign, was ist das eigentlich?

Das “Responsive Webdesign“ ist eine Layoutstruktur, welche sich an die verschiedenen Auflösungen unserer Endgeräte anpasst. Es gewährleistet eine optimale Darstellung der Webseiteninhalte mit Hilfe von HTML und CSS3 Media-Queries. Bei den Endgeräten gibt es die unterschiedlichsten Auflösungen. Ein herkömmlicher Bildschirm eines Computers hat beispielsweise die Auflösungen 4:3, 19:9 oder 16:10. Mobile Geräte machen es in dem Punkt etwas schwerer. Diese können im Hoch- und Querformat betrachtet werden. Meist geht man jedoch von einem Hochformat mit 320 Pixel Breite aus. Aber letztendlich ist das durch das Kippen des Smartphones eher schwer zu bestimmen.

Vor dem “Responsive Webdesign“ war die Adaptive Website, auch “fixed Webseiten“ genannt, gängig, in der die Webseiten in dem Browser mit drei Spalten angezeigt werden. Sobald man dann diese Webseite auf einem Tablet öffnet, kann es passieren, dass einige Webseitenelemente aus dem Sichtbereich ausgeblendet werden. Es kann auch passieren, dass einige Elemente verzerrt dargestellt werden, u.a. auch Bilder.

Durch das “Responsive Webdesign“ hingegen kann bei einem Tablet Beispielsweise die Webseite auf zwei Spalten reduziert werden, genauso wie bei einem Smarphone auf eine Spalte. Dies ermöglicht eine leichtere Navigation und besser lesbare Inhalte.

Wir gehen mal was tiefer in die Materie!

Wir wissen jetzt, dass das “Responsive Webdesign“ die Webseite auf den Endgeräten flexibel werden lässt und sie angepasst wird. Aber wie funktioniert das eigentlich genau? Dies lässt sich anhand eines Beispiels erklären:

Das Layout einer Webseite besteht aus drei Spalten. Der Wert jeder einzelnen Spalte wird in Prozentanzahl Definiert, z.B. 30 % / 40 % / 30 %. Sobald der Bildschirm des Endgerätes zu klein für dieses Verhältnis ist, werden die einzelnen Spalten untereinander Dargestellt. Genauso können auch die Bilder und Seiteninhalte der Webseite flexibel mit eingebunden werden.

Standardauflösungen von Computer-Desktops, Smartphones und Tablets:

Smartphones: 320 px bis 480 px

Tablets: 768 px bis 1024 px

Computer-Desktop: 1024 px+

Welchen Vorteil ziehen wir aus responsive fähigen Webseiten?

Zunächst einmal garantiert „Responsive Webdesign“ eine benutzerfreundliche Darstellung der Inhalte auf allen möglichen Endgeräten und zwar aus einem Content Management System. Hier liegt auch der zweite große Vorteil. Die Inhalte der Webseite müssen nur in einem System redaktionell gepflegt werden. Die doppelte Pflege bei einer parallelen App für mobile Geräte entfällt also.

Referenzen unserer Agentur im “Responsive Webdesign“

WWW.ATS-TEXTILRECYCLING.DE

WWW.HELPINGHANDS-BILDUNG.DE

Zurück