Accessibility of Disabled and Read-only Form Fields

This information is intended to create accessibility constraints and does not attempt to suggest additional user experiences.

	Read-only	Disabled
Seen by screen reader	x
Receives focus	x
Browser defaults to grayed-out color		x
Requires accessible color contrast	x

Use disabled when:

• The information in the field is not meaningful to the users but must be shown anyway, mainly for structure
• Fields are hidden visibly and will be exposed through a user action or by "progressive disclosure"
• Read-only will not work on the element

Use read-only when:

• The information in the field is meaningful to the user but it must not be changed

Q: Won’t my design suffer from having to comply with contrast requirements if I use read-only fields?

A: Not necessarily:

In the example below, the read-only input box is styled to have a border and font color of #5D5D5D which complies with AA color contrast requirements (4.5:1) and is similar to the standard, default disabled field. 

Default Input
Disabled
Read-only

Fiddle with the code

Q: Read-only is not working on my form element. Is this a bug?

A: No, unfortunately there is a limit to the read-only attribute:

    

• Read-only WILL work for
  • Type: text, search, url, tel, email, number, password, date/time input types, and <textarea>
• Read-only WILL NOT work for
  • Type: hidden, range, color, checkbox, radio, file, button, submit and image

References:

W3C Recommendation 17.12.2 Read-only Controls. http://www.w3.org/TR/html401/interact/forms.html#h-17.12.2

Q: Does a disabled label have to meet color contrast levels?

A: No, there is no accessibility requirement for disabled labels to meet color contrast requirements allowing for the lightening of the label to signify the disabled state. However, both read-only labels and fields must meet color contrast requirements

Diversity, Market Driving Accessible, Inclusive Design

In September, Scientific American cited some convincing studies showing that diversity in the workplace makes us more diligent, creative and hard working. Although the studies were based mostly on sex, race and culture, we know at IBM that this clearly extends to people with disabilities. Likewise, tech companies around the globe are adding more disabled workers and accessibility experts into their workforce. Designers are reaching out, looking for people with disabilities to help them create inclusive designs.

There is a powerful current in technology today toward inclusive design. AT&T, Yahoo, Microsoft and more are creating accessibility departments loaded with experts to design their products so that everyone can use them. This isn’t simply an altruistic change in their business model, but also an attempt to tap into a multi-billion dollar market for accessible software. In turn, we see organizations such as the International Association of Accessibility Professionals (IAAP) working to connect accessibility professionals with companies in need. It’s the right thing to do, sure, but isn’t it nice that there is a bottom-line dollar impact statement to rest on?

David Fazio, who battled through a brain aneurism when he was 14, has been speaking around the world on the astounding size of the market for accessible products. He recently released his book, Harmony at Work, that addresses the need for product experiences that work for everyone. He drives in his point of inclusiveness with the enormous market behind it.

However, we don’t just gain from selling accessible products and watching our stocks rise. In fact, money may just be the fringe benefit. When we give people with disabilities tools that allow them to work alongside the rest of us, we can finally harvest the rich knowledge of our entire community. Additionally, we give people with disabilities an opportunity to do something that we all intrinsically want, to be productive in our workforce and be self-sufficient in society.

Today, we see components such as user-centered "design thinking" frameworks, the growing number of the elderly worldwide, and a heightened awareness of the benefits of a diverse workforce coming together to form a perfect storm in the tech industry. By partnering with accessibility experts, designers and developers are getting both gratification from and recognition for building their skills and influence in inclusive design. If you’re a designer who isn’t involved in inclusive design, yet, this isn’t just inevitable, it’s imminent. 

The Mission

I know I'm not the first person to think about making interfaces that create a great user experience for disabled people. I'm not even the first person in our studio to think of it. For some reason this topic seems to be trending and I find myself feeling reactive rather than proactive. Either way the result is positive.

This blog is for my journey helping to create a great user experience for people with disabilities. Embarrassingly, at this point, I don't even know the full spectrum of disabilities that need to be considered. My program in school covered the usual suspects.

I'm going to try to get my butt on this blog each day to make some sort of discovery or jot down a thought. I'm hoping this will help me to carry through and make some sort of impact at IBM and in the world.