When is it appropriate to use disabled inputs?

Disabled components should only be used when they can be easily enabled on the same screen within the same task.

1. When should you disable a button?
2. Do screen readers read disabled inputs?
3. Should disabled elements be focusable?
4. Does a disabled input get submitted?

When should you disable a button?

A disabled button is used to visually communicate that the action is unavailable because certain conditions aren't met. However— when it lacks feedback, context, and guidance— the experience may feel frustrating, confusing, and inaccessible.

Do screen readers read disabled inputs?

Screen readers ignore disabled controls, so screen reader users won't hear the message. Add some nearby visible help text for the button. This would work for sighted users, but not necessarily for low vision users or blind users using a screen reader.

Should disabled elements be focusable?

Disabled controls should be removed from the focus order, because this is the behavior dictated by the native web pattern for the disabled attribute. This is the built-in behavior, it is familiar to users, and it would require deliberate intervention to change the pattern.

Does a disabled input get submitted?

Tip: Disabled <input> elements in a form will not be submitted!