Dichiarazione di accessibilità

1. Il mio impegno

Voglio che questo sito sia utilizzabile da tutti, comprese le persone che navigano con la tastiera, con uno screen reader, con l’ingrandimento o con un’impostazione di movimento ridotto o contrasto elevato. Qui l’accessibilità è trattata come parte della costruzione, non come una verifica finale: diverse delle misure elencate di seguito sono garantite da test automatici che fanno fallire la build in caso di regressione.

2. Stato di conformità

Questo sito punta alla conformità alle Linee guida per l’accessibilità dei contenuti web (WCAG) 2.2 di livello AA. Ritengo che sia sostanzialmente conforme, ossia che soddisfi i criteri di successo di livello AA per quanto di mia conoscenza e in base alle mie verifiche.

Deliberatamente non dichiaro la piena conformità. Non è stato svolto alcun audit di accessibilità indipendente e per questo sito non esiste una relazione formale di valutazione WCAG-EM. È un limite delle prove a sostegno della dichiarazione, non un difetto noto: quando riscontro un difetto, lo elenco nella sezione 5.

3. Che cosa è già in atto

Tastiera e focus

• Un link di salto al contenuto è il primo elemento attivabile in ogni pagina che riporta la navigazione del sito, e sposta il focus sul contenuto principale invece di limitarsi a scorrere fino a esso.
• Ogni elemento interattivo mostra un indicatore di focus visibile. La regola che lo disegna non può essere disattivata da alcuna classe di utilità, e un test lo garantisce.
• Il menu mobile è una trappola di focus: all’apertura il focus vi entra, vi circola con Tab, si chiude con Esc e torna al pulsante che lo ha aperto.
• Nessun elemento riceve un tabindex positivo, così l’ordine di tabulazione segue la pagina.

Struttura e screen reader

• Esattamente un landmark main per pagina e — ovunque siano presenti intestazione e piè di pagina del sito — un banner e un contentinfo, oltre a landmark di navigazione denominati.
• Esattamente un h1 per pagina, con le intestazioni annidate in ordine al di sotto e senza livelli saltati.
• Ogni immagine riporta un testo alternativo, e la grafica decorativa è nascosta alle tecnologie assistive invece di ricevere descrizioni di riempimento.
• Quando un’icona veicola il significato di un controllo, il controllo ha un nome testuale: l’etichetta visibile apre sempre quel nome, così il comando vocale può richiamarlo con ciò che vi è scritto.
• La lingua della pagina è dichiarata e ogni pagina ha un titolo univoco e descrittivo.

Colore, contrasto e caratteri

• I colori del testo e dell’interfaccia sono derivati in fase di build e verificati rispetto ai loro sfondi: il testo corrente deve raggiungere almeno 4,5:1, il testo principale 7:1, e ogni riempimento pieno dei pulsanti viene scurito finché la sua etichetta non supera 4,5:1.
• Nessun testo del sito è reso sotto i 12 px. È una soglia minima, garantita da un test.
• Il colore non è mai l’unico veicolo di un’informazione: gli stati selezionati portano anche un’etichetta, una forma o un valore aria-current.
• Sono disponibili un tema chiaro e uno scuro. Il sito si apre in modalità scura invece di leggere l’impostazione di sistema, e ricorda quella che lei sceglie con l’interruttore nell’intestazione.

Movimento, zoom e puntatore

• Il movimento ridotto è rispettato. Se il suo sistema lo richiede, le animazioni d’ingresso, le comparse allo scorrimento e le transizioni di vista vengono soppresse.
• Il contrasto aumentato e la modalità contrasto elevato di Windows sono gestiti: il testo con gradiente ripiega su un colore pieno e gli stati indicati solo da un riempimento acquisiscono un bordo nei colori di sistema.
• Lo zoom non è bloccato. La pagina può essere ingrandita al 500 % e, alla larghezza di 320 px indicata dal criterio WCAG 1.4.10 «Ridisposizione», si dispone su una sola colonna senza scorrimento orizzontale. Viene verificata ogni larghezza tra 320 px e 1920 px, non solo i breakpoint denominati.
• I controlli interattivi presentano un bersaglio di almeno 44 × 44 px, superiore al minimo di 24 × 24 px previsto da WCAG 2.2. Quando un controllo è disegnato più piccolo, la sua area cliccabile viene ampliata dietro di esso invece di restare piccola. L’unica eccezione è un link all’interno di una frase, che rientra nell’esenzione «in linea» del criterio WCAG 2.5.8: imporvi un’altezza fissa spezzerebbe l’interlinea del paragrafo circostante.

