Re: test of contrast with styled form controls

Hi all,

I agree that a different tactic to convey the that the control is
disabled may be the way to go.

Besides all of Glenda an Jon's great ideas, for low vision mouse users
maybe consider adding:

[disabled] {
cursor: not-allowed;
}

Kindest Regards,
Laura

On 11/10/16, Jonathan Avila <jon.avila@ssbbartgroup.com> wrote:
> 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
>
>


-- 
Laura L. Carlson

Received on Thursday, 10 November 2016 21:39:11 UTC