Mobile Website: Worauf es auf dem Handy ankommt

Wer Ihre Website auf dem Handy öffnet

Die mobile Website ist die Ansicht Ihrer Seite auf dem Handy. Stellen Sie sich einen Elektriker vor, der zwischen zwei Baustellen gesucht wird, oder eine Gärtnerei, bei der jemand auf dem Parkplatz die Öffnungszeiten nachschaut. Wer so sucht, hat eine Frage und wenig Geduld: Wie ist die Nummer, bis wann ist offen, wo genau finde ich Sie? Findet er die Antwort nicht in wenigen Sekunden, ruft er den nächsten Betrieb an.

Auch für Google ist das Handy die Hauptsache. Die Suchmaschine liest und bewertet vor allem die Handy-Version einer Seite (Mobile-First-Indexierung). Was dort fehlt, fliesst unter Umständen nicht in die Bewertung ein, auch wenn es am Computer zu sehen ist. Beide Versionen müssen deshalb denselben Inhalt zeigen, und die Handy-Version muss sich gut bedienen lassen.

Der Anrufknopf und die Kontaktwege

Für die meisten Betriebe ist der Anruf das Ziel der Seite. Er gehört nach oben und nicht in die Fusszeile.

• Tippbare Telefonnummer: Die Nummer muss ein Link sein, damit das Handy beim Antippen sofort wählt. Der Webdesigner hinterlegt sie so, dass das Handy sie als Anruf erkennt. Probieren Sie es selbst: Öffnet sich beim Antippen die Wahlfunktion, passt es.
• Sichtbar ohne Scrollen: ein Knopf «Anrufen» im Kopfbereich oder eine feste Leiste am unteren Rand. Eine feste Leiste darf weder den Text noch den Cookie-Hinweis verdecken.
• Adresse als Link zur Karte: Ein Tipp startet die Route.
• Öffnungszeiten neben der Nummer, nicht drei Seiten weiter hinten.
• Dieselbe Nummer überall: gleiche Schreibweise auf der Website, im Google-Profil und auf dem Fahrzeug.

Lesbarkeit: Schrift, Abstände und Kontrast

Das Handy wird draussen benutzt, im Gegenlicht, mit einer Hand, zwischendurch. Das stellt andere Anforderungen als der Bildschirm im Büro.

• Schriftgrösse: Fliesstext in der Regel mindestens 16 Pixel. Müssen Besucher zoomen, ist die Schrift zu klein.
• Kontrast: dunkle Schrift auf hellem Grund. Hellgrauer Text auf Weiss ist bei Sonnenlicht kaum zu lesen und für Menschen mit schwächerer Sehkraft eine Hürde. Mehr dazu im Beitrag Barrierefreie Website.
• Tippflächen: Links und Knöpfe brauchen Platz. Als Faustregel gelten rund 48 Pixel Höhe und etwas Abstand dazwischen, damit der Daumen nicht danebentrifft.
• Kurze Absätze: Auf dem schmalen Bildschirm wirkt ein langer Textblock wie eine Wand.
• Kein seitliches Wischen: Die Seite darf nie breiter sein als der Bildschirm.
• Keine Vollbild-Fenster direkt nach dem Laden. Google wertet Einblendungen negativ, die den Inhalt verdecken. Auch ein Cookie-Hinweis sollte klein bleiben und die Seite nicht blockieren.

Formulare, die der Daumen bedienen kann

Ein Formular ist auf dem Handy die grösste Hürde der Seite. Jedes Feld kostet Geduld.

• Wenige Felder: Name, Telefon oder E-Mail und das Anliegen genügen meist für die erste Anfrage. Alles andere klären Sie im Gespräch.
• Passende Tastatur: Im Telefonfeld erscheint die Zifferntastatur, im E-Mail-Feld die Taste mit dem @-Zeichen. Das hängt am Feldtyp, den der Webdesigner setzt.
• Beschriftung über dem Feld: Steht die Beschriftung nur als Platzhalter im Feld, verschwindet sie beim Tippen, und der Besucher weiss nicht mehr, was gefragt war.
• Ausfüllhilfe des Handys: Name, Telefon und Adresse trägt das Handy selbst ein, wenn die Felder richtig ausgezeichnet sind.
• Grosser Absenden-Knopf und eine klare Bestätigung nach dem Senden, am besten mit dem Hinweis, wann Sie sich melden.
• Verständliche Fehlermeldungen direkt beim betroffenen Feld.

