Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: changed aria-hidden to false for slider arrows #654

Merged
merged 1 commit into from
May 10, 2024

Conversation

sabrina-bongiovanni
Copy link
Collaborator

yes yes I know what you're thinking: basta togliere aria-hidden=true, non serve impostarlo a false, è di default
Però senza attributo non impostato esplicitamente a false, NVDA continua a leggere "vuoto" invece dell'aria-label

@sabrina-bongiovanni sabrina-bongiovanni added a11y-accessibility Fixes accessibility issues or adds accessibility features v2 labels Apr 12, 2024
@sabrina-bongiovanni sabrina-bongiovanni self-assigned this Apr 12, 2024
@giuliaghisini
Copy link

giuliaghisini commented Apr 15, 2024

ma perchè le mostriamo?
non si era detto che queste non si devono vedere per i lettori di schermo perchè la navigazione nello slider avviene con le frecce? erano stati messi aria-hidden per questo motivo. Anche qui lo sono https://accessible360.github.io/accessible-slick/

@sabrina-bongiovanni
Copy link
Collaborator Author

L'ho spiegato nella descrizione della PR :)
aria-hidden = true non fa nulla, alcuni SR continuano a leggerlo e alcuni no, per non dare problema con nessun SR o nessun tool di accessibilità, l'unica è farli effettivamente leggere con aria-hidden = false e un'aria-label parlante

@giuliaghisini
Copy link

L'ho spiegato nella descrizione della PR :) aria-hidden = true non fa nulla, alcuni SR continuano a leggerlo e alcuni no, per non dare problema con nessun SR o nessun tool di accessibilità, l'unica è farli effettivamente leggere con aria-hidden = false e un'aria-label parlante

quello che intendo io è che quei bottoni per lo screen reader dovrebbero essere come se fossero inesistenti. Se metti aria-hidden="false" li stai forzando a renderli sempre visibili

@sabrina-bongiovanni
Copy link
Collaborator Author

sabrina-bongiovanni commented Apr 15, 2024

L'ho spiegato nella descrizione della PR :) aria-hidden = true non fa nulla, alcuni SR continuano a leggerlo e alcuni no, per non dare problema con nessun SR o nessun tool di accessibilità, l'unica è farli effettivamente leggere con aria-hidden = false e un'aria-label parlante

quello che intendo io è che quei bottoni per lo screen reader dovrebbero essere come se fossero inesistenti. Se metti aria-hidden="false" li stai forzando a renderli sempre visibili

Quello l'ho capito e so che i bottoni dovrebbero essere inesistenti. Il problema è che non lo sono. I tool e gli SR li vedono comunque e li segnalano come errore.

image

Accessiway per Cavriago Servizi ad esempio richiede esplicitamente di eliminare aria-hidden=true, e facendo prove con gli SR, è effettivamente la soluzione migliore, se non fosse che togliere aria-hidden = true con NVDA non funziona, quindi occorre esplicitamente impostarlo a false (cosa che dovrebbe essere il comportamento di default ma evidentemente NVDA ha bisogno di un rinforzino)

@giuliaghisini
Copy link

L'ho spiegato nella descrizione della PR :) aria-hidden = true non fa nulla, alcuni SR continuano a leggerlo e alcuni no, per non dare problema con nessun SR o nessun tool di accessibilità, l'unica è farli effettivamente leggere con aria-hidden = false e un'aria-label parlante

quello che intendo io è che quei bottoni per lo screen reader dovrebbero essere come se fossero inesistenti. Se metti aria-hidden="false" li stai forzando a renderli sempre visibili

Quello l'ho capito e so che i bottoni dovrebbero essere inesistenti. Il problema è che non lo sono. I tool e gli SR li vedono comunque e li segnalano come errore.

image

Accessiway per Cavriago Servizi ad esempio richiede esplicitamente di eliminare aria-hidden=true, e facendo prove con gli SR, è effettivamente la soluzione migliore, se non fosse che togliere aria-hidden = true con NVDA non funziona, quindi occorre esplicitamente impostarlo a false (cosa che dovrebbe essere il comportamento di default ma evidentemente NVDA ha bisogno di un rinforzino)

ok, il problema è che i pulsanti sono elementi interattivi e aria-hidden non funziona sugli interactive and focusable elements: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-hidden

Non ho visto soluzioni alternative, quindi l'unica è rendere visibile qui bottoni anche agli screen reader

@pnicolli pnicolli merged commit 6cd4661 into v2 May 10, 2024
2 checks passed
@pnicolli pnicolli deleted the us_51458_v2_carousel_prev_next_buttons branch May 10, 2024 10:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a11y-accessibility Fixes accessibility issues or adds accessibility features v2
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants