Quando si tratta di progettare un sito web, è facile rimanere bloccati quando c’è da risolvere la questione estetica e visiva del sito. Tuttavia, in un mondo in cui le persone dispongono di oltre 1,8 miliardi di siti web da visitare, bisogna assicurarsi che il proprio sito sia creato a regola d’arte e che, soprattutto, sia stato progettato in modo da favorire l’usabilità, la praticità e l’esperienza utente (UX), che dev’essere piacevole e senza intoppi. Detto questo, potreste passare anni a studiare i dettagli di queste discipline. Ma per darvi un punto di partenza, abbiamo vagliato per voi delle linee guida fondamentali da applicare alla progettazione di un sito, con un’attenzione specifica su come creare un portfolio e sito web professionale.
La semplicità come primo step da cui partire
Sebbene l’aspetto del vostro sito web sia sicuramente importante, la maggior parte delle persone non viene sul sito per valutare quanto sia elegante il design. Vogliono completare alcune azioni o trovare informazioni specifiche. Pertanto, gli elementi di design non necessari (ovvero quelli che non servono a uno scopo funzionale) non faranno altro che confondere i visitatori e rendere loro più difficile capire ciò che stanno facendo. Dal punto di vista dell’usabilità e della UX, la semplicità è la vostra migliore alleata. Se avete tutti gli elementi della pagina necessari, è difficile andare troppo sul semplice. Potete utilizzare questo principio in una varietà di forme diverse, come ad esempio per i colori. Meglio evitare l’utilizzo di troppi colori e in contrasto tra di loro. Il Manuale di interazione uomo-macchina consiglia di utilizzare un massimo di cinque (più o meno due) colori diversi nel progetto.
Caratteri tipografici
I caratteri tipografici che scegli dovrebbero essere ben leggibili; niente di troppo artistico e anzi, caratteri tipografici molto minimali se presenti. Per il colore del testo, ancora una volta, mantenetelo minimale e assicuratevi che sia sempre in contrasto con il colore di sfondo. Una raccomandazione comune consiste nell’utilizzare un massimo di tre diversi caratteri tipografici in un massimo di tre diverse dimensioni.
Per quanto riguarda il discorso legato alla grafica: deve essere sempre versatile e funzionale per far completare un’attività o eseguire una funzione specifica per l’utente che visita il nostro sito web.
Il concetto di gerarchia visiva
Strettamente legata al principio di semplicità, per gerarchia visiva si intende disporre e organizzare gli elementi del sito web in modo che i visitatori gravitino naturalmente prima verso gli elementi più importanti.
Ricordate: quando si tratta di ottimizzare l’usabilità e l’UX, l’obiettivo è portare i visitatori a completare l’azione desiderata, ma in un modo che sembri naturale e divertente. Regolando la posizione, il colore o la dimensione di determinati elementi, potete strutturare il sito in modo tale che gli spettatori siano prima attratti da quegli elementi.
La navigabilità
La pianificazione della navigazione intuitiva sul vostro sito è fondamentale per aiutare i visitatori a trovare ciò che stanno cercando. Idealmente, un visitatore dovrebbe atterrare sul vostro sito senza pensare a dove fare clic dopo. Spostarsi dal punto A al punto B dovrebbe essere il più semplice e intuitivo possibile, per quei visitatori che lo visitano per la prima volta.
Alcuni suggerimenti per ottimizzare la navigazione del vostro sito
Mantenete la struttura della navigazione principale semplice (e vicino alla parte superiore della pagina). Prendete in considerazione l’utilizzo di breadcrumb su ogni pagina (tranne che sulla home page) in modo che gli utenti ricordino il percorso di navigazione. Includete una barra di ricerca nella parte superiore del sito in modo che i visitatori possano effettuare ricerche per parole chiave. Non offrire troppe opzioni di navigazione per pagina. Serve essere chiari, semplici. Includete collegamenti all’interno della vostra copia della pagina e chiarite dove vanno quei collegamenti.
Non costringete gli utenti a navigare troppo approfonditamente. Provate invece a creare una mappa wireframe base di tutte le pagine del sito, disposte a piramide: la vostra home page sarà in alto e ogni pagina collegata dalla precedente formerà il livello successivo.
Una volta impostata la navigazione principale (primaria) del vostro sito, mantenetela coerente. Le etichette e la posizione della navigazione dovrebbero rimanere le stesse su ogni pagina.
La coerenza è un altro aspetto fondamentale per un buon sito web
Oltre a mantenere la navigazione coerente, l’aspetto generale del sito dovrebbe essere simile in tutte le sue pagine. Sfondi, combinazioni di colori, caratteri tipografici e persino il tono della scrittura sono tutte aree in cui la coerenza ha un impatto positivo sull’usabilità e sull’esperienza utente. Questo non vuol dire che ogni pagina dovrebbe seguire lo stesso layout. Anzi, create layout diversi per tipi specifici di pagine (ad es. landing page, pagine informative, ecc.). Utilizzando questi layout in modo coerente, renderete ai visitatori più facile capire che tipo di informazioni potrebbero trovare su una determinata pagina.
Secondo Statista, il 48% delle visualizzazioni globali delle pagine proveniva da dispositivi mobili come smartphone e tablet. Secondo le ultime ricerche il 93% delle persone ha lasciato un sito web perché non veniva visualizzato correttamente sul proprio dispositivo. Per poter fornire un’esperienza utente davvero eccezionale, il vostro sito deve essere compatibile con i diversi dispositivi utilizzati dai potenziali visitatori. Nel mondo tecnologico, ciò è noto come design reattivo. Design reattivo significa investire in una struttura da sito web altamente flessibile. In un sito reattivo, il contenuto viene ridimensionato e riadattato automaticamente per adattarsi alle dimensioni del dispositivo che un visitatore sta utilizzando. Questo può essere ottenuto con modelli HTML ottimizzati per dispositivi mobili, o creando un sito dedicato per i dispositivi mobili. In definitiva, è più importante fornire un’esperienza eccezionale su diversi dispositivi piuttosto che far sembrare tutto identico tra di essi. Oltre alla compatibilità con i dispositivi mobili, vale la pena testare la compatibilità cross-browser del sito web. Con ogni probabilità, avete visualizzato il vostro sito solo su un browser web, che si tratti di Google Chrome, Safari, Firefox o altro ancora. Adesso è il momento di aprire le pagine su ciascuno di questi browser e valutare come appaiono i propri elementi. In teoria, non c’è molta differenza nella presentazione, ma non lo saprete con certezza finché non lo vedrete con i vostri stessi occhi.
L’accessibilità del vostro sito
L’obiettivo dell’accessibilità al web consiste nel creare un sito web che chiunque possa utilizzare, comprese le persone con disabilità o limitazioni che incidono sulla loro esperienza di navigazione. In qualità di designer di siti web, è vostro compito pensare anche a questa tipologia di utenti, che utilizzano e fanno grande affidamento su internet e sul web, come certamente già saprete.
