In this oldie but goodie, Hampus Sethfors digs into why disabled buttons are troubling for usability reasons and he details one example where this was pretty annoying for him. The same has happened to me recently where I clicked a button that looked like a secondary button and… nothing happened.
Here’s another reason why disabled buttons are bad though:
Disabled buttons usually have call to action words on them, like “Send”, “Order” or “Add friend”. Because of that, they often match what users want to do. So people will try to click them.
What’s the alternative? Throw errors? Highlight the precise field that the user needs to update? All those are certainly very helpful to show what the problem is and how to fix it. To play devil’s advocate for a second though, Daniel Koster wrote about how disabled buttons don’t have to suck which is sort of interesting.
But whatever the case, let’s just not get into the topic of disabled links.
Yesterday I was ordering something online, and the “Save” button on the shipping address section was disabled, because my workplace address doesn’t include a building number :facepalm:
I sneakily used the browser developer tools to remove the disabled attribute from the button, and hey presto I was able to submit my order and everything appears to have worked just fine.
Such authoritarianism when it comes to addresses on websites annoys me. Sure users make mistakes, but, in my experience, web developers are often not too familiar with addressing formalities beyond their own locality, and users should be trusted just a little bit to enter their address correctly. Ireland for example didn’t have postcodes until only a couple of years ago, and even still they are officially optional. (Modern postal systems can work without postcodes – postcodes are a solution to a 1960s problem that doesn’t exist anymore.) How many websites insist on a user entering a postcode?
I take back what I said about postcodes being a solution to a 1960s problem that doesn’t exist anymore ;-) But a site shouldn’t be insisting on building numbers. Web developers – consider your user’s situation thoroughly!
I agree with a lot of the points being made, but I don’t think disabled buttons sucks per definition, there’s just a lot of bad implementations.
How I usually create disabled buttons:
Cursor should be not-allowed
Wrap disabled buttons in a div so you can add an event listener
Give the user feedback when the disabled buttons wrapper is clicked
A lot of users know that a grey button with grey text means it’s disabled, making it look like a regular button would be kind of annoying for those people.