売りのコンテンツを目立たせる

多くのユーザが見たがるページがあれば、そのページへのショートカットを、トップページはもちろん、色んなページに設置した方がよい。

どのページをユーザがたくさん見ているか、というのを調べるには、アクセス解析を導入すればよい。
アクセス解析とは、どのページにどれだけの人がアクセスしているか、どんなキーワードをつかってアクセスしたか、などがわかるプログラムである。
アクセス解析には、Googleや忍者ツール、FC2などがある。中でもお薦めはGoogleである。

アクセス解析を導入したら、どのページが人気があるのかを調べよう。
そして、そのページへのリンクをサイト内の様々なページに貼ろう。

検索できるようにする

そのサイト内のコンテンツを検索できる機能をつけよう。
検索機能はページの目立つ場所に設置しよう。ページの上部、つまりヘッダーにおくとよい。
また、検索機能は、すべてのページから利用できるようにすること。

サイトで提供する情報を一覧できるようにする

ユーザがアクセスしてきたときに、そのサイトはどんな情報を提供しているのかを、一目でわかるようにしておきたい。

一目でわかるようにするには、大項目のカテゴリをメニューとして表示しておくことである。これは、グローバルナビゲーションと呼ばれる。
グローバルナビゲーションはすべてのページの、同じ場所に配置しておくことで、そのサイトは何を提供しているのかがわかる。

ユーザはトップページから来るとは限らない。というよりも、殆どのユーザは検索エンジンを利用してアクセスしてくる。ということは、トップーページではなく、ピンポイントに特定のページから入ってくることの方が多い。そのため、どのページでも同じナビゲーションを用意しておけば、別のページを見てもらうことができる。

サイト名とロゴ

サイト名やロゴは必ず全ページに表示するようにしよう。
大きく、デザインを考えるときは、ヘッダー、フッター、メインカラムの3つに分けられる。
このうち、ヘッダーとフッターにサイト名やロゴが表示される。

なぜそうするかというと、殆どのサイトでそういうデザインを採用しているからである。
つまり、ユーザはこれまでの経験から、どのサイトでもそういう風になっているものだと思っているのである。それを、あえて変えてしまうことは、ユーザを混乱させるだけで、何のメリットもない。

また、ロゴにはトップページに戻るリンクを貼っておくのが一般的である。
しかし、ロゴをクリックしたらトップページに戻れるということを、知らないユーザも多くいる。そのため、[ホーム]というリンクをメニューに追加しておくと親切である。

同一デザインに拘る

同じサイトであれば、すべてのページが、ある程度同じデザインで統一されている方がよい。
そうでなければ、ユーザは別のサイトに来てしまったのかと思い、混乱してしまう。混乱は、ウェブサイトからの離脱も意味しており、管理者としてもあまりメリットがない。

特に、同じカテゴリ内のコンテンツは同じデザインにしよう。
それによって、ユーザが、今自分がどこにいるのか、居場所がわかる。

ブラウザを新しく開くか、開かせないか

クリックして別ページを表示する場合に、別のウィンドウを開いて表示するかどうかという話である。
強制的に別ページを開かせるには、a要素に、target="_blank"を指定する。

基本的には、ユーザに選択肢を与える方がよいとされている。
なぜならば、ユーザはブラウザの「戻る」「進む」ボタンを使うことが多いからである。あるページを見て、見終わったら戻るボタンを押して、前のページに戻るのである。
それが、別ウィンドウを開いてしまうと、前のページの戻るという指定ができなくなる。必要ないと思ったら、そのページを閉じる、という手間がかかってしまう。
このようなユーザに対しては、常に同じウィンドウ内で次のページが表示されるように指定しておくのがよいということである。

しかし、別ウィンドウを開くのが悪いとはいいきれない。
例えば、気になる商品や情報をとりあえず開いておいて、後で順々に見たいときには、別ウィンドウで情報を開いておきたいこともある。
リンクをクリックすることで、別ウィンドウを開かせるのであれば、予め断っておくのである。
最も親切な方法は、別ウィンドウを開く場合のリンクを、リンクテキストの隣に小さく用意しておくことである。

