search

rackerlabs / canon

A front-end framework for fast & consistent development of Rackspace UIs.
http://rackerlabs.github.io/canon/
Other
30 stars 22 forks source link

Accessibility: Color Contrast #105

Open annwa opened 10 years ago

annwa commented 10 years ago

A lot of the text used in Canon (#999 on white) does not meet minimum standards for accessibility. In this issue, I will explore updating with a color that is more accessible. (#666)

http://accessibility.psu.edu/contrasthtml

annwa commented 10 years ago

Tables: loading

Before: image

After: image

annwa commented 10 years ago

Status bar

Before: image

After: image

annwa commented 10 years ago

Forms

Before: image

After:

00a96d > #12832E

image

johnsonc725 commented 10 years ago

@annwa do you think it would enough contrast for regular folks to see #333333 and #666666?

Will there be enough contrast in the table headers?

annwa commented 9 years ago

so #333 & #666 have enough contrast when presented on a white background

brianhartsock commented 9 years ago

@annwa reading through that PSU article, it sounds like text and graphics matter, but things like borders don't? It's really weird to darken the table borders much for example.

annwa commented 9 years ago

Yeah usually when we talk about color contrast it has more to do with legibility of elements on the page. don't think it's as important for non-informational elements on the page

annwa commented 9 years ago

adding this example to the list of things to fix: https://github.com/rackerlabs/canon/issues/137#issuecomment-68909205