risposta-alla-domanda-sullo-sviluppo-web-bd.com

Qual è la differenza tra le 2 icone del menu: 3 punti (kebab) e 3 linee (hamburger)

Qual è la differenza (se esiste ...) tra queste 2 icone di menu?

1) 3 righe (a.k. un'icona di hamburger)
enter image description here

2) 3 punti (icona di un kebab)
enter image description here

27
Gil Epshtain

In generale, vengono utilizzati per aprire diversi tipi di menu.

  • Il "burger" viene utilizzato per aprire un "menu burger", che viene presentato come un cassetto che appare dal lato dello schermo e occupa gran parte dello schermo;
  • Il "kebab" (tre punti verticali), nato nella lingua Material Design di Google, è progettato per aprire un menu in linea più piccolo da un pulsante o altro controllo.

In termini specifici di denominazione delle icone, Google si riferisce al menu burger come "menu" e al "kebab", verticale o orizzontale, come "più horiz" o "più vert".

Ecco una buona demo di Luke Wroblewski di kebab e altre opzioni di menu:

enter image description here

30
Matt Obee

Mi riferivo a iOS e Android e non menzionano mai l'icona a 3 punti come "menu kebab" .

In Android, lo chiamano Menu di overflow mentre in iOS lo chiamano Altro .

Per riferimento: Android - https://material.io/design/components/app-bars-top.html#anatomy =

iOS - https://developer.Apple.com/design/human-interface-guidelines/ios/icons-and-images/ sistema-icons/# tab-bar-icone

6
NB4

Google ha definito queste icone nella sua guida alla progettazione.

La cosiddetta icona hamburger   è chiamato con icona di navigazione che apre i cassetti di navigazione.
Questi ( material.io ):

cassetti di navigazione forniscono accesso a destinazioni e app funzionalità, come cambiare account.


L'icona 3 punti   è chiamato come menu di overflow .
Google fornisce come spiegazione: ( material.io ):

App azioni sono posizionati sul lato destro di un'app, come icone o in un menu di overflow.


Nota, questa è solo la definizione di Google. Ma Google usa con Android queste icone in effetti intensivamente. Anche altre aziende o programmatori possono usare queste icone in modo diverso.

2
gotwo

Fino ad ora ho incontrato molte rappresentazioni e volevo presentarne un paio sotto.

enter image description here

Anche se sembrano diversi, vengono utilizzati per lo stesso scopo di opening the menu. Anche se a volte preferivano a causa delle limitazioni di spazio con le proprie rappresentazioni, alcune di esse utilizzate con illustrazioni separate all'interno di un tema in modo che si chiamassero in questo modo come hamburger menu, ma non sono nemmeno sicuro che si applichi a tutti.

enter image description here

2
Erhan Yaşar

I tre punti sono noti come ellissi ... e indicano che c'è di più, che c'è una presunzione di consapevolezza del contesto attuale e che c'è di più rispetto a quello che è attualmente visibile.

Inizialmente era usato in modo piatto, proprio così ...

È stato reso (a volte e sempre più spesso) verticale perché il menu dell'hamburger è una pila verticale, e stava guadagnando popolarità, quindi quelli che tendono a copiare senza pensarci troppo sono andati: "oh, forse dovremmo renderlo verticale e far finta che sia un cosa".

L'hamburger è un'abbreviazione visiva di un menu o elenco verticale. Quindi ha senso come icona.

Come fa ... l'ellissi.

L'ellissi verticale è solo stupidità.

Ma guadagnando popolarità perché Google Material vuole immaginarsi una cosa, e arbitro, e alcune persone vogliono ascrivere a questa illusione.

Apple, per un bel po 'di tempo, ha voluto prevenire tutti questi tipi di cose, poiché considerava ogni necessità per loro un indicatore del cattivo design delle app. Avrebbero potuto avere ragione.

Le convenzioni che sono nate a causa del loro uso continuo e crescente sono essenzialmente:

Menu = hamburger Altre azioni = ellissi

Anche questo ha senso.

Le ellissi verticali sono solo un disgustoso passo falso. Usalo per quello che vuoi.

1
Confused