Immer mehr Internetnutzer surfen auf mobilen Geräten. Besonders das Smartphone als multifunktionaler Minicomputer läuft heutzutage Tag und Nacht – die meisten schalten es gar nicht mehr aus. Den Heimcomputer hingegen schon.
Im Zuge dieser Entwicklung stellt sich die Frage, ob es für Webseiten nicht sinnvoller sei, mehr auf das Smartphone ausgerichtet zu werden. Wenn Sie über Google Analytics verfügen, können Sie sogar direkt auswerten, wie viele Nutzer über mobile Geräte Ihre Webseite besuchen. Beträgt die Anzahl 50% oder mehr, dann lohnt sich der Fokus auf eine mobile Weboptimierung.
Das Konzept „Mobile first” geht dabei einen Schritt weiter: Es sieht vor, dass Webseiten bereits im Entstehungsprozess primär für Smartphones konzipiert werden, und erst anschließend für den großen Monitor. Dadurch werden Webinhalte mehr auf den mobilen Hauptnutzer zugeschnitten und dessen Bedürfnissen angepasst.
Google hat angekündigt, den Mobile Index von nun an über den Desktop Index zu stellen. Wer ebenfalls darüber nachdenkt, dieses Konzept anzuwenden, für den haben wir hier die 7 wichtigsten Checkpoints für ein gelungene, mobile Webseite zusammengefasst.
Platzsparende Navigation
Die Navigation gehört zu den wichtigsten Tools einer Webseite. Im Normalfall gehört sie direkt ans obere Ende der Seite, wo der Nutzer sie einfach und schnell findet. In der mobilen Version nimmt sie allerdings oft zu viel Platz ein und verdrängt wichtige Startelemente nach unten – deshalb sollten Sie auf eine sogenannte „auffahrende” Navigation zurückgreifen. Diese besteht aus einem kleinen Icon mit Navigationssymbol, das sich bei Bedarf erweitern lässt und die Unterseiten präsentiert. Auf diese Weise bleibt die Navigation zwar immer erreichbar, aber steht nicht aufdringlich im Vordergrund.
Lesbarer Content auf kleinem Bildschirm
Damit Ihre Webinhalte auf dem Smartphone gut sichtbar sind, sollten die Texte mit einer entsprechend großen Schriftgröße versehen sein. Der mobile Nutzer hat meist keine Geduld, zusätzlich in die Webseite zu zoomen, um an die gesuchten Informationen zu gelangen. Aber wer würde auch schon gerne jedes Mal eine Lupe zur Hand nehmen, um ein Buch zu lesen? Gute Lesbarkeit gehört daher zu den wichtigsten Eigenschaften eines mobilen und benutzerfreundlichen Webdesigns.
Verkürzte Ladezeiten durch schlanke Struktur
Ein weiterer Punkt sind die Ladezeiten. Gehen wir weiterhin von einem ungeduldigen Nutzer aus, der so schnell wie möglich auf Ihre Inhalte zugreifen möchte und womöglich eine schlechte Internetverbindung hat: In diesem Fall werden Ladezeiten besonders durch imposante Elemente wie große Bilder oder Videos verlängert. Versuchen Sie, auf die meisten davon zu verzichten – auch wenn es schwer fällt. Bei mobilen Webseiten ist es auch wegen des mangelnden Platzes angebracht, alle Elemente so kompakt wie möglich zu halten. Natürlich bedeutet das nicht, dass sie gar keine Gestaltungselemente verwenden sollten. Aber beschränken Sie sich auf ausgewählte Elemente und optimieren Sie diese in der Bildgröße, um die Ladezeiten zu schonen.
Touchfähige Bedienelemente in klickbarer Größe
Die meisten modernen Smartphones lassen sich mittlerweile fast ausschließlich über einen Touchscreen bedienen. Die Touchfähigkeit ist deswegen ein absolutes Must-have. Die Buttons sollten außerdem eine geeignete Größe haben – sind sie zu klein, erschwert es das Antippen mit dem Finger. Insgesamt sind für mobile Nutzer große, gut sichtbare Elemente sehr geeignet, da sie benutzerfreundlich sind.
Gestenerkennung für einfache Bedienung
Aufbauend auf der Thematik der Touchfähigkeit ergibt sich noch eine sehr beliebte Funktion für Nutzer: Die Gestenerkennung. Dadurch erkennt das Display die Bewegung des Fingers und es lassen sich Objekte auf dem Bildschirm verschieben, was man auch als „Swipen” bezeichnet. Solche Effekte kommen besonders gerne bei Bildergalerien (in Form von Slideshows) und auch Navigationsleisten zum Einsatz, weil sie einen dynamischen und intuitiven Mehrwert für den Nutzer bieten.
Icons zur schnellen Kontaktaufnahme
Wenn Sie eine Webseite für Kunden oder Leser erstellen, möchten Sie natürlich, dass diese Sie schnell und problemlos kontaktieren können. Daher empfehlen sich leicht identifizierbare Buttons, die zum Kontaktformular oder den Social Media-Kanälen weiterleiten. Außerdem können Sie wichtige Informationen wie Telefonnummer und E-Mail-Adresse mit entsprechenden Icons darstellen. Solche geläufigen Grafiken besitzen für Nutzer einen gewissen Wiedererkennungswert und brauchen daher auch keine Erläuterung.
„Es sieht vor, dass Webseiten bereits im Entstehungsprozess primär für Smartphones konzipiert werden, und erst anschließend für den großen Monitor.“
Pop-ups als Feind des mobilen Nutzers
Kaum etwas ist für den Nutzer demotivierender wie das plötzliche Auftauchen von Werbung. Doch während man diese Pop-ups beim herkömmlichen Desktop-Monitor relativ schnell wieder schließen kann, so gestaltet sich das beim Smartphone meist etwas umständlicher und kann für den mobilen Nutzer auch noch zusätzliche Kosten verursachen. Aus diesem Grund sollten Sie darauf achten, Pop-ups zu vermeiden.
Der Mehrwert von Mobile first
Wenn Sie all diese Punkte bei Ihrer Webseite integrieren, ergeben sich durch „Mobile first” einige Vorteile: Smartphone-Webseiten verfügen nur über wenig Raum und konzentrieren sich auf das Wesentliche, was für den Nutzer wirklich wichtig ist. Dadurch entsteht eine schlanke Inhaltsstruktur und eine leicht bedienbare Designlösung.
Davon kann auch die Desktop-Version profitieren. Durch den Fokus auf die wichtigsten Inhalte der Webseite bieten sich neue Blickwinkel für eine verbesserte Übersichtlichkeit und verhindern das Überladen der Seite mit unnötigen Elementen. Und wer noch zusätzliche Elemente einbauen möchte, kann dies durch die schlanke Struktur problemlos bewerkstelligen.
Wenn Sie noch Fragen zur Optimierung ihrer mobilen Webseite oder zum responsive Webdesign haben sollten, können Sie natürlich jederzeit gerne mit uns Kontakt aufnehmen.