3行メニューアイコン:ハンバーガーメニューとは何ですか?

目次:

Anonim

Webサイトやスマートフォンにハンバーガーがあると言った場合はどうなりますか?あなたはおそらく私が私の薬を脱いだ後にそれを完全に失ったと思うでしょう。しかし、それは絶対に本当です、私はあなたをしません。

今日のスマートフォンや一部のWebサイトでアプリを開くと、ハンバーガー、つまりハンバーガーのメニューアイコンが表示されます。

ハンバーガーメニューとは

ハンバーガーメニュー(フライドポテトの並び順は付いていません)は、左端または右端のいずれかにある、多くの画面の上部に表示される3本の水平線です。

$config[code] not found

それは実際にはアイコンです。

アイコンをタッチ、タップ、またはクリックすると、サイドメニューが表示され、オプションや追加のページが表示されます。

何人かの開発者はそれが彼らが彼らのアプリまたはナビゲーションにより多くの機能を詰めることを可能にするのでハンバーガー3行メニューアイコンを好きです。小さなアイコンは、最小限の画面領域しか占有しません。それはアプリやサイトにきれいなミニマリストの外観を与えます。

アプリのユーザーやWebサイトの訪問者がボタンを押してメニューをスライドさせたり出したりするのは簡単です。

それともあなたは考えるかもしれません。

しかし、他の開発者や何人かのユーザーは絶対にハンバーガーのメニューアイコンを見逃したり、単にそれに困惑しています。どうして? 3行が実際にはメニューアイコンであることがすべてのユーザーには明らかではないため、そこに何があるのか​​をユーザーに知らせるわけではありません。

誰がハンバーガーメニューアイコンを「発明した」のか?

ハンバーガーメニューアイコンの後ろの発明者は、Norm Coxという名前の男性です。彼はXerox Starのバーガーアイコンを作りました。これは世界初のグラフィカルユーザーインターフェースです。それは30年以上前のことです。

しかしその後、アイコンは消える行為をしました。

比較的最近になって、3行のメニューアイコンがモバイルデバイスの出現と共に忍び寄ってきました。

たとえば、2008年にはTwitterのアプリTweetieに登場しました。その後、2009年にiPhone 3GSのVoice Memosアプリに登場しました。

スモールビジネストレンドとのインタビューで、コックス氏は次のように述べています。

「約9ヵ月前まで、私は30年以上も「私のデザインキャリアバケツに滴り落ちる」ことを考えていませんでした。」

「考慮されたシンボルはごくわずかです」とCox氏は付け加えました。「1つのシンボルは三角形の形をした下向きの矢印で、結果のメニューが表示される方向を表していました。このシンボルはポインタとして解釈されすぎる傾向があると判断しました。アスタリスク(*)またはプラス(+)記号を使用することを考えましたが、それらは抽象的すぎるように見えました。」

コックスは、3行のハンバーガーのイメージがちょうどいいとわかったと言った。このシンボルは視覚的にシンプルで、簡単に説明され、そして機能的に記憶に残るものでした。 3行が完璧な数字だ」とコックス氏は付け加えた。

この悪名高いハンバーガーメニューアイコンを使用しているウェブサイトやアプリは?

Gmail、Facebook、Reeder、Twitter、Starbucksなどのアプリでハンバーガーアイコンを使用している有名な名前のいくつかがあります。

そして今、Webサイトやブラウザも3行のメニューアイコンを採用しています。 ChromeとFirefoxのブラウザがその一例です。右上隅のメニューを使用します。ハンバーガーメニューはすべてのオプション、設定、および拡張子を非表示にします。また、ブラウザ内の何かを修正または更新する必要がある場合は、アイコンがオレンジ色に点灯します。

Time.comはハンバーガーメニューを使用する主要なWebサイトの例です - この場合は左上隅にあります。 3行のメニューアイコンをクリックすると、追加のコンテンツリンクを示すスライドアウトが表示されます。

一部の専門家は、ハンバーガーメニューの機能はほとんど使用されていないと指摘しています。

まず第一に、3本の横線は実際にはメニューアイコンであり、単なる画像ではないことを多くの人がまだ理解していません。

第二に、ハンバーガーのアイコンは隠されたメニューの情報を「見えない、心の外」にします。実際にクリックしたり3行のメニューアイコンに触れたりしない限り、選択肢は表示されません。

実際、Time.comの場合、シンボルの意味を明確にするために、アイコンの下に「メニュー」という単語を追加する必要がありました。

ハンバーガーメニューに依存しない

さまざまな開発者が、ハンバーガーのアイコンとその欠点に不満を表明しています。

その流行にもかかわらず、一部の人はアイコンの使用を拒否しています。

しかし、変化をもたらした最も知名度の高い企業はFacebookです。絶対に明確にするために、Facebookはそれを完全に取り除きたいと公に述べたことは一度もない。しかし、Facebookは以前はハンバーガーアイコンの後ろに隠れていたモバイル機能のいくつかを出しています。

これらは、画面下部のタブバーと呼ばれる水平バーに表示されます。

下部のタブバーは、画面上でもう少し広いスペースを占有しますが、特定の機能をより明確にします。

AddapptのCEO兼共同創設者であるMrinal Desaiと話をしました。彼はまた、クラウドソースのリモートテックアプリCrossloopの背後にいましたが、これは最終的にAVG Anti-Virusに販売されました。

「ハンバーガーのメニューは実際には設定用ではありません」とDesai氏は述べています。 「それは「もっと」のようなものです、あるいは「タブバー」の代わりとして考えることもできます。両方を見ることはめったにありませんが、我々はプロトタイプでそれを探求しましたが、結局「タブバー」ルートを選ぶことを選びました。」

これらの決定は、多くの場合、アプリの目的によって異なります。ハンバーガーのアイコンは機能を解除する傾向がありますが、タブバーは機能を明確にします」とDesai氏は付け加えました。

ハンバーガーアイコン作成者が最後の言葉を入手

それで、あなたはあなた自身のウェブサイト、モバイルテーマまたはアプリでハンバーガーメニューアイコンを使うべきですか?

アイコンの元の開発者が最後の単語を取得する必要があります、と思います。

「シンボルの長寿命(1980年代以降)は、そのシンプルさ、実用性、学びやすさ、そして記憶に残るものの証です」と、Coxはハンバーガーアイコンを殺すための電話について尋ねました。

「不適切な使用法や実装に基づいてUIツールやウィジェットを「削除」または「廃止」しようとするのは、近視眼的で反応が早すぎるためです。」

Hamburger、Shutterstockによる赤いアイコン写真

もっと:あなたが知らなかったこと、3つのコメントは何ですか▼