階層の深さ

サイトの階層の深さは、大体3階層が理想的とされている。
3階層よりも深くなると、ユーザは迷いやすくなるといわれている。
そのため、できるのであれば、トップページから3階層以内という原則を守ろう。
この3階層というのは、トップページからのクリック数のことである。要するに、トップページから3クリックで求める情報にたどり着ける、ということである。
情報が多すぎて、3階層でまとめきれないのであれば、最大で5階層程度で収めよう。

情報の構造化

グループに分けた情報をさらに、関連付けすることで、そのサイトの構造を決定する。
ウェブサイトにおける構造には、以下の4つがある。

(1) 階層型
(2) 直線型
(3) グリッド型
(4) ウェブ型

(1) 階層型
多くのサイトで使われる構造。あるコンテンツの下に、別のコンテンツがあり、それは別のグループとは関連付けされていない状態。最も、サイトの構造がわかりやすく、ユーザにとっても、自分が今どこにいるのかがわかる。

階層型で注意すべきことは、各グループが他のグループに干渉しないことである。どのグループに入ってもおかしくない、又はどのグループに関係することも若干ずつ入っているような情報を扱うサイトの場合には、他のグループに干渉しないページというのは難しくなる。

(2) 直線型
印刷物で使われている構造。最もシンプルな構造である。すべての情報が並列に並んでおり、他に飛ぶことがない。1ページ目の次には2ページ目が必ず表示され、いきなり5ページ目が表示されることもない。

(3) グリッド型
グリッド型は、図で示せば表のような構造である。それぞれ、隣り合う縦と横のページが関連付けられている。

(4) ウェブ型
ウェブとは蜘蛛の巣である。網目状に関連付けられたページのことで、あるページからあるページに自由にリンクが貼られた状態のことである。
ウェブ型は、自由にリンクを貼ることで表現するため、構造が曖昧になりがちである。このような方法を用いる場合とは、他のコンテンツを参照させたいときなどである。

情報の整理

サイトの構造を考える上で、どのコンテンツがどのグループに属するか、という情報の整理が重要である。
そのためにも、まずはサイトで提供するコンテンツの大項目を決めよう。

大項目を決める方法にはいくつかあるが、その中でも簡単なものが、まずは、思いつく限りのコンテンツを書き出し、出尽くしたら次に、そのコンテンツをグループ分けして5グループぐらいにまとめるのである。
この5グループが、大項目となる。適当な項目名をつけよう。

情報の整理の仕方
情報を整理するには、以下の方法がある。

(1) 50音別
用語集などで使われる。本の索引などを想像すれば分かりやすい。

(2) 地理／場所別
地図や天気などのサイトで使われる。

(3) 時系列
情報系のサイトで使われる。ブログなどがよい例。

(4) トピック別
情報系サイトで使われる。

(5) 作業別
スケジュールなどがそれにあたる。

(6) ユーザ別
ユーザによって見ることができる情報と、見ることができない情報に分けられる。会員用、一般用、初心者用などにわけられることもある。

表示速度

ウェブサイトにアクセスしたときに、すぐに画面が表示されなければ、ユーザはイライラしてしまい、あまりに待たされるようならば、他のサイトに移ってしまう。
ブロードバンドが当たり前の昨今では、それほど待たされることはないかもしれないが、それでも回線が細い場合には、混み合ってきたら中々表示されなくなることもある。
理想的には10秒以内にページが表示されることである。

ページの読み込みが遅くなる理由は、ページのサイズである。
ページサイズは、HTMLファイルに書かれているテキスト以外に、表示しようとしている画像やFlash、CSS、JavaScriptなどの外部ファイルも含まれる。これらの総合計ファイルサイズが、ページサイズとなる。

回線別の最大ページサイズ
56Kモデム --- 65KB
ADSL（1M） --- 1MB

