Nelle attuali metodologie di realizzazione di un sito web, ottenere un design personalizzato e allo stesso tempo un’accessibilità web ottimale è di fondamentale importanza.
In tale ottica, gli approcci creativi bottom-up, maggiormente orientati ai dettagli, risultano molto più efficaci e rendono più facile raggiungere un pubblico diversificato ed eterogeneo. Sfruttare al meglio questa metodologia consente inoltre di soddisfare le nicchie di pubblico più esigenti. Oltre agli aspetti di design, è fondamentale tuttavia soddisfare i principali criteri di accessibilità. Un sito che non considera in che modo la User Experience può differire per i vari tipi di pubblico, in particolare quelli con disabilità, non sarà in grado di coinvolgere e servire tutti allo stesso modo. Uno dei modi migliori per evitare che ciò accada è quello di affrontare il sito da una prospettiva bottom-up.
Come opera la progettazione bottom-up
Gli approcci convenzionali, top-down, di web design partono con la definizione del quadro generale prima di suddividere obiettivi e concetti in dettagli più piccoli. Le filosofie bottom-up, al contrario, considerano prima i dettagli, raggiungendo infine l’obiettivo più ampio pezzo per pezzo. Questo modo di pensare alternativo è funzionale all’accessibilità in generale, poiché riflette il modo in cui le persone neurodivergenti ragionano comunemente.
Un esempio è quello delle persone autistiche: varie ricerche hanno dimostrato come tendono ad avere una prospettiva bottom-up, che consente loro di ottenere spesso risultati incredibili nel pensiero logico.
Si identificano almeno tre tipi di pensiero specialistico, all’interno dello spettro autistico:
- Pensatori visivi, che utilizzano principalmente immagini;
- Pensatori pattern, che si basano su modelli e relazioni;
- Pensatori verbali, che prediligono il linguaggio.
In ognuna di queste tipologie di pensiero, la predilezione viene data per le prospettive bottom-up, a differenza di quanto avviene per gli utenti neurotipici. Di conseguenza, una strategia top-down potrebbe far perdere dettagli al tuo pubblico, rendendo il sito web non ottimale in termini di accessibilità.
Un esempio di accessibilità bottom-up
Per fare un semplice esempio, consideriamo il compito scolastico di scrivere un saggio.
Agli studenti viene spesso insegnato di sviluppare un tema pensando come prima cosa al concetto principale che vogliono trasmettere; una volta fatto ciò, passare alla creazione di un indice di argomenti a supporto dell’argomento principale.
Questo è il classico approccio dall’alto verso il basso: iniziare con il quadro generale e poi scomporre gradualmente l’argomento in punti e successivamente in testo. Al contrario, utilizzando una metodologia dal basso verso l’alto, si deve iniziare senza uno schema preciso ma semplicemente annotando ogni singola idea che ci viene in mente; partendo da questo, si procede successivamente approfondendo ed esplorando ulteriormente tutte le idee che troviamo interessanti, e dalle quale è possibile possa nascere un ulteriore “ramo” di conoscenza o di analisi. Alla fine, una volta che tutte le idee sono state scritte, è possibile raggruppare quelle correlate tra loro e organizzarle in uno schema logico. Si inizia dunque con i piccoli dettagli e lavorando su questi dettagli si arriva al quadro generale del saggio.
Questo metodo è ottimale anche per l’attività di web design. Un approccio bottom-up significa partire dalle specifiche dell’esperienza utente invece che dall’effetto desiderato. Questo significa partire da ciò che vuole o che ricerca l’utente del sito, scoprire in che modo le sue intenzioni si relazionano con le pagine del sito e costruire gradualmente, basandosi su queste informazioni, tutto il contenuto sul web.
Facciamo un esempio. Supponiamo di dover lavorare al design mobile di un sito; può essere un’ottima idea quella di posizionare il menu nella parte inferiore della pagina, rendendolo più facile da toccare quando viene utilizzato con una mano e migliorandone la facilità d’uso. Il risultato potrebbe prevedere un menu a discesa attorno a questa scelta, con le voci in basso anziché nella classica posizione in alto. Partendo da questa impostazione è evidente che bisogna ripensare tutto il layout del sito, oltre che le singole voci del menu.
Seguendo tale approccio, si inizia ad affrontare per primi i problemi più correlati all’utilizzo e all’interazione che l’utente può avere con il nostro sito (o applicativo); si finirà per affrontare le problematiche in sequenza, piuttosto che a seguito di uno studio a priori del quadro generale.
Vantaggi di un approccio bottom-up per l’accessibilità web
Sebbene non si possa stabilire a priori quale sia l’approccio migliore da seguire (da basso oppure dall’alto), sempre più designer e sviluppatori web propendono per l’approccio dal basso verso l’alto, grazie ai diversi vantaggi che assicura in termini di accessibilità.
Mettere al primo posto le esigenze degli utenti
Il più grande vantaggio dei metodi dal basso verso l’alto è che danno priorità alle esigenze dell’utente. Pensiamo ad alcune delle lamentele che gli utenti dei social media hanno espresso nel corso degli anni, relative all’usabilità e all’accessibilità.
Ad esempio, molti utenti si continuano a lamentare del fatto che il loro feed di Facebook si aggiorna in modo casuale con i contenuti più aggiornati. Tali aggiornamenti casuali rendono praticamente impossibile tornare a un post visualizzato precedentemente che non si è pensato di salvare.
La stessa cosa succede con LinkedIn e con la funzione di cronologia visualizzazioni di TikTok, ancora oggi difficile da utilizzare per molti utenti.
Il 95,9% delle prime 1 milione di home page presenta errori rispetto alle Linee guida per l’accessibilità dei contenuti Web (WCAG). Sebbene un approccio dal basso non eliminerebbe di per sé gli errori, potrebbe però renderli meno probabili, poiché partire dalle esigenze dell’utente spesso migliora consapevolezza dei limiti e delle problematiche da risolvere. È più facile soddisfare le esigenze degli utenti realizzando l’intero sito attorno alla loro esperienza, piuttosto che adattare l’UX al progetto di design.
Consideriamo l’esempio di Berkshire Hathaway, la holding multimiliardaria di Warren Buffett.
La filosofia generale del design è comprensibile: semplice e diretta, si concentra esclusivamente sulle informazioni da dare più che sull’estetica, che potrebbe non sposarsi efficacemente all’immagine dell’azienda. Tuttavia, anche in questo caso si potrebbe trovare qualche spunto di miglioramento. Sebbene si tratti di un sito con poche pagine e dalla struttura piuttosto semplice, la mancanza di un menu, il basso contrasto di colore e il carattere piccolo dei testi lo rendono difficile da leggere e un po’ dispersivo.
Guardiamo, per fare un confronto, all’homepage dell’ente di beneficenza britannico Scope.
Il web design è in questo caso ben incentrato sulle esigenze degli utenti: menu concisi e chiari, allineati nella parte superiore della pagina per facilitare una navigazione più rapida e semplice. La combinazione di colori è semplice ed efficace, con un buon contrasto per rendere tutto facilmente leggibile, in aggiunta al carattere sans-serif che aiuta ulteriormente la lettura.
Accessibilità fin da subito
Partire dalla visione generale e scendere poi nel particolare rende difficile soddisfare un pubblico diversificato, in quanto potrebbe essere necessario inserire nuove funzionalità in un design preesistente.
Pensiamo ad esempio alla creazione di un sito web incentrato sulla fornitura di informazioni e servizi a un pubblico generale di residenti, dotato inizialmente di immagini ad alta risoluzione, colori vivaci e grafici interattivi. In un secondo momento (rimaniamo nell’ipotesi di esempio) potrebbe però succedere di rendersi conto che le immagini non siano accessibili alle persone che navigano tramite gli screen reader, oppure che i livelli multipli di sottomenu siano difficili da raggiungere per gli utenti che utilizzano solo la tastiera. Oppure, ancora, che i colori vivaci del sito rendano difficile per gli utenti ipovedenti leggere molte delle informazioni.
Come si potrebbe procedere a questo punto? Per le immagini, si potrebbero aggiungere didascalie informative, che andrebbero tuttavia a “rovinare” l’estetica visiva e il flusso originariamente previsto. La revisione dei colori vivaci comporterebbe un ripensamento completo dell’intera tavolozza dei colori del sito, così come la rivisitazione del menu porterebbe a modifiche sostanziali sul numero e la gerarchia di tutte le pagine. Se tutte queste considerazioni fossero state fatte prima della realizzazione del sito, ad esempio tramite un approccio bottom-up, questi elementi di criticità sarebbero stati risolti con ogni probabilità nelle prime fasi di lavoro, mantenendo un risultato finale esteticamente gradevole e di facile usabilità.
Riprogettare invece un sito web per risolvere problematiche di UX/UI o di accessibilità in precedenza ignorate, non solamente può risultare gravoso in termini di effort e tempi di lavorazione ma può portare a errori come collegamenti non funzionanti o pagine 404.
Semplicità e chiarezza
Un flusso di lavoro bottom-up contribuisce anche alla semplicità e chiarezza generale del sito web. Prendiamo ad esempio l’homepage del sito Awwwards. Si nota da subito la presenza di molti menu per condensare le informazioni e facilitare la navigazione senza sovraccaricare lo schermo. La scelta, benché positiva in termini di maggiore accessibilità, genera però molta confusione e trasmette disorganizzazione.
I menu sono oggettivamente ridondanti: alcuni sono in alto, divisi dal pulsante di ricerca, mentre in basso ne troviamo altri due, separati tra loro, che aggiungono confusione al tutto.Questa impostazione potrebbe farci pensare che si siano aggiunti ulteriori menu a seguito di ripensamenti successivi, nel tentativo di migliorare la navigazione. Questo ha portato a incongruenze e ridondanze, causate da un design iniziale che si è dovuto ripensare in corso d’opera.
Proseguiremo nel prossimo articolo con ulteriori aspetti favorevoli all’approccio bottom-up, stay tuned!
