• UI E UX

Principio di Pareto nel web design: progettare un sito web più efficace con la regola dell'80/20

  • Lene Wandrey
  • 10 min read
Principio di Pareto nel web design: progettare un sito web più efficace con la regola dell'80/20

Il problema di essere perfezionisti nel web design

Il perfezionismo può essere una sfida per molti graphic e web designer. La ricerca dell'eccellenza è ammirevole, ma può portare alla frustrazione di dover cambiare e modificare all'infinito finché ogni elemento del sito web non è perfetto. Per molti designer è facile farsi travolgere dal processo di progettazione e perdere la cognizione del tempo mentre si scelgono caratteri tipografici, palette di colori e si rimugina su centinaia di decisioni di design perfette al pixel. Certo, è importante consegnare un ottimo lavoro, ma come designer è facile perdere di vista cosa significa? Un sito web non dovrebbe essere incentrato sugli obiettivi del progettista, ma sul raggiungimento dei risultati desiderati dal cliente, bilanciando allo stesso tempo i limiti di tempo, risorse ed energia. Senza vincoli, un sito web può facilmente finire per essere troppo ingegnerizzato, lento, con troppi elementi e funzionalità che confondono gli utenti. È anche difficile inserire tutte le funzionalità nel tempo limitato, quindi il designer potrebbe semplicemente esaurire il suo tempo, e non riuscire a consegnare un buon sito web entro la scadenza è molto stressante per tutti i soggetti coinvolti.

Che cos'è il Principio di Pareto?

La "regola dell'80/20", talvolta chiamata principio di Pareto, afferma che l'80% degli effetti deriva dal 20% delle cause. Il principio di Pareto fu introdotto per la prima volta da un economista italiano di nome Vilfredo Pareto nel 1895, quando osservò che l'80% della ricchezza italiana era posseduta solo dal 20% della popolazione. Notò anche che il 20% dei baccelli di piselli nel suo giardino produceva l'80% dei piselli! Il principio di Pareto suggerisce che pochi elementi chiave sono responsabili della produzione della maggior parte di un determinato risultato. Da allora, è stato applicato a molte altre aree, tra cui gli affari, l'economia, la psicologia e può anche essere utilizzato nella vita di tutti i giorni.

Questo si traduce bene anche in esempi su scala minore; avete mai notato che la maggior parte del vostro reddito proviene da una manciata di clienti fissi? O che sembrate indossare sempre gli stessi capi di abbigliamento, mentre la maggior parte del vostro guardaroba non viene utilizzata? Anche se il rapporto non è sempre esattamente 80/20 e ci sono sempre delle eccezioni, è un ottimo strumento per aiutare le persone a identificare le azioni che hanno il maggiore impatto sul loro successo e a dare loro la priorità di conseguenza.

Il Principio di Pareto nel web design e nel marketing digitale

Il principio di Pareto, applicato al web design, presuppone che la maggior parte dei risultati derivi da un numero ridotto di caratteristiche chiave. Nel marketing, alcune campagne avranno risultati migliori di altre. Per ottenere i migliori risultati, ha senso concentrarsi prima su questo piccolo numero di caratteristiche chiave e assicurarsi che ricevano la massima attenzione, mentre le parti meno importanti possono essere realizzate più rapidamente. Un modo per utilizzare il Principio di Pareto è quello di concentrarsi sull'esperienza dell'utente e sull'usabilità: prestando attenzione al modo in cui gli utenti interagiscono con i vostri contenuti online e assicurandovi che riescano a trovare ciò di cui hanno bisogno, è probabile che raccogliate maggiori frutti rispetto a quelli che otterreste concentrandovi solo sull'estetica. Ci insegna che la perfezione non è sempre necessaria e che è possibile ottenere un sito web ancora più efficace ottimizzando il 20% importante delle funzionalità.

A titolo di esempio, abbiamo appena esaminato i dati di traffico di un piccolo negozio di e-commerce che vende prodotti fatti a mano e abbiamo notato diverse tendenze di Pareto. Ad esempio, quasi tutti i visitatori accedono al sito da mobile. La maggior parte delle vendite di prodotti proviene da un numero limitato di categorie. Facebook è la principale fonte di traffico sui social media. Quando si esamina una mappa di calore della pagina del prodotto, alcune aree ottengono un maggiore coinvolgimento. È possibile osservare il tipico schema F, con gruppi di interazioni nella riga superiore e lungo il lato sinistro della pagina.

Devices popularity

Dashboard with website analytics data

Cosa si può fare con queste informazioni per migliorare le vendite di questo cliente?

