Prestare attenzione quando si utilizzano queste tendenze di web design popolari

Pubblicato: 2018-02-14

Come la maggior parte dei prodotti culturali, il web design ha il suo spirito del tempo. Ogni anno vede un nuovo raccolto di componenti di design, funzionalità e tendenze popolari. Gli atteggiamenti cambiano rapidamente, soprattutto con il ritmo veloce dei nuovi sviluppi tecnologici.

Alcune tendenze del web design non resistono alla prova del tempo. Dovresti inserire tendenze che impediscano l'usabilità o scoraggiano i visitatori del sito in passato. I designer dovrebbero essere cauti nell'utilizzare le seguenti tendenze che possono alienare le stesse persone che stanno cercando di coinvolgere.

Spazio negativo insufficiente

Lo spazio negativo gioca un ruolo importante, ma spesso non celebrato, nell'usabilità. A volte chiamato spazio bianco, è lo spazio intorno e tra un'immagine o un elemento di design. Come nell'arte, lo spazio negativo nel web design ha il suo potere come elemento artistico. Sfortunatamente, alcuni considerano lo spazio negativo come spazio sprecato, ma proprio come le pareti dei musei hanno bisogno di spazio tra le opere d'arte, così anche i blocchi di web design. Lo spazio negativo rende i contenuti del tuo sito facili da leggere e da trovare.

bagigia esempio spazio bianco

I web designer farebbero bene a seguire il consiglio di Coco Chanel su come meno è di più: "prima di uscire di casa, guardati allo specchio e togli un accessorio". I web designer devono considerare come gli elementi CSS e HTML non hanno spazio vuoto per impostazione predefinita prima di iniziare ad aggiungere risorse extra.

Combina questo problema con il contenuto di alta qualità di cui ha bisogno un buon sito Web e il problema è ovvio: un sito Web eccessivamente accessoriato con troppi posti in cui cercare. Quando c'è molto spazio attorno a ogni elemento, gli utenti vedranno i tuoi contenuti e le tue CTA risalteranno.

Ci sono un paio di semplici soluzioni per un sito affollato. Innanzitutto, usa la capacità infinita dello scorrimento verticale. Quando la tua navigazione in alto è chiara, avere altri elementi secondari sotto la piega è perfettamente accettabile. Quando il tuo sito è inizialmente facile da navigare, agli utenti non dispiacerà cercare ulteriori informazioni. In secondo luogo, (e parleremo più avanti della tipografia) fai attenzione alle dimensioni dei caratteri. Troppo grande occupa spazio e può leggere in modo aggressivo, come un'e-mail del tuo capo in maiuscolo. È un equilibrio: trova un carattere che non travolga ma attiri comunque l'attenzione.

Menù Hamburger

Una delle tendenze di web design più importanti degli ultimi anni è stata il menu dell'hamburger. Questa tendenza è nata, in parte, a causa di un improvviso aumento degli utenti che accedono ai siti Web da dispositivi mobili. Il punto del menu dell'hamburger è nascondere la navigazione del menu in modo da non ingombrare lo spazio principale di una pagina. Gli utenti riconoscono le icone e di solito non hanno problemi a trovare il menu completo. È una buona idea se le persone sanno cosa vogliono prima di arrivarci.

icone del menu dell'hamburger

Il problema sorge quando un sito dipende dalla scoperta organica dei contenuti da parte di un utente. Come dice Luke Wrobleski, "l'ovvio vince sempre". Ed è ovvio: maggiore visibilità significa maggiore utilizzo. Consideriamo l'esempio di Facebook. Quando il social media è passato da un menu di hamburger in alto a una barra delle schede in basso sulla sua app iOS, il coinvolgimento degli utenti è andato alle stelle, così come una maggiore soddisfazione degli utenti, maggiori ricavi e velocità (e la sua percezione).

Limitare la quantità di altri contenuti che gli utenti scopriranno naturalmente è un gioco pericoloso. Nascondendo le categorie, i visitatori non sono immediatamente esposti alle opzioni.

I menu degli hamburger sono particolarmente dannosi per i siti di e-commerce, dove le aziende dipendono dall'esposizione degli utenti alle merci. Quando agli utenti viene richiesto di aprire il menu, potrebbero perdere gli aspetti più ovvi e importanti della tua attività. E se la tua attività dipende dai lettori che vedono un feed RSS, i menu degli hamburger dovrebbero essere completamente evitati; influiscono negativamente sui siti di notizie che dipendono dalla capacità dei lettori di vedere argomenti correlati e altri titoli attuali.