以上のように、回線の速度によって、10秒以内に読み込めるページサイズは変わってくる。
画像や、動画のようなものをたくさん使っていれば、別であるが、普通にウェブサイトを作っていれば、1MBなどという大きさのページになることはあまりない。

重くなるのを避けるテクニック
ページサイズをなるべく軽くするには、以下のことに注意しよう。

(1) ファイルに余計なテキストを書かない
HTML、CSS、JavaScriptなどのファイルに、余計なタグやコメントを書き込まないようにする。特にコメントを大々的に書いてしまうと、その分読み込む速度に影響を及ぼすといわれている。とはいえ、後々ファイルを管理する際にある程度のコメントは必要となる。最低限のわかりやすいコメントを心がけよう。

(2) レイアウトやデザインはCSSでまとめる
HTMLファイルに直接レイアウトや見た目に関する処理を書くよりも、外部CSSファイルに書いたほうがよい。フォントサイズ、色、レイアウトといったデザインは、他のHTMLファイル内でも同じものを使うことが多い。それならば、外部CSSファイルに、まとめて書けば、1つ設定するだけで、複数のHTMLファイルに適用することができる。

(3) CSSの設定をなるべく字数の少ないものに変える
例えば、border-left、border-top、border-left、border-bottomの4つを指定するのであれば、一度に、borderプロパティで指定する。また、0pxとしたいのであれば、0とだけ記述する、というように、なるべく少ない字数で収まるようにする、ということである。
ちまちまとした感じに思えるかもしれないが、こういう細かい積み重ねが大事である。

(4) 画像の画素数は下げる
画像処理ソフトで、画像のサイズを変更したときに、色の数を減らすなどしてなるべく画像のサイズを落とすようにする。特に、画像を鮮明にする必要がないような場合には、ギリギリまで下げよう。

(5) 広告などの貼り付けは最低限にする
アフィリエイトなどの広告をベタベタと貼ると、これが結構なサイズを持っていることがある。特に、JavaScriptを読み込むようになっている広告の場合は、複数のJavaScriptを読み込むようになっていると、かなりの時間を要することがある。実際に表示してみて、あまりに重いようならば、広告を減らそう。

(6) 目安をユーザに知らせる
ファイルをダウンロードする場合には、そのファイルのサイズや、ダウンロードにかかる所要時間などを書いておくと、ユーザがどのくらいの時間がかかるのかが事前にわかるため、待っていられるようになる。

ディスプレイ領域

サイトの幅を固定幅に選択した場合、その幅をいくらにするか、という話である。
固定幅にするならば、ディスプレイの幅に合わせるのがよい。
現在では、ディスプレイの幅は1280ピクセルが一般的かもしれないが、少し古かったり小さいディスプレイでは、800ピクセルもまだ健在である。そこで、サイトの基本的な幅は最低800ピクセルが考えられる。
しかし、画面内にサイト全体が表示されなくても、メインの記事が読める幅であれば、問題ないと考えると、大体900ピクセルくらいまでは許容範囲ではないだろうか。

固定幅か可変幅か

デザイン面で考えることの一つに、サイトの幅をいくらにするか、ということがある。
まず、サイトの幅を考える上で、サイトの幅を固定にするか、可変にするかを選択しなければならない。

固定幅か可変幅か
紙とウェブの最大の違いは、固定幅と可変幅である。
印刷物は、幅を変えることができないため、必ず固定幅になる。固定幅であれば、1行の文字数も決められる。しかし、ウェブの場合、ウィンドウのサイズを変えれば表示する領域も変わる。

幅を固定にすることの利点は、一行の文字数を決めることができることにある。
目で追うのに疲れない一行の文字数というのは、大体20～40字と言われている。
字の大きさや、字間を変更して文字数を調節することで、40字以内に収めることができる。

