Der Beginn eines großartigen Designs beginnt mit dem Inhalt. Um eine herausragende mobile UX optimal zu nutzen, müssen möglicherweise einige Änderungen und Anpassungen vorgenommen werden.
Aber wo fängst du an? Wie sollten Inhalte angepasst werden, um nahtlos auf mobilen Geräten zu funktionieren? Es beginnt mit dem Nachdenken darüber, wie Benutzer mit kleineren Bildschirmen interagieren, und wie sich das auswirkt, was (und wie viel!) Sie lesen möchten.
1. Ein Gedanke pro Bildschirm
Versuchen Sie beim Reduzieren von Inhalten für mobile Geräte, Elemente so zu planen, dass pro Bildschirm ein Durchgang erfolgt. Auch wenn die Telefone wieder in Richtung größerer Größen tendieren, sollten Sie nicht versucht sein, viele Informationen auf dem Bildschirm zu stopfen!
Ein Gedanke pro Bildschirm reicht aus. Noch mehr und Sie riskieren, den Benutzer zu überwältigen.
Benutzer von mobilen Geräten sind in der Regel Multitasker. Sie betrachten Ihre Website, während Sie mit einem Freund sprechen, während Sie an einem Baseballspiel teilnehmen. Indem Sie die Nachricht und den Inhalt behalten einfach und DirekteSie haben eine bessere Chance, dass ein einziger Gedanke kommuniziert wird.
Aber wie sieht ein Gedanke aus? Es ist ein Block aus Text, Bildern und umsetzbaren Elementen, die alle miteinander verbunden sind. Die Inhaltsgruppe sollte die Benutzer auffordern, eine Wahl zu treffen: Möchten Sie das tun?
2. Navigation priorisieren
Es sollte eine Handvoll Dinge geben, die Benutzer normalerweise tun oder von denen Sie möchten, dass sie die mobile (responsive) Version Ihrer Website besuchen. Stellen Sie sicher, dass es eine einfach zu befolgende Navigation gibt, die Benutzer schnell zu diesen Elementen bringt.
Während ein Menü mit zehn Navigationsoptionen mit mehreren Ebenen auf Ihrer Desktopsite funktionieren kann, sind mobile Benutzer oft etwas mehr Zeit. Sie haben nicht die Absicht, sich auf der Website zu bewegen, bis sie etwas finden.
Die Navigation muss einfach und rationalisiert sein. Wenn Sie nicht sicher sind, wo Sie anfangen sollen, werfen Sie einen Blick auf Ihre mobilen Benutzeranalysen. Was sind die drei oder vier meistbesuchten Seiten? Entsprechen diese Seiten Ihren Erwartungen? Sie haben die wichtigsten Navigationselemente gefunden, damit Sie mobile Inhalte entsprechend anpassen können.
3. Denken Sie wie eine Suchmaschine
Spielen Sie nicht den Algorithmus. Erstellen Sie qualitativ hochwertigen Inhalt, den Benutzer lesen möchten. Egal, ob Sie zehn oder mehr Millionen Seitenaufrufe pro Tag erhalten, Sie möchten in Bezug auf Inhalte auf mobilen Geräten wie eine Suchmaschine denken. Jedes Wort, Bild und jeder Inhalt muss schnell und durchsuchbar sein. Aber spielen Sie nicht den Algorithmus. Erstellen Sie qualitativ hochwertigen Inhalt, den Benutzer lesen möchten.
Wenn es um mobile Geräte geht, kann dies bedeuten, dass einige Inhaltselemente reduziert werden. Wählen Sie statt drei Bildern auf der Startseite beispielsweise das wichtigste Foto aus. Beschweren Sie Ihre mobile Website nicht. Webgeschwindigkeiten und WLAN werden immer besser, aber einige Benutzer haben Schwierigkeiten mit Verbindungen und Ihre Website muss noch verfügbar sein.
Mit diesem praktischen Tool von Google können Sie die Geschwindigkeit von mobilen Seiten überprüfen, sodass Sie alles optimal optimieren können.
4. Machen Sie den Text größer
Kleiner Bildschirme sollte nicht kleiner sein Text. Sie sollten tatsächlich die Punktgröße erhöhen, um den Inhalt lesbarer und verdaulicher zu machen. Schauen Sie sich Ihre Körperkopie an und wählen Sie eine Größe, die 30 bis 40 Zeichen pro Zeile zulässt. (Dies ist ungefähr die Hälfte von dem, was für Desktop-Bildschirme empfohlen wird.)
Es gibt andere Tricks, um Text auch auf kleinen Bildschirmen lesbarer zu machen. Sie finden diese in einem früheren Design Shack-Artikel mit Tipps zum Entwerfen einer besseren mobilen Typografie.
5. Schreiben Sie eine aussagekräftige Mikrokopie
Große Mikrokopie - der Text in Elementen wie Schaltflächen - kann das Design beeinflussen oder brechen. Die Mikrokopie kann dem Design Persönlichkeit und Funken verleihen. Es vermittelt auch eine Vielzahl von Informationen und hilft Benutzern, sich im Design zurechtzufinden.
Insbesondere auf mobilen Geräten sollten Sie die Mikrokopie etwas größer als üblich machen und sie immer in Formularen verwenden, damit die Benutzer genau wissen, was zu tun ist.
Denken Sie an die häufigsten Probleme, auf die Sie stoßen, wenn Sie beispielsweise etwas für Ihr Telefon bezahlen. Das Formular kann sich über mehrere Bildschirme oder Scrolls erstrecken. Das Führen der Mikrokopie kann es viel einfacher machen, alles beim ersten Mal korrekt auszufüllen. (Eine Schlüsselkomponente für das Konvertieren von Aktionen von mobilen Benutzern.)
6. Entfernen Sie unnötige Effekte für Mobile
Entnehmen Sie alles, was Sie für mobile Designs nicht benötigen. Drehende Animationen und Parallax-Scrolling-Funktionen sehen auf Desktop-Websites hervorragend aus, können jedoch mobile Versionen beeinträchtigen. Entnehmen Sie alles, was Sie für mobile Designs nicht benötigen. Sie möchten, dass alles schnell und nahtlos geladen wird. Animationen, die möglicherweise funktionieren oder nicht funktionieren, stehen der sofortigen Verbindung mit einem Benutzer im Weg.
Ein weiterer Effekt, den Sie ausreissen können? Hover-Effekte Es gibt keinen Schwebezustand für Berührungsaktionen.
Rationalisieren Sie die mobile Benutzererfahrung mit einer leicht verständlichen Tap-Funktion (zum Ersetzen des Klicks), die ein offensichtliches Feedback aufweist. Sie möchten nicht, dass Benutzer fragen, ob eine Aktion stattgefunden hat. es sollte immer offensichtlich sein.
7. An die Skala anpassen
Nichts ist frustrierender als eine mobile Website, auf der alles klein ist. Der Sinn eines mobilen Designs besteht darin, die Website für Benutzer mit kleineren Geräten zugänglicher zu machen. Sie müssen den Inhalt an diese Skala anpassen.
Manchmal ist das Anpassen des Inhalts nur eine Neuordnung der Teile.
- Boxen, die auf einem Desktop über den Bildschirm aufgereiht wurden, sind auf einem mobilen Gerät möglicherweise vertikal gestapelt.
- Fotos werden aufgrund der dominanten Ausrichtung der mobilen Nutzung (vertikal) mehr quadratisch oder vertikal zugeschnitten.
- Text wird zur Kürze bearbeitet und beschnitten.
- Die Navigation wird neu zugewiesen und an einem anderen Ort platziert.
- Handlungsaufforderungen werden zu größeren, fast bildschirmgroßen Elementen gemacht.
- Alle Tasten und Tap-Elemente befinden sich an leicht zugänglichen Stellen, je nachdem, wie die Benutzer ihr Telefon halten.
Fazit
Sind Sie bereit, einige Inhalte Ihrer Website zu überdenken? Wenn Sie eine responsive Website erstellt haben und einfach davon ausgegangen sind, dass alle mobilen Benutzer konvertiert werden, ist es an der Zeit, den mobilen Teil des Designs zu bewerten. Möglicherweise gibt es Raum für kleine Inhaltsänderungen, die die Art und Weise ändern können, wie Benutzer mit dem Design interagieren.
Dies ist ein wesentlicher Teil des Designprozesses. Schauen Sie sich Ihre Analysen an. Wie viel Prozent Ihrer Benutzer haben Zugriff auf das Design auf einem mobilen Gerät? Wenn Sie keine Anpassungen vornehmen, um ihren Bedürfnissen gerecht zu werden, können Sie einen großen Teil Ihrer Benutzerbasis verfremden, ohne sie zu beleidigen.