当初、「ナビゲーションは右にすべきか?左にすべきか?」みたいなことを長文で書いてたけど、Liner Noteさんのエントリーを見て自嘲。

「やっぱモックアップなりなんなり、画を見せないとダメだよなあ」ってことで作ったのが、以下の画像。

Yahoo!の広告を左上に移動させた画像

→ 別ページで表示

おなじみ「Yahoo!」トップの広告を左上に移動したら、ものすごく違和感のあるページができあがったので、この違和感について、あれこれ考えてみた。

1. ナビゲーションはどこに配置すべきか

Yahoo!の各サービスへのリンクを右側に移動させてみたけど、やっぱり左側にないと気持ち悪い。

この「右ナビか、左ナビか」っていう話だけど、たとえば、コーポレートサイトとかECサイトとか、ページ数が多いサイトを作るとき、下階層のローカルナビはたいてい右側に配置する。

それは、「コンテンツが主(メイン)、ナビゲーションは従(サブ)」っていう主従関係があるからで、ユーザ中心のサイト設計をする限り、メインであるコンテンツ部分は「一等地である左側」に配置するのが正しいと思う。

ただまあ、サイトを提供する側からすると、そうも言ってられないのかな?とは思う。

たとえばコーポレートサイトを提供する企業側からすると、「いろんなページを見てもらいたい」という思いがあって、「目に入りにくい右側にナビゲーションを配置するなんて、もってのほかだ!」なんて言いたくなるのかもしれない。

でもユーザへの配慮が不足した、独りよがりのサイトを作っても、その企業のファンは増えないような気がする。

webサイトは、勤勉な営業マンと同じだ。24時間365日、文句も言わずせっせと働いてくれるのだから。

なんて言葉を聞いたことがあるが、営業マンの出来不出来が、売り上げなりイメージなり、その会社の行方を左右するのは言うまでもない。

2. 右ナビを採用しているwebサイトの例

下の画像で分かるように、企業サイトランキング2008で首位を取った富士通のサイトでも、下階層に右ナビを採用している。

右ナビを採用している富士通サイトの下階層

ナビゲーションの位置でサイトの価値が決まるわけではないけど、昨年の企業サイトランキングで首位を取った「出光興産」のサイトでも右ナビを採用してるのは、偶然ではないような気がする。

3. デスクトップアプリケーションの場合

デスクトップアプリケーション(以下、アプリケーション)の例として、Windowsのメールソフト「Outlook Express」(以下、Outlook)を紹介する。下図を見て分かるとおり、メールの受信トレイ・送信トレイなどの、いわゆる「サブメニュー」は左側に配置されている。

Outlook Expressのキャプチャ画像

今までさんざん言ってきた「右ナビ最適説」と違うじゃないか!って言う人がいるかもしれないけど、これは「webサイトとアプリケーションの違い」だと思う。

ここでもし比べるのなら、例えばそれは「富士通webサイトとOutlook」ではなく、「FirefoxとOutlook」でないといけないのかと。

詳しくは、「Webブラウザの領分ーコンテンツとナビゲーションの分離 - Liner Note」とか「Infoperience - ナビゲーションの落とし穴」で言及されているので、簡単な説明だけしておく。

たとえば、「Outlookというアプリケーション」はメールを読み書きするツール、つまり決められたタスクをこなすためのツールであるのに対して、「富士通webサイト」はユーザが必要としている情報を提供するためのコンテンツであるということ。

つまり、Outlookは、webでいうところのブラウザの役割であり、ナビゲーションというものの概念が違うのだ。(と僕は解釈してます。違ってたら指摘してください。)

4. Yahoo!の各サービスへのリンクの位置付け

で、Yahoo!トップページの話に戻って、各サービスへのリンクエリアの話。

下図のように、通常左サイドに配置されているこのリンクエリアは、Yahoo!というアプリケーションのナビという位置付けとしてとらえると、すんなりその配置が解釈できるのではないか。

