ハンバーガー‐メニュー【hamburger menu】
ハンバーガーメニュー
別名：ハンバーガーボタン
【英】hamburger menu, hamburger button
【英】hamburger menu, hamburger button
ハンバーガーメニューとは、主にスマートフォン向けウェブサイトやウェブアプリのUIに用いられる、等幅の横線が「三」の字に並んだアイコンの通称である。
ハンバーガーメニューは画面の右上や検索ボックスの右端などに設置されることが多い。機能は、いわゆるプルダウンメニューと同じである。メニューをタップすることでアクセス可能なページや機能の一覧が表示される。
ハンバーガーメニューは、HTML/CSSのコーディングだけで設置できる手軽さや、フラットデザインに合うシンプルな表示が好まれている。スマホ向けページと揃えるようにしてPC向けウェブサイトにハンバーガーメニューを設置しているウェブサイトも少なくない。
ハンバーガーボタン
(ハンバーガーメニュー から転送)
出典: フリー百科事典『ウィキペディア（Wikipedia）』 (2023/09/19 02:59 UTC 版)
ハンバーガーボタン（英語: hamburger button）とは、一般にグラフィカルユーザインタフェース (GUI) の画面上部の隅に配置されるボタンである。
- ^ “How To Create a Menu Icon”. www.w3schools.com. 2018年9月5日時点のオリジナルよりアーカイブ。2018年9月20日閲覧。
- ^ “The origin of the hamburger icon”. 2015年11月7日時点のオリジナルよりアーカイブ。2018年9月20日閲覧。
- ^ a b Campbell-Dollaghan, Kelsey (2014年3月31日). “Who Designed the Hamburger Icon?”. Gizmodo. 2016年2月6日時点のオリジナルよりアーカイブ。2016年2月2日閲覧。
- ^ “A Brief History of the Hamburger Icon”. placeit.net (2014年10月29日). 2017年2月2日時点のオリジナルよりアーカイブ。2017年1月25日閲覧。
- ^ Ltd., Stuff & Nonsense. “We need a standard show navigation icon for responsive web design”. 2018年9月20日時点のオリジナルよりアーカイブ。2018年9月20日閲覧。
- ^ “A Brief History of the Hamburger Icon” (英語). Placeit Blog (2014年10月29日). 2019年2月23日閲覧。
- ^ Ali, Fahad (2015年5月13日). “Microsoft First Used The Controversial Hamburger Menu In 1985”. windowschimp.com. 2019年6月12日閲覧。
- ^ Doppelhammer, Jim. “Windows Elements”. doublehammer.com. 2019年6月12日閲覧。
- ^ Shaikh, Rafia (2016年4月4日). “Here's How the New Windows 10 Anniversary Start Menu Looks Like”. wccftech.com. 2019年6月12日閲覧。
- ^ Lessin, Jessica (2013年3月18日). “What’s a ‘hamburger’ button? A guide to app features”. The Wall Street Journal (Dow Jones & Company). オリジナルの2015年4月16日時点におけるアーカイブ。 2015年4月10日閲覧。
- ^ Nguyen, Chuong (2015年6月26日). “Office 365 Store saves time with single sign-on to web apps”. Tech Radar Pro. 2018年2月9日時点のオリジナルよりアーカイブ。2018年2月8日閲覧。
- ^ Constine, Josh (2014年5月24日). “Kill the hamburger buttons”. TechCrunch. 2016年8月19日時点のオリジナルよりアーカイブ。2015年4月10日閲覧。
- ^ “WIRED.jp”. CONDE NAST JAPAN. 2022年1月19日閲覧。
- ^ “CSSで実装するハンバーガーメニュークリック時のエフェクト 10＋”. 2020年1月20日閲覧。
- ^ Stokel-Walker, Chris (2015年5月16日). “Hamburger icon: How these three lines mystify most people”. オリジナルの2018年2月20日時点におけるアーカイブ。 2018年10月11日閲覧。
- ^ a b “Loving & Hating the Hamburger Icon” (英語). Webdesigner Depot (2018年9月17日). 2019年2月23日閲覧。
- ^ Tsiodoulos, Dimitrios (2016), Comparison of hamburger and bottom bar menu on mobile devices for three level navigation, オリジナルの2018-06-13時点におけるアーカイブ。 2018年6月13日閲覧。
[続きの解説]
「ハンバーガーボタン」の続きの解説一覧
- 1 ハンバーガーボタンとは
- 2 ハンバーガーボタンの概要
- 3 脚注
- ハンバーガーメニューのページへのリンク
