È tempo di parlare del design del primo schermo. La prima schermata è quella prima visione che un utente accede al tuo sito web. È tutto sopra la pergamena, se l'utente accede a un sito Web da un desktop, tablet o dispositivo mobile.
Le informazioni che includi in questa? Prima schermata? è la chiave per il successo del sito web. Il design può attirare e fare in modo che gli utenti facciano clic o li costringano ad allontanarsi dalla pagina. Cosa deve essere visualizzato sullo schermo prima che gli utenti inizino a scorrere? Diamo un'occhiata.
1. Crea una prima schermata distinta
Inizia con una prima impressione. Il tuo sito web dovrebbe crearne uno con impatto.
Vai alla grande con una visuale - foto, video o illustrazione - per afferrare il pubblico fin da subito. L'immagine dovrebbe essere qualcosa che le persone non possono smettere di guardare. E dovrebbe essere totalmente tuo e diverso da qualsiasi altro sito web.
Abbina le immagini con alcune parole chiave per dire agli utenti perché sono lì e cosa il tuo sito ha da offrire. (Questa è la tua migliore possibilità di vendere il vantaggio di fare clic sul tuo sito.)
Ecco la cosa che unisce tutto: la prima schermata deve adattarsi precisamente a quella prima schermata. Il contenuto deve essere ridimensionato in modo responsivo al dispositivo in modo che l'intera immagine e tutta la copia associata siano chiaramente visibili senza un singolo scorrimento.
2. La navigazione dovrebbe essere intuitiva
Sono finiti i giorni in cui la navigazione deve eseguire l'altezza della pagina in una barra laterale o nella parte superiore dello schermo. Gli stili di navigazione nascosti e pop-out sono diventati così popolari (grazie in parte ai dispositivi mobili) che è accettabile per tutti i progetti di siti web.
Ma non nascondere la navigazione o renderla difficile da usare. Piaccia o no il menu di navigazione in stile hamburger è diventato l'uso più dominante per la navigazione nascosta. Gli utenti hanno imparato a lavorarci e possono trovare le cose sulle pagine con facilità.
Assicurati di posizionare l'icona impilata in una posizione che è facile da trovare, puoi renderla più grande di un'icona tipica e assicurarti che la navigazione sia perfettamente funzionante con quel clic. Uve, sopra, fa un ottimo lavoro con un'icona del menu di un hamburger prominente che si espande in una lista a schermo intero di opzioni di menu. E soprattutto, gli utenti non devono indovinare come usarlo.
3. Creare un punto focale
Quando si lavora su una singola tela, come la prima schermata, è importante creare una messa a fuoco singola o un messaggio. Gli utenti sono arrivati sul tuo sito, intenzionalmente o per caso, e hanno bisogno di sapere di cosa si tratta.
Un singolo concetto visivo può aiutare gli utenti a creare l'idea di cosa e chi sei. Questo può essere realizzato con immagini o testo in diversi modi.
Mentre gli stili complessi possono funzionare, iniziare pensando semplice. Il minimalismo è alla moda e un modo efficace per aiutare a trasmettere informazioni.
4. Scrivi Copia con Scopo
Pensa al primo schermo come copertina di un libro, non alla prima pagina di un romanzo.
Dovrebbe includere solo una copia sufficiente per aiutare gli utenti a impegnarsi. Un titolo semplice e un piccolo blocco di copia sono in genere sufficienti per farlo. Sebbene le parole siano poche, questo può essere un processo che richiede molto lavoro. Scrivere una copia concisa e chiara può essere una sfida.
Pensa agli obiettivi del tuo sito come linea guida. Perché gli utenti sono qui? Cosa vuoi che facciano? Usa la copia per creare quella connessione e inizia a raccontare la tua storia. Ricordati di vendere il vantaggio del tuo sito all'utente.
5. Dà agli utenti qualcosa da fare
Sebbene i siti web offrano esperienze visive distinte, devono anche fornire un motivo per cui gli utenti devono restare in attesa. Il tuo primo schermo deve dare agli utenti qualcosa da fare.
Le azioni possono includere:
- Compilare un modulo, ad esempio fornire un indirizzo email
- Giocare un gioco
- Condivisione sui social media
- Navigando tra gli articoli in vendita
- Commentando o coinvolgendo il contenuto
- Guarda un film o una presentazione
Non solo la prima schermata dovrebbe includere una di queste azioni, dovrebbe essere perfettamente chiaro qual è l'azione e cosa l'utente dovrebbe fare. Il design dovrebbe attirarli abbastanza da sentirsi obbligati a farlo.
Il sito Web di The Big Short, sopra, offre agli utenti molte cose da fare. I video clip sono sufficienti a renderti interessato al film e c'è un pulsante per guardare il trailer. Interessato a questa storia vera? C'è un pulsante per incontrare gli esperti. L'hai già visto e vuoi condividere i tuoi pensieri? Ci sono pulsanti social media. Ci sono molti modi per interagire con il sito fin dall'inizio.
6. Crea spazio per il marchio
Un sito Web non farà molto bene se non sai a chi appartiene. La prima schermata dovrebbe includere almeno un logo o una connessione alla marca dietro il sito.
Un nome di marca o società crea legittimità e credibilità. Rende il sito più realistico? (Questo è particolarmente importante per i siti che includono qualsiasi tipo di transazioni finanziarie o personali, in modo che gli utenti sappiano chi sta ottenendo le loro informazioni.)
I marchi più grandi possono farla franca con marchi più piccoli sui loro primi schermi perché è probabile che molte persone li conoscano già. (Chi conosci che non riconoscerebbe gli archi dorati che sono diventati simbolo di McDonald's?) Per i marchi più piccoli, mostrare chiaramente un logo e uno stile è importante per creare un'identità che gli utenti possano associare e fidarsi.
7. Riduci al minimo le distrazioni
Non dare agli utenti troppo da guardare o trattare in quella prima schermata. Dovrebbe essere semplice, snella e mirata.
Se disponi di molti contenuti, spostali su più schermi. (Ciò può promuovere l'impegno e prevenire una struttura del sito disordinata o disordinata).
Melanie DaVeid fa un ottimo lavoro con un'estetica semplice che ti rende interessato al suo altro lavoro. Con semplici tocchi di animazione, colori e bellissime scritte, il primo schermo crea una sensazione, un focus e una linea d'azione distinti per gli utenti.
Conclusione
Mentre la pergamena sta tornando di moda, il modo in cui lo progettiamo è cambiato. I migliori design dei siti utilizzano responsive design e funzioni di scorrimento (come la parallasse) per creare un'esperienza basata sullo schermo per gli utenti.
E il primo schermo è il più importante. Assicurati di creare un elemento visivo interessante, leggibile e distinto per portare gli utenti nel tuo sito.