Yahoo!トップページ

ということで、今のYahoo!のインターフェースは理にかなっているんだと思う。あ、別にYahoo!の回し者ではありません。

(おまけ)もし左上が広告エリアだったら・・・

「ユーザの目線はFの字を描きながら、左上から右下へと移動する」ってーのは、よく知られてるけど、真っ先に目線が行く左上に広告が入ると、それだけで?☆Σ※(・・・自嘲)。

たまに表示される「有名占い師に聞いてみよう!あなたの2009年」とか「おしゃれを諦めない!マタニティウェア♪」とか、興味ありませんって。もっとユーザのセグメンテーションができれば、少しは広告の効果があるかもしれないけど。

もしかして、そういう計画が進行中だったりして。いわゆるLPOの一種か。

新年あけましておめでとうございます。今年もよろしくお願いします。

ということで、2009年が始まってしばらく経ってるワケだけど、しつこい風邪のせいで、苦々しい日々が続いております。 そんな中、今年の抱負なんぞ考えてみたので、自分を追い詰めるためにも書いておく。

2009年の抱負

  1. webサービスを立ち上げる
  2. 自分にキャッチコピーを付ける
  3. 引っ越す

まずひとつ目の「webサービスを立ち上げる」だけど、これはプライベートとしてやるのではなく、是非業務としてやってみたい。

不況のあおりというか、不況のおかげというか、仕事が落ち着いているこの時期を利用して、自社サービスでも立ち上げたい(って勝手に思ってる)。

このご時世、サイト制作を発注する企業も減るわけだし、政府の景気対策に期待してもしょうがないし、自分たちの食いぶちは自分たちでまかなおうぜ。っていうスタンス。

で、その開発を、デザイナー2人+プログラマー1人の3人セットでやる。

そうすると、3人セットが何組かできるから、おのおのモックアップを作って、社内でレビューして、イケそうなやつは実際のサービスとしてリリース。とかできるといいなあ、というひとつ目の抱負。

二つ目の「自分にキャッチコピーを付ける」はこの頃特に感じる、焦りにも似た抱負。

『自分にキャッチコピーをつけてみる』

商品も社員も、「いろいろなことができる」というのは、一見、とても頼られるいいことのように思えるが、「これしかできないが、それについては誰にも負けない」という事柄を持っているほうが、結果としての評価を受けやすい。

ナガオカケンメイ著 「ナガオカケンメイの考え」より

「webやるからにはなんでも出来ないと!」ってそれまでは思ってたけど、この言葉を読んで少し考えが変わった。自分につけるキャッチコピーを、今年は自分で作り出そうと思う。

最後に三つ目の「引っ越す」。これは単純に引っ越したいなーっていう希望。

もうちょっと快適なとこに引っ越して、たまりにたまったweb系の本をまとめて読みたいなあ、なんて思ったりしてます。本棚に本が増え続ける日々から脱却したい!

以上3つの新年の抱負。来年の今頃、何個クリアーできてるか、今から不安です。

ナガオカケンメイの考え
ナガオカケンメイの考えナガオカ ケンメイ

おすすめ平均
stars高い。面白くない。
stars色々考えさせれる一冊
stars共感だらけで怖いぐらい

Amazonで詳しく見る
by G-Tools

web検定合格書の写し


こんな僕もうれしはずかし2級です。

web屋が資格なんか取ってもしょうがない、と思ってたけど、なんか事の流れで取っちゃいました。ひとまず、合格おめでとう、俺。

試験を受けてみて思ったのは、「webデザイナー検定」に合格してもwebサイトは作れないだろうなってこと。

なんか、もっとうまいこと言いたいけど思いつかないので、工藤進英っていうお医者さんの以下の話を引用しておきます。

プロフェッショナルとは・・・

「自分の経験と自分の知識とそれから技術と、それを総動員してかつ、その結果についてすべての責任を負える人間、それがやっぱりプロフェッショナルと思います。」