可変幅の利点とは、ブラウザのウィンドウサイズを変更しても、常に全ての情報がウィンドウ内に収められるということである。幅を固定してしまうと、その幅よりも小さいサイズでウィンドウを表示したら、すべての情報を読み取るには、横にスクロールしなければならなくなる。
幅を固定にすることは、ウェブの強みである可変を拒否することになる。

固定にするか可変にするかは、デザインにもよるし、好みも入ってくるかもしれない。
最大限ウェブの利点を使うのであれば、可変であるべきという意見もある。

しかし、固定幅を否定することもできない。
固定幅は、可変幅による利点が得られないことを補う利点がある。
それが、文字数の固定による読みやすさと、デザインのしやすさである。
幅を固定にすることで、一行の文字数を決めることができる。これは、読み手にとって、読みやすい環境を与える。
そして、幅を固定にすることは、ウィンドウのサイズが変わっても見た目が崩れないことになる。これは、サイトの運営者側にとって、作りやすい環境を与える。
つまり、読み手と作り手の双方に利便性を与える、固定幅のレイアウトには捨てがたいものがある。
よって、固定幅か可変幅かは、好みが入ってくるのである。

title要素をまじめに考える

　HTMLのtitle要素をまじめに考えよう。
　title要素は、各HTMLファイルに必ずつけよう。title要素は、そのページのタイトルにあたる。これは、そのページをブラウザで表示したときに、ブラウザの一番上の欄に表示される。また、検索エンジンは、title要素がある場合には、優先的にtitle要素の内容を、検索結果の見出しとして表示するようになっている（title要素がない場合は、内容を適当に表示する）。そのため、title要素に書かれたテキストは重要になってくる。
　あなたが検索エンジンを使って、何かを検索したときに、検索結果に表示されたサイトを実際に見てみようとする動機は何だろうか？以下の2つのうち、どちらかに属さないだろうか？

(1) より上位に表示されたコンテンツ
(2) 内容の説明文が自分の求めているものに近そうなコンテンツ

　(1)の仕組みは、検索エンジンの動作によるもので、より上位に表示するためには、内容が充実していること、他者から人気のあるサイトであること、SEOにもきちんと取り組んでいること、など、様々な要素が絡んでくる。検索エンジンの検索結果の上位に表示するための考え方については別の機会に説明する。
　ここでは、(2)の説明をする。検索結果に表示される見出し文や概要は、すべてそのページの内容が反映される。検索エンジンが勝手に説明文を作ってくれるわけではない。あなたがそのページで書いた内容が表示されるのである。つまり、その文章を見て、興味を持った人があなたのページにアクセスしてくるのである。アクセスしてもらうには、見出しや概要が人をひきつける内容でなければならない。最初に書いたように、title要素に書いた内容は、検索結果の見出しに相当する。検索結果の概要は、ページ内の冒頭に書かれた内容や、主要な文章からの引用になる。あなたが本を読もうと思うときは、その本のタイトルをみないだろうか。次に目次をみないだろうか？つまり、人は、タイトルや見出しに、それ以下に書かれている内容が凝縮されていると考えるものなのである。このタイトルをおざなりに書いてしまえば、それだけあなたは損をしていることになる。
　ウェブオーサリングソフトなどを使っていると、title要素をきちんと設定しなければ、「無題」などとされることもある。「無題」と表示されているウェブページほどみっともないものはないし、非常にもったいないことをしている。

title要素の入力方法
　title要素の重要性は理解してもらえたと思う。次は、具体的な入力方法である。ただ闇雲にタイトルを入力すればいいというものではない。基本は、そのページ内を端的にあらわす内容にすることである。そのページ内の情報を端的にあらわすためには、そのページ内の重要なキーワードとなる言葉をタイトルに盛り込むことである。しかし、そのために、タイトルがやたらと長くなったり、支離滅裂な日本語になってしまうのはいただけない。検索エンジンで上位に表示されても、人が読んだら意味不明なものでは、あまり近寄られない。
　タイトルは、ブラウザの上の欄に一文がすべて読める程度の長さにするのが望ましい。具体的には、30～40字であろう。もっと短くてもいいかもしれない。ただし、これにあまり拘り過ぎなくても、例えば、ウェブサイトの名前を入れておくのも、SEOとしては有効な場合がある。だから、最初にページの概要がわかる見出し文を入力し、その後にスラッシュなどで区切ってウェブサイト名を表示しておく、という方法もある。非常に短い略称でウェブサイト名を表示することができる場合は、最初にサイト名を持ってくるのも有効である。そのサイトが有名であれば、ユーザは、それを見たときに、「あ、あのサイトなのか、ならば安心だ」となる。アマゾンがいい例である。

