Responsive Webdesign Beispiel
  • Autor:Bernd Moehle
  • Erstellt am:8. April 2017
  • Thema: Webentwicklung & Web-Design


Was ist eigentlich Response Design?

Responsive Design oder Responsive Web-Design bedeutet im Grunde nichts anderes, als dass sich Ihre Website dem aktuellen Aus- und Eingabegeräten (beispielsweise Smartphone mit Touchscreen, Tablet, TV, Notebook oder Desktop-PC mit Maus ) anpasst. Responsive heißt in diesem Fall in etwa "sich anpassend" oder "reagierend".

Diese Anpassung beim Laden geschieht über eine Reihe neuerer Techniken, wie HTML5 und insbesondere den sogenannten Media Queries in CSS. Das aufgerufene Dokument wird anhand verschiedener beim Laden abgefragter Faktoren wie der Displayauflösung, Größe oder Orientierung des Geräts entsprechend angezeigt und die Elemente einer Seite in ihrer Darstellung und Anordnung bei der Ausgabe angepasst. Hierdurch ist es nun nicht mehr erforderlich sich extra eine mobile Website einzurichten oder sogar etwa gesondert pflegen zu müssen.

Früher war leider nicht "alles besser"

Was sich eigentlich nur logisch anhört war in der Vergangenheit mit den seinerzeit gegebenen Techniken leider nicht immer einfach zu realisieren. So wurden früher, als überwiegend noch an Desktop-PCs gesurft wurde, z.B. häufig Tabellen verwendet - die selbstverständlich besser zur Ausgabe von Datensätzen genutzt werden sollten - um das Layout einer Seite beispielsweise mehrspaltig zu erstellen.

Durch die zunehmende Anzahl unterschiedlicher kleinerer Geräte hat sich die Lage glücklicherweise mittlerweile, wenn auch erst im Nachhinein, erheblich verbessert. Mit den modernen Techniken können nunmehr deutlich mehr Anwendungsfälle abgedeckt werden. So dass der Quellcode heutzutage auch dafür genutzt werden kann, wofür er einst vorgesehen wurde. Des weiteren sind viele neue Auszeichnungen und Möglichkeiten hinzugekommen, mit denen sich Inhalte deutlich gezielter und vor allem logischer strukturieren lassen.
Die gute Nachricht also ist: Die technischen Möglichkeiten gute und spezielle Inhalte optimal darzustellen sind besser als je zuvor und werden zudem stetig weiterentwickelt!

Vorteile von Responsive Design - Sie kennen das

Wenn Ihre Internetseite nicht schon automatisch beim Aufruf anpasst, müssen Ihre Besucher beispielsweise von Links nach Rechts scrollen um den den gesamten Text zu lesen, oder Texte und Grafiken mit zwei Fingern vergrößern, um den Inhalte erkennen zu können.

Beim Responsive Design werden die Inhalte, die einfach mehr nicht nebeneinander passen, schlicht anders angeordnet und beispielsweise untereinander angezeigt. Die Schriftgröße ist entsprechend vergrößert und zu große Grafiken können automatisch verkleinert werden. Inhalte die nicht besonders wichtig erscheinen, können auch einfach mal ausgeblendet und gar nicht erst mitgeladen werden, was natürlich nebenbei auch verfügbares Datenvolumen spart. Gerade auch für ältere Menschen, deren Anteil in der Gesamtbevölkerung ständig zunimmt, und eine schnelle Bedienung im Allgemeinen ist es ist sehr hilfreich, wenn der Inhalt nicht erst "manipuliert" werden muss, damit man ihn auch mit dem bloßen Auge entziffern kann.

Und sonst noch was?

Natürlich haben auch Google & Co., sowie alle anderen wichtigen Technik-Größen unserer Zeit erkannt, dass dies für den Benutzer und damit auch die allgemeine Akzeptanz der angebotenen Produkte große Vorteile bietet und setzen vermehrt darauf. So ist es durchaus - neben den vielen Vorteilen für den Nutzer selbst - auch zum "Gefundenwerden" in den Ergebnislisten der Suchmaschinen Ihrer Inhalte durchaus von Vorteil, wenn Ihre Seite "mobil" ist, schnell geladen wird und den besonders relevanten Inhalt für Benutzer schnell verfügbar macht.

Ganz nebenbei: Seiten, die nicht optimal zugänglich sind, werden in der Google-Suche seit einiger Zeit nicht mehr oder schlechter gelistet - was für die Erreichbarkeit, insbesondere in Deutschland, wo fast ausschließlich diese Suchmaschine verwendet wird - natürlich fatal ist.