webユーザビリティを徹底講座!
![]() |
| 内職的貯蓄節約生活 > webユーザビリティとは | ||
| webユーザビリティとは |
| ネットサーフィンをしていると、「このサイトは本当に訪問者のことを考えているの?」と疑いたくなるサイトを見掛けることがあります。たとえば、トップページに大量の画像や動画が使われ、読み込むのに時間がかかったり、ポップアップ(新しいウィンドウを自動的に開き、別の内容を表示させること。)が出たり、BGMが流れたり。 しかし、これらのサイトを運営している人は、別に訪問者を困らせるためにやっているわけではありません。むしろ、自分のサイトをもっと見てもらいたいと張り切って作っているのです。特に、動画を使っているサイトなどは「どうだ!かっこいいだろ!」と自信満々です。しかし、動画を使えば重くなるだけで、読み込むのに時間がかかり訪問者をイライラさせるだけです。これでは、単なる自己満足に過ぎません。 そこで、覚えてほしいのがWebユーザビリティです。Webユーザビリティとは、「見やすく、わかりやすく、使いやすい」ページ、つまり訪問者(ユーザー)の視点で作られたホームページのことです。ユーザビリティを考えながら作っていけば、必ずアクセスアップにつながるホームページを作ることができます。そこで、ここではユーザビリティについて詳しく講座したいと思います。 □ユーザビリティに優れたホームページ ・見やすい 見やすいホームページを作るには、シンプルを心掛けることです。慣れてくると画像をたっぷり使った、「カッコいいデザイン」のホームページをどうしても作りたくなります。しかし、訪問者は画像を見たいのでしょうか?画像をたっぷり使えば、重くなるだけでかえって見づらいページになってしまいます。 たとえば、Googleのトップページを見てください。とてもシンプルですよね。Googleのような検索サービスは、訪問者は検索する『目的』のために訪れるわけですから、検索機能が使いやすければ、それだけでいいのです。余計なものは必要ありません。当サイトのような情報サイトの場合は、訪問者にコンテンツを見てらうのが『目的』です。だから、訪問者が文章を読みやすいようにして上げるだけでいいのです。 そもそもパソコンの画面で文字を読むのは、とても疲れるんですよね。ですから、訪問者にできるだけ疲れないような文字にすることは大切なことです。ちなみに、文章で一番読みやすい配色は、背景色「白」、文字色「黒」です。当サイトもそうですよね。ユーザビリティを考える上で、文字は非常に重要ですので、読みやすく目に優しい文字・文章にのページでも詳しく講座していますので、参考にして下さい。 それから、ホームページは複数のページで構成されていますが、できるだけ訪問者が疲れないように各ページのレイアウトを統一した方がいいでしょう。当サイトのように、一つのサブページを作ったら、後はそれをコピーし各ページに貼り付けでいけば楽です。なお、ユーザビリティ考慮したデザインについては、ホームページのデザイン講座を参考にして下さい。 ・わかりやすい わかりやすいというのは、「何がどこにあるのかわかる。」「自分がサイトのどこにいるのかわかる。」「どこをクリックすればいいのかわかる。」「パッと見ただけで何のサイトかわかる。」ということです。 「何がどこにあるのかわかる」「自分がサイトのどこにいるのかわかる」。これは、レイアウトやナビゲーションをシンプルにすることでわかりやすくすることができます。そして、全てのサブページのレイアウト、ナビゲーションを統一させ、同じところに配置することです。そうすることで、誰が訪れても考えることなく、迷うことがなくなります。また、サイトマップを設置して、コンテンツに何があるのかがわかるようにして上げることも大切でしょう。 「どこをクリックすればわかる」。これはリンクをする場合、必ず下線を引いたりして、別の場所へのリンクであることがわかるようにさせます。リンクの色は青で下線を引くのが一般的なので、それに統一するといいでしょう。それからリンクは、「こちら」リンクではなく、リンク先の内容をきちんと表したリンクにしましょう。こうすることで、訪問者にも親切ですし、リンク先も興味を持って見てもらえるようになります。 「パッと見ただけで何のサイトがわかる」。これはそのままです。ネットサーフィンをしていると、トップページをパッと見ただけでは何のサイトなのかわからないサイトがたまにあります。トップページを数秒間見ただけで一目瞭然にどんなサイトなのかわからないといけません。そのためには、タイトルロゴや紹介文、キャッチコピーなどで何のサイトかわかるようにする工夫が必要です。 ・使いやすい 使いやすいはページにするには、まず操作性の良いナビゲーションは欠かせません。簡単にページの行き来がしやすいようなナビゲーションが理想です。また、連続性のあるページはきちんとつなげる必要があります。このページの下部にも、『前【ヤフー・グーグルはHP作成の手本】へ 次【ホームページのデザイン講座)】へ』となっていますよね。 それから、全てのページから、トップページへのリンクは必要です。最近は、検索エンジン経由でサブページに直接やってくる訪問者が多いので、それを考慮したナビゲーションを作る必要があります。 最近は「パンくず」ナビゲーションがよく使われています。これだと、トップへのリンクがなされ、しかも、自分が今いる場所がわかるので迷子になりません。当サイトも、上部に【内職的貯蓄節約生活 > webユーザビリティ】と、使っていますよね。 それから、使いやすいページを考える上で、やってはいけないのが横幅が広いページです。縦幅は多少広くてもいいのですが、横幅が広いと毎回横スクロールをしなければいけなくなるので、非常に使いにくくなります。面倒な操作は、閲覧する方も見る気がなくなってしまいます。 それでは、どのくらいの横幅が理想なのでしょうか?最近では1024×768の解像度が支流ですが、ノートパソコンで800×600解像度を使う人もいますので、基本は800×600でしょう。画面解像度が800×600でも横スクロールしないで済む横幅は、750ピクセル以下です。ちなみに、当サイトはトップページが700pxでサブページが650pxになっています。やはり、650〜750pxくらいが現在の理想ではないでしょうか。 |
| 前【ヤフー・グーグルはHP作成の手本】へ | 次【ホームページのデザイン講座】へ |
| TOP【webユーザビリティとは】へ↑ HOME【内職的貯蓄節約生活】へ |
| MENU(内職・ネットで稼ぐ編) |
| ・ホームページ作成の仕方・ホームページ作成に必要なもの・レンタルサーバー・ドメイン講座・レンタルサーバの選び方 ・格安レンタルサーバー比較・ホームページのテーマとコンテンツ・タイトルの付け方・ヤフー・グーグルはHP作成の手本 ・webユーザビリティとは ・ホームページのデザイン講座 ・読みやすく目に優しい文字・文章に ・HTMLタグはこれだけ覚えれば十分 |
|
|
| 当サイトの内容の全部または一部を無断転機・複製することは一切禁止です。悪質な場合、厳しい対処を致します。 Copyright(C) +内職的貯蓄節約生活〜副収入・お小遣いを稼ぐ〜 All Rights Reserved |