Itqualityassurance
- Why you shouldn't gray out disabled buttons?
- Why disabled buttons are bad for accessibility?
- Should you use disabled buttons?
- Do disabled buttons need to pass color contrast?
Why you shouldn't gray out disabled buttons?
Gray is often used to communicate a low priority button (e.g., cancel buttons). When they see a gray button, they won't know for sure if it's disabled unless they click it. This uncertainty and unpredictability is not an optimal user experience. When making your button transparent, adjust the opacity, not the color.
Why disabled buttons are bad for accessibility?
Bad accessibility
Sometimes disabled buttons are designed in a way that they cannot be read by a screen reader (buttons are not focusable, and hence users can't reach them with a keyboard). No need to explain that users with disabilities will face problems with such behavior.
Should you use disabled buttons?
While designing the UI, avoid using a disabled button as it becomes hard to find out why it is disabled and what should be done to make it enable. It is better to keep buttons enabled all the time and highlight the field if users don't provide the required information.
Do disabled buttons need to pass color contrast?
The question: Do disabled buttons need to conform to colour contrast guidelines? The answer: No disabled buttons do not need to pass color contrast guidelines.
