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

♿ [#2345] A11y replace disallowed heading tags in Cards #1224

Merged
merged 1 commit into from
Jun 14, 2024

Conversation

jiromaykin
Copy link
Contributor

@jiromaykin jiromaykin commented May 28, 2024

issue: if there is no content, then there should not be any headings.
Taiga: https://taiga.maykinmedia.nl/project/open-inwoner/task/2345

Cards that only have an image and no text content at all, should use a paragraph that may visually look like a Heading.
A real Heading is an HTML tag that should summarize/pin-point the section below it, but in case of an image it does not make sense in accessibility/meaningfulness.

Also screen-readers will read out headings as a list with hierarchy, so there better be something meaningful there.

Note : it is outside of the scope of this issue but some of the other cards are incorrect as well - in case a card has only a title, it's again not really a heading. Example: the sub-category card here: https://open-inwoner-test.maykin.nl/onderwerpen/vervoer/
And on the Profile page it is better to just consistently use paragraphs, since many of the 'Overzicht' cards do not have 'meaningful' content when read by a screenreader as a hierarchical list.

Perhaps none of the cards need a true Heading tag, but at least our 'Aanvragen/Vragen/Samenwerkingen' cards have a lot more content that may benefit from having a heading.

Also note: NL Design System has its own Card component, which we are not using yet in OIP.

@jiromaykin jiromaykin changed the title ♿ [#2345] A11y replace disallowed heading tags ♿ [#2345] A11y replace disallowed heading tags in Cards Jun 6, 2024
@jiromaykin jiromaykin force-pushed the issue/2345-A11y-1.3.1-category-card-headings branch from 92754db to 4134d69 Compare June 6, 2024 15:16
@jiromaykin jiromaykin marked this pull request as ready for review June 6, 2024 15:16
@jiromaykin jiromaykin force-pushed the issue/2345-A11y-1.3.1-category-card-headings branch from 46cb3ea to 4b182c2 Compare June 6, 2024 15:26
@codecov-commenter
Copy link

codecov-commenter commented Jun 6, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 95.22%. Comparing base (12c451b) to head (4b182c2).
Report is 60 commits behind head on develop.

Additional details and impacted files
@@             Coverage Diff             @@
##           develop    #1224      +/-   ##
===========================================
+ Coverage    95.21%   95.22%   +0.01%     
===========================================
  Files          968      973       +5     
  Lines        35256    35446     +190     
===========================================
+ Hits         33568    33755     +187     
- Misses        1688     1691       +3     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@jiromaykin jiromaykin requested a review from pi-sigma June 6, 2024 17:06
@alextreme alextreme self-requested a review June 10, 2024 08:13
@jiromaykin jiromaykin added the Accessibility Improving accessibility label Jun 13, 2024
@jiromaykin
Copy link
Contributor Author

@alextreme You are also allowed to review this one, since it's quite simple.

@alextreme alextreme merged commit 7516e19 into develop Jun 14, 2024
16 checks passed
@alextreme alextreme deleted the issue/2345-A11y-1.3.1-category-card-headings branch June 14, 2024 08:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Accessibility Improving accessibility
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants