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

Accessibility improvements to the left nav #638

Merged
merged 3 commits into from May 18, 2018

Conversation

davidfischer
Copy link
Contributor

This makes a few color changes to the left navigation with an eye toward improved accessibility. Specifically, I looked at the colors on our existing theme and they don't have enough contrast. The headings are the worst offenders but some of the links aren't fantastic.

screen shot 2018-05-14 at 3 28 40 pm

Ping @mahmoud

Copy link
Member

@Blendify Blendify left a comment

Choose a reason for hiding this comment

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

The improvements and code look good!
This also fixes #453

Copy link
Contributor

@jessetan jessetan left a comment

Choose a reason for hiding this comment

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

Definitely an improvement.

The contrast between toctree captions like "Demo documents" and the links has decreased with these changes. Have you considered making the entire menu background a bit darker (versions menu bg could go to full black)? This will also increase contrast between bg and text, and you don't have to lighten the captions as much.

@davidfischer
Copy link
Contributor Author

By itself though, going to jet black (#000) will not solve the problem. The accessibility rating would only be acceptable for large headings.

The other problem is that the left navigation would blend in with the version menu at the bottom ("Read the Docs v:latest")

I suspect we can slightly darken the captions ("Demo documents") though while still keeping a good rating. I'll see what I can do.

@davidfischer
Copy link
Contributor Author

I made a slight tweak to the colors to try to get a little more differentiation between the captions ("DEMO DOCUMENTS") and the links ("Structural elements"). I reduced it down to essentially the least contrast of the caption so that we retain a AA accessibility rating with the background.

@davidfischer davidfischer merged commit 17ecdc6 into master May 18, 2018
@mahmoud
Copy link

mahmoud commented May 18, 2018

Excellent! Is there a milestone / timeline for getting this released? I assume I'll just have to re-pin to the new release in my requirements.txt.

Thanks!

@davidfischer
Copy link
Contributor Author

If you've pinned to a precise version, yes, you'll need to re-pin.

If you haven't, or you pinned to something like sphinx-rtd-theme<0.4 (which will be the default after readthedocs/readthedocs.org#4096), then it should just happen automatically. I aim to get both of these changes out next week.

@stsewd stsewd deleted the increase-color-accessibility branch January 2, 2019 23:39
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.

None yet

4 participants