In questo esempio, la soluzione più rapida sarebbe quella di migliorare l'esperienza mobile di questo sito web, originariamente costruito per desktop. Si potrebbero esaminare le heatmap di tutte le pagine per conoscere meglio le preferenze degli utenti. Ad esempio, le domande più cliccate della sezione FAQ potrebbero essere spostate nella home page invece di essere nascoste. I prodotti ad alto profitto potrebbero essere inseriti nelle aree della pagina in cui è probabile che si verifichi il maggior numero di clic.

Iniziare sempre dal "perché

Always start with the Why (Fonte: Envato Elements)

Dalla mia esperienza nel settore, ho notato che molti designer accettano volentieri il brief e iniziano a lavorare sui progetti, anche se mancano informazioni fondamentali relative allo scopo del progetto. Forse la persona che ha compilato il brief pensava che queste informazioni fossero implicite, oppure il cliente non le ha espresse in modo conciso. Prendetevi un momento per fare un passo indietro prima di iniziare a lavorare. Senza una chiara comprensione del motivo per cui state facendo quello che state facendo, il vostro web design mancherà di direzione. Il vostro sito web potrebbe sembrare buono per voi e anche per il cliente, ma nonostante le molte ore di lavoro, il risultato sarà deludente se non raggiunge i risultati attesi dal cliente.

Incontrare Ranktracker

La piattaforma all-in-one per un SEO efficace

Dietro ogni azienda di successo c'è una forte campagna SEO. Ma con innumerevoli strumenti e tecniche di ottimizzazione tra cui scegliere, può essere difficile sapere da dove iniziare. Ebbene, non temete più, perché ho quello che fa per voi. Vi presento la piattaforma Ranktracker all-in-one per una SEO efficace.

Abbiamo finalmente aperto la registrazione a Ranktracker in modo assolutamente gratuito!

Creare un account gratuito

Oppure accedi con le tue credenziali

Chiedetevi: Perché esiste questo sito web? Chi saranno gli utenti finali del sito e come interagiranno con il sito? In che modo il sito web creerà valore e successo per il vostro cliente? Come il cliente misurerà questo successo? Come il sito web attirerà i visitatori e catturerà i contatti? Quando riuscirete a rispondere a queste domande e a capire il "perché", sarà più facile stabilire le priorità del "cosa" e del "come" degli elementi di design. Quando riuscirete a visualizzare il risultato desiderato, vi aiuterà a concentrare le energie sulle aree più importanti per raggiungerlo.

Abbracciare l'approccio del prodotto minimo vitale nel web design

Con tante decisioni da prendere quando si progetta un sito web, può essere difficile sapere da dove cominciare. L'approccio del prodotto minimo realizzabile (MVP) consiste nel costruire subito solo gli elementi fondamentali di un sito web, per poi perfezionarli continuamente con il feedback dei clienti nel corso del tempo. Di solito viene adottato per risparmiare costi e tempo o quando un'idea commerciale si basa su molte ipotesi. Invece di tentare tutto in una volta, gli sviluppatori possono dare priorità alle funzionalità in base alle esigenze dei clienti e creare prototipi il prima possibile. Anche quando non si è sotto pressione per il tempo o il budget, adottare il sito web come MVP è un modo fantastico per applicare il principio di Pareto e combattere le tendenze perfezionistiche. Mentalmente, è utile sapere che si possono sempre aggiungere altre funzionalità in un secondo momento, ma che per il momento ci si deve concentrare sugli elementi più importanti.

Progettare per il mobile-first può aiutarvi a semplificare il vostro sito web

Quando si progetta un sito web, si vuole offrire agli utenti un'esperienza efficace e intuitiva. Il modo migliore per raggiungere questo obiettivo è progettare con un approccio "mobile-first". Questo concetto implica la creazione di siti web ottimizzati per i dispositivi mobili, piuttosto che di siti web desktop adattati per i dispositivi mobili. Perché è necessario? Nel 2022, secondo techjury.net, i telefoni cellulari genereranno il 60,66% del traffico dei siti web, mentre i desktop e i tablet insieme saranno responsabili del 39,34%. Questo dato può variare a seconda dei settori e dei siti web, ma la tendenza è degna di nota. Concentrando il vostro design sulla versione mobile del sito, potete aumentare le probabilità di successo a vostro favore.

Quando si inizia a progettare per i dispositivi mobili, si nota subito che c'è meno spazio per le parole e il disordine. È piuttosto difficile adattarsi, se si è progettato per lungo tempo per i desktop. Ma questo approccio è in linea con il principio di Pareto, in quanto aiuta a scegliere i contenuti di maggiore impatto. I vantaggi sono due: il vostro sito sarà ottimizzato per la piattaforma mobile preferita dagli utenti e quando lo adatterete per il desktop avrà un aspetto moderno e pulito. In seguito sarà comunque necessario adattare il sito per il desktop, ma quando si lavora con l'approccio mobile-first diventa molto più facile, perché si dispone già di un design semplificato.

