-
-
Notifications
You must be signed in to change notification settings - Fork 4k
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
[BITV] 9.1.3.1e/8.1 - The user table represents a grid element and should be implemented as such. (1) #36921
Comments
@JuliaKirschenheuter I would say we have a situation where the solution lies somewhere in the middle. But I would say we can also implement it as a normal table instead of a grid. |
Please verify the table semantics on https://try.nextcloud.com/ltd/a11y/index.php/settings/users @michaelnissenbaum and let us know if adjustments should be made :) |
Hi @JuliaKirschenheuter. You're on the right track, BUT in the case of tables, it is important not to mix ARIA roles and HTML elements, which you have done here. Either the table should be implemented entirely with ARIA roles or solely with HTML elements, without mixing them. You can find a good description at https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Table_Role. |
The usage of both HTML elements and roles in the markup here is a technical limitation and did not seem optimal at first but given that browser engines interpret these semantics correctly i.e.
and as a result provides the correct information to screenreaders, is this an acceptable solution @michaelnissenbaum? |
Hi @JuliaKirschenheuter. Unfortunately, with such a mix of HTML elements and ARIA roles, it cannot be guaranteed that all screen readers will correctly render the table across all browsers. I would strongly advise against using such a mixed approach in this case. |
Thanks a lot @michaelnissenbaum for this advice! |
Ultimately it's best to use HTML elements instead of hacking |
Any things we should take into account with VirtualList 👆 @skjnldsv? Shall we copy-n-adapt for users or abstract it into a reusable table component? |
Well, I don't know about the latest a11y hacks, but we're fully using official semantic for a table. |
@michaelnissenbaum any comment on this and subsequent comments? |
From my perspective, there's nothing preventing us from implementing the table entirely with ARIA. You can find the description here: https://www.w3.org/WAI/ARIA/apg/patterns/table/examples/table/. |
Let's see if the maintainer takes a look soon If not, plan ARIA it is |
@Pytal you can also use the component Files is using. |
@Pytal can this item be considered done for the moment or are there any open items? If So can you please add them to the top issue description? Thanks! |
At the moment, the data is implemented in an unstructured manner using "div" elements. More information on grid implementation can be found at the following URLs: https://sarahmhigley.com/writing/grids-part1/, https://sarahmhigley.com/writing/grids-part2/ or https://www.w3.org/WAI/ARIA/apg/patterns/grid/.
feat: Set custom element tags Akryum/vue-virtual-scroller#825If upstream additions can't be made
Details
https://report.bitvtest.de/default-en/d63601ac-cb34-4645-8256-66bec78964a0.html#checkpoint-3f0ff0bc0e-v8-n1
The text was updated successfully, but these errors were encountered: