Stichworte | Thomas Borghoff Web Engineering

Responsive Website

Responsiv gestaltete Websites passen sich dem Ausgabemedium an, sie »antworten«, sprich: reagieren auf unterschiedliche Bildschirmgrößen und sind in allen Bildschirmgrößen und Ausgabegeräten gut bedienbar.

Beispiele für responsive Techniken

Eigentlich ein alter Hut

Der Vorläufer der responsiven Seiten waren die fluiden Seiten. Dieser Ansatz startete in den 90er-Jahren mit dem Aufkommen immer größerer Bildschirme. Bis dahin entwickelte man Websites meist für fixe Breiten zwischen 800, später dann 1024 Pixel. Ganz ernsthaft. Die Website waren auch mehr digitale Drucksachen, jedes Element wurde pixelgenau platziert. Der ob des Entwicklers bestand vor allem darin, die unterschiedlichen Browser dazu zu bringen die Website gleich aussehen zu lassen.

Als dann die Bildschirme immer größer wurden, war dieses Konzept am Ende, die Inhalte sollten sich also ausbreiten. Dies nannte man eben fluides Verhalten, ein Verhalten, dass vor allem von Graphikern aufs Äußerste bekämpft wurde, da so natürlich keine genaue Positionierung von Inhalten mehr möglich war.

Und dann kamen die Smartphones

Zwar gab es auch schon früher diverse kleinere Geräte, aber erst mit dem iPhone im Jahr 2007 waren diese in der Lage Websites einigermaßen ordentlich anzuzeigen. Allerdings waren diese alle viel zu groß für den kleinen Bildschirm, so dass man »pinchen« also pfetzen oder kneifen musste, um die Inhalte so groß anzuzeigen, dass man sie lesen konnte.

Mit der zunehmenden Verbreitung des Smartphones war es dann praktisch unumgänglich auch für diese Geräte einfach bedien- und tatschbare Websites anzubieten. Manche Unternehmen entwickelten daraufhin spezielle Mobilversionen Ihrer Websites, oft mit nur eingeschränkten Inhalten. Ein anderer Weg war responsive Wesbites zu entwickeln, bei denen ein identischer Inhalte anders dargestellt wurde.

Mobile first als Entwicklungs- und Denkansatz

Nun war die große Frage, wie man eine bestehende Website schrumpfen konnte. Die Antwort lautet: praktisch nicht. Dies liegt vor allem daran, dass eine Website auf dem Smartphone mehr oder minder linear von oben nach unten funktioniert, während am Desktop, also dem Bildschirm auf dem Schreibtisch die Website zweidimensional und flächig aufgebaut ist und auch die horizontale Ordnungen ermöglicht.

Und da es wesentlich einfacher ist, lineare Ordnungen in zweidimensionale zu überführen als umgekehrt, ist ein wesentlicher Entwicklungsansatz mobile first. Dies hat auch nichts mit einer Fixierung auf Smartphones als bevorzugtes Gerät zu tun, sondern viel mehr mit der inneren technischen Struktur einer Website, von der Sie als Nutzer nichts mitbekommen, zumindest nicht, solange sie keine Unstimmigkeiten oder Stolpersteine enthält.