So machen Sie Ihre Website fit für Touchscreens

Website für Touchscreen optimieren
© goodluz - Fotolia.com

In den letzten Jahren haben Touchscreens große Verbreitung erlangt. Trotzdem findet man immer noch zahlreiche Websites, darunter sogar neu erstellte, die in Teilen nicht mit der Finger-Bedienung kompatibel sind. So wird der Besuch einer Website für Tablet- oder Smartphone-Benutzer nicht selten zu einem Spießroutenlauf.

Touchbedienung ist nicht neu

Dabei ist Touchbedienung nicht neu: bereits in den 1980er-Jahren gab es Lichtgriffel, die vom Prinzip her dem heutigen Stylus (Stift für die Toucheingabe) entsprechen. Mit MS-DOS-eigenen Hilfsmitteln (GWBASIC) konnten damals bereits Anwendungen geschrieben werden, die sich mit Stift bedienen ließen. Ende der 1990er-Jahre fanden PDAs (in erster Linie mit PalmOS und Windows CE) große Verbreitung. Mit diesen Geräten konnte man bereits im Internet surfen. Aufgrund der damals noch teuren Mobilfunktarife und eingeschränkten Bandbreiten war jedoch der PC das Mittel der Wahl.

Heute sieht das anders aus: Seit Einführung von Apples iPhones im Jahr 2007 ist der Markt für touchbasierte Smartphones rasant gewachsen. 2010 hat das iPad der Geräteklasse des „Tablet PCs“ zum Durchbruch verholfen – wenn auch in reduzierter Form. Günstige Tablets sind heute schon zu Preisen im unteren dreistelligen Bereich erhältlich. Und viele Besitzer verwenden sie gerne zum Surfen.

Worauf Sie achten sollten

Rufen Sie Ihre Website doch einmal über Ihr Smartphone oder Tablet auf. Tippen Sie sich durch und prüfen Sie, ob alle wichtigen Funktionen kompatibel sind.

Besonders häufig ist die Navigationsleiste von Problemen betroffen, insbesondere wenn Pulldown-Menüs auf JavaScript-Basis zum Einsatz kommen. Zeigt man mit der Maus auf ein Menü, so klappt es sich aus und man kann via Klick einen untergeordneten Menüpunkt auswählen. Doch entfällt beim Touchscreen das Zeigen. Man kann in der Regel nur tippen. Daher sollten Sie die Ausklappfunktion so gestalten, dass diese auch bei einem Klick auf das Menü ausgelöst wird.

Auf den meisten neueren touchbasierten Geräten kann durch Wischgesten in eine Seite reingezoomt werden. Oft sehen Grafiken dann verwaschen oder pixelig aus, weil sie nur in 1:1-Größe hinterlegt sind. Deshalb macht es Sinn, Grafiken in 2:1- oder sogar 4:1-Größe zu hinterlegen. Denken Sie nur an Retina-Displays und 4K-Monitore, bei denen eine Zoomstufe von 200 % quasi den Standard darstellt.

Auch sollten Sie Links und andere Schaltflächen nicht zu klein darstellen. Lassen Sie außerdem etwas Luft zwischen den einzelnen Elementen, damit Ihre Besucher beim Tippen nicht versehentlich ein falsches Element treffen.

Allgemein gilt…

…dass man oft mit wenigen Handgriffen eine Lösung erreichen kann, die sowohl Maus- als auch Touchscreen-Nutzern eine zufriedenstelle Bedienung erlaubt. Als Touchscreen-Nutzer wird man immer wieder auf nicht-kompatible Seiten geraten. Wenn sich Ihre Website davon abhebt, wird sie dem Nutzer in wohlwollender Erinnerung bleiben.

 

Jochen Moschko

 
Jochen Moschko
SEO & QS-Manager
Jochen Moschko arbeitet in den Bereichen Suchmaschinenoptimierung und Qualitätssicherung bei der FAIRRANK GmbH.