Caroselli in prima pagina

I caroselli in prima pagina sono onnipresenti in questo momento e puoi vederli su siti dalle pagine delle piccole imprese alle grandi società. I designer possono essere attratti dai caroselli perché creano economia visiva, fornendo molte informazioni attraverso una caratteristica.

Se la tua azienda sta ancora cercando di ottenere il suo nome, usa i caroselli con cautela. I caroselli rendono più difficile per le persone trovare la tua pagina e possono avere un impatto negativo sull'ottimizzazione dei motori di ricerca (SEO) perché in genere significano meno contenuti nel corpo della pagina. Meno testo sulla pagina significa meno metainformazioni da trovare da parte di Google.

grafica a carosello

Ci sono soluzioni alternative, tuttavia, come fare un punto per aggiungere testo alla pagina stessa, ma questo mina il punto di usare un carosello per l'economia visiva. I caroselli possono anche causare gravi problemi di accessibilità su un sito. Sono noti per rallentare il tempo di caricamento e spesso usano JavaScript, che può causare problemi di prestazioni.

I caroselli non solo rendono un sito meno accessibile, ma non coinvolgono con successo i visitatori che possono accedervi. Uno studio del 2013 ha rilevato che circa l'1% dei visitatori del sito ha fatto clic su un carosello, a seconda che il carosello stesse trasmettendo automaticamente o manualmente.

E se consideriamo i consigli che Wroblewski offre sui menu degli hamburger, il problema è lo stesso con i caroselli: non sono ovvi. Nello studio sopra, l'83% dell'1% che ha cliccato, ha cliccato sulla prima immagine. Cosa significa per le altre quattro immagini con cui speri di catturare gli utenti? Non ottengono chilometri e fanno poco per promuovere il coinvolgimento.

Wroblewski utilizza il design del carosello di PJ McCormick su Amazon come esempio che funziona davvero. Le immagini sono divise in segmenti e quando l'utente passa con il mouse su una sezione particolare, diventa l'immagine nel carosello, rendendo ovvio che gli utenti possono fare clic lì per trovare ciò che stanno cercando.

Popup

I menu a discesa possono essere complicati da utilizzare anche dagli utenti più esperti, aggiungi quella complessità al piccolo schermo ed è un incubo per la navigazione. I controlli del menu a comparsa, d'altra parte, offrono un elenco contenuto di opzioni di menu che possono essere facilmente visualizzate indipendentemente dall'acutezza o dall'andatura dell'utente. L'iPhone di Apple ne è un buon esempio: trascina, scorri o spingi verso il basso: l'obiettivo grande e le opzioni tolleranti lo rendono facile da controllare.

Se fatti bene, i popup sono ottimi per input composti - input per date, altezze, pesi - e rendono il processo molto più snello.

Ad esempio, invece di tre opzioni per inserire una data – il giorno, il mese e l'anno – un singolo campo della data può aprire una serie di menu a comparsa che consentono agli utenti di scorrere tre elenchi contemporaneamente per inserire la data corretta. Questa semplice soluzione può ridurre il tempo di input insieme all'impazienza dell'utente.

Combinare lo scorrimento infinito con il contenuto del piè di pagina

Lo scorrimento infinito può essere un utile strumento di progettazione. Il caricamento di contenuti senza fine e senza sforzo può produrre un'esperienza utente soddisfacente. Siti come Pinterest utilizzano lo scorrimento infinito con ottimi risultati e sono in parte responsabili di mantenerlo alla moda. Sebbene lo scorrimento verticale sia stato un grande successo per alcune app, lo scorrimento orizzontale confonde ancora molti utenti. Spesso non si rendono nemmeno conto che è un'opzione. Se il contenuto sembra finire, saranno allo stesso modo perplessi.

Scorrimento infinito

Lo scorrimento infinito diventa un problema quando un sito ha anche un piè di pagina con contenuto a cui gli utenti potrebbero voler accedere. Gli utenti scorreranno verso il basso e verso il basso e non saranno in grado di raggiungere il piè di pagina. Gli utenti mobili esperti lo capiranno, ma se li frustra, potrebbero non provarci. Oltre ad essere ovvia, la navigazione dovrebbe essere facile.

