1 1

In Windeseile lösen Smartphones und Tablet-Computer derzeit den PC als das wichtigste Internet-Zugangsgerät ab. Braucht jetzt jedes Unternehmen eine „mobile Website“?

Plötzlich werden Websites nicht mehr nur per Tastatur und Maus, son-dern auch durch die Berührung mit den Fingern gesteuert. Wo gestern noch der große Monitor als Anzeigegerät gesetzt galt, müssen heute auch handtellergroße Displays zur Anzeige ausreichen. Smartphones und Tablets – die Apple-Geräte iPhone und iPad seien hier nur stell-vertretend genannt – sind aus dem Alltag nicht mehr wegzudenken.

Die Konsequenz daraus: Immer häufiger erwarten Kunden, dass Unternehmenswebsites auch auf ihren Mobilgeräten funktionieren. Unternehmen, die diesen Trend rasch aufgreifen, verschaffen sich einen Wettbewerbsvorteil und Erfahrungsvorsprung. In der Praxis bedeutet

Mobiles Webdesign

UNDER CONSTRUCTION

Mobiles WebdesignWebsites für Tablets und Smartphones

2 3

das aber viel mehr als ein paar technische Änderungen. Kleine Displays, instabile Internetverbindungen und tendenziell abgelenkte Nutzer er-fordern komprimierte Informationen, minimale Ladezeiten und ein klares Webdesign. Spannenderweise sind das dieselben Kriterien, nach denen Nutzer seit über fünfzehn Jahren die Qualität von Websites beurteilen, nämlich

> “Habe ich das Gesuchte gefunden?”

> “Lädt die Website schnell?”

> “Ist die Website übersichtlich?”

Der Rückschluss lautet: Wenn Unternehmen bei der Konzeption ihrer Website für mobile Nutzer planen, dann konzentrieren sie sich automa-tisch auf die Aspekte, die für alle Nutzer höchste Bedeutung haben. Das zeigen auch die beiden folgenden Beispiele.

Abspecken ohne Verzicht

In Zeiten allgegenwärtiger DSL-Anschlüsse ist fast in Vergessenheit gera-ten, dass die Ladezeit einer Website über ihren Erfolg mitentscheidet. So rechnet der Onlinehändler Amazon für jede zusätzliche Zehntelsekunde Ladezeit mit dem Verlust von einem Prozent Umsatz. Bei Smartphones und Tablet-Computern haben nicht nur die Verbindungsgeschwindigkeit und die maximale Zahl gleichzeitiger Verbindungen Einfluss auf die Ladezeit.

Viele Geräte sind hinsichtlich ihrer Rechenkraft so schwachbrüstig auf-gestellt, dass sich der Aufbau komplexer Websites merklich verlangsamt.

Unternehmen, die hinreichend viel Mühe in einen auch auf Smartphones schnell ladenden Web-Auftritt investieren, freuen sich zwangsläufig über extrem kurze Ladezeiten auf dem PC. Anstrengungen, die man für mobile Nutzer mit langen Ladezeiten unternimmt, kommen also letztlich allen Nutzern und damit auch dem Unternehmen selbst zugute.

Nehmen wir als zweites Beispiel die Bildschirmgröße, die Webdesigner über Jahre mit einem Durchschnittswert von 1024 mal 768 Pixeln (Breite mal Höhe) angenommen haben. Auf Smartphones sind es in der Regel 320 mal 480 Pixel – gerade einmal 20 Prozent des alten Standards. In der Praxis führt dieser Flächenverlust dazu, dass sich die Webteams auf die Inhalte und Funktionen konzentrieren, die für den Kunden am wichtigsten sind.

Ein mustergültiges Beispiel für diese Praxis stellt die Website der Deutsche Lufthansa AG, www. lufthansa.de dar. Ruft man diese Website am PC auf, erschweren unzählige Menüs, Infokästchen und Eigenwerbung die Orientierung. Ganz anders die mobile Version der Website, die sich auto-matisch öffnet, wenn man die Website mit einem Smartphone besucht. Drei prominent platzierte Links namens “Flugstatus”, “Flugplan” und “Check-in” führen den Nutzer direkt zu den entscheidenden Funktionen des Webangebots. Solche Lösungen mit hohem Nutzwert erwachsen aus dem Druck beengter Platzverhältnisse. Sie erfordern, dass sich das Webteam intensiv mit Nutzerwünschen auseinandersetzt und die Freiheit erhält, entsprechende Erkenntnisse umzusetzen. Oft gelingt das nur durch Hinzunahme externer Berater.

