有名サイトに学ぶトップページの要素構成 – 全日本空輸(ANA)編

全日本空輸(ANA)は、日本ブランド戦略研究所が公表しているWebサイト価値ランキングで常に上位に顔を出し、2014年は1,108億円という価値を算出されています。
そんなサイトhttp://www.ana.co.jpの今昔物語を見てみましょう。

「Webサイト価値ランキング」におけるana.co.jpの順位変動

2006 2007 2008 2009 2010 2011 2012 2013 2014
順位 2 2 2 1 4 1 2 1 1

なお、Webサイト価値は売上価値と情報価値の合算値で計算される独自指標です。
Webサイト価値ランキング | Webサイト価値ランキング | 日本ブランド戦略研究所 | Japan Brand Strategy

1996/10/28

取得できた最古のキャプチャです。
English Version hereと言っておきながらすべて英語表記だったりするなど、とてもよい感じです。
すべてはここから始まります。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

1998/5/7

少しHPらしくなってきました。
逆にこのくらいシンプルな方が目的のページに遷移しやすい感じすらします。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

2000/6/21

現代ぽさも、どことなく見えてきた時代です。
いまも使われている「ANA SKY WEB」という言葉も登場しています。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

2002/7/21

色が少し重い感じになりました。
また予約導線や飛行情報などが左サイドなどセクションごとにグルーピングが明確化されています。
このタイミングでサイトの幅は740pxと少し広がりました。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

2005/3/27

予約の上にマイレージを持ってきて、かつトップページから直接ログインできるようにしています。
またメニューは国内線トップをデフォルトとして、国際線はサイドから予約が消えています。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

2008/11/2

キャプチャーが正常ではないのですが、マイレージをより目立つようにヘッダー下にぶち抜きで設置しています。
またサイドはより国内線予約を簡単にできるように変更されています。
さらにキャンペーン情報の充実が目立っています。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

2010/8/30

これまでの流れを踏襲する形で全体のデザインが爽やかになりました。
これにより、コントラスト差が付き、訴求したい箇所に目が行くようになっています。
サイトの幅は950pxとなり現在と同じものとなります。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

コントラスト

各ボタンに目が行くようになっているのがわかります。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

2011/7/9

もの凄く大きな変更はありませんが、微妙に変わっている部分が2つ。
左サイド予約部分がより詳細な指定ができるようになっています。
また、パッケージツアー部分がANA内ワードだったものが、一般的なものに変更されています。
より利用者目線にしたということかと思います。

  • ダイナミックパッケージ→航空券+宿泊
  • スカイホリデー→パンフレット商品など

有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

2012/3/21

ここも大きな変化はなく、Facebookページヘの導線が追加されたのみです。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

2013/7/24

デザインが大きく変更され、現在使用されているものになりました。
メニューが大きく見やすくなった他、要素を絞ることでトップページの目的を明確にしています。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

公式のプレスリリースでも下記のようにうたわれています。

1.ASW トップページをリニューアル!
 ASWの各トップページをシンプルですっきりとしたデザインにリニューアルし、ゆとりあるレイアウトとすることで、タブレット端末でも使いやすくなり、よりスムーズな航空券・ツアー商品の検索・予約購入が可能となりました。また、マイレージ会員様向けにも、エリアを集約し、会員情報や旅程など、必要な情報を簡単に確認出来るようになりました。
ANA SKY WEBを大幅にリニューアル!|プレスリリース|企業情報|ANA

2014/3/12

ロゴの隣に「Inspiration of JAPAN」が追加されました。
また「領収書・搭乗証明書」検索も追加されるなど、細かい改修が続いているようです。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

コントラスト

見出しが非常に見やすくなっています。
有名サイトに学ぶトップページの要素構成 - 全日本空輸(ANA)編

ANAのサイトは利用者のニーズに応じて情報の整理・特化を行っています。
基本ではありますが、ニーズを汲み取りながら、随時細かい追加を行っていくことが、Webサイト価値ランキング上位という結果に繋がっているようです。

growth > 有名サイトに学ぶトップページの要素構成 – 全日本空輸(ANA)編