Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

Here are two similar examples of a typical menu bar.

What would you expect as an active hover area for click? Should it be the same or different in these two examples? Does the device matter? What do you think?

http://f.cl.ly/items/1O3F0g390W021S390U1r/Image%202012.06.14%206:21:40%20PM.png

share|improve this question

3 Answers 3

There was a study that was conducted which determined 13px x 13px minimum optimum touch-point.

Didn't find the doc. But a potential google hit.

Hope that helps. All the best! Nash

share|improve this answer

As a general rule, you want to make the interaction area as large as possible to aid with touch interfaces. The counterbalance to this is that you need to make the button area visually cohesive, so it affords the interaction.

Given this principle, I would suggest you go for option A in both examples.


It is worth noting, however, that A only holds in example 1 because the container constrains the area that could be a link - in a larger area or an area where the container isn't distinct from the background a user might expect the interactive area to only expand to cover the single line of links/dividers.

In the following example there is no obvious vertical constraint so users might expect only to be able to interact with the element as its height is visually defined by the vertical bars:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

share|improve this answer

Definitely A. This style of menu bar is emulating a basic button and a button includes the padding. Also, the bigger the hit area the easier it is for the user.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.