Our design team is thinking of using grey secondary buttons on our site. I'm concerned they may appear to be disabled to our users (especially when used with the primary orange buttons). There is a hover state on them so users would know they are not disabled when mousing-over.
Answer
Grey buttons can still be used, provided you can give enough indication that the button is indeed not disabled. You could have a darker font color, like this:
Even then, this approach is not recommended. Seconding Pasha's thoughts, such an attempt to make grey buttons seem "non-disabled" might still not be convincing to all users. Unless you're bent on retaining the grey, you could try the following options:
(A)
Make your secondary buttons align with your website color palette. You could try coloring the buttons the same blue you have on your header:
Having buttons that match your color palette will help blend the buttons in with the rest of your theme, reassure users to the integrity of the site, and yet not create confusion about the secondary nature of the button since it lies alongside a vibrant orange button.
(B)
As an alternative, you could also try having the orange color scheme for all the buttons, but differentiate secondary buttons from primary ones by inverting the color scheme, as Koen said.
The story does not end here. Further to this, you'd need to work out the color schemes for the hover state, depressed state and disabled (if needed) state of these buttons. Good luck with that!
No comments:
Post a Comment