情報には3クリックで辿りつく

　ユーザビリティの高いサイトにおいて、よく言われるのが、3クリックで求める情報にたどり着く、という原則である。
　これは、何も完璧に守る必要はない。まずは、サイトの目的や目標合ったコンテンツを考えよう。そして、いくつかのコンテンツを考えたら、どのように配置するか、サイトの構造を決めて、そのコンテンツがどこに位置するかを決める。そして、それらのコンテンツを求めるユーザがどのようにアクセスしてきて、サイト内でどのように動き、最終的にサイトの目的・目標を満たす動作をユーザにさせるには、どのような導線をつければいいかのシナリオをつくる。
　こういった導線作りが第一である。しかし、それ以外に、人気のあるページを調べ、そのページは別のページからリンクを貼っておき、いつでもワンクリックでそのページにジャンプできるようにしておこう。
　人気のあるページを調べるには、アクセス解析を導入するのがよい。アクセス解析には、様々なものがある。最も単純なものでは、サーバがつけるログである。これは、レンタルサーバでは殆ど提供されないので、有料サーバを借りた場合に有効な調査方法である。それ以外にも、GoogleAnalyticsや、忍者ツール、FC2などもアクセス解析ツールを提供している。これらを導入して、どのページがユーザのアクセス数が高いのかをチェックしよう。
　アクセス数をチェックしたら、「アクセス数ランキング」などのサイドボックスをサイト内に表示させ、そこに上位5番くらいまでの順位を表示させる、といった工夫をするだけで、ユーザを誘導することができるようになる。

ユーザの身になって考える

　大抵の人は、客観的に考えることは難しい。生き物というのは、自分が生きていかなければならないため、人のことよりも自分のことを考えるのは当たり前だ。しかし、自分のためになるからこそ、人のことを考える、という思考が必要である。客観的に観ることで、その結果が自分にかえってくるということである。
　すごい技術があるとする。JavaScriptやFlashでグリグリと画面が動くインタラクティブなものにしようと考えるかもしれない。しかし、それは果たしてこのサイトにユーザが望んでいるものだろうか？それを導入することで、サイトの目的や目標を達成させることに近づくのだろうか。
　もし、その技術を導入することで、ユーザが見たい情報にたどり着くのに1ステップ多くなるのであれば、それはユーザにとっては不親切な技術に過ぎない。あなたの一時的な満足感は満たされるかもしれないが、長期的にはユーザが離れていくことになるので、当初の目的が達成できなくなり、あなたの満足感も満たされなくなっていく。
　ユーザが求めているのは、サクサクと動くサイト、すぐに情報にたどり着けるサイトである。その上で、あなたの目的・目標に誘導できるように作るのが、あなたが第一に考えなければならないことである。

競合サイトの研究

　今作ろうとしているウェブサイトは、よほどニッチなニーズであるか、新しい内容でない限り、誰かに先を越されていると考えた方がよい。
　では、先を越されているからといってやるのをやめるべきかというと、そうでもない。まずは競合サイトがどのようなサービスを提供しているのかを実体験してみよう。それには、競合サイトにアクセスして、そこで一ユーザとしてサイトを利用してみるのがよい。もし、そのサイトがECサイトであるならば、商品の購入手続き（支払の一歩手前でよい）や、会員登録をしてみることである。このとき、入力間違いをわざとしてみよう。その結果、どのような処理をするようになっているのかをチェックする。また、サイトの構成はどうだろうか。コンテンツにはどのようなものがあるだろうか。そのほか、サイト内検索の動作、どのようなコンテンツやサービスにトップページからのショートカットがついているか、他のページからショートカットなどで目立たせているのは何か、宣伝はどこに張り付いているか、なども見よう。
　これらをすべてチェックして、気づいたこと、よい点、悪い点、改善点などを、逐一メモしていこう。そして、いい点は取り入れ、悪い点は気をつけるようにすると、競合よりもよいサイトを作ることができるようになる。

