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

Enhance text contrast of light theme to improve accessibility. #1470

Merged
merged 1 commit into from
Feb 22, 2021

Conversation

tim-seoss
Copy link
Contributor

This PR aims to address #1442, and is a refinement of PR #1353 based on feedback there, and also on the WebAIM mailing list, in the replies to this post:

https://webaim.org/discussion/mail_message?id=45812

Principle differences from earlier revisions posted in #1353 are:

  • The new colour scheme is now applied directly to the default light theme (instead of a separate and new contrast theme).
  • The scroll bars are now slightly lower contrast (to make them less visually distracting/imposing, while still complying with WCAG v2.1).
  • A subtle change to the syntax highlight text colours, to perform better on devices which have their "blue light filter" activated.
  • The size of the title text (rendered at the top-centre of each page) is now 20% larger (this doesn't make the title bar steal area from other page elements, and seems unlikely to get the title ellipsised except when viewing on phone screens)

Of the changes, I'm least certain about the last one (title text size). If people feel that it's now too big, an alternative would be to restore the size of the title text, and further increase its contrast (by introducing a new theme colour for it) instead.

Commit text follows:

The existing light theme has relatively low contrast between the text
(and other UI elements) and background (especially within code blocks).
This presents difficulties for people with reduced visual contrast
perception (common in older adults).

This patch makes changes to the default light theme to meet the
minimum contrast requirement of the v2.1 W3C WCAG (Web Content
Accessibility Guidelines)
https://www.w3.org/WAI/WCAG21/quickref/#contrast-minimum

The small size, and slender font used for the title text makes it hard
to read, even with the increased contrast colour scheme, so this patch
also increases the size of the title text font by 20%.

Closes #1442

The existing light theme has relatively low contrast between the text
(and other UI elements) and background (especially within code blocks).
This presents difficulties for people with reduced visual contrast
perception (common in older adults).

This patch makes changes to the default `light` theme to meet the
minimum contrast requirement of the v2.1 W3C WCAG (Web Content
Accessibility Guidelines)
https://www.w3.org/WAI/WCAG21/quickref/#contrast-minimum

The small size, and slender font used for the title text makes it hard
to read, even with the increased contrast colour scheme, so this patch
also increases the size of the title text font by 20%.

Closes rust-lang#1442
Copy link
Contributor

@ehuss ehuss left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for working on this, I appreciate the attention to detail here!

The only feedback that I might have is that the scroll bars might be a little distracting since they are now so visible. However, I'm fine with trying this out and seeing if there is any other feedback.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Stylesheet contrast issues
2 participants