django / django/djangoproject.com
Check colours for accessibility / WCAG compliance
- Dominant language
- Python
- Stars
- 2k
- Forks
- 1.1k
- Avg merge
- 3d 10h
- Merged PRs (30d)
- 33
Description
There are a couple of areas where the current colour contrasts between fonts and backgrounds fail the WCAG 2.0 colour contrast accessibility guidelines on the djangoproject.com pages.
It's mostly to do with the bright green compared with white/white-ish colours:
### Green on gray, [contrast 2.79](https://contrast-ratio.com/#rgb%2832%2C%20170%2C%20118%29-on-%23f8f8f8)
Fails all checks, mostly in use on sidebars.

### Bright green on less bright green, [contrast 2.02](https://contrast-ratio.com/#%23C9F0DD-on-%2344b78b)
Fails all checks, it's in use in title areas.

### Bright green on dark green, [contrast 4.05](https://contrast-ratio.com/#%2344B78B-on-%230c4b33)
This would be okay with 14pt+ instead of the current ~10pt, but 14pt is unreasonably huge.

### Green on green, [contrast 2.43](https://contrast-ratio.com/#rgb%2843%2C%20140%2C%20103%29-on-%230c4b33)
Fails all checks, is hard to read even for me.

### White on green, [contrast 2.5](https://contrast-ratio.com/#white-on-%2344B78B)
Sadly, this isn't even WCAG compliant in large/bold fonts, and we use it on all of our buttons, etc.

## Next steps
For me (good vision, good screen) some of the completely failing combinations are perfectly easy to read, like the white font on bright green buttons – but that's the point of accessibility guidelines, they're not for people with good vision and good screens.
Since this impacts a lot of the djangoproject.com page, especially with the bright green being so prevalent, I'm not sure how to proceed here, but I wanted to document the issue to start a conversation about it.
Contributor guide
No contributing guide indexed for this repository
Research direction
No source file or test is named; begin by locating the djangoproject.com page styles responsible for the colour combinations documented in the issue. Use the linked contrast checks to verify each reported failure, and consider the work done when the affected text and background combinations meet the applicable WCAG contrast requirements.
Written by the indexing model from the issue text.
Assessment
- Domain
- accessibility, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 35/100