ヒューマンインタフェース｜平成23年度 特別 ITパスポート試験 問97
〔中問C・Web ページの作成〕〔テクノロジ〕D さんは，E さんから受けたアドバイスの内容を考慮して，図1の懸賞ページ案のデザインを改善することにした。改善内容として，適切なものはどれか。
〔中問C の記述（抜粋・再掲）〕スーパマーケット N 町店の広報スタッフである D さんは，本社の Web サイト担当の E さんと協力して N 町店紹介のページを作成している。このたび，N 町店紹介のページのアクセス数増加を目的として，Web サイトで懸賞付きアンケートを実施することになった。D さんは，図1のような懸賞ページ案を作成し，E さんに相談した。
〔図1 懸賞ページ案〕当課が画面の並びを字で書き起こしたもの
```
懸賞ページタイトル
賞品 A賞〔写真1〕 B賞〔写真2〕 C賞〔写真3〕
希望賞品を一つ選んでください ［ ］
〔アンケートでの個人情報の取得目的，用途，管理などに関する記述〕
アンケート
〔アンケートの内容の一部〕
N町店のWebページを見たご感想 ［ ］
お名前 ［ ］ 性別 ［ ］
連絡先メールアドレス ［ ］
（応募する） （キャンセル）
注記 ［ ］は入力領域，（ ）はボタン，〔 〕は表示する部品や
表示内容が省略されている箇所の説明を示す。
```
〔デザインに関する主なアドバイス〕
1. マウスでの入力など，操作性の良い入力方法を採用する。
2. 回答などの操作がしやすい順序に，入力領域やボタンを配置する。
3. 入力の誤りを防ぐため，データ形式に応じた入力フォームを利用する。
- “応募する” ボタンは，押し忘れがないよう画面の一番上に配置する。
- “希望賞品” は，マウスのクリックで賞品を選択できるようチェックボックスを用いる。
- ✓ これが正解“性別” は，“男”，“女” の二つの選択肢から選べるようラジオボタンを用いる。
- 画面の右上の項目から順に回答することを想定して，アンケート項目を配置する。
解説
二つの中から一つだけ選ばせる欄には、丸い選び札を使います。
GUI の入力の部品は、選ばせ方で使い分けます。一つだけ選ばせたい欄には、丸い選び札を並べました。押すと他の選びが外れるので、必ず一つに決まります。男と女の二つから選ぶ欄は、まさにその形でした。だから丸い選び札を使うと述べた肢が当たります。押すだけで済むので、打ち間違いも起きません。いくつでも選ばせる欄には、四角い印を並べます。賞品は一つに絞る欄なので、向いていません。だから四角い印を挙げた肢は、選ばせ方が合いません。送る釦を画面のいちばん上に置く手も、筋が通りません。書き終えてから押すので、下に置くのが自然でした。右上から順に答えると想定して並べる手も、読み方に反します。多くの人は、左上から下へ読み進めていきました。シラバスも、画面の代表的な形を学ぶよう求めています。
ほかの選択肢はなぜ違うのか
- 送る釦を画面の上に置く肢のほうです。押し忘れを防ぎたい、という言い分でした。ところが押すのは、書き終えた後になります。上に置けば、書く前に押してしまいました。順に沿っていません。下に置くのが自然です。置く場所が逆です。
- 賞品の欄に四角い印を使う肢が、こちらです。押して選べる点は、確かに合っていました。けれども四角い印は、いくつでも選べます。賞品は一つだけ選ぶ欄でした。選ばせ方が合いません。部品を取り違えています。部品が合いません。
- 右上から順に並べる肢が、こちらに当たります。答える順を想定した並べ方ではありました。ところが多くの人は、左上から読み始めます。右上から始まる並びは、目の動きに反しました。迷いを生むことになります。読み方に沿っていません。
この問題に関係する言葉
- GUI
出典：平成23年度 特別 ITパスポート試験 問97（改変：原典の図表をテキストに書き起こした）
同じ単元をまとめて解くならヒューマンインタフェースへ。
この解説に誤りを見つけたら教えてください。直して、直した記録を残します。誤りを報告する（メールが開きます）