Кнопка гамбургера - Hamburger button

Значок из трех линий
Значок свернутого меню, используемый на Кнопка гамбургера
Изображение гамбургера с тремя булочками
Гамбургер, происхождение прозвище

В кнопка гамбургера, названный так из-за непреднамеренного сходства с гамбургер, это кнопка обычно помещается в верхний угол графический интерфейс пользователя.[1] Его функция - переключать меню (иногда называемое гамбургер-меню) или Панель навигации между сворачиванием за кнопкой или отображением на экране. Значок, связанный с этим виджет, состоящий из трех горизонтальных стержней, также известен как значок свернутого меню.

История

Оригинальный дизайн

Иконка изначально была разработана Норм Кокс как часть пользовательского интерфейса для Xerox Star, введен в 1981 г .;[2] он возродился в 2009 году из-за ограниченной площади экрана, доступной для мобильные приложения.[3][4][5] Кокс описал создание значка, сказав: «Его графический дизайн должен был быть очень простым« дорожным знаком », функционально запоминающимся и имитировать внешний вид отображаемого списка меню. С таким небольшим количеством пикселей, с которыми нужно было работать, он должен был быть очень четким, но простым. Я думаю, у нас было только 16 × 16 пикселей для рендеринга изображения. (или, возможно, 13 × 13 ... точно не помню) ».[6]

В массовых вычислениях

Возможно, это первое использование после Xerox Star, выпуск Windows 1.0 в 1985 году содержал значок гамбургера в меню управления каждого окна.[7] Однако это длилось недолго, так как значок гамбургера исчез в Windows 2.0 в пользу единственной горизонтальной линии, обозначающей меню управления. Windows 95 заменил единственную строку на значок программы,[8] и гамбургер не вернется в Windows, пока не будет помещен на Стартовое меню из годовое обновление из Windows 10.[9]

Внешний вид и функционал

Кнопка "меню" имеет форму икона который состоит из трех параллельных горизонтальных линий (отображается как ≡), наводящий на размышления о списке.[3] Название относится к его сходству с меню, которое обычно отображается или открывается при взаимодействии с ним.[10] Более широкая кнопка может быть уменьшена до трех точек, расположенных вертикально друг над другом (отображается в виде трех двоеточий или вертикальное многоточие ⋮ ), известный как шашлык. в Microsoft На платформе Office 365 отображается аналогичное меню приложения, состоящее из трех рядов по три квадрата.[11] Нажатие, нажатие или иная активация этой кнопки приводит к меню раскрывается, что отличает его от меню или панель вкладок это всегда на виду.[12]

Критика

Внешность

Утверждалось, что, хотя кнопка свернутого меню сейчас является обычным явлением, ее функциональность не обязательно сразу очевидна при первом обнаружении;[13] в частности, это может сбить с толку пожилых пользователей, менее знакомых с современной иконографией.[14]

Юзабилити

Кнопка меню может увеличиваться стоимость взаимодействия по сравнению с меню нижней панели, требующим дополнительных щелчков мыши для получения той же информации, хотя и с преимуществом меньшего использования места на экране, в контексте мобильные приложения.[15] Также утверждалось, что дизайнеры склонны перегружать эти значки слишком большим количеством скрытой информации.[14]

Смотрите также

использованная литература

  1. ^ «Как создать значок меню». www.w3schools.com. В архиве из оригинала на 2018-09-05. Получено 2018-09-20.
  2. ^ «Происхождение иконы гамбургер». В архиве из оригинала от 07.11.2015. Получено 2018-09-20.
  3. ^ а б Кэмпбелл-Доллаган, Келси (31 марта 2014 г.). "Кто создал икону гамбургера?". Gizmodo. В архиве из оригинала от 06.02.2016. Получено 2 февраля, 2016.
  4. ^ "Краткая история иконы гамбургеров". placeit.net. 29 октября 2014 г. В архиве из оригинала на 02.02.2017. Получено 25 января 2017.
  5. ^ Ltd., Всякая всячина. «Нам нужен стандартный значок навигации по шоу для адаптивного веб-дизайна». В архиве из оригинала на 2018-09-20. Получено 2018-09-20.
  6. ^ «Краткая история иконы гамбургеров». Блог Placeit. 2014-10-29. Получено 2019-02-23.
  7. ^ Али, Фахад (13 мая 2015 г.). «Microsoft впервые использовала вызывающее споры гамбургерное меню в 1985 году». windowschimp.com. Получено 2019-06-12.
  8. ^ Доппельхаммер, Джим. «Элементы Windows». doublehammer.com. Получено 2019-06-12.
  9. ^ Шейх, Рафия (4 апреля 2016 г.). «Вот как выглядит новое меню« Пуск », посвященное годовщине Windows 10». wccftech.com. Получено 2019-06-12.
  10. ^ Лессин, Джессика (18 марта 2013 г.). «Что такое кнопка« гамбургер »? Руководство по функциям приложения». Журнал "Уолл Стрит. Доу Джонс и компания. В архиве из оригинала от 16.04.2015. Получено 10 апреля, 2015.
  11. ^ Нгуен, Чыонг (26 июня 2015 г.). «Магазин Office 365 экономит время за счет единого входа в веб-приложения». Tech Radar Pro. В архиве из оригинала на 2018-02-09. Получено 2018-02-08.
  12. ^ Константин, Джош (24 мая 2014 г.). «Убейте гамбургер кнопками». TechCrunch. В архиве из оригинала на 19.08.2016. Получено 10 апреля, 2015.
  13. ^ Стокель-Уокер, Крис (16 мая 2015 г.). «Значок гамбургера: как эти три строчки вводят в заблуждение большинство людей». BBC. В архиве из оригинала на 20.02.2018. Получено 11 октября 2018.
  14. ^ а б "Любить и ненавидеть икону гамбургеров". Депо веб-дизайнеров. 2018-09-17. Получено 2019-02-23.
  15. ^ Циодулос, Димитриос (2016). Сравнение меню гамбургера и нижней панели на мобильных устройствах для трехуровневой навигации (PDF) (Тезис). В архиве (PDF) из оригинала на 2018-06-13. Получено 2018-06-13.