microsoft / microsoft/TypeScript
Avoid using just color to distinguish markers in type compatibility chart (WCAG 1.4.1)
@navya9singh is already working on this.
Since Jan 4, 2024.
- Dominant language
- Go
- Stars
- 111k
- Forks
- 14.4k
- Avg merge
- 1d 19h
- Merged PRs (30d)
- 117
Description
Acknowledgement
- I acknowledge that issues using this template may be closed without further explanation at the maintainer's discretion.
Comment
In the handbook section any, unknown, object, void, undefined, null, and never assignability, the chart uses just color to differentiate checkmarks:
- A blue
✓(classblue-tick) for a combination that's assignable regardless ofstrictNullChecks - A green
✓(classblack-tick[sic]) for a combination that's only assignable whenstrictNullChecksis off - A lighter blue
✓(via inline style) for the intersection ofanyandunknown
It's really subtle and hard to see even with "normal" color vision, let alone for people with color blindness. (People who are red-green color blind -- the most common kind -- "...tend to confuse purple, blue, green, orange, and red...." source.) See also WCAG Success Criterion 1.4.1: "Color is not used as the only visual means of conveying information..."
For (2) above, I suggest using a different marker entirely, perhaps one of: * † ‡ ○. Or alternatively, perhaps a combination like ✓? or ✓‡. (The text above explaining about the special checkmarks would also need to be changed to match.)
For (3) above, the text doesn't call out why that intersection is different from others, so I suggest the inline style could just be removed. If the distinction is important, though, it could be another marker.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Assessment
This issue has not been assessed yet.