Re: test of contrast with styled form controls

Glenda, I agree. A textual explanation would be best to help users know what to do.   Another option is to visually hide or provide instructions.    Another visual option I have considered are slashes similar to but different from strikethrough.  Icons may help some but likely will not be understood by all.  Other text effects are likely to causes reading issues.

Jon

Sent from my iPhone

On Nov 10, 2016, at 3:14 PM, Glenda Sims <glenda.sims@deque.com<mailto:glenda.sims@deque.com>> wrote:

Jim,

I'm struggling with coming up with an excellent design pattern for disabled form controls that:

1)  Clearly indicates that the form control is not currently available
AND
2)  Allows a person with low vision to see the disabled form control.

It is a bit of a conundrum for me.  I keep wondering if the way to solve the problem is to stop trying to do it with low contrast...and instead use a visually clear indicator of "unavailable".

For example, when selecting seats on an airplane, unavailable seats may be clearly indicated with an "X" that everyone can see (and also with alternative text that clearly conveys this visual information to a screen reader).

I'm not a designer...but I keep thinking of the classic red circle with a slanted line through it to mean "no", or an "x" laid on top of something (or beside it) or a strike through line.

I'll be interested to see what others think/suggest.  I don't want to give up on this problem just because there isn't an easy, obvious answer.  I mean, seriously, if Apple could figure out how to make touch screens accessible...surely we can come up with a creative and elegant solution for disabled controls that makes it better for all users (says the optimistic goodwitch).

Glenda

glenda sims    |   team a11y lead   |    deque.com<http://deque.com>    |    512.963.3773

web for everyone. web on everything. -  w3 goals

On Thu, Nov 10, 2016 at 1:50 PM, Jim Allan <jimallan@tsbvi.edu<mailto:jimallan@tsbvi.edu>> wrote:
Create a page http://w3c.github.io/low-vision-SC/contrast-styled-forms.html

styled the enabled form controls to have a border contrast of 4.5:1
styled the disabled form controls to have a border contrast of 3.0:1

?Note: IE 10 and FF do not allow radio button or checkbox border styling. Other controls can be styled.  Webkit browsers (chrome, safari, et al)? allow styling of all controls.

What do you think? is there enough contrast between enabled and disabled controls?

please comment to me or the list. I will compile results.

--
Jim Allan, Accessibility Coordinator
Texas School for the Blind and Visually Impaired
1100 W. 45th St., Austin, Texas 78756
voice 512.206.9315<tel:512.206.9315>    fax: 512.206.9264<tel:512.206.9264>  http://www.tsbvi.edu/
"We shape our tools and thereafter our tools shape us." McLuhan, 1964