Moduli

• Ogni campo ha un nome associato a livello di programmazione. Quando un modulo ha più di un campo — il modulo di contatto e il pannello delle preferenze sui cookie — quel nome è una <label> visibile. I controlli a campo singolo (iscrizione alla newsletter, ricerca negli elenchi, casella dei commenti, richiesta di accesso via e-mail) ricavano il nome da un aria-label, mentre l’intestazione, l’icona o il pulsante accanto veicolano lo stesso significato sullo schermo.
• Gli errori sono descritti a parole accanto al campo cui si riferiscono, non con il solo colore, e sono collegati a esso perché uno screen reader annunci il messaggio quando il campo riceve il focus.
• L’invio di un modulo con un campo non valido sposta il focus su quel campo: è il problema a trovare lei, non il contrario.
• I campi di testo sono resi a 16 px sui dispositivi touch, così metterli a fuoco non impone uno zoom di iOS che non si riesce ad annullare.

4. Come è stata svolta la valutazione

Per autovalutazione, combinando verifiche automatiche e manuali:

• Test automatici nella suite di test del progetto, che fanno fallire la build in caso di regressione degli indicatori di focus, della dimensione minima del testo, della dimensione dei bersagli, della struttura dei landmark, dei testi alternativi delle immagini e dell’ordine delle intestazioni.
• Contrasto misurato dai pixel effettivamente resi, componendo i livelli traslucidi invece di leggere i colori dichiarati.
• Una scansione del viewport da 320 px a 1920 px che verifica, a ogni passo intermedio, traboccamenti orizzontali, elementi sovrapposti e testo troncato — non solo ai breakpoint denominati.
• Percorsi manuali da tastiera e verifiche su più motori: Chromium, Firefox e WebKit.

5. Limiti noti

• Nessun audit indipendente. Tutto quanto precede è autovalutato. Un audit svolto da una persona diversa dall’autore sarebbe una base più solida per la dichiarazione di conformità della sezione 2.
• Test limitati con le tecnologie assistive. Struttura e comportamento sono verificati rispetto all’albero di accessibilità e da tastiera, ma il sito non è stato provato da capo a fondo con tutti i principali screen reader.
• Contenuti di terze parti. La prenotazione degli appuntamenti è gestita da un servizio esterno sul proprio dominio. Non ne controllo l’accessibilità. Se ciò rappresenta una barriera per lei, utilizzi uno dei canali di contatto della sezione 6: una chiamata si può sempre concordare via e-mail.
• Media incorporati. Oggi su questo sito non è pubblicato alcun video. Il video di presentazione annunciato dalla pagina «Chi sono» non è ancora stato registrato; quando lo sarà, i criteri WCAG 1.2.2 e 1.2.3 richiederanno sottotitoli e una trascrizione per il livello di conformità dichiarato sopra.

6. Segnalazioni e come contattarmi

Se incontra una barriera su questo sito, me lo dica: è il modo più rapido perché venga corretta, e le segnalazioni sono benvenute anche se non è certo che il problema dipenda da me.

• Scriva a contact@mhsaeed.com — indichi «Accessibilità» nell’oggetto se desidera che sia trattata con priorità.
• Oppure utilizzi il modulo di contatto.

Rispondo entro 24 ore, lo stesso impegno assunto dalla pagina dei contatti. Descriva la pagina, che cosa stava cercando di fare e il browser o la tecnologia assistiva che utilizzava, se le fa piacere condividerlo: rende il problema molto più rapido da riprodurre.