Comments (4)
I'll reach out to some folks on guidance here
from dataverse.
Hmm - I used to see this but with Chrome/Windows using Wave 3.2.3 I'm not seeing this error - this is in the file table on the dataset page, view mode?
from dataverse.
Odd I'm not seeing it in Chrome/Edge, either, but I see it in Firefox and I think it's correct -- it is a table header with no text and I don't think the ARIA labels can substitute for having actual text
from dataverse.
OK, here's the response from an accessibilty specialist over at code4lib:
Sebastian
Hi -- I'm trying to get the display of a file list/table right for accessibility in a data repository, see e.g. the File tab here. This is basically a table with one row per file and three cells per row -- a select checkbox, a File name & link, and a download/view option.
Currently we have a table header at the top that has a check all box on the left, "1 to k of n files" in the middle, and a download/request button for all selected files on the right. That doesn't seem right to me.
I'm struggling to think about this even in conceptual terms: Should we treat this as a data table and get the header right (if so, any thoughts on how?) -- my thinking here is that a screenreader announcing something like "Table with 3 columns and 8 rows..." is actually useful information -- or is this more helpful as a layout table, i.e, we'd take out the table header entirely as per the WebAIM guidance for layout tables.
metageeky (Kate)
Hey Sebastian, we interacted a little when I was at Syracuse.
The problem here is that if you turn it into a layout table, you introduce some navigation confusion. First, you lose what you noted about being aware of how many items (files) and all that. Semantically, what you have is either a table or a list of items.
Further complicating the situation is that the actual table headers do not really create a helpful experience. It's three columns only. There's a checkbox, various file names and details, and some file actions. Each row comes off as some text with actions and not really tabular data.
I don't know Dataverse at all but if had my druthers, I'd propose the following:
Revamp the table as a list
Each list item is essentially a "card" such as Heydon Pickering talks about.
You'd want to play with the DOM (element) ordering so that things like the file name comes first and not the check box. Makes scanning across the list items easier by front-loading that.
There is an another option, but it's a bit more drastic and involved. There is actual tabular data in that middle column: file name, file type, file size, thumbnail, publication date, # of downloads, etc. Since those appear to be found in all rows, you could make each a column with a relevant header. That would let a screen reader scan down by columns. You'd need to do a lot of CSS trickery to keep the layout as it is. Quite doable now that most browsers stopped letting CSS display override element role.
My current view is that the 2nd option is a bit too much, but as I say above, list would seem like a better way to organize this than table. I don't think we'll want to engage in that level of design work right now, though -- is there a way to bring this up in the context of the engoing SPA development?
from dataverse.
Related Issues (20)
- Accessibility - Drupal - Focus elements HOT 5
- Accessibility - Dataverse - Frames and Axecore HOT 1
- Accessibility - Dataverse - Fly Out Menus HOT 2
- Accessibility - Dataverse(?) - Spreadsheet Viewer HOT 7
- Accessibility - Dataverse - ARIA Hidden Elements with Focusable Elements HOT 1
- Accessibility - Dataverse - Unique ID Attribute Value HOT 1
- Accessibility - Dataverse - ARIA Attributes and Valid Values HOT 1
- Accessibility - Dataverse - ul and ol HOT 2
- QA on 5.8: Bug when trying to open an old project HOT 1
- QA on 5.8: SSO redirects HOT 3
- Accessibility - Dataverse - ARIA Roles Contained by Particular Parents HOT 1
- Accessibility: Contrast of red-on-red warning (e.g. must allow requests for access)
- Accessibility: Tab highlight of rectangular buttons (Dataverse)
- Accessibility - Dataverse - <li> elements HOT 1
- Accessibility - Dataverse - ARIA Commands and Accessible Name HOT 4
- Accessibility - Dataverse - ARIA Toggle Fields and Accessible Name HOT 1
- Accessibility - Dataverse - Nested Interactive Controls HOT 3
- Accessibility - Dataverse - ARIA Role and Element HOT 1
- Accessibility - Dataverse - Links with Same Name HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from dataverse.