September 2015 – Responsive Design: Eines für alle?

Screenshot der Website direktvermarkter-landkreis-loerrach.de

Responsive Design: Eines für alle?

Auf unserer Website ist immer wieder die Rede vom Responsive Design, vor allem im Zusammenhang mit Mobile Devices wie Smartphones oder Tablets.
In diesem Artikel wollen wir uns mit der Frage auseinandersetzen, was es damit eigentlich genau auf sich hat.

Responsive Webdesign ist eine Art Sammelbegriff, der die Gestaltung und Programmierung einer Website für eine möglichst optimale Darstellung auf verschiedensten Geräten und Bildschirmgrössen beschreibt.
Da es heutzutage neben reinen Desktop PCs mit verhältnismässig grossen Monitoren auch Laptops, Netbooks, Tablets und Smartphones gibt, welche allesamt unterschiedliche Anforderungen an die Darstellung und Bedienung einer Website stellen, muss dies beim Entstehungsprozess berücksichtigt werden.
Tatsächlich hat sich das Smartphone zwischen 2013 und 2015 in der Schweiz zum primären Gerät für das Surfen im Internet entwickelt, wie die Studie Net-Metrix-Base 2015-1 zeigt. Es ist also unumgänglich, sich mit dem Thema „Responsiveness“ auseinanderzusetzen.

Entwicklung der Gerätenutzung nach Typ zwischen 2013 und 2015

Bei der grafischen Gestaltung wird hier gerne auf sogenannte „Grids“ zurückgegriffen, welche der Website eine Art Spaltenraster verpassen, in welchem Inhaltselemente platziert werden können. Dies hilft Webdesignern, Inhaltselemente der Site so zu gestalten, dass sie immer Abmessungen aufweisen, die sich leicht neben- oder untereinander arrangieren lassen.
Dieses Rearrangieren der Inhaltselemente kommt dann ins Spiel, wenn eine Website, die auf einem 24″ Monitor gut aussehen soll, auch auf einem Smartphone mit 4″ Bildschirm schick und bedienbar bleiben muss. Werden die Inhaltselemente auf einem Desktop-Monitor z.B. in einer Dreierreihe nebeneinander dargestellt, so verschieben sich diese auf einem Smartphone dann untereinander, sodass der Nutzer nicht ständig nach links und rechts scrollen muss, um alle Inhalte zu sehen. Stattdessen bekommt er eine feste Breite und kann bequem einfach nur hoch und runter scrollen.

Weiterhin kommt natürlich nicht nur die Darstellung, sondern auch die Bedienbarkeit ins Spiel. Während an einem Desktop PC in aller Regel mit Maus und Tastatur gearbeitet wird, bedienen sich Smartphones der Touch-Steuerung. Diese Art der Bedienung muss natürlich berücksichtigt werden – so gibt es bei der Touchbedienung z.B. keinen Mouseover-Effekt wie mit der Maussteuerung.
Auch Bildergalerien oder Slider wollen per „Swipe“ bedient werden, anstatt per Klick auf einen Pfeil.
Die Umsetzung von responsiven Websites erfolgt oftmals mithilfe sogenannter Frameworks (wie z.B. Bootstrap), welche Gestaltungsvorlagen für verschiedene Elemente einer Website beinhalten und damit eine homogene Frontend-Präsentation ermöglichen.

Heutzutage ist es quasi unumgänglich bei der Konzipierung einer neuen Website die Mobile Nutzer zu berücksichtigen. Bei k-webs achten wir schon seit geraumer Zeit darauf, unsere Kunden darüber zu informieren. Wenn Sie eine veraltete Website haben und über einen Relaunch nachdenken, oder Sie einfach mehr Informationen zum Thema Responsive Webdesign brauchen, kommen Sie gerne auf uns zu!