どうも、ハガネ屋（@hagane_ya）です。
海外のWebサイト・ブログで、「ヘッダーデザイン」「トップページデザイン」が素晴らしいと感じたものを100サイトほどピックアップしてみました。どれもこれも、うっとりするような凝りに凝ったデザインです。
流行りもあってか「フラットデザイン」系のサイトが若干多めですが、これだけサンプルがあれば、さすがに好みのデザインは一つぐらい見つかるかと思います（笑）よろしければ参考にしてみてください。
ちなみに、ヘッダー同様「フッターデザイン」もかなり手が込んでいるところが多いです。気になったサイトは実際に訪問して、隅から隅まで研究しまくってみると面白いですよ。
スポンサードリンク
検索結果から無作為に選ぶ、海外ブログヘッダーデザイン例100選！
※クリックで各項目へ飛びます（戻る時は右下のBACK TO PAGETOP）
Webデザイナーのポートフォリオサイト。赤ヘッダー×黒×グレーが基調。
建築家（空間デザイナー）の作品集。黒背景にタイル状の建築写真が並ぶ。
Webデザイナーのポートフォリオサイト。黒地に青緑色の円がトレードマーク。
音声学習ツールのサイト。原色（オレンジ・赤・青・緑）のフラットデザイン。
超党派による非営利組織サイト。各種ウインドウの影が初代Macintosh風。
シカゴにある、ワッフルのファーストフード店の公式サイト。オレンジ色。
Webデザイナーのポートフォリオサイト。白地に六角形型のコンテンツが並ぶ。
MSの開発者向けイベント「build Windows」公式サイト。橋の写真に白文字。
英国にある商標・ブランドデザイン会社の公式サイト・モノクロの切り絵風。
英国のコーヒーショップの公式サイト。モスグリーン系統のカラーで統一。
デザイナー向けワークショップの公式サイト。グレー背景に黄色の差し色。
オシャレ文房具のネットショップ。筆記体のショップロゴが映える。
Webデザイナー・開発者向けTips集サイト。PCデスクトップ風のデザイン。
英ゲーム産業におけるデータ・解析の交流会サイト？ぼかし背景×白フォント。
仏Webデザイナーのポートフォリオサイト。ライトグレーの布地っぽい背景。
独のレスポンシブWebデザインサイト。奥行きの概念を持ったTOP画像が凄い。
Webデザイナーのポートフォリオサイト。インディゴ柄の背景に円が並ぶ。
米メンフィス発、コンサル会社のサイト。黒×白を基調に赤ラインの差し色が特徴。
Webデザイナーのポートフォリオサイト。白背景×タイル状に並んだコンテンツ。
Webデザイナーのサイト。Pinboard×Instagramな雰囲気。淡い七色フォントがお洒落。
Webデザイナーのポートフォリオサイト。クラシックが似合いそうなデザイン。
Webデザイナーのポートフォリオサイト。米メロコアバンドの公式サイト風。
Webデザイナーのサイト。ぼかし背景×文字背景ぬりつぶしの合わせ技。
ワイヤレスなリストバンド型活動量計の公式。カラフルなフラットデザイン。
03年から続く、老舗Webデザイン系サイト。シンプルなタイルUI×筆記体ロゴ。
海外版クックパッド（料理サイト）。料理写真を引き立たせるため、デザインは控えめ。
商標・デザイン会社の公式。ダンボール風アイボリー背景×版画がモチーフ。
「Fork」というCMSの公式サイト。青背景×デフォルメされた人魚キャラが印象的。
※CMS＝コンテンツ・マネジメント・システム（または「コンテンツ管理システム」）の略。HTMLをあまりよく知らなくても、比較的簡単にWebサイトが作れるソフトウェアのこと。なお、WordPressやMovableTypeなども、CMSにあたる。
サンディエゴ発、映像制作会社の公式。コンテンツスライダーをすべて動画で再現。
Webデザイナーのポートフォリオサイト。端末毎のプレビュー画像が並ぶ。超シンプル。
女性ファッション系サイト。スクロールによる場面転換が神技レベル。全背景が主役級。
Webデザイン＆アプリ開発者のサイト。マウスオーバー時のギミックが面白い。
デザイナー向けワークショップの公式サイト。Windows8（Modern UI）を彷彿とさせる。
↑の姉妹サイト（おそらく）。こちらは、上記サイトの「赤」バージョン。
子供向け学習絵本の公式サイト。昔懐かしの「Flash」を彷彿とさせるギミック。
Webデザイナーのポートフォリオサイト。黒背景×海水風テクスチャ文字がクール。
仏産ウォッカ「グレイグース」の公式。清涼感最強。スクロールによる場面転換あり。
英国ハムステッド・ヒース公園の写真サイト。航空写真を大々的に使ったサイトデザイン。
Webデザイナーのポートフォリオサイト。4カラム。右上のカラーパレットバーがお洒落。
電子メールクライアント「Inky」の公式サイト。OSX風ウインドウ×フラットデザイン。
米国発、コーヒー会社の公式兼ネットショップ。スキューアモーフィズム・デザイン。
Webデザイナーのポートフォリオサイト。選挙掲示板を彷彿とさせる、淡色のタイルUI。
Webデザイナーのポートフォリオサイト。ぼかし写真×フラットデザイン。全体的に淡色。
タイプ・デザイナー「Jessica Hische」の公式サイト。上品さが漂うサイトデザイン。
チェコのコーヒーショップ公式。航空写真の緑地帯が左サイドバーの茶色と絶妙に合う。
英国発、タクシー・レンタカー会社の公式。ありがちな車系サイト感が逆にそそる。
米シカゴ発、アパレル系の公式。メンノン系雑誌をそのままWebサイト化した雰囲気。
Webデザイナーのポートフォリオサイト。公式は謙虚、手掛けた作品群がハイセンス。
英国、ランカスター大学の公式サイト。赤を全面に押し出したこだわりのデザイン。
オランダのロゴ・デザイナーの公式。意図的に原色を抑えており、カラーセンス抜群。
- LayerVault
- LogicSpot – web design agency
- Lorenzo Verzini
- Manos
- MetroTwit
- Microsoft
- Naldz Graphics
- NATL
- oak.is
- Oliver Russell
- Performance Marketing Awards 2013
- Pete Firman – Magician / Comedian
- Photoworks Interactive Photo Booths
- Production Locations
- Quartz
- Rdio
- Seminal Responsive Web Design Example
- Shiny Demos
- Siyelo
- Snowbird
- Somewhat
- SpellTower
- Sphero
- Stacked Font
- Standbuy
- Stuff & Nonsense
- Supereight Studio
- Swerve Media Hub
- SWIMFIT Trajes de Bano
- Symbolset
- Taylor Herron Photography
- teamgeek
- The Gently Mad Podcast
- The Next Web
- The Ocean Grove Church
- The Onward Store
- Thibault Jorge
- Thomas Schrijer
- TIME
- Treasure of FrontEnd Island
- Trent Walton
- True
- TypographyShop
- United Pixelworkers
- Web Agency Fe-el srl
- Web Designer Wall
- William Csete
- William Leeks
- Windows Phone
- Xero
Design made in Germany Issue 5
Free People clothing’s Holiday Boutique
Performance Marketing Awards 2013
Pete Firman – Magician / Comedian
Photoworks Interactive Photo Booths
Seminal Responsive Web Design Example
スポンサードリンク
この記事が気に入ったら
いいね！しよう
最新情報をお届けします