Schermate a caricamento lento

Il motivo principale per cui gli utenti abbandonano un sito, a causa di una frana, è il tempo di caricamento lento. Nei sondaggi, circa la metà degli utenti afferma che non aspetterà più di 10 secondi per il caricamento di una pagina. Man mano che ci siamo abituati a connessioni e dispositivi Internet più veloci, le persone si aspettano che le pagine vengano caricate quasi istantaneamente. Più tempo impiega una schermata per caricarsi, più è probabile che un utente se ne vada.

Gli utenti non dovrebbero assumersi la colpa per questo, la tecnologia ha semplificato abbastanza delle nostre esperienze da diventare un'aspettativa. Quando stai bilanciando contenuti complicati che potrebbero rallentare il tuo tempo di caricamento, considera se sarà importante se nessuno lo vede. Gli utenti mobili non stanno seduti a bere latte macchiato mentre controllano il tuo sito web: sono in movimento e si aspettano che la loro esperienza mobile sia altrettanto veloce.

Tipografia inutilmente complicata

Con la varietà di caratteri tipografici disponibili oggi, i web designer potrebbero essere tentati di utilizzare un numero di caratteri su una singola pagina. C'è una linea guida tipografica spesso citata secondo cui non si dovrebbero mai usare più di due o tre caratteri in un singolo documento.

Sebbene possano esserci circostanze che giustificano più font, di solito è meglio concentrarsi su una consegna chiara e chiara delle informazioni. Wroblewski offre i suoi appunti sulle migliori pratiche di tipografia di Tim Brown. Uno degli elementi più importanti per la tipografia è l'equilibrio: l'equilibrio nelle dimensioni, nella guida e in misura migliora la leggibilità e l'estetica. Qual è lo scopo di un font se non per essere letto? Oscurare la chiarezza per il design è controintuitivo e non aumenterà il numero di lettori.

buon carattere cattivo carattere

La scelta di uno o due caratteri crea un aspetto unificato e aiuta gli utenti a identificare meglio un marchio. Ricorda, l'obiettivo è coinvolgere gli utenti. I caratteri multipli di troppe dimensioni rendono un sito difficile da leggere comodamente. Se il testo è illeggibile, nessuno rimarrà sulla pagina per un certo periodo di tempo.

Elementi fluttuanti

Gli elementi mobili possono essere un ottimo modo per attirare l'attenzione di un utente, ma se cronometrati in modo inappropriato, possono alienare i tuoi utenti bloccando parte della pagina e distraendoli da ciò che vogliono vedere. Tutto, ma assicura che non interagiranno con un sito. Gli elementi mobili sono particolarmente frustranti per gli utenti mobili che tentano di accedere a un sito su uno schermo più piccolo.

Inoltre, gli elementi mobili spesso non funzionano come previsto, aprendosi anche quando sono chiusi e fluttuando su importanti funzionalità della pagina. Più complicata diventa l'esperienza dell'utente, meno è probabile che continui a utilizzare il sito.

Scorrimento della parallasse

Lo scorrimento in parallasse non è necessariamente una cattiva scelta di design ed è stato utilizzato con grande efficacia in molte campagne di marketing. Offre una nuova opzione ai siti per differenziarsi e recentemente è diventato popolare.

Viene fornito con alcuni inconvenienti. Come con i caroselli, può influire negativamente sulla SEO perché c'è meno contenuto per la scansione dei motori di ricerca. Anche lo scorrimento in parallasse non è una buona scelta di design per i siti che dovrebbero essere accessibili da dispositivi mobili. Poiché si basa su JavaScript e molta grafica, può causare il caricamento di una pagina molto lentamente, aumentando la probabilità che un utente diventi impaziente e se ne vada prima che la pagina venga caricata.

Fai il miglior uso delle tendenze

Sebbene esistano sicuramente applicazioni appropriate per tutte queste tendenze, i web designer dovrebbero riflettere attentamente prima di decidere di usarle. La regola migliore per qualsiasi designer è dare più peso alla funzionalità e all'esperienza utente rispetto alla tendenza lampo. Tieni a mente i consigli di Luke Wroblewski con qualsiasi progetto e sii ovvio. Non importa quanto sia buono il contenuto, se è nascosto, è inutile.