Fate ricerche e analizzate i siti web dei concorrenti

Quando si parla di web design, spesso si pensa alla ricerca come all'osservazione di altri siti web di ispirazione o di modelli con splendidi elementi di design. Ma la ricerca per il web design va oltre il semplice ammirare l'estetica di altri siti web. È necessario capire come le persone utilizzano il web, come gli utenti interagiscono con i diversi design e come vengono organizzati i contenuti per creare un sito web efficace. Chiedendo i dati analitici che il cliente può fornire o utilizzando uno strumento di monitoraggio come Ranktracker, possiamo identificare meglio le aree di opportunità di miglioramento per un sito web più performante.

La ricerca deve comprendere l'esame degli standard di settore esistenti, del pubblico target e delle preferenze degli utenti attraverso l'analisi dei concorrenti. Potete trovare i concorrenti chiedendo al cliente, oppure facendo ricerche personali e vedendo quali sono i siti web ai primi posti. Una volta individuati i concorrenti, è necessario disporre di una fonte affidabile di dati su di essi. Una delle mie caratteristiche preferite di Ranktracker è la possibilità di aggiungere i vostri concorrenti identificati e di visualizzare le prestazioni dei concorrenti in una colonna accanto ai risultati del vostro dominio. Se un concorrente vi supera per le vostre parole chiave, vale la pena di analizzare il suo sito web per imparare da lui. Per aggiungere un concorrente, è sufficiente incollare il suo URL.

Add competitors in Rank Tracker

Rank Tracker board

Cliccate su un ottimo articolo di approfondimento su come condurre un'analisi della concorrenza.

Incontrare Ranktracker

La piattaforma all-in-one per un SEO efficace

Dietro ogni azienda di successo c'è una forte campagna SEO. Ma con innumerevoli strumenti e tecniche di ottimizzazione tra cui scegliere, può essere difficile sapere da dove iniziare. Ebbene, non temete più, perché ho quello che fa per voi. Vi presento la piattaforma Ranktracker all-in-one per una SEO efficace.

Abbiamo finalmente aperto la registrazione a Ranktracker in modo assolutamente gratuito!

Creare un account gratuito

Oppure accedi con le tue credenziali

Mentre fate tutte le ricerche, stilate una "lista dei sogni" di tutte le possibili caratteristiche ed elementi che potreste includere (non preoccupatevi, le restringerete, ma è utile avere tutte le idee insieme).

Pianificazione: Identificare le caratteristiche principali del progetto

Planning: Identifying Key Design Features (Fonte: Envato Elements)

Il design di un sito web deve basarsi sullo scopo che si prefigge. Esaminate tutti gli elementi/caratteristiche del vostro elenco di sogni e scegliete quelli che pensate possano aiutare il cliente a raggiungere il suo obiettivo. Prendete un foglio bianco e iniziate a disegnare alcuni wireframe approssimativi per il vostro sito web. Nei wireframe, collegate ogni elemento che intendete includere a un risultato: se non riuscite a trovare uno scopo chiaro, scartate quella sezione. Non pensate all'estetica del design, ma concentratevi su ciò che è meglio per l'esperienza dell'utente e l'usabilità.

Contrariamente a quanto si crede, non è necessario che i primi wireframe siano disegnati con un software di progettazione sofisticato. L'approccio analogico di carta e matita funzionerà benissimo, e a volte anche meglio, perché non sarete distratti dal software stesso. La carta è più indulgente e meno permanente; è più veloce da usare e questo può aiutare durante il processo creativo. Se dovete presentare i wireframe al vostro cliente, potete farlo in modo più professionale dopo aver elaborato i disegni grezzi.

Fate prima un mock-up, non progettate nella piattaforma web per risparmiare tempo.

Un vecchio detto dice che non si può pilotare un aereo mentre lo si sta costruendo. Lo stesso vale per il web design: cercare di costruire un sito web mentre si stanno ancora prendendo decisioni su contenuti, funzionalità e design è una ricetta per la frustrazione. Per mantenere l'efficienza, è necessario un piano. Creare un mock-up di ogni pagina sembra dispendioso in termini di tempo e controintuitivo, ma serve a molti scopi e farà risparmiare tempo nel lungo periodo. I mock-up consentono al cliente di visualizzare il sito web prima ancora che inizi lo sviluppo. Può sperimentare le diverse opzioni di colore e di carattere e anticipare facilmente le modifiche da apportare. Discutere un mock-up crea molte opportunità di discussione e domande. Aumenta le possibilità che il cliente sia soddisfatto quando vedrà il sito dal vivo per la prima volta. Soprattutto, lavorare con un mock-up permette di costruire il sito web molto più velocemente una volta arrivati alla fase di sviluppo, poiché quasi tutte le decisioni creative sono già state prese.

