the first point is that it is not even a semantic HTML element for an accordion, it's much more a disclose widget (also mentioned here accessibleculture.org/articles/201...).
The article above also states some accessibility problems the screen readers have with details/summary element. I quote:
If you must have one or more links nested in the summary, arrange them so that they are not the first things within the summary element. And even if you manage this, you should recognise that:
- these links still won't be in any way clearly identifiable to users of VoiceOver in Safari;
- these links still won't be available to JAWS in FF or Window-Eyes in both FF and IE when these screen readers are in Browse Mode; and,
- JAWS users with IE will have a less than ideal experience reading the summary's content.
be aware, the summary/details element is not as accessible as a well implemented accordion pattern.
Do you have any links or anything to read up on this? :)
Its semantic HTML elements, so I couldn't see much being better.
the first point is that it is not even a semantic HTML element for an accordion, it's much more a disclose widget (also mentioned here accessibleculture.org/articles/201...).
You can compare them at the WAI-ARIA practices site:
w3.org/TR/wai-aria-practices-1.1/#...
w3.org/TR/wai-aria-practices-1.1/#...
The article above also states some accessibility problems the screen readers have with details/summary element. I quote:
and another article:
scottohara.me/blog/2018/09/03/deta...
Thank you! Thats a really good note! :)