Un sito accessibile a tutti

Contenuti inclusivi dalla vision alle soluzioni ai prodotti

Il sito web di CITISLAB è stato realizzato tenendo costantemente presenti gli obiettivi di Inclusione, cioè consentire a tutti coloro che lo visitano, anche nelle loro diversità, di poterlo navigare e consultare, e di Accessibilità, ovvero abbattere alcune barriere visive e consentire ad esempio la lettura di buona parte delle immagini, indicando per ciascuna di esse l’ALT, ovvero una breve descrizione dei suoi contenuti proposta dallo Screen Reader.
A partire dai colori, la scelta cromatica che caratterizza l’intero sito ha seguito le esigenze e le verifiche di visibilità: sono stati adottati, oltre al bianco, il BLUE (#2621F) che è un colore freddo, e il GIALLO (#FBBA1F), un colore caldo. La palette è stata limitata a questi colori per una semplificazione degli stimoli e una ordinata sequenza dei campi, cosicché il contrasto garantisce una percezione chiara e immediata, anche per chi ha difficoltà visive.
Tutti i font sono chiari e leggibili, scelti tra quelli senza grazie, nel rispetto delle linee guida sull’accessibilità tipografica. I font scelti sono Roboto e Open Sans.
Il layout è semplice e pulito, e si avvale dell’alternanza testi/sfondi per tenere interessata la lettura e stimolato l’osservatore.
Tramite il design del marchio, CITISLAB ha posto al centro l’accessibilità e la comunicazione multisensoriale: CITIS è scritto con caratteri lineari e privi di grazie, scelta compiuta per garantire la massima leggibilità e rispettare i parametri di accessibilità visiva, mentre la parola laboratorio, abbreviata in LAB, viene espressa sia in caratteri tradizionali che nell’alfabeto Braille.

Struttura e navigabilità del sito

Per raggiungere il risultato dell’Accessibilità abbiamo adottato un approccio strutturato e rigoroso, in linea con le norme vigenti:

Linee guida di riferimento – Il progetto è stato sviluppato secondo le WCAG 2.1 livello AA e le Linee Guida AgID 2022, soddisfacendo il D.Lgs. 106/2018 e anticipando il futuro European Accessibility Act (2019/882).
Struttura semantica e regioni ARIA – Titoli, paragrafi e sezioni sono organizzati in modo gerarchico; sono presenti link di salto rapido (“salta al contenuto”) e regioni ARIA che orientano la navigazione via tastiera e gli screen reader.
Contrasto cromatico e tipografia leggibile – Ogni accoppiata testo/sfondo rispetta il rapporto minimo 4,5 : 1 (7 : 1 per testi sotto i 18 px); i font sans serif scelti assicurano chiarezza anche su schermi a bassa risoluzione.
Alternative testuali complete – Immagini, icone e pulsanti dispongono di testi alternativi (alt, aria-label, aria-describedby); per audio e video sono disponibili trascrizioni o sottotitoli.
Gestione del focus e prove da tastiera – L’ordine di tabulazione segue la logica visiva, gli indicatori di messa a fuoco rimangono sempre evidenti e non esistono situazioni di blocco della tastiera.
Verifica con utenti reali – Il sito è stato testato con gli screen reader NVDA e JAWS dai soci UICI, consentendoci di individuare e correggere criticità che i soli controlli automatici non avrebbero evidenziato.

L’insieme di queste attività garantisce una navigazione percepibile, operabile e comprensibile per tutte le persone, rendendo il sito pienamente accessibile e in linea con l’evoluzione della normativa europea.

Durante le diverse fasi di costruzione del sito Web e delle relative verifiche di accessibilità siamo stati seguiti e assistiti dal Servizio Informatico dell’Unione Italiana dei Ciechi e degli Ipovedenti – ETS – APS di Brescia, che ringraziamo per la competenza e la disponibilità dimostrate. Sempre grazie alla collaborazione dell’UICI sono stati eseguiti dei test di lettura da soci non vedenti e da soci ipovedenti a causa di patologie diverse.

Grazie a tutte queste attenzioni, il sito risulta quindi facilmente fruibile da chiunque.