Tablet-Verkäufe verdoppeln sich 2012

Im April 2012 prognostizierte Gartner, dass Endverbraucher bis Ende des Jahres weltweit 118,9 Millionen Tablets kaufen würden. Das entspricht einem Anstieg von 98% gegenüber den 60 Millionen Verkäufen aus dem Vorjahr.

Marktführer ist mit einem Anteil von über 60% bislang das iPad von Apple.

MOBILES WEBDESIGN

Success Story Smartphone

Das Smartphone hat das Internet mit rasender Geschwindigkeit erobert: Mehr als 30 Millionen deutsche Nutzer surften 2012 mobil – über doppelt so viele wie noch 2011. Das entspricht etwa der Hälfte der Internetnutzer in Deutschland.

Der Studie Mobile Web Watch 2012 von Accenture zufolge planen dieje-nigen Nutzer, die noch über kein Smartphone – oder ein anderes mobiles Endgerät – verfügen, sich bald eines anzuschaffen.

4 5

Nicht unerwähnt bleiben dürfen die umfangreichen Zusatzfunktionen, die gerade Smartphones zur Verfügung stellen. So sind die Geräte dank GPS, WLAN und 3G-Empfang präzise über ihren eigenen Aufenthaltsort im Bild. Websites können den Standort des Nutzers abfragen. Stimmt er der Abfrage zu, kann die Website mit maßgeschneiderten Informationen reagieren – etwa mit Angeboten, Gutscheinen oder der Route zur nächsten Filiale. Viele andere Funktionen, wie der Zugriff auf die im Gerät integrierte Kamera erfordern hingegen die Entwicklung eigenständiger Softwares, so genannter Apps.

Responsive Webdesign

Nun ist das “Modell Lufthansa” – der Betrieb sowohl einer klassischen, als auch einer eigenständigen mobilen Website – nur für eine Minderheit der Unternehmen leistbar. Glücklicherweise ist das auch gar nicht not-wendig. Das Zauberwort heißt “Responsive Webdesign” und beschreibt eine Technik, dank der sich dieselbe Website in unterschiedlicher Optik präsentieren lässt, je nachdem wie groß das Display bzw. Browserfenster ist, auf dem sie angezeigt wird.

Wie stark das Smartphone- vom Desktop-Design abweichen soll, ist pro-jektabhängig. Fast immer empfiehlt es sich, Spalten, die auf einem großen Monitor nebeneinander erscheinen, auf einem Smartphone-Display un-tereinander zu positionieren. Dadurch lassen sich alle Inhalte schon beim Laden der Seite in lesbarer Schriftgröße darstellen. Dem Nutzer erspart man so das mühsame Vergrößern des gewünschten Bildausschnittes durch doppeltes Antippen. Desweiteren ist es oft sinnvoll, das gesamte Hauptmenü auf Smartphones hinter einem einzigen Knopf zu verstecken. Von der Platzersparnis profitiert der Nutzer insofern, als er nicht erst am Menü vorbeiscrollen muss, um zum eigentlichen Inhalt der Website zu gelangen. Über den Knopf bleibt das Menü dennoch vollständig erreich-bar und in “Griffweite”. Häufig lässt sich im Smartphone-Design auch die Schriftgröße verringern, gehen wir doch davon aus, dass Mobilgeräte sich näher am Auge befinden als ein Monitor.

Responsive Webdesign verursacht zwar bei der Erstellung einer Website einen gewissen Mehraufwand, weil mehrere Designvarianten entwickelt

und getestet werden müssen. Gerade das Testen auf Mobilgeräten gestal-tet sich in einer zunehmend heterogenen Gerätelandschaft vergleichs-weise aufwändig. Im Gegenzug muss das Unternehmen aber nur eine einzige Website pflegen und weiterentwickeln, die sich dank Responsive Webdesign auf stationären wie mobilen Endgeräten optimal präsentiert.

Fazit

Kunden besuchen Websites immer öfter mit Mobilgeräten – mit kleinen Displays, unzuverlässigen Internet-Verbindungen und unter verschiedens-ten Rahmenbedingungen. Unternehmen, die sich mit ihren Websites auf diese neuen Anforderungen einstellen, bieten einen Service, den Kunden heute noch positiv bemerken – und morgen stillschweigend vorausset-zen. Nebenbei verbessern Unternehmen durch ihre Anstrengungen im Bereich “Mobile Website” das Online-Erlebnis für alle ihre Besucher. Dank Responsive Webdesign erfordert die optimale Darstellung von Web-Inhalten auf mobilen Endgeräten keinen zweiten Webauftritt.

