L'inizio di un grande design inizia con il contenuto. Per ottenere il massimo da una UX mobile stellare, il contenuto potrebbe dover subire alcune modifiche e modifiche.
Ma da dove inizi? In che modo il contenuto dovrebbe essere adattato per funzionare senza problemi sui dispositivi mobili? Comincia col pensare al modo in cui gli utenti interagiscono con gli schermi più piccoli, e come questo influisce su cosa (e quanto!) Vorranno leggere.
1. Un pensiero per schermo
Quando comprimi contenuti per dispositivi mobili, prova a pianificare gli elementi in modo che ce ne sia uno per schermo. Anche se i telefoni sembrano essere di tendenza verso le taglie più grandi, non essere tentato di riempire un sacco di informazioni sullo schermo!
Un pensiero per schermo è sufficiente. Ancora e rischi di travolgere l'utente.
Gli utenti di dispositivi mobili tendono a essere multi-taskers. Stanno guardando il tuo sito web mentre parlano con un amico mentre partecipano ad una partita di baseball. Mantenendo il messaggio e il contenuto semplice e diretto, hai una migliore possibilità di comunicare un singolo pensiero.
Ma come si presenta un pensiero? È un blocco di testo, immagini e elementi utilizzabili che sono tutti legati insieme. Il gruppo di contenuti dovrebbe chiedere agli utenti di fare una scelta: vuoi farlo?
2. Dare priorità alla navigazione
Ci dovrebbe essere una manciata di cose che gli utenti tendono a fare, o che vuoi che facciano, quando visitano la versione mobile (reattiva) del tuo sito web. Assicurati che ci sia una navigazione facile da seguire che porti rapidamente gli utenti a questi elementi.
Mentre un menu di dieci opzioni di navigazione con più livelli potrebbe funzionare sul tuo sito desktop, gli utenti di dispositivi mobili hanno spesso più tempo. Non hanno intenzione di curiosare nel sito finché non trovano qualcosa.
La navigazione deve essere semplice e snella. Se non sai da dove iniziare, dai un'occhiata alle analisi dei tuoi utenti mobili. Quali sono le prime tre o quattro pagine visitate? Queste pagine sono in linea con quello che ti aspetti? Hai trovato gli elementi chiave di navigazione in modo da poter regolare di conseguenza i contenuti mobili.
3. Pensa come un motore di ricerca
Non riprodurre l'algoritmo. Crea contenuti di qualità che gli utenti desiderano leggere. Se ricevi dieci visualizzazioni di pagina al giorno o milioni, vuoi pensare come un motore di ricerca quando si tratta di contenuti su dispositivi mobili. Ogni parola, immagine e parte del contenuto deve essere veloce e ricercabile. Ma non suonare l'algoritmo. Crea contenuti di qualità che gli utenti desiderano leggere.
Quando si tratta di dispositivi mobili, ciò potrebbe significare abbattere alcuni elementi di contenuto. Ad esempio, anziché tre immagini sulla home page, scegli la foto più importante. Non appesantire il tuo sito mobile; le velocità del Web e il Wi-Fi migliorano continuamente, ma alcuni utenti avranno difficoltà con le connessioni e il tuo sito web deve ancora essere accessibile.
Puoi controllare la velocità della pagina mobile con questo strumento elegante di Google, che ti aiuta a mantenere tutto ottimamente ottimizzato.
4. Rendi il testo più grande
Più piccoli schermi non dovrebbe significare più piccolo testo. Dovresti effettivamente aumentare le dimensioni dei punti per rendere i contenuti più facili da leggere e da digerire. Dai un'occhiata alla tua copia del corpo e opta per una dimensione che consenta da 30 a 40 caratteri per riga. (Questo è circa la metà di ciò che è consigliato per gli schermi desktop).
Ci sono altri trucchi per rendere il testo più leggibile anche sui piccoli schermi. Puoi trovare quelli in un precedente articolo di Design Shack sui suggerimenti per la progettazione di una migliore tipografia mobile.
5. Scrivi Microcopy Significativa
La grande microcopia - il testo all'interno di elementi come i pulsanti - può creare o distruggere il design. Microcopy può aggiungere personalità e scintilla al design. Trasmette anche una grande quantità di informazioni e aiuta gli utenti a orientarsi nel design.
Sui dispositivi mobili, in particolare, considera di rendere la microcopia un po 'più grande del normale e usarla sempre nei moduli per aiutare gli utenti a sapere esattamente cosa fare.
Pensa ai problemi comuni che incontri quando paghi qualcosa sul tuo telefono, per esempio. Il modulo può estendersi su più schermi o pergamene; guidare la microcopia può rendere molto più facile riempire tutto correttamente la prima volta. (Un componente chiave nella conversione di azioni da utenti mobili.)
6. Elimina gli effetti non necessari per il mobile
Elimina tutto ciò che non ti serve per i design mobili. Le animazioni di rotazione e le funzionalità di scorrimento della parallasse sono straordinarie sui siti Web desktop, ma possono rovinare versioni mobili. Elimina tutto ciò che non ti serve per i design mobili. Vuoi che tutto si carichi rapidamente e senza problemi; le animazioni che potrebbero funzionare o meno potrebbero ostacolare il collegamento con un utente immediatamente.
Un altro effetto che puoi eliminare? Effetti al passaggio del mouse. Non esiste uno stato di hover per le azioni touch.
Razionalizza l'esperienza dell'utente mobile con una funzionalità di tocco di facile comprensione (per sostituire il clic) che ha un evidente feedback. Non si desidera che gli utenti si interroghino se si è verificata un'azione; dovrebbe sempre essere ovvio.
7. Adatta alla scala
Niente è più frustrante dell'atterraggio su un sito mobile reattivo dove tutto è piccolo. Il punto di avere un design mobile è quello di rendere il sito più accessibile agli utenti su dispositivi più piccoli. Devi adattare il contenuto a quella scala.
A volte l'adattamento del contenuto è solo un riarrangiamento delle parti.
- Le scatole allineate sullo schermo su un desktop potrebbero essere impilate verticalmente su un dispositivo mobile.
- Le foto sono ritagliate più quadrate o verticalmente in base all'orientamento dominante dell'uso mobile (verticale).
- Il testo è modificato e ritagliato per brevità.
- La navigazione viene riproposta e collocata in una posizione diversa.
- Gli inviti all'azione vengono trasformati in elementi più grandi, quasi a schermo.
- Tutti i pulsanti e gli elementi di tocco sono collocati in posizioni facili da raggiungere, in base al modo in cui gli utenti tengono i loro telefoni.
Conclusione
Sei pronto a ripensare alcuni dei contenuti sul tuo sito web? Se hai creato un sito web reattivo e hai semplicemente dato per scontato che tutto ciò avrebbe convertito gli utenti mobili, è giunto il momento di valutare la parte mobile del progetto. È probabile che ci sia spazio per piccole modifiche ai contenuti che possono davvero cambiare il modo in cui gli utenti interagiscono con il design.
Questa è una parte vitale del processo di progettazione. Dai un'occhiata alle tue analisi. Quale percentuale della tua base di utenti accede al design su un dispositivo mobile? Se non stai apportando delle modifiche per soddisfare i loro bisogni, potresti alienare un ampio segmento della tua base di utenti senza volerlo offendere.