Botón de hamburguesa

El botón de hamburguesa es un botón , generalmente ubicado en una esquina superior de una interfaz gráfica de usuario . ^{[ 1 ]} Su función es alternar un menú (a veces denominado menú de hamburguesa ) o barra de navegación entre estar contraído detrás del botón o mostrarse en la pantalla.

El icono asociado a este botón consta de tres barras horizontales paralelas (≡), conocido como icono de hamburguesa (a veces llamado icono de menú colapsado ). Su diseño pretende asemejarse a las líneas de texto de un menú impreso pequeño . ^{[ 2 ] [ 3 ]} Recibe este nombre por su parecido involuntario con una hamburguesa .

Las primeras versiones del botón de menú desplegable se pueden ver en las interfaces gráficas de usuario de la década de 1980 del ordenador Xerox Star y Microsoft Windows 1.0.

El icono fue diseñado originalmente por Norm Cox como parte de la interfaz de usuario de la computadora personal Xerox Star , presentada en 1981. ^{[ 4 ]} Cox describió la creación del icono diciendo: ^{[ 4 ]}

Su diseño gráfico debía ser muy sencillo, como una señal de tráfico, funcional y fácil de recordar, e imitar el aspecto del menú resultante. Con tan pocos píxeles disponibles, tenía que ser muy distintivo, pero a la vez simple. Creo que solo teníamos 16 × 16 píxeles para renderizar la imagen (o posiblemente 13 × 13 [...]).

Cox dijo que bromeaba con los posibles usuarios diciéndoles que era una "rejilla de ventilación" para mantener la ventana fresca. ^{[ 4 ]}

Posiblemente por primera vez después de la Xerox Star, la versión de Windows 1.0 de 1985 incluía un icono de tres líneas en el menú de control de cada ventana. ^{[ 5 ]} Sin embargo, su uso fue breve, ya que este icono desapareció en Windows 2.0 en favor de una sola línea horizontal que indicaba el menú de control. Windows 95 reemplazó la línea única con el icono del programa, ^{[ 6 ]} y la versión de tres líneas no volvería a Windows hasta su inclusión en el menú de inicio de la actualización anual de Windows 10. ^{[ 7 ]}

El ícono de Cox experimentó un resurgimiento a partir de 2009 debido al área de pantalla limitada disponible para las aplicaciones móviles . ^{[ 2 ] [ 8 ] [ 9 ]}

El icono de hamburguesa consta de tres líneas horizontales paralelas, diseñadas para asemejarse a las líneas de texto de un menú pequeño. ^{[ 2 ] [ 3 ]} Para reducir aún más el consumo de espacio en la pantalla, puede reducirse a tres puntos apilados verticalmente ( ). A este se le ha llamado botón de kebab , albóndiga o falafel , pero aún así muestra un menú de aspecto normal. En las aplicaciones en línea de Microsoft Office 365 y Google, un icono similar que consta de tres filas de tres cuadrados ( ) muestra una matriz de iconos en lugar de un menú, y se le conoce como botón de gofre . ^{[ 10 ]}

Al hacer clic o presionar estos botones, se muestra un menú vertical , generalmente igual a un menú de un solo elemento o una barra de pestañas . ^{[ 11 ]}

El botón de hamburguesa no es un carácter textual y no está codificado en Unicode . Sin embargo, a veces los diseñadores utilizan caracteres textuales visualmente similares para crear un botón de hamburguesa, ^{[ 12 ]} como por ejemplo:

Se ha argumentado que, si bien el botón de menú contraído es ahora común, su funcionalidad no es necesariamente obvia de inmediato al encontrarlo por primera vez; ^{[ 13 ]} en particular, los usuarios mayores menos familiarizados con la iconografía moderna pueden encontrarlo confuso. ^{[ 14 ]} La ubicación del icono del menú de hamburguesa también depende del sitio web o la aplicación específicos. ^{[ 15 ]}

El botón de menú puede aumentar el costo de interacción en comparación con una barra de menú , requiriendo clics adicionales para recuperar la misma información, aunque con la ventaja de ocupar menos espacio en la pantalla. ^{[ 16 ]} También se ha argumentado que los diseñadores tienden a sobrecargar estos íconos con demasiada información oculta. ^{[ 14 ]}

• Tecla de menú
• Barra triple §  Diseño de la aplicación
• Puntos suspensivos §  En la interfaz de usuario de la computadora  : se utilizan para indicar "más opciones" (opciones que están ocultas, mientras que el icono de menú colapsado significa todas las opciones ocultas).