なぜ多くのWebサイトはハンバーガーメニューを使うのか?

なぜ多くのWebサイトはハンバーガーメニューを使うのか?
学生の皆さん。
これから新社会人になる方、クリエイターとして学びを始める方。
ご卒業、ご入学おめでとうございます。

さて今回は、「なぜ私はハンバーガーメニューを使うのか」という主題でお話ししていきます。
Web UIにおけるハンバーガーメニューは、名前は知らなくても見たことがあるという人は多いのではないでしょうか。
Webサイトの右上などにある三本線、あるいは二本線(≡)のアイコンが、一般的にハンバーガーメニューと呼ばれるものです。
私は、このハンバーガーメニューを暗黙的に意図して用います。

なぜか?

それについて、本記事で述べていきます。

ハンバーガーメニューとは何か?

まず前提として、ハンバーガーメニューについて簡単に説明します。
ハンバーガーメニューとは、三本(あるいは二本)の横線が並んだアイコン(≡)をクリックすると、隠れていたメニューが引き出しのように表示されるUI(ユーザーインターフェース)のことです。
グローバルナビゲーションを格納するために使われることが多く、三本線の形がバンズとパテに見えることから「ハンバーガーメニュー」と呼ばれています。
また「ドロワーメニュー」と呼ばれることもあります。

なぜ私がハンバーガーメニューを用いるのか

多くのサイトで採用されているハンバーガーメニューですが、これが最適なUIなのかについては、実はあまり議論されていません。

その背景には、社会的な慣習の存在があります。
ユーザーは三本線を見ると「メニューだろう」と理解しますし、制作者側も「一般的なUIです」と説明することができます。
つまりこのアイコンは、UIであると同時に社会的な合意によって成立している記号でもあるのです。

簡単な例で説明すると、Webにおけるリンクの色があります。
多くのサイトでは、クリックできるテキストリンクが青色で表示されています。
しかし「リンクは青でなければならない」と法律で決まっているわけではありません。
それでも多くのユーザーは、青い文字を見ると自然に「クリックできるリンクだろう」と認識します。
これは長いWebの歴史の中で繰り返し使われてきた結果、社会的な慣習として定着したものです。
つまり青いリンクは、技術的な必然というよりも、社会的な慣習として共有されている記号と言えるでしょう。

同じように、ハンバーガーメニューも「最適解だから」使われているわけではありません。
多くの人がそれを当たり前だと認識しているからこそ、社会的に許容されているUIなのです。

ビジネスの文脈においてハンバーガーメニューを採用すると、「一般的なUI」という理由で説明することができます。
もしこれを別のアイコンにした場合、一般認知と乖離し、その意味について説明責任が生まれます。

責任を取りたくない。
説明をしたくない。

それが、実際の現場でもあります。
デザインは自由なものだと思われがちですが、実際の制作現場には多くの制約があります。

・ユーザーの慣習
・プロジェクトの期限
・クライアントの要望

こうした条件の中では、未知のUIよりも「慣れたUI」が選ばれやすくなります。
余計な説明コストを払うくらいなら、社会的な慣習に沿う方が合理的だからです。
ハンバーガーメニューが広く使われている理由も、この社会的な慣習によるものです。

こうした事例は他にもある

例えば、検索窓にある「虫眼鏡」や、保存を表す「フロッピーディスク」のアイコンです。
虫眼鏡は物を拡大して見るための道具であり、フロッピーディスクは若い世代にとってはほとんど見たことのない保存媒体でしょう。

それでも私たちは、虫眼鏡を見ると「検索」、フロッピーディスクを見ると「保存」と理解します。
このように、社会的な慣習によって、ある記号が特定の意味を持つものとして成立することがあります。
そしてそれらを採用することで、説明のコストを減らすことができるのです。

学生のデザイン

しかし学生の課題におけるデザインは、事情が少し違います。
コンバージョン、企業ブランド、実運用といった責任との結びつきが、ほとんどありません。
プロのような説明責任もありませんし、社会的な慣習に従う必要もそれほど強くありません。
だからこそ、プロよりも比較的自由な発想やアイデアを試すことができます。

既存のUIをそのまま使う必要もありません。

・なぜそのUIなのか
・本当に必要なのか
・他の方法はないのか

こうした問いを持つことができます。
前述したように、多くのサイトで採用されているUIであっても、実際にはあまり議論されていないものもあります。
社会に出ると責任が生まれるため、その問いを持つ機会自体が少なくなってしまうのです。

規範を疑う時期

社会に出ると、デザインは徐々に社会的な慣習の中で行われるようになります。
その中で合理的な選択を繰り返すうちに、やがてそれを疑わなくなります。

なぜだと思いますか?

慣習が長く続くと、それを疑ったときに自分の足場が揺らぐからです。
慣習化された技術がアイデンティティと結びつくことは、よくあります。
その慣習が崩れることは、自分の立場や価値観にも影響を与える可能性があります。
だから人は、それを守ろうとします。

だからこそ学生のうちは、少し奇妙なUIを作ってもいい。
私はそう思います。

分かりにくいデザインや実験的なインターフェースも、その時期にしか試せないものです。
ハンバーガーメニューを使うかどうか。
その判断を自分なりに考えること自体が、デザインを学ぶ過程の一つなのです。

歴史的理解

歴史を振り返ってみても、既存の慣習を疑うことが新しい発見につながることがあります。
ダヴィンチの空気遠近法や、ニュートンとライプニッツの微積分などがその例です。

こうした発見は、必ずしも当時すぐに評価されるわけではありません。
むしろ社会的な慣習から外れた思想は、理解されないことも多いのです。

ガリレオ(コペルニクス)の地動説は当時強い反発を受けましたし、ゴッホの絵画も生前はほとんど売れませんでした。

彼らは既存の考え方を疑いました。
そして後の時代が、その価値を見出したのです。
意味というものは、多くの場合後から与えられるものです。

すべての新しい試みが評価されるとは限りません。
しかし既存の慣習を疑うこともまた、発展の一つの形なのです。

まとめ

ハンバーガーメニューは、必ずしも最適なUIだから使われているわけではありません。
多くの人が見慣れているという社会的な慣習があるからこそ、安心して採用できる側面があります。
実際の制作現場では、ユーザーの慣習やプロジェクトの制約、説明責任といった様々な条件の中でデザインが選ばれます。
その結果として、既存のUIが合理的な選択として採用され続けることも少なくありません。

しかし学生のうちは事情が少し違います。
社会的な慣習に従う必要も、説明責任を負う必要もほとんどありません。

だからこそ、既存のUIをそのまま使うのではなく、「なぜそうなっているのか」を考えることができます。

ハンバーガーメニューを使うかどうか。
その判断を自分なりに考えること自体が、デザインを学ぶ過程の一つです。
既存の慣習を理解することも大切ですが、時にはそれを疑ってみることも、新しい発想につながるのかもしれません。