7 Möglichkeiten zum Anpassen von Inhalten für eine bessere mobile Benutzeroberfläche

Der Beginn eines großartigen Designs beginnt mit Inhalten. Um das Beste aus einem herausragenden mobilen UX herauszuholen, muss der Inhalt möglicherweise einige Optimierungen und Änderungen erfahren.

Aber wo fängst du an? Wie sollten Inhalte so angepasst werden, dass sie nahtlos auf Mobilgeräten funktionieren? Es beginnt damit, darüber nachzudenken, wie Benutzer mit kleineren Bildschirmen interagieren und wie sich dies auf 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 Element angezeigt wird. Auch wenn Telefone wieder in Richtung größerer Größen zu tendieren scheinen, sollten Sie nicht versucht sein, viele Informationen auf dem Bildschirm zu speichern!

Ein Gedanke pro Bildschirm reicht aus. Mehr und Sie riskieren, den Benutzer zu überwältigen.

Benutzer mobiler Geräte sind in der Regel Multitasker. Sie schauen auf Ihre Website, während sie mit einem Freund sprechen, während sie an einem Baseballspiel teilnehmen. Indem Sie die Nachricht und den Inhalt einfach und direkt halten, haben Sie eine bessere Chance, dass ein einzelner 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 Auswahl zu treffen: Möchten Sie dies tun?

2. Priorisieren Sie die Navigation

Es sollte eine Handvoll Dinge geben, die Benutzer tun oder die sie tun sollen, wenn sie die mobile (responsive) Version Ihrer Website besuchen. Stellen Sie sicher, dass es eine einfach zu verfolgende Navigation gibt, mit der Benutzer schnell zu diesen Elementen gelangen.

Während ein Menü mit zehn Navigationsoptionen mit mehreren Ebenen auf Ihrer Desktop-Site möglicherweise funktioniert, sind mobile Benutzer häufig zeitaufwändiger. Sie haben nicht die Absicht, sich auf der Website umzuschauen, bis sie etwas finden.

Die Navigation muss einfach und rationalisiert sein. Wenn Sie sich nicht sicher sind, wo Sie anfangen sollen, sehen Sie sich die Analyse Ihrer mobilen Benutzer an. 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 den Algorithmus nicht. Erstellen Sie hochwertige Inhalte, die Benutzer lesen möchten.

Egal, ob Sie zehn Seitenaufrufe pro Tag oder Millionen erhalten, Sie möchten wie eine Suchmaschine denken, wenn es um Inhalte auf Mobilgeräten geht. Jedes Wort, Bild und jeder Inhalt muss schnell und durchsuchbar sein. Aber spielen Sie nicht den Algorithmus. Erstellen Sie hochwertige Inhalte, die Benutzer lesen möchten.

Wenn es um Mobilgeräte geht, kann dies bedeuten, dass einige Inhaltselemente reduziert werden. Wählen Sie beispielsweise anstelle von drei Bildern auf der Startseite das wichtigste Foto aus. Beschweren Sie Ihre mobile Website nicht. Webgeschwindigkeit und WLAN werden immer besser, aber einige Benutzer haben Probleme mit Verbindungen und Ihre Website muss weiterhin zugänglich sein.

Sie können die Geschwindigkeit mobiler Seiten mit diesem nützlichen Tool von Google überprüfen, mit dem Sie alles gut optimieren können.

4. Vergrößern Sie den Text

Kleinere Bildschirme sollten keinen kleineren Text bedeuten. Sie sollten die Punktgröße tatsächlich erhöhen, um das Lesen und Verdauen von Inhalten zu erleichtern. 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 dessen, was für Desktop-Bildschirme empfohlen wird.)

Es gibt noch andere Tricks, um Text auch auf kleinen Bildschirmen besser lesbar 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

Eine großartige Mikrokopie - der Text in Elementen wie Schaltflächen - kann das Design verändern oder verändern. Mikrokopie kann dem Design Persönlichkeit und Funken verleihen. Es vermittelt auch viele Informationen und hilft Benutzern, sich im Design zurechtzufinden.

Insbesondere auf Mobilgeräten sollten Sie die Mikrokopie etwas größer als normal gestalten und sie immer in Formularen verwenden, damit Benutzer genau wissen, was zu tun ist.

Denken Sie an häufige Probleme, auf die Sie stoßen, wenn Sie beispielsweise für etwas auf Ihrem Telefon bezahlen. Das Formular kann sich über mehrere Bildschirme oder Schriftrollen erstrecken. Die Führung der Mikrokopie kann es viel einfacher machen, beim ersten Mal alles richtig auszufüllen. (Eine Schlüsselkomponente beim Konvertieren von Aktionen von mobilen Benutzern.)

6. Entfernen Sie unnötige Effekte für Mobilgeräte

Entfernen Sie alles, was Sie für mobile Designs nicht benötigen.

Spinning-Animationen und Parallax-Scrolling-Funktionen sehen auf Desktop-Websites fantastisch aus, können jedoch mobile Versionen blockieren. Entfernen 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, behindern die sofortige Verbindung mit einem Benutzer.

Ein weiterer Effekt, den Sie entfernen können? Hover-Effekte. Es gibt keinen Schwebezustand für Berührungsaktionen.

Optimieren Sie die mobile Benutzererfahrung mit einer leicht verständlichen Tippfunktion (um das Klicken zu ersetzen), die ein offensichtliches Feedback enthält. Sie möchten nicht, dass Benutzer fragen, ob eine Aktion stattgefunden hat. es sollte immer offensichtlich sein.

7. An Skalierung anpassen

Nichts ist frustrierender als die Landung auf einer mobilen Website, auf der alles winzig ist. Das Ziel eines mobilen Designs besteht darin, die Website für Benutzer auf kleineren Geräten zugänglicher zu machen. Sie müssen den Inhalt an diese Skala anpassen.

Manchmal ist das Anpassen des Inhalts nur eine Neuanordnung von Teilen.

• Boxen, die auf einem Desktop über den Bildschirm ausgerichtet waren, können auf einem mobilen Gerät vertikal gestapelt werden.
• Fotos werden quadratischer oder vertikaler zugeschnitten, basierend auf der vorherrschenden Ausrichtung der mobilen Nutzung (vertikal).
• Der Text wird der Kürze halber bearbeitet und gekürzt.
• Die Navigation wird neu verwendet und an einem anderen Ort platziert.
• Handlungsaufforderungen werden zu größeren, fast bildschirmgroßen Elementen.
• Alle Schaltflächen und Tippelemente befinden sich an leicht erreichbaren Stellen, je nachdem, wie Benutzer ihre Telefone halten.

Fazit

Sind Sie bereit, einige Inhalte auf Ihrer Website zu überdenken? Wenn Sie eine reaktionsschnelle Website erstellt haben und einfach davon ausgegangen sind, dass alles mobile Benutzer konvertieren würde, ist es an der Zeit, den mobilen Teil des Designs zu bewerten. Möglicherweise gibt es Raum für kleine Änderungen an Inhalten, die die Art und Weise, wie Benutzer mit dem Design interagieren, wirklich verändern können.

Dies ist ein wesentlicher Bestandteil des Designprozesses. Sehen Sie sich Ihre Analysen an. Wie viel Prozent Ihrer Benutzer greifen auf das Design auf einem mobilen Gerät zu? Wenn Sie keine Anpassungen vornehmen, um ihren Anforderungen gerecht zu werden, können Sie einen großen Teil Ihrer Benutzerbasis entfremden, ohne sie beleidigen zu wollen.