? Success

User tests: Successful: Unsuccessful:

avatar nonumber
nonumber
17 Mar 2015

According to accessibility guidelines, the contrast ratio of text vs background should be at least 4.5 (7.0 is better!).

A lot of text in Isis (Bootstrap 2) fails this ratio.

This PR fixes a lot of these by tweaking either the font colour or the background colour of elements.

  • Darker links
  • Darker text/links in status bar (bottom)
  • Darker headings
  • Darker text in alerts
  • Darker background of gray badges
  • Darker background of button states (green/red)

contrast

avatar nonumber nonumber - open - 17 Mar 2015
avatar joomla-cms-bot joomla-cms-bot - change - 17 Mar 2015
Labels Added: ?
avatar brianteeman brianteeman - change - 17 Mar 2015
Category Accessibility
avatar dgt41
dgt41 - comment - 17 Mar 2015

@test OK
Although this improves the contrast, I think a better approach will be to have a dedicated isis style e.g. High Contrast where no element will have a value less than 10. This can be implemented in a similar way as tinyMCE is picking up templates (folders inside /css/ will define styles that can be selected through a dropdown menu in Template Manager: Edit Style)

screen shot 2015-03-17 at 4 17 55

avatar nonumber
nonumber - comment - 17 Mar 2015

These tweaks are so minor, that most people will probably not even notice it.
That doesn't warrant a new style/template for me.
To have an extra style in isis with even more contrast (maybe even monochrome!) would be fine by me. But that would be a bigger step than these quick fixes that benefit all.

avatar pbwebdev
pbwebdev - comment - 17 Mar 2015

Thanks Peter!

avatar jessicadunbar jessicadunbar - test_item - 21 Mar 2015 - Tested successfully
avatar n9iels
n9iels - comment - 25 Mar 2015

@test looks good to me


This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/6475.
avatar n9iels n9iels - test_item - 25 Mar 2015 - Tested successfully
avatar nonumber
nonumber - comment - 25 Mar 2015

@dgt41 I like the idea to have an extra style in isis that has a minimum contrast ratio of 7 (Which is WCAG20 level AAA).
But let's try to get isis at least to WCAG20 level AA, so a a minimum contrast ratio of 4.5.

For more info: http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html

PS: I know contrast ratio is only 1 little part of the WCAG20... small steps.

avatar dgt41
dgt41 - comment - 25 Mar 2015

@nonumber I am not against this PR! Don’t take me wrong, all I proposed was the option for one or maybe more accessible themes within isis. One great starting point for the colors i guess can be http://contrastrebellion.com
Also this one got already 3 successful tests and it can be marked RTC and maybe merged for 3.4.2 (nothing major here to postpone it for another release)

avatar pbwebdev
pbwebdev - comment - 25 Mar 2015

I do like that idea @dgt41 of having that extra high contrast level. Perhaps it can be added as a template option to switch over to the extra high level.

But yeh in this case as long as we pass WCAG 2.0 AA level in testing for the standard admin for everyone else is best!

Thanks everyone.

avatar zero-24 zero-24 - change - 25 Mar 2015
Status Pending Ready to Commit
avatar zero-24 zero-24 - alter_testresult - 1 Apr 2015 - dgt41: Tested successfully
avatar zero-24 zero-24 - alter_testresult - 1 Apr 2015 - pbwebdev: Tested successfully
avatar zero-24
zero-24 - comment - 1 Apr 2015

Moving to RTC based on testing. Other changes can be done with a later PR. Thanks :smile:


This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/6475.
avatar zero-24 zero-24 - change - 1 Apr 2015
Labels Added: ?
avatar wilsonge
wilsonge - comment - 4 Apr 2015

@nonumber can you fix conflicts so i can merge please :)

avatar nonumber
nonumber - comment - 4 Apr 2015

Ok, done :)

avatar wilsonge wilsonge - change - 4 Apr 2015
Status Ready to Commit Closed
Closed_Date 0000-00-00 00:00:00 2015-04-04 17:48:02
avatar wilsonge wilsonge - close - 4 Apr 2015
avatar wilsonge wilsonge - reference | - 4 Apr 15
avatar wilsonge wilsonge - merge - 4 Apr 2015
avatar wilsonge wilsonge - close - 4 Apr 2015
avatar zero-24 zero-24 - close - 4 Apr 2015
avatar wilsonge
wilsonge - comment - 4 Apr 2015

Thankyou :)

avatar spignataro
spignataro - comment - 4 Apr 2015

Thank you peter.

avatar nonumber
nonumber - comment - 4 Apr 2015

Great, thanks :)

avatar zero-24 zero-24 - change - 14 Oct 2015
Labels Removed: ?

Add a Comment

Login with GitHub to post a comment