A volte i siti web mi fanno brontolare. Clicco con anticipazione e poi? disastro di progettazione. Ammettilo, hai brontolato allo schermo più di un paio di volte.
Dal tipo scadente ai collegamenti mancanti ai problemi di usabilità, condividerò gli errori che mi fanno impazzire. Badate! Queste sono cose da affrontare e risolvere sul tuo sito, prima che qualcun altro li incontri!
1. Mancanza di contrasto
Il testo e le immagini sul tuo sito web devono essere leggibili. Il modo più semplice per farlo è attraverso il contrasto. Ma troppi designer dimenticano questo semplice fatto.
Il problema più grande è spesso la mancanza di contrasto tra il testo e lo sfondo, rendendo le scritte illeggibili. (Non è questo il senso del contenuto?)
È importante assicurarsi che ogni posizione contenga un sufficiente contrasto con gli elementi circostanti per metterla a parte in modo che gli elementi siano indipendenti. Ricorda alcune delle nozioni di base del design quando pensi al contrasto: colore, spazio e dimensioni. L'utilizzo di questi elementi ti aiuterà a distinguere gli elementi l'uno dall'altro.
L'immagine sopra contiene due problemi di contrasto con il testo. Guarda il colore dei link sullo sfondo. Il testo è abbastanza difficile da leggere. Quindi guarda la dimensione del testo rispetto alla scala delle immagini sullo schermo. È troppo piccolo e le scritte bianche su uno sfondo chiaro complicano il problema.
2. Scarsa navigazione e flusso
Dal momento in cui atterro sul tuo sito, dovrei sapere cosa ti aspetti che io faccia dopo. I modelli di clic e il flusso di informazioni dovrebbero essere piuttosto ovvi. (Questo è uno dei motivi per cui la navigazione e i menu sono spesso nella parte superiore della pagina).
I trucchi e gli effetti di navigazione dovrebbero essere chiaramente etichettati e funzionare intuitivamente. Questo è per tutti voi che state sperimentando lo scrolling da sinistra a destra o altri effetti animati insoliti - date agli utenti qualche tipo di indicazione su come funziona. Gli utenti frustrati con trucchi di progettazione complicati causeranno l'abbandono del sito.
3. Uso o trattamento scadente della foto
Non c'è niente di peggio di una grande immagine oscurata da altri elementi di design. Se ti stai prendendo il tempo di usare immagini fantastiche sul tuo sito, usale senza troppi effetti sovrapposti. Aggiungi una semplice riga di testo e fermati. (Da qui la popolarità dei pulsanti fantasma.)
Mentre ci sono molti modi in cui questo può accadere, la trappola si verifica spesso quando i designer cercano di essere "troppo trendy". Le intestazioni degli eroi sono divertenti. I cursori sono fantastici. Ma quando accoppi questi elementi con il testo possono diventare pericolosi. Ogni immagine del set deve funzionare con il testo in modo che ogni parola sia leggibile e che tutti gli elementi importanti nella foto siano visibili.
Non coprire le parti importanti di un'immagine con testo o pulsanti. Se pensi che questo accada nel tuo design, forse sarebbe meglio optare per uno sfondo semplice e usare le foto altrove.
A prima vista, l'immagine sopra ti cattura perché è nello stile di disegno legale. Ma guarda più da vicino, i volti sono oscurati dal testo e tutto diventa un po 'confuso usando una testimonianza che non ha bisogno di coprire l'immagine.
4. Non usare una griglia
C'è una certa quantità di caos felice nel web design; l'asimmetria è uno di questi elementi. La mancanza di una griglia non lo è.
Usare una griglia è uno di quei lucidi professionali che distingue il buon design dal cattivo. Le griglie aggiungono chiarezza e organizzazione, aiutano a creare una spaziatura adeguata e coerente tra gli elementi e aiutano a darti un'idea di dove e come posizionare gli elementi. La griglia può aiutare a focalizzare il processo decisionale per il dimensionamento degli elementi, la dimensione e lo spazio del testo e la progettazione all'interno di proporzioni che vengono opportunamente ponderate.
5. Non utilizzo del design reattivo
Per favore, per carità, usa un framework responsive per i tuoi siti web. Il tuo sito deve funzionare su un telefono cellulare. Periodo. Al contrario, ha anche bisogno di funzionare altrettanto bene sul mio desktop.
Continuo a trovare siti che vengono visualizzati come pagine web complete sul mio telefono. I siti web che non sono reattivi, o che sono privi di una versione mobile, perdono ogni giorno traffico e conversioni. (Mentre più raro, i siti che offrono solo versioni mobili sono ugualmente frustranti).
E molti altri utenti probabilmente sono come me, se provo il tuo sito sul mio telefono e non funziona, non ritorno né provo nemmeno sul mio desktop.
6. Collegamenti mancanti
I collegamenti interrotti sono una delle maggiori frustrazioni del web. Prendi l'abitudine di eseguire un audit di link annuale per il tuo sito. Questo è qualcosa che puoi fare manualmente o con l'aiuto di uno strumento come Website Link Checker.
L'altra cosa che mi infastidisce? Quando il logo non è un collegamento alla pagina iniziale da ogni pagina. Ci dovrebbe sempre essere una casa? funzione. (E mentre ci sei, non disabilitare il pulsante Indietro.)
Quando si tratta di collegamenti, pensa all'usabilità. Assicurati che i link, specialmente quelli in-text, siano visibili e abbastanza grandi da fare clic o toccare senza ottenere un link adiacente per sbaglio. Non includere troppi collegamenti nel testo per questo motivo perché può essere difficile toccare il link corretto, specialmente su dispositivi più piccoli.
7. Riproduzione automatica del suono
L'audio sul tuo sito web può essere divertente. Il suono che suona senza chiedere conferma non lo è.
Si dovrebbe sempre dare agli utenti un'opzione di attivazione / disattivazione dell'audio e l'impostazione predefinita è disattivata. Il suono può essere sorprendente per gli utenti, potrebbe non essere sicuro per gli ambienti di lavoro ed è generalmente fastidioso. La maggior parte degli utenti desidera avere il controllo dell'esperienza di visualizzazione del sito Web e il suono di riproduzione automatica elimina alcuni di questi controlli. Sono molto più propenso a interagire con il suono e suonarlo se mi viene data l'opzione; l'auto-play mi porta spesso a lasciare il sito senza cercare un posto in cui tacere.
Ci sono alcuni posti in cui questo può essere complicato: la pubblicità, per esempio. Se hai qualcosa che contiene suoni che devono essere riprodotti, prendi in considerazione una casella di stile a comparsa con un pulsante di disattivazione audio di grandi dimensioni.Gli utenti sono più? Addestrati? accettare alcuni secondi di riproduzione degli annunci per visualizzare i contenuti. Non è ancora una situazione ideale, ma può essere una soluzione migliore.
Guarda l'immagine dal sito qui sopra. Riproduce automaticamente i suoni - dovrebbero essere tranquilli - ma vedi se riesci a individuare il suono a colpo d'occhio. Il pulsante è piuttosto piccolo, soprattutto rispetto alla scala di altri elementi.
7 Altri pet peeves
Purtroppo, ci sono molte altre piccole cose che possono farmi impazzire durante la navigazione sul web. Cerca di non cadere vittima di nessuno di questi errori incuranti.
- Nessuna ricerca
- Errori di grammatica o errori di ortografia
- Nessuna chiamata all'azione
- Troppi collegamenti nella copia
- Testo sillabato
- Pulsanti super-piccoli
- Scarsa tipografia e leggibilità
Conclusione
Cadere in alcune trappole di design è troppo facile e può capitare a chiunque. (Troverai anche alcuni di questi errori in agguato nei siti con un ottimo design complessivo.)
Quindi, fai attenzione e concentrati sui dettagli durante tutto il processo di progettazione e avvio in modo da poter evitare molti di questi problemi. Non vuoi rendermi scontroso, vero?