♿ [#2955] A11y: Remove B-tags if they are used for styling #1566
+7
−11
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
B
-tags should not be used lightly, usually these need to be replaced with aSTRONG
tag or a correct styling class, since B has no meaning and is only a visual tag (but we should use CSS for that).Strong
has emphasis in meaning and tone, which is useful to (for example) notify the user there is no data available.Screen-reader software responds differently to
B
-tags and Strong tags so they are more than just a 'style'.Issue: https://taiga.maykinmedia.nl/project/open-inwoner/task/2955
Also: it is NOT allowed to use
H2
headings if that heading has no paragraph and doesn't actually summarize any content - for accessibility software Headings have a specific meaning and are read out loud as a list with nested hierarchy.So: if there is data, then it is fine to use the
H2
, but if there isn't, it should be a paragraph.Additionally we should aim to always use the NLDS classes for headings, so municipalities can overwrite these with their own tokens.
The Heading hierarchy should be correct for accessibility, and it is perfectly acceptable to use the H3 CSS style for an H2 heading, as long as the HTML structure stays correct.