0

If you wanted a user to distinguish if a menu item is important and not selected.

How will you represent the difference between the selected and the important menu item?

The only idea I would come up with is to add a small lock symbol to the menu item.

1
  • A lock symbol on a menu item usually denotes that the page requires authentication, or isn't available to the user. Unless that is the case with your item, you should consider other symbols.
    – Izquierdo
    Jan 6 at 21:58

2 Answers 2

2

Here some examples:

Icons

mediamarkt.de

mediamarkt


Color

levi.com

levi


Typographic style

adidas.co.uk

adidas


Relevant info

stackoverflow

enter image description here


Product Logo

hebo.com

hebo


Mascot

seek.com

seek


Figure/ground

publitas.com

publitas


Tagline

esky.co.uk

esky


2
  • 1
    I like the exclamation mark
    – rubo77
    Jan 6 at 22:03
  • I have problems to find the animated one, but I'm sure I saw it somewhere.
    – Danielillo
    Jan 6 at 22:04
0

First thing that comes to mind is to indicate the important menu item with a background color. Use a similar shade of the background color for a hover effect. On mobile, you could do the same thing but use a touch event instead of hover.

Another option is to use a very benign/unobtrusive css animation to dictate the important menu item.

I personally wouldn't use icons.

3
  • The problem with another BG colour is, that this can be misunderstood as "active"
    – rubo77
    Jan 8 at 9:13
  • You are correct. Allow me to clarify the aforementioned with a mockup: codepen.io/eastcoastdeveloper/pen/rNGZewz
    – Eric Scott
    Jan 8 at 18:25
  • A mock-up is a good way to show. But still, there too: is is not clear which is active and which is promoted
    – rubo77
    Jan 8 at 23:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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