« 2011年2月 | トップページ | 2011年4月 »

2011年3月

インターフェースデザインは迷わせないことが重要

今日も CSS Nite in FUKUI, Vol4 のレポートを書きます。こんなに分けて書く人は他に居ないと思いますが、ぐっとくるセッションが続いたので一つずつ書きたくなったのです。

セッションのタイトルと概要
講師: 中川直樹さん (株式会社アンティー・ファクトリー代表)
タイトル: 「 『中川流 Webデザイン道』 福井編」

私は中川さんがどんな方か知らず、講演を聞いたのも初めてでしたが、ウェブサイトを運営するという日々の作業や、新しいコンテンツの企画に最も影響を与える内容でした。ソフトウェア業で小規模の会社だと、コーポレートサイトや自社のサービス、製品のウェブサイトを社内で運営していることも多いと思います。Webデザイナーではないけれど、ウェブサイトを見つめる時間の多い担当者にとって役立つポイントが満載でした。

中川さんのお話によると、Webデザインは色: 5割、フォント: 2.5割、レイアウト: 2.5割で成り立っているそうで、人の記憶に残り、瞬時で判断されるのが要素の半分を占める「色」とのことです。ベタ塗りではなく、近似の二色を使うことで立体的に見せ、さらに補色(反対の色)を差し色にすると華やかさが生まれると言われて、これまでにディレクションした美しいサイトを見せてくださいました。女性は知っているであろう美白化粧品の色使いが印象に残っています。また、色でウェブサイト(会社や製品)の世界観を出したい時は、白をベースにメインと同系色の二つを使い、差し色を1割で作るとすっきり見せられるとのことでした。

コンテンツの目的に応じて余白をどのように作るかも勉強になりました。その文章を読んだ人にどのような行動をとってほしいのかで、組み方や周囲の空き具合、写真の位置を調整すると読むリズムが生まれます。知らせたいことを並べるだけでなく、見ている・読んでいる人に何をしてほしいのかをもっと突き詰めていくと、目的に合ったページを作成できるのではと思いました。

何より心に残ったのは、「インターフェースデザインは迷わせないことが重要。そこにあるだけで、何をするか目的のことができる」、それが大切だとおっしゃっていたことです。いつもウェブサイトを見ながら考えるのは、このページを初めて見たユーザーは、一目でどこをクリックすれば欲しい情報に辿り着けるか判断できるだろうか、ということです。これは常に改善の途上にあって、何かを、どこかを変えるたびに見直しが入る悩み多き項目です。完璧はありませんが、より分かりやすい、迷いにくいページには近づけるはずなので、これからも考えていきたいと思います。

セッションでは、アフォーダンス(東京大学の佐々木先生が有名ですね)という言葉も出てきて、ウェブサイトと人間に対してもこうした見方をしていいんだなと感じました。見たことがあっても、知っていても、自分の中でつながっていない大量の事柄(知識も技術も癖も)をつなげることで新しい発見ができるかもしれませんね。

| | コメント (0) | トラックバック (0)

Google Analyticsで別ドメインへの遷移をトラッキングする

Google Anaticsは設定した一つのドメインに対して解析データを表示してくれます。トラッキングコードを解析対象のウェブサイトに追加しただけでは、外部サイトへのリンクがクリックされたかどうかは追えません。自動では記録されないため、データを収集したい(追跡したい)外部サイトへのリンクに、一つ一つ手動でJavascriptコードを追記する必要があります。

例えば、ABC.com というウェブサイトがあると仮定して、このサイト内の別ページへのリンクは記録されます。しかし、ABC.com から DEF.comという別のウェブサイトへのリンクがあった場合、これをクリックしても記録されません。

Google Analytics ヘルプ 「JavaScriptイベントをトラッキングするにはどうすればよいですか。」

Code

設定後の後半に新しく入った部分を説明します。(詳しく知ろうとするとプログラミング言語の理解が必要になるので、とても簡単に書きました。)
onClick は(リンクやボタンを)クリックした時に、"=" で書いた動作を実行することを示しています。"javascript"は、HTMLの中にプログラムを書く方法です。"pageTracker._trackPageview"は、Google Analyticsでページへのアクセスを追跡するために必要な決まった書き方です。記録したい動作によって、アンダーバー以降の文字列が変わります。括弧で囲まれた '/_outlink/DEF' がGoogle Analyticsで上位のコンテンツページに表示されるURLにあたります。この部分は自分で好きな文字列を決めます。ボタンをクリックしたのか、リンクをクリックしたのか、特定のリンク先に決まった名称を付けておくと分かりやすいかもしれません。必ずスラッシュで始めなければなりませんが、その後の文字列はアンダーバーで始める必要はなく、'/download/file1' や '/links/button2' のような書き方もできます。

追加して24時間経過したら、ちゃんと記録できているかを確認します。「上位のコンテンツ」レポートを表示して、一覧の下部にある「ページをフィルタ」で設定した文字列を入力して、抽出すれば閲覧できます。

コーポレートサイトと販売サイトでドメインを分けている例はよくあると思いますので、自社が運営しているウェブサイト間でのアクセスの行き来を記録できると改善につながりそうですね。

| | コメント (0) | トラックバック (0)

« 2011年2月 | トップページ | 2011年4月 »