Responsive WebDesign für alle

2. Juli 2015 Diskutieren Sie mit 125 Ansichten

So sorgt Ihre Website für ein besseres Nutzererlebnis
Smartphones und Tablets sind aus dem Alltag nicht mehr wegzudenken. Websites, die nicht für diese Geräte optimiert wurden, werden dort oft als schlecht lesbare Miniatur der PC-Website dargestellt. Also werden die interessanten Bereiche mit dem „2-Finger-Trick“ vergrößert und der User arbeitet sich Stück für Stück durch die ganze Seite – jedenfalls solange er noch Lust dazu hat. Die wird ihm bestimmt bald vergehen, denn das ist genau das Gegenteil von „Usability“. Und dank der Suchmaschinen wird „Ihr“ Nutzer sicher bald eine bessere Website mit einem ähnlichen Angebot anklicken. Was können Sie dagegen tun? Das Zauberwort heißt „Responsive WebDesign“.

Responsive WebDesign: optimierter Webauftritt für ALLE Geräte
Heute gibt es kein mobiles oder stationäres Internet mehr, es ist DAS Internet. Um den Pflegeaufwand von Webpräsenzen so gering wie möglich zu halten, benötigt man also ein System, das an einer Stelle alle Daten beherbergt (den Webserver) und beim Aufruf durch ein Endgerät (PC, Smartphone, Tablet etc.) die Website jeweils angepasst darstellt, damit das bestmögliche Nutzererlebnis erzielt wird. Einfach gesagt reagiert das Design auf den Nutzer: Die Website sieht überall gut aus. Die Folge sind geringere Absprungraten und zufriedenere Kunden. Und Korrekturen müssen nur 1x an zentraler Stelle ausgeführt werden.

Modul 1: Layout
Bilder, Tabellen, Logos, Texte, Videos… Alles muss sich flexibel anpassen. Flexibilität ist die Grundvoraussetzung! Die Planungs- und Konzeptionsphase ist daher etwas aufwändiger, aber dafür ist die Pflege und Aktualisierung der Site in einem solchen Maß geringer, dass sich der Aufwand in jedem Fall lohnt. Für die Umsetzung werden für Seiten und deren Elemente prozentuale statt fest vorgegebener Pixelwerte verwendet, so reagiert die Website auf den User.

Modul 2: Schriftgrößen
Alle Texte, ob Headlines oder Fließtext müssen auf das Endgerät angepasst werden und auch auf Smartphones gut lesbar sein. Eine feste Schriftgröße ist demnach nicht geeignet. Hier wird mit prozentualen Werten gearbeitet, JavaScript Plugins skalieren dabei eigenständig die Größe von Headlines.

3. Modul: Bildgrößen
Hier wird es besonders knifflig: Bilder müssen entsprechend skaliert werden, sollen aber auf den hochauflösenden Displays gut aussehen und scharf dargestellt werden! Eine Zwickmühle: Werden sie auf dem PC mit großem Bildschirm und schneller Datenleitung ruckzuck geladen und gestochen scharf dargestellt, kann ein großes Bild zu langen Wartezeiten und hohem Datenverbrauch führen, wenn man mobil unterwegs ist. Dazu gibt es auch hier kleine JavaScript-Helferlein: Durch die Reaktion des Designs auf das benutzte Gerät wird die benötigte Grafik in der richtigen Größe geladen, damit die Bilder gut aussehen. So werden Ladezeit und Nerven des Nutzers geschont.

Fazit:
Die aktuellen Entwicklungen in der mobilen Internetnutzung verlangen nach einer mobile-fähigen Website, um auf Dauer konkurrenzfähig zu bleiben. Gemäß einer Prognose wird es in diesem Jahr ca. 56,3 Millionen mobile Internetnutzer in Deutschland geben. Grund genug, sich mit dem Gedanken an eine mobile Website auseinanderzusetzen. Responsive Webdesign ist definitiv der zukunftsweisende Trend, insbesondere wenn Sie ihre Seite allen mobilen Plattformen zugänglich machen wollen.
Mehr Infos: www.web-fuer-alle.de