45

First of all, does anyone know the name for this type of navigation?

And second of all, what is the difference between these two? In what case you use the vertical one and in what case the horizontal one? I uploaded an image for a better understanding.

horizontal or vertical three dots menu?

2
  • 4
    Luke Wroblewski created a (joke?) image naming all types of menus different forms of meat as a play on the "hamburger menu", here are some images it spawned: 1, 2, 3. Answered as comment because I can't image thats an accepted/understood term.
    – DasBeasto
    Jun 13, 2016 at 12:00
  • Isn't that the "Hamburger Button"? en.wikipedia.org/wiki/Hamburger_button Jun 15, 2016 at 10:49

3 Answers 3

31

Both are traditionally known for displaying More Options

You can think of them as Ellipsis that refer to un-finished menu and hence clicking on it shows you the entire menu, finishing it.

On Android, it is referred to as Overflow Menu

On Apple and iOS devices it is referred to as More Options Menu

Technically these are used to display Secondary options as opposed to Primary ones which are directly displayed in the UI. Overflow Menu options can also contain Destructive actions.

I believe it was made Vertical in Material Design since it drops down rather than showing a horizontal menu with more options, improving User Expectation.

1
  • 3
    The vertical dots indicate a list, such as that presented by an unordered list.
    – Rob
    Jun 13, 2016 at 12:49
4

Both of them were used to show more options.

  1. Material design uses vertical hamburger icon across platforms to show more options. Primarily used to show secondary options.
  2. iOS use horizontal hamburger icon to show more options

I prefer both. But I use this approach to make a decision when it comes to choosing one.

If the data scrolls vertically, I use vertical hamburger icon & if the data scrolls horizontally I use horizon three dots.

3

Those characters are called horizontal ellipsis and vertical ellipsis.

https://en.wikipedia.org/wiki/Ellipsis#Computer_representations

⋯ (Midline horizontal ellipsis, U+22EF):

⋮ (Vertical ellipsis, U+22EE):

For UI, the difference might be like a horizontal list and a vertical list.

1

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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