Lavorare con contenuti che si posizionano bene sui motori di ricerca

A volte un cliente insiste perché iniziate a progettare con un "testo segnaposto", perché pensa che il vostro ruolo sia solo quello di progettare gli elementi estetici. Se possibile, evitate di progettare con un testo segnaposto generico. Anche se i vostri progetti possono sembrare belli, il vostro sito web mancherebbe di scopo se trascuraste un ingrediente chiave come i contenuti ben scritti.

Incontrare Ranktracker

La piattaforma all-in-one per un SEO efficace

Dietro ogni azienda di successo c'è una forte campagna SEO. Ma con innumerevoli strumenti e tecniche di ottimizzazione tra cui scegliere, può essere difficile sapere da dove iniziare. Ebbene, non temete più, perché ho quello che fa per voi. Vi presento la piattaforma Ranktracker all-in-one per una SEO efficace.

Abbiamo finalmente aperto la registrazione a Ranktracker in modo assolutamente gratuito!

Creare un account gratuito

Oppure accedi con le tue credenziali

Un sito web ha valore solo se riceve visitatori e l'ottimizzazione per i motori di ricerca (SEO) è il modo in cui i motori di ricerca trovano il vostro sito web in modo organico. La scelta delle parole chiave in una pagina è fondamentale per la SEO e gli elementi di design devono supportare le parole. Se si conoscono in anticipo le parole chiave, si ha un'idea in più. Se lavorate con un copywriter per i vostri contenuti, assicuratevi che abbia familiarità con la SEO. Anche se non siete esperti di SEO, imparate a conoscere questo argomento in modo da poterne essere più consapevoli durante il processo di web design.

Alcuni strumenti per la ricerca di parole chiave sono complicati (soprattutto se siete alle prime armi con la SEO), ma Ranktracker Keyword Finder è molto semplice e intuitivo: basta aggiungere le parole chiave a un elenco e i risultati vengono visualizzati con un codice colore in base alla difficoltà della parola chiave. Per una buona SEO si vogliono scegliere parole chiave con bassa concorrenza ma con un volume di ricerca adeguato, quindi è molto utile che i volumi di ricerca siano visualizzati proprio lì.

Keyword Finder

Quindi, prima di iniziare, cercate di ottenere almeno una bozza della dicitura. Se siete un designer indipendente, è probabile che dobbiate anche aiutare il cliente a capire dove la dicitura si adatta meglio al sito web. Una realtà del processo di progettazione è che questa formulazione potrebbe cambiare più volte, ma avere qualcosa con cui iniziare è molto meglio di niente.

Semplificare le scelte su font, colori, gerarchia ed elementi visivi.

Se siete designer meno esperti o volete semplicemente risparmiare tempo, è utile lavorare con i modelli e usarli come base. Per un CMS come WordPress, esistono migliaia di ottimi template a prezzi ragionevoli. Questi hanno già font, colori, gerarchia ed elementi visivi progettati in uno stile coeso. Se siete preoccupati per l'originalità, state certi che il vostro risultato sarà diverso dal modello, poiché lo state adattando ai vostri wireframe. Avere alcune risorse di design e uno stile generale da cui partire può davvero aiutarvi a trovare la direzione e a ridurre la fatica di decidere. Non includete troppi colori: potete tranquillamente limitare i colori del vostro sito web a 2 colori o a un massimo di 3. Date un'occhiata a Le 20 migliori combinazioni di colori da provare sul vostro sito web per trovare alcune idee e tendenze per la scelta dei colori del sito web.

Conclusione: Massimizzare l'impatto

Sapere dove concentrarsi può aiutare un designer a gestire la propria tendenza al perfezionismo e a raggiungere il successo. Il principio di Pareto è una regola empirica del web design che afferma che l'80% dell'esperienza dell'utente può essere ottenuta con il 20% dello sforzo. Ciò significa che i web designer devono concentrare i loro sforzi sull'ottimizzazione dei contenuti, sugli elementi di design della pagina, sull'usabilità e su altri fattori per creare un sito web efficace che si posizioni bene sui motori di ricerca.

Lene Wandrey

Lene Wandrey

Founder, hot-designs.com

Lene Wandrey is a tech-loving artist, graphic designer and entrepreneur living in South Africa. She's the founder of hot-designs.com. She is passionate about design and productivity.

Link: hot-designs.com

Iniziate a usare Ranktracker... gratuitamente!

Scoprite cosa ostacola il posizionamento del vostro sito web.

Creare un account gratuito

Oppure accedi con le tue credenziali

Different views of Ranktracker app