MOBILES WEBDESIGN

Regionale Suchmaschinenoptimierung

Wie nutzen Smartphone-Besitzer das Internet? Über 60% nutzen ihre Mobilgeräte, um nach regionalen Einkaufsmöglichkeiten zu suchen, und über 70% tätigen kurz nach ihrer Suche tatsächlich einen Einkauf im Ladengeschäft.

Deshalb gewinnt das Thema regionale Suchmaschinenoptimierung immer größere Bedeutung: Unternehmen mit lokalem Kundenkreis müssen nicht landes- oder gar weltweit gefunden werden. Die Auswahl der richtigen Keywords und die regionale Platzierung der Website auf Google helfen dabei, nur diejenigen Suchenden anzusprechen, die sich gezielt für ein Angebot vor Ort interessieren.

Download aller BIEG-Leitfäden unterwww.bieg-hessen.de

6 7

Über den Autor Tim Kaufmann Taquiri GmbH & Co. KG

Stand: Juni 2012

MOBILES WEBDESIGN

Tim Kaufmann ist Geschäftsführer der Webagentur Taquiri GmbH, Referent und Fachautor. Seit 15 Jahren realisiert er Websites für kleine und mitt-lere Unternehmen im Rhein-Main-Gebiet und Mittelhessen. Taquiri setzte als eine der ersten deutschen Agenturen bei Kundenprojekten Responsive Webdesign ein.

www.taquiri.de

Diese Leitfäden des BIEG Hessen könnten Sie ebenfalls interessieren:

Die 7 Website-SündenGanz gleich ob im Design, in der Menüführung oder Kundenansprache – auf Websites werden immer wieder die gleichen Fehler gemacht. Wer diese typischen Fehler vermeidet, ist seiner Konkurrenz häufig bereits voraus.

In 5 Schritten zum erfolgreichen Website-RelaunchSoll eine alte Website durch eine modernere Version ersetzt werden, scheitert die neue Seite meistens bereits an Planungsfehlern. Ein Website-Relaunch will gut vorbereitet und organisiert sein.

Regionales Online-Marketing Die Betreiber von Websites mit lokalem Kundenkreis müssen nicht von jedem Suchenden gefunden werden, sondern nur von denen, die sich in räumlicher Nähe zum Unternehmen befinden.

Texten für die Website Google liest die Inhalte, also die Texte von Websites aus. Warum Suchmaschinenoptimierung einem gelungenen und ansprechenden Websitetext nicht im Weg stehen muss, erfahren Sie hier.

Besuchen Sie uns auf www.bieg-hessen.de!

8 9

Herausgeber

Das BIEG Hessen ist eine GbR und wird vertreten durch die Gesellschafter IHK Frankfurt am Main, IHK Hanau-Gelnhausen-Schlüchtern, IHK Fulda und IHK Offenbach am Main.

Verantwortlich für den InhaltDetlev Osterloh, Geschäftsführer,BIEG Hessen, IHK Frankfurt am Main

DruckDaab Druck & Werbe GmbH, Reinheim

Layout und TitelbildBirgit Dürr

Impressum

BIEG Hessenc/o IHK Frankfurt am MainBörsenplatz 460313 Frankfurt am Main

Telefon 069 / 2197 1380Telefax 069 / 2197 1497info@bieg-hessen.de

Mobiles Webdesign

In Windeseile lösen Smartphones und Tablet-Computer derzeit den PC als das wichtigste Internet-Zugangsgerät ab. Plötzlich werden Websites auch durch die Berührung mit den Fingern gesteuert, und auch handtellergroße Displays müssen ausreichen, um den Auftritt anzuzeigen. Was ist beim Webdesign zu beachten?

HERAUSGEBER BIEG Hessenc/o IHK Frankfurt am MainBörsenplatz 460313 Frankfurt am Main

Telefon 069 2197-1380Telefax 069 2197-1497info@bieg-hessen.dewww.bieg-hessen.de

Träger des BIEG Hessen | Industrie- und Handelskammern:Frankfurt am Main| Fulda | Hanau-Gelnhausen-Schlüchtern | Offenbach am Main