Eine überzeugende Nutzererfahrung bieten

Layoutdesign

• Touchscreen-freundliche Seiten: Die empfohlene Mindestgröße eines Touch-Zielpunkts für den menschlichen Finger beträgt 48 dp (dichteunabhängige Pixel), bei einem Mindestabstand von 8 dp zwischen den Zielpunkten. Zu kleine Zielpunkte und dadurch entstehende Klickfehler sind der schnellste Weg, mobile Nutzer zu vertreiben.
• Die richtige Schriftart: Die Schriftgröße sollte mindestens 12 Pixel betragen. Bei kleineren Schriftgrößen ist die Lesbarkeit erheblich beeinträchtigt. Wählen Sie eine klare Schriftart, die auf dem Display gut zu lesen ist. Verwenden Sie möglichst keinen bildbasierten Text.
• Die passende Breite festlegen: Die meisten Internetnutzer sind daran gewöhnt, auf einer Seite vertikal nach oben oder unten zu scrollen. Sind sie jedoch gezwungen, auch seitlich zu scrollen, beeinträchtigt dies nicht nur die Nutzererfahrung, sondern erweckt auch schnell den Eindruck, dass die Website nicht für kleinere Bildschirme konzipiert wurde.
• Mouseover vermeiden: Auf einem Desktopbildschirm ist das Mouseover eine elegante Methode, um ausgeblendete Inhalte anzuzeigen.  Für Mouseover benötigt man jedoch eine Maus. Auf Touchscreens wie Tablets oder Smartphones funktioniert dies nicht, weil Nutzer ihren Finger nicht wie eine Maus über Objekte bewegen. Vermeiden Sie daher Mouseover und verwenden Sie stattdessen Schaltflächen, die der Nutzer antippen kann, um zu untergeordneten Menüs zu gelangen.
• Keine Pop-up-Fenster: Pop-up-Fenster sind schon bei Desktopwebsites irritierend und stören bei mobilen Websites noch mehr. Ebenso wenig sollten Sie Interstitials nutzen, um App-Downloads zu fördern, sondern die Aufforderung in Ihre Website einbetten.
• Aussagekräftige Schaltflächen: Lassen Sie potenzielle Kunden nicht im Unklaren darüber, wohin sie nach einem Klick gelangen. Beschriften Sie Schaltflächen eindeutig und verwenden Sie als Navigationshilfen Klickpfade und klare Kategoriennamen, z. B. "Schritt 2: Zahlung".

Inhalt:

• Weniger ist mehr: Auf mobilen Websites geht Qualität vor Quantität. Widerstehen Sie der Versuchung, auch noch das letzte Wort Ihrer Desktopseite irgendwie unterzubringen. Deswegen gilt:
• Lieber anpassen als weglassen: Nutzer von Mobilgeräten und Tablets erwarten im Wesentlichen dieselbe Funktionalität wie auf Ihrer Desktopwebsite – ganz gleich, ob es darum geht, Videos anzusehen oder Bürobedarf zu kaufen. Statt wichtige Inhalte wegzulassen, strukturieren Sie diese so, dass sie auf den Bildschirm des Mobilgeräts passen.
• Wichtige Funktionen müssen sichtbar sein: Bieten Sie den Nutzern schnellen Zugriff auf alle wichtigen Funktionen Ihrer Website. Wenn Sie Einzelhändler sind, sollten beispielsweise Funktionen wie Produktsuche und Einkaufswagen sowie mobilgerätespezifische Tools wie die Filialsuche im Vordergrund stehen. Bieten Sie einen Link zur vollständigen Website, falls mobile Nutzer diese bevorzugen sollten.
• Funktion von Mediendateien überprüfen: Auf vielen Mobilgeräten können beispielsweise keine Flash-Videos abgespielt werden. Vergewissern Sie sich, dass die Mediendateien Ihrer Multiscreen-Websites auch wirklich auf den vorgesehenen Bildschirmen funktionieren.
• Einfache Zahlung: Auf Mobilgeräten ist es lästig, längere Formulare auszufüllen und womöglich in mehreren Schritten komplette Adressen und sonstige Daten einzugeben. Um Ihre Conversion-Raten zu erhöhen, sollten Sie die Zahlung so weit wie möglich vereinfachen.

Geschwindigkeit:

Hierzu gibt es nur einen Rat: Machen Sie die Website so schnell wie möglich. Durch Optimierung der Websitegeschwindigkeit sorgen Sie auf jeden Fall für eine bessere Nutzererfahrung – insbesondere auf Mobilgeräten, wenn Nutzer gerade unterwegs sind und eventuell nur ein langsames Datennetz zur Verfügung steht.  Bei schnellerem Tempo steigen normalerweise die Interaktionsbereitschaft der Besucher und die Anzahl der Conversions. Geschwindigkeit ist nicht nur ein Rankingkriterium bei der Google-Suche. Viele Unternehmen verzeichnen einen positiven Effekt, wenn sie in die Optimierung des Seitenladetempos investieren.

Vermeiden Sie jedoch die folgenden Fehler:

• Zu viele HTTP-Anfragen: Mobile Nutzer möchten auf Ihrer Website dieselben Dinge tun wie Desktopnutzer, haben dabei jedoch nur eine beschränkte Rechenleistung. Und möglicherweise schwankt die verfügbare Bandbreite. Reduzieren Sie deshalb Seitenelemente, durch die zusätzliche HTTP-Anfragen generiert werden.
• Zu viele Bilder: Angesichts der immer besser werdenden Displays von Smartphones erscheint es verlockend, einfach das größte verfügbare Bildformat bereitzustellen und die Verkleinerung dem jeweiligen Gerät zu überlassen. Dies ist jedoch keine gute Entscheidung. Sie verschwenden nur Zeit und Rechenleistung. Stellen Sie stattdessen für jedes Gerät die passende Bildgröße bereit.
• Zu viele Dateien: Überlegen Sie, ob die vorhandenen JavaScript-Snippets und CSS-Styles für mobile Nutzer wirklich hilfreich sind. Zu viel JavaScript- oder CSS-Elemente verlangsamen die Seite. Minimieren und verschlanken Sie den Code, wo immer möglich, und reorganisieren Sie eventuell Ihr CSS von Grund auf. Stellen Sie sicher, dass Assets im Browsercache gespeichert werden, sodass sie nicht bei jedem weiteren Seitenaufruf des Besuchers erneut geladen werden müssen.

Weitere Einzelheiten und Tools zur Leistungsoptimierung für Ihre Website erhalten Sie auf der Google-Seite "Make the Web Faster" unter https://developers.google.com/speed/