Gimme5 è il servizio digitale di AcomeA SGR che permette di risparmiare e investire attraverso la propria app.
La sfida era chiara: adeguare il sito principale agli standard europei di accessibilità in vista dell’entrata in vigore dell’European Accessibility Act. Per Gimme5 non si trattava solo di rispettare un obbligo normativo, ma di aprire i propri servizi a chiunque, senza barriere. Il timore? Che l’intervento potesse compromettere un’identità visiva fondata su una palette cromatica distintiva e componenti grafici consolidati.
Il nostro compito è stato trasformare quel timore in un’opportunità: dimostrare che accessibilità e identità possono rafforzarsi a vicenda, senza compromessi estetici.
Richiesta
Rendere il sito conforme all’European Accessibility Act mantenendo intatta l’identità di brand.
Risultato
Un sito accessibile, usabile e coerente con l’immagine di Gimme5, che traduce l’obbligo normativo in un vantaggio strategico.
Analisi e audit
Il progetto è iniziato con una fase di test manuali approfonditi, realizzati attraverso la navigazione da tastiera, l’utilizzo dello screen reader e le funzioni di ingrandimento, per valutare in modo diretto l’esperienza delle persone che utilizzano tecnologie assistive. Questi test hanno permesso di individuare criticità concrete di navigazione e comprensione dei contenuti, difficilmente rilevabili dai soli strumenti automatici. In parallelo sono state effettuate anche verifiche automatiche e semi-automatiche, utili per completare la fotografia tecnica dello stato del sito.
Abbiamo prodotto due documenti paralleli: un report narrativo, pensato per stakeholder non tecnici, e un documento tecnico con tutte le non conformità, spiegazioni e best practice.
In parallelo, abbiamo analizzato il design system e i moduli presenti sul sito, catalogando colori, tipografia e componenti. Questo ci ha permesso di evidenziare come molte criticità nascessero direttamente da pattern ricorrenti di design: contrasti insufficienti, titolazioni non semantiche, link identificati solo dal colore, form senza etichette, assenza di meccanismi per disattivare animazioni, slider non accessibili. Una mappatura che ha fornito al cliente una visione chiara non solo del sito, ma dell’intero ecosistema visivo di Gimme5.
Accessibilità by design
Sappiamo che quasi il 70% dei problemi di accessibilità nasce dal design. Per questo, il nostro lavoro è partito da lì.
Abbiamo ottimizzato la palette colori mantenendo il tono del brand riconoscibile, ridefinito le gerarchie tipografiche per garantire contrasti adeguati e una lettura più chiara, in linea con i requisiti della norma tecnica UNI CEI EN 301549 più recente e con i criteri di successo delle WCAG.
Sono stati progettati nuovi stati di focus, reso accessibile il menu di navigazione, introdotto un meccanismo per disattivare le animazioni, rivisti form e ricerca per una fruizione immediata e comprensibile. Ogni intervento ha rafforzato l’usabilità complessiva, trasformando la scoperta dei contenuti in un percorso più intuitivo e accessibile.
Uno degli interventi più significativi ha riguardato la sezione di supporto. Qui l’attenzione non si è concentrata in prima battuta sulla user interface, ma sul percorso utente: come arrivare in modo rapido alle informazioni necessarie? Abbiamo rivisto l’architettura della sezione, aggiunto scorciatoie come “salta alle domande frequenti” e reso il contenuto delle FAQ immediatamente accessibile anche a chi utilizza screen reader. Un esempio concreto di come accessibilità e user experience possano camminare insieme.
La sezione dedicata ai fondi di investimento ha rappresentato una sfida ulteriore. I grafici interattivi, cuore informativo del sito, vengono generati in tempo reale partendo da dati in formato JSON forniti da Gimme5 e utilizzano Chart.js. Un sistema efficace ma con un limite: i grafici non sono compatibili con i requisiti di accessibilità, in particolare con la navigazione da tastiera e la lettura tramite screen reader.
Per rispondere a questo vincolo tecnologico senza stravolgere l’infrastruttura esistente, abbiamo progettato un’alternativa parallela: i dati in formato JSON vengono trasformati in tabelle accessibili, con colonne data/valore, arricchite da una descrizione sintetica dell’andamento del fondo se necessario. Così ogni utente può leggere e comprendere le informazioni in autonomia, con pari opportunità di scelta e decisione.
Sviluppo accessibile
Terminata la fase di progettazione, abbiamo predisposto un handoff dettagliato per il team di sviluppo, con l’obiettivo di integrare l’accessibilità direttamente nelle logiche del sito, senza dover ricorrere a continue correzioni manuali in fase di gestione dei contenuti.
Abbiamo definito relazioni semantiche automatiche tra titoli e sezioni, predisposto meccanismi per rendere le CTA sempre contestuali (“leggi di più” diventa automaticamente “leggi di più sul fondo X”), creato campi dedicati agli screen reader per aggiungere informazioni accessorie solo quando necessarie.
Lo sviluppo è stato realizzato sfruttando Flying Pp, il blank theme WordPress di PaperPlane, che permette di incorporare queste ottimizzazioni by default, garantendo performance ottimali, SEO e componenti accessibili, conformi alle richieste della UNI CEI EN 301549 più recente e delle WCAG. Il confronto costante tra designer e sviluppatori ha permesso di trasformare le indicazioni progettuali in un ecosistema coerente, scalabile e accessibile.
Durante la fase di debug e Quality Assurance, abbiamo investito diverse ore per affinare gli elementi più rilevanti per chi utilizza tecnologie assistive.
Abbiamo rivisto le label, aggiunto etichette accessibili e chiarito il significato di interazioni e componenti, così che la navigazione tramite screen reader fosse fluida e comprensibile. Questa rifinitura ha permesso di alzare ulteriormente il livello di accessibilità, dimostrando come l’attenzione ai dettagli faccia la differenza nell’esperienza finale.
Oltre la conformità
Il nuovo sito di Gimme5 dimostra che l’accessibilità non è un vincolo per l’aspetto estetico di un brand, ma può rappresentare un vantaggio strategico e competitivo. Le ottimizzazioni effettuate sul design system sono “invisibili agli occhi” di chi non ha esigenze specifiche, ma fondamentali per chi altrimenti non avrebbe potuto fruire dei contenuti.
Il progetto ha permesso a Gimme5 di offrire un’esperienza più accessibile e inclusiva, ampliando il target e la portata informativa del sito.
Un lavoro così profondo non sarebbe stato possibile senza la disponibilità e la fiducia del team di Gimme5. Un grazie speciale ad Andres Felipe Pardo, Strategic Designer, e a Fabio Arlati, Lead Developer, che hanno accompagnato ogni fase del percorso con entusiasmo e spirito di collaborazione.
GrUSP | AccessibilitàSiti Web
