Immer öfter hört man die Phrase „Mobile First“ oder es wird von „Responsive“ Webdesign gesprochen, wenn es um den Aufbau oder die Erstellung von Webseiten geht. Aber was bedeutet das eigentlich und wozu ist es gut?
Bedeutung
„Responsive“ Webdesign ist nichts anderes, als eine spezielle Programmierung, die dafür sorgt, dass Webseiten und dessen Eigenschaften in korrekter Darstellung auf jeglicher Art von Endgerät angezeigt werden.
Kurz gesagt – Das Layout der Webseite wird runtergebrochen und speziell angepasst, sobald das Display kleiner wird.
Das betrifft insbesondere die Anordnung und Darstellung einzelner Elemente, wie Navigation, Spalten, Ränder und Texte, aber auch Eingabemethoden wie Touchscreen, Maus und Tastatur.
Warum ist das wichtig?
Wenn man eine Webseite in einem Handybrowser aufruft, ist natürlich alles kleiner, das heißt, die textlichen Inhalte dürfen nicht zu groß sein, da das Lesen sonst sehr anstrengend ist.
Im Umkehrschluss: Die Webseite wird wieder verlassen und es wird nicht interagiert.
Außerdem verwendet man das Handy zum Surfen im Internet eher, wenn man unterwegs ist. Man hat also keine ruhige Umgebung, in welcher man sich auf das Ansehen der Webseite konzentrieren kann, sondern man ist vielleicht nur mit halber Aufmerksamkeit dabei.
Zudem ist die Bandbreite von mobilem Internet nicht immer ausreichend, um große Videos und Bilder oder Animationen zu laden.
Ist die Seite dann also zu voll, zu klein oder unnatürlich verschoben, geht das Interesse schnell verloren.
Mobile First
Die wohl wichtigste Entwicklung der letzten Jahre ist das Smartphone, das neue Übertragungstechniken wie LTE befördert und so den Zugang zum Internet von fast jedem erdenklichen Standort aus erlaubt. So hat die Digitalisierung dazu geführt, dass mittlerweile die meisten Menschen über ihr Smartphone ins Internet gehen und ihrer Nutzergewohnheiten verändert haben.
Funfact: Bis zu 70% der Webseitenaufrufe werden über das Mobiltelefon getätigt.
Auf Grund dieser neuen Priorisierung entstand das Motto „Mobile First“.
Es bedeutet so viel wie, dass man in der Webseitenerstellung mit dem Design auf kleinerer Bildschirmgröße beginnt und nicht mehr nur desktop-orientiert arbeitet.
Was genau muss angepasst werden?
Wichtig ist, dass der Content von Anfang an übersichtlich gegliedert ist, das heißt, dass der Text kurz und knapp aufgeführt ist, mit entsprechend angenehm zu lesender Schriftgröße und Farbe, damit stets alles lesbar bleibt, auch wenn man grade durch die Stadt bei Sonnenschein läuft.
Für Bilder, Buttons oder Slider jeglicher Art gilt, dass, selbst in kleinem Format, immer noch eine gute Auflösung bestehen sollte und, dass sich Fullwidth Elemente dementsprechend proportional mitverändern.
Oftmals werden auch sehr detailreiche Objekte simpler gestaltet, Hintergründe mit Motiven weggelassen und aufwendige Grafiken durch kleinere Icons ersetzt.
Durch sogenannte Breakpoints, die programmiert werden, weiß die Webseite, ab welcher Display-Breite sie herunterbrechen muss, damit, egal ob auf Smartphone, Tabletcomputer oder Fernseh-Monitor, die Website sinnvoll gestaltet ist.
Fazit
„Mobile First“ und „Responsive” Webdesign sind wahrhaftig ein Zeichen von Digitalisierung und Fortschritt. Es gibt mittlerweile fast keine Webseite mehr, die man nicht auch auf mobilen Endgeräten aufrufen und bedienen kann. Die Welt bewegt sich immer schneller und Webseitenbetreiber müssen mithalten.
Unsere Branche geht mit der Zeit und optimiert stets ihre Möglichkeiten, die User-Experience zu verbessern.