ブラウザの違い

　ウェブサイトは、ブラウザによって若干表示が変わることがある。これは、各ブラウザが採用しているHTMLのレンダリングエンジンが違うことに関係する。

InternetExplorer ---
Firefox ---
Google Chrome ---
Opera ---
Safari ---

　主に有名なブラウザは以上の5つである。なお、利用者数は、IEが5割以上、次いでFirefox、次にGoogleChromeとなっている。最近では、それほどの差異はなくなりつつあるので、インストールして観てみるとよい。
　なお、ブラウザによってわずかながらデザインにずれが生じたりすることにこだわり始めると、かなり苦労することになる。場合によっては古いバージョンは切り捨てたり、記事が読めれば多少崩れるのは目をつぶるくらいの考えでいたほうがよい。シェアの大きい上位3つくらいできちんと表示されていればよいのである。

　また、Linxというテキストブラウザがある。これは、HTMLの構造を理解し、テキストだけで表示するブラウザである。画像やCSSによるレイアウトなどはすべて無視され、上から登場した順番にただテキストを表示する。このブラウザを使うと、検索エンジンがそのサイトを見るときと同じ状況を人の目で見ることができると言われている。つまり、検索エンジンがどのようにサイトを理解するのかがわかるのである。
　こういったテキストブラウザで一度自分のサイトを確認することも、ユーザビリティを理解するには大切なことである。画像に説明文がついていない、ということが一目でわかるのである。

OSの違いを意識する

　殆どの人がWindowsでサイトを作っているであろう。または、Machintoshもありうる。しかし、それ以外にもLinuxや携帯端末やスマートフォンという状況も考えられる。
　これらすべてに対応するのはかなり厄介なことであろう。対応するというには、これらのOSでの環境を実際に見てみるのが第一である。そのためには、それらのマシンがなければならない。しかし、個人でそれらを集めるのは難しい。集まったとしても、そこまでやらなければならないサイトなのだろうか。そういったことも考えたい。
　ただし、携帯でも観られるサイトを作りたいと考えるのはごく普通である。こういった場合には、エミュレータを使うという方法がある。

エミュレータ
　エミュレータとは、ある環境で、別の環境をつくりだして、動作を確認することができるようにするものである。例えば、Windows上でMachintoshの環境を擬似的につくったり、携帯の環境をつくったりすることである。
　一時期、ゲーム機のエミュレータが流行ったが、違法に使う人が多いので、お薦めできない。しかし、コンピュータのエミュレータ（特に携帯）は、各社からエミュレータが公開されているので、これを利用することで、自分の環境で確認できるようになる。

・NTT DoCoMo
・au
・Softbank

また、Machintoshのエミュレータも一応発表されている。

・Pear PC

デザイン

　ユーザビリティにおいて、デザインは重要である。スタイリッシュにこだわろうとすると、実はとても使い辛いものになる。最近のブログの傾向などがそれである。
　文字を小さく、色も背景と近くするといったことは、なんとなくデザイン的に綺麗に見えるものである。カッコいいサイトを意識するあまり、文字を9ptや8ptに設定しているサイトも多く見受けられる。しかし、そのサイトの文字はユーザにとっては読み辛い。リンクの下線を無闇に消したり、リンクテキストの色を変えることは、ユーザにとって、それがリンクであると理解させることができるのか、を考えてからするべきである。

