Merged
Conversation
Collaborator
|
Review requested:
|
The current use of color only to differentiate links fails WCAG A accessibility standards. Possible solutions are: 1. Using a text indicator to show that the text is a link. 2. Using additional cues (such as underlining). 3. Providing color contrast of 3:1 or greater with surrounding text (not the background--the adjacent text!) along with visual cues on hover. The solution here implements the second option. Ref: https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html Ref: https://www.w3.org/WAI/WCAG21/Techniques/failures/F73 Ref: https://www.w3.org/WAI/WCAG21/Techniques/general/G182
be33bb1 to
4b72008
Compare
ovflowd
approved these changes
Oct 30, 2023
Member
ovflowd
left a comment
There was a problem hiding this comment.
This seems such a trivial enough change, that it definitely brings more benefits as outlined by Rich, even tho these API docs are due to a redeisgn.
Thanks for the effort of making this change and bringing relevant docs, Rich!
MoLow
approved these changes
Oct 31, 2023
bmuenzenmeyer
approved these changes
Oct 31, 2023
anonrig
approved these changes
Oct 31, 2023
tniessen
approved these changes
Oct 31, 2023
aymen94
approved these changes
Oct 31, 2023
bnb
approved these changes
Oct 31, 2023
lpinca
approved these changes
Oct 31, 2023
Member
Author
|
We may want to revise this later to improve the aesthetics, but I think it's better to make it accessible first and then figure out how to make it look better. In a lot of cases, adding the underlining looks just fine: But it can be a bit much when everything is a link: (Or maybe all that underlining is fine. I don't know.) |
Collaborator
|
Landed in 401ea75 |
anonrig
pushed a commit
to anonrig/node
that referenced
this pull request
Nov 9, 2023
The current use of color only to differentiate links fails WCAG A accessibility standards. Possible solutions are: 1. Using a text indicator to show that the text is a link. 2. Using additional cues (such as underlining). 3. Providing color contrast of 3:1 or greater with surrounding text (not the background--the adjacent text!) along with visual cues on hover. The solution here implements the second option. Ref: https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html Ref: https://www.w3.org/WAI/WCAG21/Techniques/failures/F73 Ref: https://www.w3.org/WAI/WCAG21/Techniques/general/G182 PR-URL: nodejs#50481 Refs: https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html Refs: https://www.w3.org/WAI/WCAG21/Techniques/failures/F73 Refs: https://www.w3.org/WAI/WCAG21/Techniques/general/G182 Reviewed-By: Claudio Wunder <cwunder@gnome.org> Reviewed-By: Moshe Atlow <moshe@atlow.co.il> Reviewed-By: Yagiz Nizipli <yagiz@nizipli.com> Reviewed-By: Tobias Nießen <tniessen@tnie.de> Reviewed-By: Tierney Cyren <hello@bnb.im> Reviewed-By: Luigi Pinca <luigipinca@gmail.com>
targos
pushed a commit
that referenced
this pull request
Nov 11, 2023
The current use of color only to differentiate links fails WCAG A accessibility standards. Possible solutions are: 1. Using a text indicator to show that the text is a link. 2. Using additional cues (such as underlining). 3. Providing color contrast of 3:1 or greater with surrounding text (not the background--the adjacent text!) along with visual cues on hover. The solution here implements the second option. Ref: https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html Ref: https://www.w3.org/WAI/WCAG21/Techniques/failures/F73 Ref: https://www.w3.org/WAI/WCAG21/Techniques/general/G182 PR-URL: #50481 Refs: https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html Refs: https://www.w3.org/WAI/WCAG21/Techniques/failures/F73 Refs: https://www.w3.org/WAI/WCAG21/Techniques/general/G182 Reviewed-By: Claudio Wunder <cwunder@gnome.org> Reviewed-By: Moshe Atlow <moshe@atlow.co.il> Reviewed-By: Yagiz Nizipli <yagiz@nizipli.com> Reviewed-By: Tobias Nießen <tniessen@tnie.de> Reviewed-By: Tierney Cyren <hello@bnb.im> Reviewed-By: Luigi Pinca <luigipinca@gmail.com>
targos
pushed a commit
that referenced
this pull request
Nov 14, 2023
The current use of color only to differentiate links fails WCAG A accessibility standards. Possible solutions are: 1. Using a text indicator to show that the text is a link. 2. Using additional cues (such as underlining). 3. Providing color contrast of 3:1 or greater with surrounding text (not the background--the adjacent text!) along with visual cues on hover. The solution here implements the second option. Ref: https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html Ref: https://www.w3.org/WAI/WCAG21/Techniques/failures/F73 Ref: https://www.w3.org/WAI/WCAG21/Techniques/general/G182 PR-URL: #50481 Refs: https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html Refs: https://www.w3.org/WAI/WCAG21/Techniques/failures/F73 Refs: https://www.w3.org/WAI/WCAG21/Techniques/general/G182 Reviewed-By: Claudio Wunder <cwunder@gnome.org> Reviewed-By: Moshe Atlow <moshe@atlow.co.il> Reviewed-By: Yagiz Nizipli <yagiz@nizipli.com> Reviewed-By: Tobias Nießen <tniessen@tnie.de> Reviewed-By: Tierney Cyren <hello@bnb.im> Reviewed-By: Luigi Pinca <luigipinca@gmail.com>
UlisesGascon
pushed a commit
that referenced
this pull request
Dec 11, 2023
The current use of color only to differentiate links fails WCAG A accessibility standards. Possible solutions are: 1. Using a text indicator to show that the text is a link. 2. Using additional cues (such as underlining). 3. Providing color contrast of 3:1 or greater with surrounding text (not the background--the adjacent text!) along with visual cues on hover. The solution here implements the second option. Ref: https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html Ref: https://www.w3.org/WAI/WCAG21/Techniques/failures/F73 Ref: https://www.w3.org/WAI/WCAG21/Techniques/general/G182 PR-URL: #50481 Refs: https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html Refs: https://www.w3.org/WAI/WCAG21/Techniques/failures/F73 Refs: https://www.w3.org/WAI/WCAG21/Techniques/general/G182 Reviewed-By: Claudio Wunder <cwunder@gnome.org> Reviewed-By: Moshe Atlow <moshe@atlow.co.il> Reviewed-By: Yagiz Nizipli <yagiz@nizipli.com> Reviewed-By: Tobias Nießen <tniessen@tnie.de> Reviewed-By: Tierney Cyren <hello@bnb.im> Reviewed-By: Luigi Pinca <luigipinca@gmail.com>
Merged
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.


The current use of color only to differentiate links fails WCAG A accessibility standards.
Possible solutions are:
The solution here implements the second option.
Ref: https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html
Ref: https://www.w3.org/WAI/WCAG21/Techniques/failures/F73
Ref: https://www.w3.org/WAI/WCAG21/Techniques/general/G182