知的?自己流?普利伊待夢な育児ブログ

主に子育て日記。パソコン関連はソフト紹介や備忘録。
美容/健康・ベビー/マタニティに関する商品も紹介中。

cssc cssc cssc
--/--/--  Post at Diskenth
Category スポンサー広告 Tags

MicroAd(マイクロアド)に登録して自分のWeb/Blogに広告を貼るだけでお小遣いが稼げます。 ↓から登録いただければ、報酬アップに必要なサイトランクアップ方法などノウハウを提供します。楽天ぴたっとアドも稼げるのでオススメです。
MicroAd(マイクロアド)の登録はコチラ  楽天ぴたっとアドの登録はコチラ



上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
2009/10/07  Post at Diskenth
Category Windows / Mac Tags Web Tips ユーザビリティ

MicroAd(マイクロアド)に登録して自分のWeb/Blogに広告を貼るだけでお小遣いが稼げます。 ↓から登録いただければ、報酬アップに必要なサイトランクアップ方法などノウハウを提供します。楽天ぴたっとアドも稼げるのでオススメです。
MicroAd(マイクロアド)の登録はコチラ  楽天ぴたっとアドの登録はコチラ



昨日はサイト・ブログの実用的なユーザビリティ10のポイントの内、5ポイントを紹介しましたので、6以降を紹介します。

Smashing Magazine
10 Useful Usability Findings and Guidelines

10のポイント
  1. ラベルはフィールドの上に配置
  2. フォーカスは視線の先に
  3. デザインのクオリティは信頼を与える
  4. ランディングページのスクロール
  5. リンクはやっぱりブルー
  6. 検索ボックスの文字数
  7. ホワイトスペースの価値
  8. ユーザビリティテストの重要性
  9. プロダクトページは作りこむ
  10. コンテンツのような広告

詳細、和訳は続きに。


↓以下、追記です↓

6. 検索ボックスの文字数
検索ボックスの理想的な幅はいくつでしょうか?
Jakob Nielsenのレポートによると、現在の検索ボックスの大半はあまりにも短いということが分かります。ボックスの幅が短い時の問題は、長い文字列を入力することはできますが、一度に目に見える範囲が狭く、再検討や編集することが難しくなってしまうことです。

レポートによると、検索ボックスの平均的な幅は18文字分で、その文字数だと実際に入力された文字の27%をカバーするものでした。幅を27文字分とすると、90%をカバーします。例えば、テキストフィールドの幅を指定する際、emでも行えるので27文字分に調整することもできます。
WebUser_6.png
Googleの検索ボックスは、長いテキストを入力するのに十分な幅を備えています。

WebUser_6_2.png
Appleの検索ボックスは、「Microsoft Office 2008」と入力しただけで表示されず、あまりにも幅が短いです。

一般的には、検索ボックスはユーザが問い合わせるに使用するので、短くするのではなく幅を広く設計します。しかし、このデザインは不幸にも簡単に却下されるか、無視されがちです。ただし、フィールドに若干のpaddingを与えるとユーザエクスペリエンスを改善することができます。



7. ホワイトスペースの価値
たいていのデザイナーはホワイトスペースの効果を知っています。それはパラグラフ、画像、ボタンなどの間にある空間です。各項目の間のスペースをコントロールし、関係性を示したりすることができます。
WebUser_7.png

上部に大きなコンテンツマージンがあり、パラグラフの間隔に注目してください。このホワイトスペースはコンテンツを読むことを容易にし、快適にします。

ホワイトスペースはコンテンツの読み取りをいっそう容易にします。パラグラフの間、左右のマージンにホワイトスペースを配置することで理解度を20%増やすとも言われます。ユーザは容易に、そこに視線を合わせることができるでしょう。



8. ユーザビリティテストの重要性
Jakob Nielsenのレポートによると、ウェブサイトのユーザビリティテストは、5人のユーザで実施した場合は問題点の85%が明らかになり、15人のユーザーで実施した場合は問題点のほぼすべてを見いだすであろうとリリースしました。
WebUser_8.png

Webサイトの最も大きな問題点は、通常最初の一人か二人のユーザで発見できます。次のユーザは、これらの問題点を確認して、残っているマイナーな問題点を発見します。このたった二つのステップで、Webサイトの問題の半分は見つかるでしょう。これはテストに多くの費用をかけなくても良いことを意味します。

このユーザビリティテストの大きな分岐点は0か1という点です。
テストが何もないよりは「有る」ということが大切です。



9. プロダクトページは作りこむ
多くのプロダクトページは、さっとながめるユーザにとってさえ十分な情報に欠けています。これは重大な問題です。なぜなら、プロダクトページの情報が、ユーザが購入する際の決断を促すものになる為です。プロダクトページの情報に有用性が欠けていると、8%のユーザが諦めて、10%のユーザがWebサイトを去ります(ユーザビリティに欠けるため)。
WebUser_9.png

Appleではプロダクトごとに「技術仕様」のページを設けています。これは複雑なディテールが分かりやすく記載されています。

あなたのプロダクトについて、詳細な情報を提供するようにしてください。しかし、あまりにも多くのテキスト量にはしないでください。情報を理解することを容易にします。長文を使用するのではなく、多くの小見出しを使用し走査しやすいようにします。画像を多く使用することも効果があります。最後に、ユーザが理解しにくい専門用語は使わないでください。



10. コンテンツのような広告
Jakob Nielsenのレポートによると、たいていのユーザはバナー広告に盲目であると報告されています。ユーザがコンテンツに没頭しているとしたら、広告によって注意をそらされることはないでしょう。これは、ユーザが広告を避けるということだけではありません。ナビゲーションやボタンなど広告のように見えてしまうエレメントに注意してください。
WebUser_10.png

このWebサイトの左のサイドバーにあるバナーは、広告ではありません。これはサイト内のコンテンツへのリンクです。これらは広告バナーのように見えてしまい、若干のユーザには広告と認識されてしまうかもしれません。

コンテンツのように見える広告は人々が見て、そしてクリックするでしょう。そして多くの広告収入を生み出すかもしれません。しかし、コンテンツだと思ってクリックしたユーザの信頼を犠牲にしています。「短期の広告収入」と「長期の信頼」のどちらが大事か、よく考えてください。
スポンサーサイト

コメント


この記事に対するコメントの投稿
















この記事に対するトラックバック

トラックバックURL
http://nakano66.blog66.fc2.com/tb.php/150-270997eb
この記事にトラックバックする(FC2ブログユーザー)
Profile

Diskenth

Author:Diskenth

はじめまして。Diskenthです。
30代のしがないリーマンですw
詳しくは ... 自己紹介 »

Archives
Categorise
Comments

Trackbacks
Links

MyBlog Links

Friend Links

Favorite Links

AffiFrend Links

Software | Material Links

Tips | Customize Links

Affiliate Links

Access Up Links

このブログをリンクに追加する

Ad Rakuten

Ad Micro

マイクロアドBTパートナーでおこづかいゲット!

Ad Sense

Ad Trend Match

Ad Adgger

アフィリエイト

ウェルカムボード

大阪 出張マッサージ 鍼灸 神戸 心理カウンセラー 福岡 Gree 広告 DM 制作 ダイレクトメール 代行 ダイレクトメール 発送代行 ショッピング枠現金化 リサイクルショップ 大阪

AccessUp Parts

キーワードアドバイス
ツールプラス

PING送信プラスSEO対策

RSS | Parts

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。