Accessibilità: i collegamenti di ancoraggio necessitano di un'etichetta

Dato che sono comparsi solo nella beta 7, vorrei segnalare che i link a ogni sottotitolo in un post lungo devono avere un attributo aria-label. Attualmente, sono codificati con un semplice tag a con nome e probabilmente un’immagine di sfondo inclusa tramite la classe CSS .anchor, il che fa sì che lo screen reader legga un numero (probabilmente l’ID del post) e frammenti del titolo. È meglio essere espliciti e inserire qualcosa come “Link permanente” oppure "Link permanente a " seguito dal testo del sottotitolo. In questo modo, gli utenti che utilizzano screen reader, quando aprono un elenco di link in una pagina, troveranno link correttamente nominati.

Inoltre, sarebbe possibile posizionare l’ancora dopo il testo del titolo all’interno dell’elemento h, e non prima? Al momento, lo screen reader, quando si naviga da un titolo all’altro, legge sempre prima il link; soprattutto se il testo del titolo viene ripetuto nell’etichetta come suggerito sopra, la lettura può diventare piuttosto pesante. Poiché gli utenti di screen reader spesso ottengono una panoramica della pagina grazie alla struttura dei titoli (vedi vari sondaggi WebAIM sugli utenti di screen reader), sarebbe meglio inserire il link dopo il testo del titolo.

Grazie per il continuo miglioramento dell’accessibilità in Discourse!

4 Mi Piace

Hmm, sembra strano che un numero sia stato prelevato da qualche parte…

A parte questo, tutti questi suggerimenti hanno senso e non dovrebbero essere un problema da implementare. Grazie ancora per il consiglio!

1 Mi Piace

In assenza di un’etichetta alternativa per un link, i lettori di schermo leggeranno il contenuto dell’attributo href, in modo che gli utenti sappiano almeno la destinazione o l’URL del link.

C’è un’ottima analisi tecnica approfondita sul tema dei link di ancoraggio accessibili qui: Are your Anchor Links Accessible? | Amber Wilson

2 Mi Piace