私が今まで見たユーザビリティ系の記事の中には、追求したら悟りが開けそうな、限りなく奥深いものもありましたが、適度に深く、満遍なくカバーしているユーザビリティ・ガイドライン(原文)を見つけ、以降これを参考にしています。少し前に翻訳しましたので、今日はそれをご紹介いたします。
一般ユーザー向けのWebサービスでは、全部のチェック項目が該当するわけではありません。個人的には、各項目のスコアより、「スコアの説明」という欄を重視しています。現状では何が問題であり、どう解決するべきなのか、そういった思考のプロセスが、「ユーザーのことを思うこと」だと思うのです。
いま、ウノウではフォト蔵のデザイン見直しを行っております。私たちのデザインを省み、ユーザーのことを思うプロセスを、大事にしたいと思います。
(この下に原文を翻訳した表が見えない場合は、「続きを読む」からご覧ください。)
| ナビゲーション | スコア | スコアの説明 |
|---|---|---|
| サイト内のどこにいるのかが一目でわかる | ||
| メインページへのリンクが一目でわかる | ||
| サイト内の重要なセクションにメインページから直行できる | ||
| 大規模サイトにおいてのサイトマップ完備 | ||
| (必要に応じて)使いやすいサーチ機能完備 | ||
| 機能性 | スコア | スコアの説明 |
| 初心者ユーザーもエキスパートユーザーも同等に対応 | ||
| 機能が明確にラベル付けされている | ||
| サイトを出ることなく基本的な機能を使用できる | ||
| サイトに価値を付加する場合のみプラグインを使用 | ||
| ユーザーコントロール | スコア | スコアの説明 |
| ユーザーのワークフローを反映している | ||
| ユーザーはどのような操作でも途中でキャンセルできる | ||
| 全てのページに明確な出口がある | ||
| 低速コネクションに対応すべく、各ページのサイズは50K以下である | ||
| 全ての適切なブラウザに対応 | ||
| 言語とコンテンツ | スコア | スコアの説明 |
| 最重要の情報やタスクが最も目立つ | ||
| 関連性の低い、あるいは重要性の低い情報は含まれていない | ||
| 関連した情報がグループ化されている - 同ページや同メニューにて - 同ページ内の同セクションにおいて |
||
| 専門用語を極力回避した、シンプルな言語を使用している | ||
| 段落は簡潔である | ||
| リンクは簡潔で、直感的に想像しやすく、テキストの中に埋まれることなく視覚的に明確である | ||
| 用語が定義されている | ||
| オンラインヘルプ と ユーザーガイド | スコア | スコアの説明 |
| ヘルプやインストラクションの必要性は最小限 | ||
| ヘルプやインストラクションが必要な場合は、容易に参照可能 | ||
| システム/ユーザー・フィードバック | スコア | スコアの説明 |
| 何が起こっているかが常に明確(視覚的なヒントがある) | ||
| ユーザーは必要に応じて、メールでフィードバックを与えられる | ||
| ユーザーはメールやフォームを使用して、サイトのフィードバックを送信できる | ||
| フォームの送信の際には、確認画面が用意されている | ||
| システムのフィードバックは瞬時に返される | ||
| 特定のプラグインやブラウザバージョンが要求される場合には、ユーザーは通知を受ける | ||
| 最後にアップデートされた日時を、各ページに明記されている | ||
| ウェブ・アクセシビリティ W3C ツール、チェックリスト、ガイドライン |
スコア | スコアの説明 |
| ウェブ標準を準処: HTML 4.0, Cascading Style Sheets (CSS1) レイアウトやスタイルにCSSが使用されている |
||
| イメージとアニメーション: ALT属性がイメージ、アニメーションその他のオブジェクトに使用されている |
||
| イメージマップ イメージマップのホットスポットにはクライアントサイトのマップとテキスト表示を完備 |
||
| マルチメディア オーディオにはキャプションや歌詞等、ビデオには描写表現が用意されている |
||
| PDFは、ウェブ用のフォーマットを用意する | ||
| リンクのラベルは文脈の中において意味のあるものである | ||
| ページの体系 ヘッドタイトル、リスト、そして一貫した構成によって体系付けられている |
||
| グラフとチャート グラフとチャートには要約やLONGDESC属性が用いられている |
||
| スクリプト、アプレット&プラグイン スクリプト、アプレット、プラグインには、代替コンテンツが用意されている |
||
| フレーム NOFRAMEオプションと、意味の通じるタイトルが用意されている |
||
| テーブル テーブルの要約が用意されており、テーブル構造の一行一行が理にかなったものである |
||
| バリデーション(有効性) Site has been validated using the W3Cの HTML Validation ServiceやBobby Accessibility Checkerを利用し有効性が保障されている |
||
| 様々なプラットフォーム (UNIX, Windows, Mac)、様々なブラウザ(Netscape 3, 4, 6, 7; IE 5, 6; lynx)でテストされている | ||
| 一貫性 | スコア | スコアの説明 |
| 一つのアイテムを表現するのに、一貫した語彙や文章が使用されている | ||
| リンクがリンク先のページタイトルを反映している | ||
| ブラウザのページタイトルは、意味あるもので、そのページの最重要セクションのヘッダーを反映している | ||
| エラーの回避と修正 | スコア | スコアの説明 |
| サイトの使用が記憶に頼らずとも、認識に頼って達成できる | ||
| 様々なユーザーの行動に対応している | ||
| ユーザーのアクション(例えばフォームの記入例等)について、簡潔な説明が用意されている | ||
| エラーメッセージが視覚的に明確である | ||
| エラーメッセージが解りやすい文章である | ||
| エラーメッセージは、問題の解決に役立つものである | ||
| エラーメッセージには明確な出口が用意されている | ||
| エラーメッセージにはアシスタンスのためのコンタクトが用意されている | ||
| 構築的・視覚的明確さ | スコア | スコアの説明 |
| ユーザーの視点に立ったサイトの体系付けである | ||
| 体系付けや、意味づけのために、飛ばし読みしやすいデザインである | ||
| サイトデザインやレイアウトは直感的にわかりやすく簡潔である | ||
| サイトデザインやレイアウトは、ユーザーの生産性を高める場合においてのみ豊富である | ||
| 十分な余白があり、ページがきつすぎない | ||
| 不必要なアニメーションは回避されている | ||
| リンク(訪問済み、未訪問)は明確でわかりやすい | ||
| 太字や斜体は選択的に用いられている |