大腸内視鏡医・工藤進英 「NHK プロフェッショナル 仕事の流儀」より

さすが、プロらしいコメント。僕は果たしてプロフェッショナルなのか、吟味します。


それにしても、いまいちパッとしない2級という響き。
「2流webデザイナーでしょ?」って言われないか、これからが不安です・・・。

日経ネットを見てたら、こんなニュースに出会った。

消費税増税「11年度」明記 3年以内の景気回復前提で自公合意

自民、公明両党は23日未明、税制抜本改革の道筋を示す「中期プログラム」で、消費税率の引き上げ時期を巡る表現修正で基本合意した。3年以内の景気回復を前提条件に、早ければ2011年度からの消費税増税を可能にする内容。24日に両党内の手続きを終え、同日中に政府が閣議決定する方針だ

NIKKEI NET(日経ネット)より

記事によると、麻生首相が消費税の増税を明言したらしい。
ただし、景気が回復すれば...っていう条件付きで。

っていうか、景気悪いんだから、しばらく消費税ゼロにしない?
で、その隙に、車でも家でも、高そうなもの買っちゃおうよ。
ついでに、webサイトのひとつでも発注しようよ。

ダメか?

12月は好きなサイトをさらす月[謎]、ということで、僕が最近気に入っているサイトを10個紹介しようと思う。以下、順不同。

NRI NetCom
野村総合研究所グループのコーポレートサイト。
写真のクオリティ、心が動くコピー、動きの気持ちよさ、すべてがハイレベル。これぞプロの仕事。
NRI NetCom
ありがとう0系新幹線 スペシャルサイト
0系新幹線の特設サイト。
すべてにノスタルジーを感じさせる素晴らしい完成度。特にスペシャルムービー「ありがとう 夢の超特急」は映像と音楽のマッチングが素晴らしくグッと来る。
ありがとう0系新幹線
未来の自分に、手紙を書こう。
日本郵政グループの特設サイト。
「拝啓、未来の俺。」で始まるCMギャラリーはとても心があったかくなる。日本郵政のコンテンツは本当に素晴らしいものが多い。
未来の自分に、手紙を書こう。
村田製作所
村田製作所のコーポレートサイト。
白を基調としたすっきりとしたデザイン、情報のまとめ方は学ぶべきところが多い。
村田製作所
アップル
ご存知、アップルのポータルサイト。
グレーの使い方にはいつも感心させられる。
アップル
CCC カルチュア・コンビニエンス・クラブ
TSUTAYAを展開するカルチュア・コンビニエンス・クラブのコーポレートサイト。
グラデを使わない、区切らないデザインに、引き算の美しさが垣間見える。
CCC カルチュア・コンビニエンス・クラブ
無印良品
言わずと知れた無印良品のコーポレートサイト。
田中一光 ⇒ 原研哉と引き継がれたデザインの力がよく見える。ECサイト制作のベンチマークにはもってこい。
無印良品
TOYOTA DESIGN
トヨタ自動車 デザイン部門のサイト。
写真の美しさを余すところなく活かしたデザインは素晴らしいの一言。ただただ、かっちょいい。
TOYOTA DESIGN
Honda Green Machine
ホンダのクルマづくりに対する姿勢を伝えるスペシャルサイト
ゲームとメッセージを融合させ、「ホンダ」というメーカーらしさが現れた素晴らしいサイト。
Honda Green Machine
DESIGN | ヤマハ株式会社
ヤマハのデザインについて紹介したスペシャルサイト。
クリックレスのインターフェースが極めて気持ちよく、北島康介でなくても「チョー気持ちいい」という言葉が出てしまう代物。
ヤマハデザイン

以上、最近気に入っている10のwebサイトを紹介してみた。
よそのサイトを見て「ウーン!」とか「おーっ!」って言ってるだけじゃなく、そう言ってもらえるサイトを作らんと・・・。