　また、それとは全く反対で、デザインに拘らないサイトも読み辛い。ページの端から端まで文字がしきつめられていて、文字と文字の間隔も狭く、行間も100%のままだとしたら、目が疲れてしまう。紙媒体のものと違い、ディスプレイはそれ自体が発光しており、余計に目が疲れるものである。だからこそ、可読性は紙媒体よりも確保しなければならないのである。

独りよがりを避ける
　上記以外に、容量の大きい画像をたくさん貼り付けるという行為も、ページの読み込みに時間がかかって、ユーザをイライラさせる原因になる。画像をたくさん張りたいならば、サムネイルで見せて、クリックしたら大きい画像にするなど、必ず方法はある。
　ウェブサイトは、誰かがアドバイスしてくれることは少ない。既に競合があるのであれば、わざわざ改善を要求するのではなく、もっと読みやすい競合サイトに流れていくだけである。サイトは基本的には自分だけでつくるものである。独りよがりになってしまいがちなところを、客観的に見ることができるように常に気を配らなくてはならない。

　独りよがりを避ける簡単な方法は、誰かに見てもらうことである。気のおけない仲間に観てもらって感想を言ってもらうのでもよい。勇気があるならば、掲示板にURLを貼ってもいいかもしれない。ただし、掲示板で告知すると、真似る人が現れる可能性もあることに注意した方がいい。

ユーティリティはシンプルに

　ユーティリティとは、機能のことである。サイトに持たせる機能はシンプルなほうがよい。多機能は複雑で、何をすればいいのか、どこにいけばいいのか、混乱をきたす。だから、メニューの数は多すぎてはならない。せいぜい、5～6がいいところであろう。
　また、JavaScriptを使ったり、Flashを使って多機能なものを装備したとしても、それらが本当にユーザの手助けになっているのかを考える必要がある。ここで動画は必要だろうか、わざわざ回転しながら画像を拡大させる必要があるのか、など。余計なものはそぎ落とそう。

サイト構築

　サイト構築とは、
(1) 企画・設計
(2) 作成・公開
(3) テスト・修正
の3つの作業の繰り返しである。

　一度作ったらおしまいではなく、つくったページのできばえを確認し、誤字脱字のチェックはもちろん、リンクのチェック、文章の読みやすさ、操作性といった面から確認を何度も行う。場合によっては、複数の方法論をテストして、どれが一番よいか結論を導き出すことも必要である。こうして使い勝手のよいサイトになっていく。

(1) 企画・設計
　何事も始める前には企画が必要である。やみくもにhtmlをつくりはじめても、まとまりのないサイトになってしまう。まとまりがないと、どこにどんな情報があるのか、ユーザには理解できなくなる。分かり辛ければユーザは去っていく。

　まず、サイトの目的・目標を設定しよう。そのサイトはユーザに何を与えるサイトであるのかを定義する。そして、自分が与えようとしている情報は、ユーザのニーズがあるものであるのかどうかを考える。つまり、ターゲットを設定するのである。
　わかりやすく考えるには、5W1Hが役に立つ。

What --- 何のためのサイトか（サイトの目的・目標）
Who --- 誰のためのサイトか（ターゲット）
When --- いつ利用するサイトか（ニーズ）
Where --- どこで使うサイトか（ユーザの利用環境）
Which --- どっちを使うか（競合の把握）
How --- どうやって使うか（使い方の流れの設定）

What
　何のためにつくるか、何をもってして目的達成とするか、ということである。
　ここで、自分に嘘をついても仕方がない。正直に何をしたいのかを考えて企画書の一番最初に書き出そう。この段階では、余計なことを考えないでよい。とにかく自分がしたいこと、目標を書く。

Who
　ターゲットを決める。自分の目的を達成するには、どんな人に読んでもらえばいいのか。自分がつくろうと思っているサイトは、誰にとって読まれやすいものなのかを考える。ターゲットがはっきりすれば、サイトのつくり方もおのずと決まってくる。例えば、若ければ字を小さめに設定することもできるが、年配がターゲットならば、字は大きめの方がいい、となる。

