Consider that I am creating an interface for a mobile app which shows a list of buttons on the main screen. I can move through the buttons using mobile keypad (feature phones) or screen touch (smart phones). I wonder if I should implement the currently focused button in darker shade as compared to the other buttons? Or a lighter shade would work as well? I mean is there any unwritten UX rule that selected/focused button is always in darker color compared to the other buttons on the same screen?
1 Answer
There is no rule, written or unwritten. All that matters is that:
- The focused state is sufficiently different, yet still clearly the same button. A change from #EEE to #DDD is usually not enough, but changing a square red button with a border into a blue borderless circle isn't a good idea either.
- The focused state is consistent across the interface. If the focused state of one button is darker, other interface elements on the website, when possible, should follow the same system.
-
1Yep, it's all about consistency and contrast. If your site is dark, a shift to lighter is a good contrast or vise versa. I would note that buttons that turn darker can look like they've been "pressed" with the right effect though.– ZeldaCommented Aug 25, 2011 at 13:33
-
And color is useless in showing a selected item if there are only two things in the list. Commented Aug 25, 2011 at 23:26