stringtranslate.com

Botón de hamburguesa

El botón de hamburguesa (la triple barra ≡ o símbolo de trigrama ☰), llamado así por su parecido involuntario con una hamburguesa , es un botón que normalmente se coloca en la 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 colapsarse detrás del botón o mostrarse en la pantalla. El ícono asociado con este widget , que consta de tres barras horizontales, también se conoce como ícono de menú colapsado .

Historia

Las primeras versiones del botón de hamburguesa se pueden ver en las interfaces gráficas de usuario de la década de 1980 de la computadora 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. [2] Cox describió la creación del icono diciendo: "Su diseño gráfico estaba pensado para ser muy simple, como una 'señal de tráfico', funcionalmente memorable e imitar el aspecto de la lista de menú resultante. Con tan pocos píxeles con los que trabajar, tenía que ser muy distintivo, pero simple. Creo que solo teníamos 16x16 píxeles para representar la imagen (o posiblemente 13x13... no recuerdo exactamente)". [3]

En lo que posiblemente fue su primer uso después de Xerox Star, el lanzamiento de Windows 1.0 en 1985 contenía un icono de hamburguesa en el menú de control de cada ventana. [4] Sin embargo, duró poco, ya que el icono de hamburguesa desapareció en Windows 2.0 a favor de una sola línea horizontal que denota el menú de control. Windows 95 reemplazó la línea única con el icono del programa, [5] y la hamburguesa no volvería a Windows hasta una ubicación en el menú Inicio de la actualización de un año de Windows 10. [ 6]

El ícono de la hamburguesa de Cox experimentó un resurgimiento a partir de 2009, debido a la limitada área de pantalla disponible para las aplicaciones móviles . [7] [8] [9]

En 2024, Mondelez International (el propietario de la marca Oreo) intentó públicamente fomentar que se llamara menú " Oreo " en lugar de "hamburguesa". [10] [11]

Apariencia y funcionalidad

Un menú de hamburguesas en una versión anterior de la aplicación móvil de Wikipedia

El botón "menú" toma la forma de un icono que consta de tres líneas horizontales paralelas (mostradas como ), sugerentes de una lista. [7] El nombre se refiere a su parecido con el menú que normalmente se expone o se abre al interactuar con él. [12] El botón más ancho puede reducirse a tres puntos apilados verticalmente (mostrados como un tri-colon o puntos suspensivos verticales ), también conocido como icono de kebab , icono de albóndiga o icono de falafel . En la plataforma Microsoft Office 365, se muestra un menú de aplicación similar que consta de tres filas de tres cuadrados, esto se conoce como "waffle". [13] Al tocar, hacer clic o activar de otro modo este botón, se revela un menú , lo que lo distingue de un menú o una barra de pestañas que siempre está en pantalla. [14]

Recepción

Se ha argumentado que, si bien el botón de menú colapsado es ahora algo común, su funcionalidad no es necesariamente obvia de inmediato cuando se lo encuentra por primera vez; [15] en particular, los usuarios mayores que no estén familiarizados con la iconografía moderna pueden encontrarlo confuso. [16] La ubicación del ícono del menú de hamburguesa también depende del sitio web o la aplicación específicos. [17]

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 el beneficio de un menor uso del espacio de la pantalla. [18] También se ha argumentado que los diseñadores tienden a sobrecargar estos íconos con demasiada información oculta. [16]

Véase también

Referencias

  1. ^ "Cómo crear un icono de menú". w3schools.com . Archivado desde el original el 5 de septiembre de 2018. Consultado el 20 de septiembre de 2018 .
  2. ^ "El origen del icono de la hamburguesa". evernote.com . Archivado desde el original el 2015-11-07 . Consultado el 2018-09-20 .
  3. ^ "Una breve historia del icono de la hamburguesa". Blog de Placeit . 2014-10-29 . Consultado el 2019-02-23 .
  4. ^ Ali, Fahad (13 de mayo de 2015). «Microsoft utilizó por primera vez el controvertido menú hamburguesa en 1985». windowschimp.com . Archivado desde el original el 1 de abril de 2021. Consultado el 12 de junio de 2019 .
  5. ^ Doppelhammer, Jim. "Elementos de Windows". doublehammer.com . Consultado el 12 de junio de 2019 .
  6. ^ Shaikh, Rafia (4 de abril de 2016). "Así luce el nuevo menú de inicio del aniversario de Windows 10". wccftech.com . Consultado el 12 de junio de 2019 .
  7. ^ ab Campbell-Dollaghan, Kelsey (31 de marzo de 2014). "¿Quién diseñó el icono de la hamburguesa?". Gizmodo . Archivado desde el original el 6 de febrero de 2016. Consultado el 2 de febrero de 2016 .
  8. ^ "Una breve historia del icono de la hamburguesa". placeit.net . 29 de octubre de 2014. Archivado desde el original el 2017-02-02 . Consultado el 25 de enero de 2017 .
  9. ^ "Necesitamos un icono de navegación estándar para un diseño web responsivo". Stuff & Nonsense . 17 de marzo de 2012. Archivado desde el original el 20 de septiembre de 2018 . Consultado el 20 de septiembre de 2018 .
  10. ^ Berger, Eric (8 de abril de 2024). "Oreo reivindica el menú de hamburguesas como propio". campaignlive.com . Consultado el 15 de abril de 2024 .
  11. ^ "Oreo anhela el cambio y convierte el 'menú hamburguesa' de Internet en 'El menú Oreo'". The Drum . Consultado el 15 de abril de 2024 .
  12. ^ Lessin, Jessica (18 de marzo de 2013). "¿Qué es un botón de 'hamburguesa'? Una guía de las características de las aplicaciones". The Wall Street Journal . Dow Jones & Company . Archivado desde el original el 16 de abril de 2015 . Consultado el 10 de abril de 2015 .
  13. ^ Nguyen, Chuong (26 de junio de 2015). "Office 365 Store ahorra tiempo con el inicio de sesión único en aplicaciones web". Tech Radar Pro . Archivado desde el original el 2018-02-09 . Consultado el 2018-02-08 .
  14. ^ Constine, Josh (24 de mayo de 2014). "Eliminemos los botones de hamburguesa". TechCrunch . Archivado desde el original el 19 de agosto de 2016. Consultado el 10 de abril de 2015 .
  15. ^ Stokel-Walker, Chris (16 de mayo de 2015). «El icono de la hamburguesa: cómo estas tres líneas desconciertan a la mayoría de la gente». BBC . Archivado desde el original el 20 de febrero de 2018. Consultado el 11 de octubre de 2018 .
  16. ^ ab "Amar y odiar el icono de la hamburguesa". Webdesigner Depot . 2018-09-17 . Consultado el 2019-02-23 .
  17. ^ "El icono del menú de hamburguesas: ¿debería estar a la izquierda o a la derecha?". UX Pickle . 2018-09-17 . Consultado el 2022-11-02 .
  18. ^ Tsiodoulos, Dimitrios (2016). Comparación de menús hamburguesa y de barra inferior en dispositivos móviles para navegación de tres niveles (PDF) (Tesis). Archivado (PDF) desde el original el 2018-06-13 . Consultado el 2018-06-13 .