Mehr zu diesem Thema: Kontaktformular optimieren.

So testen Sie auf echten Geräten: Ablauf in 20 Minuten

Das Schmalziehen des Browserfensters am Computer zeigt nur das Layout. Berührung, Sonnenlicht, Mobilfunk und Tastatur zeigt es nicht. Darum zählt der Test auf echten Geräten.

1. Sammeln Sie zwei Handys ein: ein neueres und ein älteres, wenn möglich ein iPhone und ein Android-Gerät. Im Betrieb oder in der Familie findet sich beides.
2. Schalten Sie das WLAN aus und öffnen Sie die Seite über Mobilfunk. So sehen Sie, wie sie bei normalem oder schwachem Empfang lädt. Die Messung mit PageSpeed Insights steht im Beitrag Ladezeit verbessern.
3. Geben Sie sich eine Aufgabe wie ein Kunde: «Ich brauche die Nummer, die Öffnungszeiten und die Adresse.» Stoppen Sie die Zeit und zählen Sie die Tipps.
4. Tippen Sie die Telefonnummer an. Startet der Anruf?
5. Füllen Sie das Formular wirklich aus und senden Sie es ab. Kommt die Anfrage bei Ihnen an, auch im Spam-Ordner?
6. Gehen Sie nach draussen und lesen Sie die Seite bei Tageslicht.
7. Drehen Sie das Handy ins Querformat und blättern Sie durch alle Hauptseiten.
8. Stellen Sie in den Handy-Einstellungen die Schrift grösser. Bleibt alles lesbar, oder rutscht etwas übereinander?
9. Notieren Sie jeden Fehler mit Gerät und Seite und geben Sie die Liste Ihrem Webdesigner.

Die Geräteansicht in den Entwicklerwerkzeugen des Browsers eignet sich für einen ersten Blick, ersetzt die Handys aber nicht.

Wenn Ihre Seite auf dem Handy noch Mühe macht

Der kostenlose Website-Check zeigt Ihnen, wo Ihre Website heute steht. Edelweiss vermittelt Ihr Vorhaben an eine Agentur, die dazu passt. Für Sie ist das kostenlos, bezahlt werden wir von den Agenturen. Sie können Ihr Vorhaben in sechs Fragen beschreiben. Weitere Beiträge finden Sie in der Ratgeber-Übersicht.

Häufige Fragen

Braucht mein Betrieb eine eigene Handy-Version?

Nein. Eine moderne Website passt sich dem Bildschirm automatisch an (responsives Design). Zwei getrennte Versionen verdoppeln den Pflegeaufwand und führen leicht zu unterschiedlichen Inhalten.

Muss der Anrufknopf auf jeder Seite stehen?

Er sollte von jeder Seite aus mit einem Tipp erreichbar sein, zum Beispiel im Kopfbereich oder in einer festen Leiste am unteren Rand. Prüfen Sie vor allem die Seiten, auf denen Besucher aus Google zuerst landen. Das sind oft die Leistungsseiten und nicht die Startseite.

Reicht es, das Browserfenster am Computer schmal zu ziehen?

Für einen ersten Blick ja. Ob die Nummer wirklich wählt, die Tastatur passt und der Text bei Sonnenlicht lesbar ist, zeigt nur ein echtes Handy.

Wie oft sollte ich die Handy-Ansicht prüfen?

Nach jeder Änderung an Menü, Formular oder Startseite und sonst zweimal im Jahr, weil sich Geräte und Browser ändern. Einen festen Rhythmus für solche Kontrollen finden Sie im Beitrag Website-Pflege.