トップ   編集 凍結解除 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS   ログイン

Webサイト制作関連/ユーザビリティ

Last-modified: 2019-05-15 (水) 20:34:19 (69d)
Top / Webサイト制作関連 / ユーザビリティ

ユーザビリティで気をつける10の項目

システム状態の可視化

何かボタンを押して裏でシステムが動いている様な場合に、ユーザーが今何が起こっているかを適宜把握できる様、その状態・結果を通知する。
「只今××しています」~「処理が完了しました」とか

現実環境の慣習に合わせる

システム担当者しか使わない様な言葉はなるべく使用せず、一般的に判りやすい単語を使う
「データ登録」 → 「××の申し込み」とか
また、画面自体の配置等も上から下へ、左から右へ(右から読む国もあるかもしれませんが。。)自然に遷移できる様心がける。

ユーザが画面を制御できる様にする

ユーザが入力ミスをして前のページに戻ったり、入力した項目を再入力したりできる様にしておく。
やり直しの効かない画面遷移は必ず事前に確認させるフェーズを設ける。
行き止まりにならない様に気をつける。

一貫性と標準化

画面の操作や単語の意味等に一貫性を持たせる。
また、業界標準となっている様な規格に準拠する。

エラーの事前抑止

ユーザが間違えそうな入力欄等は(可能なものは)選択式にしたり、入力値に制限がある場合等は必ずよく見える所に注意書きを用意する。

思い出さなくても良い様にする

複数の画面にまたがって何かを入力させる場合等に、前の画面に戻らないといけない様なケースは避ける。
前の画面で入力した内容が必要な時は、操作中の画面で確認できる様配慮する。
データの入力チェックでエラーになった場合等でもどこが何故エラーになったのかわかり易く表示させる。
(間違った箇所を赤字に変えて、どこの入力が間違っていたかをわかり易く説明する。等)

柔軟性と効率性

基本的には初心者を想定してわかりやすいUIにし、上級者が”物足りない”と思わない様、詳細に設定できる画面ももたせる。

シンプルで美しいデザイン

画面内には必要な情報のみを配置し、不要な情報で重要な情報が見辛くならない様にする。
また関連する情報はひとまとめにしたり、ページデザインの統一感をもたせたりする等、美しく配置する。

エラー発生へのケア

エラーが発生した場合は、それが何故起こったのか、どうすればよいかを説明したり、同画面で説明しきれない場合はヘルプページのどこを読めば良いか等をユーザに伝える。
「エラーが発生しました」「エラー番号XXXX」のみ なんてのはNG

ヘルプとドキュメント

ヘルプやマニュアルがなくても判り易いのが一番だか、
判りにくい操作には、ヘルプやドキュメントを用意して適宜説明する。

参考

  • Ten Usability Heuristics
  • このページはユーザビリティの権威(らしい)ニールセン氏の上記記事を和訳したものを読んで、自分なりに気をつけたいなと思う事をまとめました。