WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Inactive Buttons - ALT Tags?


From: Jared Smith
Date: Dec 22, 2005 9:00AM

Jukka has brought up most of the problems. Let me perhaps present them in
a less critical fassion.

> I have a situation where a button is inactive until something is
> selected on the page.

Using JavaScript, I suppose. If JavaScript is disabled or unavailable, you
should ensure that the page still functions properly.

> Visually, it has two different colors (in an
> inactive state, the button is grey; when active, its beige).

Fantasic. The use of color can be very helpful for visual users. However,
the use of color alone may not be enough to convey the state of the
button, especially if the user cannot see color.

Some screenreaders will not read form elements that are truly set to be
disabled (disabled="disabled").

> Whats the best way to handle ALT tags for the two different states?

The ALT attribute (and there's no law against calling them TAGS!) would
not apply to button form elements. You should instead be setting the VALUE
attribute. If you are using <input type="image">, then you must use ALT
text. You should also be aware that low vision users may have difficulties
reading the image button if it is enlarged.

There are several JavaScript methods that could be used to do what you are
presenting (again, understanding that JavaScript must be enabled). You
could use JavaScript to hide/unhide the buttons based on the state of the
other page element. You could also use JavaScript and DOM to change the
ALT (or VALUE) attributes. The problem with this approach is that you
cannot necessarily be certain that the user will access the form elements
in the order you prescribe.

As Andrew pointed out, using NOSCRIPT would seem like a very logical way
of providing functionality when JavaScript is disabled, but JAWS never
reads it (WHY???).

The best approach would be to do the logic using server-side scripting. If
it is something like, "you must check the box to accept our terms of use
before submitting the form" type thing, then simply allow the form to
function and be submitted normally, then provide the feedback after the
form is submitted.

Of your ALT options, I'd probably go with 2b. Because the button performs
some function, alt="" would not be appropriate (it never is for images or
image buttons that are clickable). I'd provide the necessary feedback to
the user when the button is accessed.

Jared Smith