ヘッダー（グローバルナビゲーション）のデザイン事例100選｜akane

こんにちは！株式会社Rabeeのデザイナーのakaneです🐏 今回は、ヘッダー（グローバルナビゲーション）のデザイン事例を調べてみました！パターンごとに分類しながら紹介していくので、どうぞ最後までお楽しみください✍ はじめに：グローバルナビゲーションとは？グローバルナビゲーションとは、Webサイトの全ページに共通して表示される「主要なコンテンツへの案内リンク」です。 一般的には画面上部のヘッダーに設置されることが多く、ユーザーが「今、どこにいるのか？」「目的のページはどこか？」と迷わないように誘導する大切な役割があります。 どんなサイトを作るときもほとんど必須のパーツですが、わたしは気付けばいつも似たようなレイアウトを使いがち…。そこで今回は、グローバルナビゲーションのデザインを100事例見比べて分類してみます🔍 ・ ・ ・ 1. スタンダード型まずは、一般的に「ヘッダー」の言葉で想像

[shields-pikes]

ああ、こういうパーツごとにまとめたやつ欲しかった！！！　キービジュアルも一緒に見れてありがたい。フッター版とか、会社紹介ページだけとか、サービス紹介ページだけとか、問い合わせフォーム版とかも見たい。

[ustam]

なんか違和感あると思ったら、スマホでデスクトップのヘッダーデザイン見てた。

[jyib1302]

まず、100個も集める情熱のそれに賛美を送りたい

[shiro-coumarin]

どれも綺麗で上品だなと思ったと同時に、ページ遷移後の情報量とUXで印象が覆るかも…とも。でも、ここまで考えてる人なら大丈夫かな。こういう人に松屋とケンタッキーの店内端末のUIをやってほしい（切実）

[sigwyg]

でかい画像をどーんと置くのは速度改善的に避けたい気持ちがあって、タイポグラフィで表現するか、実用を兼ねて記事一覧の出し方とかで代用してほしい気持ちがある。

[hiroshe]

リファレンスとし保存。100個全部見て選べるような人間はなかなかいない。

[tohokuaiki]

ハンバーガー🍔メニューは嫌だったけどもう広まってしまったからなぁ。やりやすいよ。

[tomono-blog]

何度テストしても、やはりハンバーガーメニューは撲滅したい派です。いちいち押すのめんどくさい。中身わからない

[nekoline]

見応えあった

[Falky]

こういうのぼへーっと見続けるのすこ

[rabit_bee]

こんなにヘッダーが集まってるなんて辞書として一家に一台欲しいくらいです！