When
　それでは、自分がつくろうとしているサイトは、設定したユーザが本当に読みたいと思うものなのだろうか。それがユーザニーズの把握である。ターゲットユーザは、どんなときにこのサイトを使うのだろうかを考え、それらを書き出しておく。これは、提供する情報の方向性に影響してくる。もし、自分のやりたいことがユーザニーズとかけ離れていると思えるようであれば、ターゲットの設定をやり直すか、サイトの目的を変更する必要がある。
　ニーズを把握すると、サイトの構造の組み立て方も考えられる。例えば、まとめて1ページですべての情報を読みたいと思うか、細切れにして1ページの情報量が少ないほうがいいのか、などである。

Where
　ユーザの利用環境とは、コンピュータの環境であったり、実際に見る場所のことであったりする。接続環境は、もはやADSLか光接続が主流なので、あまり気にする必要はないかもしれない。それ以外にも、OS、ブラウザ、モニタの解像度の違いや、会社で見るのか（人の目が気になるのか）、家で見るのか（人の目が気にならないのか）といったことまで考える。

Which
　自分の作ろうとしているサイトは、殆どが既にあるサイトである。今までなかったサイトを作るとしたら、それは相当にニッチであるか、つい最近できた製品・情報しかない。ニッチなものはニーズも少ない可能性もあるし、最近の製品・情報は、すぐに類似サイトがいくつもできる可能性が高い。競合をチェックできない分、サイト作成に慣れていない人には作り辛いジャンルとなる可能性もある。

　既にあるサイトである場合、他のサイトのいいとこどりをすることができる。検索エンジンでサイトのキーワードをチェックしてみればいい。検索にひっかかったサイトを簡単に評価してみよう。デザイン、情報、機能などざっと見て、書きだしておこう。
　大事なことは、競合よりも優れたものにすることである。だから、いいとこどりをするだけではダメで、競合にはない機能や情報を盛り込む必要がある。何があって、何がないのかを把握しよう。

How
　ユーザがサイトを利用するときの、流れを決める。シナリオづくりである。ユーザはまずどこを見て、どのように辿って、ユーザニーズを満たした上で、自分がサイトを作った目的・目標を満たすか、という流れを考える。
　ユーザがそのサイトに来るということは、検索エンジンやリンクをクリックして、そのサイトにある情報を得ようとしているのである。そのユーザごとの目的や動機、サイト内でどのように動いてほしいかを書き出そう。
　ここで考えたシナリオは、後でサイトの機能や記事を書くときに役立つ。

ユーザビリティに必要なもの

ユーザビリティに必要なものは以下の5つである。

(1) 操作性
(2) 視認性
(3) 情報量

　ユーザビリティとは、ユーザにとって使いやすいかどうかを図る度合いである。

　操作性とは、何も説明書がなくても、感覚的に使い方がわかる、ということである。どこにメニューがあるか、ボタンの意味がわかるか、といったことから、自分の現在位置を把握できるか、あるページから別のページへの移動がしやすいか、といったことも含む。

　視認性とは、そのページの内容の読みやすさである。文字が小さすぎないか、文字の色が背景と似た色になっていないか、スクロール量が多すぎないか、どこがコンテンツでどこが宣伝なのかなど、ユーザにとって何がどこにあるのか目で確認しやすいかどうかということである。

　情報量とは、ユーザが求める情報がそのサイトにあるかどうかである。

　上記の3つのうち、情報量は、他の2つよりも重要度が高く、この1点で優れているサイトは、ユーザを集めることができる。情報量において唯一無二であれば、ユーザはそのサイトを利用するが、類似サイトというのは数多く作られるもので、ニッチなジャンルであっても、そこを狙ってサイトを作る人がいつか必ず現れると思っていた方がいい。
　他を寄せ付けないサイトをつくるならば、1に情報量、そして2・3に操作性、視認性を確保することである。