search

DSpace / dspace-angular

DSpace User Interface built on Angular.io
https://wiki.lyrasis.org/display/DSDOC8x/
BSD 3-Clause "New" or "Revised" License
131 stars 430 forks source link

[Deque Analysis] Edit Item, Bitstreams Tab: "Content should be in a data table but is not" (Critical Issue) #1270

Open tdonohue opened 3 years ago

tdonohue commented 3 years ago

Critical: This issue results in blocked content for people with disabilities, and will definitely prevent them from accessing fundamental features or content. This type of issue puts your organization at risk. Prioritize fixing as soon as possible, within the week if possible. Remediation should be a top priority.

Deque Analysis Summary

(Issue ID: 470946) Edit Item, Bitstreams tab: "Content should be in a data table but is not." The page appears visually as a table, but it is not represented as a <table>. Ideally, this will be fixed as follows:

Fix this issue by doing ALL of the following:

The full issue (which includes links for more info) can be found at this link (requires login): https://axeauditor.dequecloud.com/test-run/0856438a-a19a-11eb-bc31-b7d5be387c86/issues?activeTab=dt-issue&page=0&pageSize=100&sortField=ordinal&sortDir=asc&row=9&filter%5Bseverity%5D=4&filter%5Bpage_number%5D=12&filter%5Bpage_number%5D=13&filter%5Bpage_number%5D=14&filter%5Bpage_number%5D=15

More Information / Tools

atarix83 commented 2 years ago

@tdonohue

the solution of this issue is not trivial since it requires a complete refactoring of the components in order to be rendered as a table. The estimation is about 60hours and in our opinion benefits are not commensurate with the cost

tdonohue commented 2 years ago

@atarix83 : Thanks for your honest estimate & opinion on this ticket. Given that feedback, I'll add your estimate to this ticket...and I'll decrease the priority to medium priority for now. I'll also flag it as needing a volunteer, in case there are others out there interested in such a refactor, even if it only provides accessibility benefits.

artlowel commented 2 months ago

Atmire would like to claim this issue as well as https://github.com/DSpace/dspace-angular/issues/3154 and https://github.com/DSpace/dspace-angular/issues/1191, and refactor this page to solve them all

artlowel commented 1 month ago

@tdonohue This already had an estimate of 60 hours. That looks correct

tdonohue commented 1 month ago

More information on this issue from original Deque report:

Description

Data table - General: The content visually appears to be a data table but is not marked up as one.

Element:

Recommendation to fix

RULE : Tabular data SHOULD be represented in a <table>.

HOW TO FIX: Fix this issue by doing ALL of the following:

  1. Markup data that appears logically as a table using <table>, <tr>, and <td> elements.
  2. Ensure that header cell and data cell relationships are correctly conveyed according to the complexity of the table.
  3. If possible, add a <caption> element as the first child of the <table> element containing the name or title of the table.

REFERENCE: Deque University: https://dequeuniversity.com/class/semantic-structure2/tables/ W3C-WAI tutorial: https://www.w3.org/WAI/tutorials/tables/

BACKGROUND: People who are blind cannot see the organizational structure of a table with data arranged in rows and columns with corresponding header cells. In order for screen reader users to understand the logical relationships of data arranged in a table, tables need HTML markup that indicates header cells and data cells and defines their relationship. When tables are marked correctly, screen reader users are able to navigate data tables from cell to cell, in a multi-directional way (up, down, right, left), much like navigating a spreadsheet. As they move from cell to cell, screen readers will read the associated header labels.