一覧に戻る

インタフェース設計

技術要素 › 情報デザイン · 17 問

1. 出典: 平成21年度 春期 ITパスポート試験 問67

営業伝票を入力する画面の設計に際し,リストボックスを使った選択画面において,作業効率を高めるために,画面が表示された時点で,ある値がすでに選択された状態になるように設定することにした。 取引先の所在地(関東地方の七つの都道府県の名称)を選択するリストボックスの場合,選択された状態で設定される都道府県として,適切なものはどれか。ここで,入力作業に関する事項は,次のとおりである。 〔入力作業に関する事項〕 (1) 営業担当者ごとの取引先の所在地は,一つ又は隣接する二つの都道府県にある。 (2) 営業担当者は,伝票を取引先ごとに分類して,入力作業担当者に渡す。 (3) 入力作業は,営業担当者ごとの伝票をまとめて行う。 (4) まとめて入力する伝票の数は,都道府県ごとに複数枚ある。 (5) 1画面の入力操作で,1枚の伝票が入力できる。

  • 営業成績の良い担当者の取引先がある都道府県
  • 会社数が最も多い東京都
  • 五十音順で先頭となる茨城県
  • 前画面で入力した都道府県

リストボックス · ユーザビリティ

2. 出典: 平成23年度 特別試験 ITパスポート試験 問97

D さんは,図 1 のような懸賞ページ案を作成し,本社の Web サイト担当の E さんに相談した。 〔図 1 懸賞ページ案の主な内容〕 ・〈懸賞ページタイトル〉 ・賞品:A 賞 〈写真 1〉,B 賞 〈写真 2〉,C 賞 〈写真 3〉 ・希望賞品を一つ選んでください [ ] ・〈アンケートでの個人情報の取得目的,用途,管理などに関する記述〉 ・アンケート 〈アンケートの内容の一部〉  ・N 町店の Web ページを見たご感想 [ ]  ・お名前 [ ]  ・性別 [ ]  ・連絡先メールアドレス [ ] ・注記:[ ] は入力領域,( )はボタン,〈 〉は表示する部品や表示内容が省略されている箇所の説明を示す。 D さんは,懸賞ページ案を確認した E さんから,次のようなアドバイスを受けた。 〔デザインに関する主なアドバイス〕 (1) マウスでの入力など,操作性の良い入力方法を採用する。 (2) 回答などの操作がしやすい順序に,入力領域やボタンを配置する。 (3) 入力の誤りを防ぐため,データ形式に応じた入力フォームを利用する。 D さんは,E さんから受けたアドバイスの内容を考慮して,図 1 の懸賞ページ案のデザインを改善することにした。改善内容として,適切なものはどれか。

  • “応募する”ボタンは,押し忘れがないよう画面の一番上に配置する。
  • “希望賞品”は,マウスのクリックで賞品を選択できるようチェックボックスを用いる。
  • “性別”は,“男”,“女”の二つの選択肢から選べるようラジオボタンを用いる。
  • 画面の右上の項目から順に回答することを想定して,アンケート項目を配置する。

ラジオボタン · チェックボックス

3. 出典: 平成23年度 特別試験 ITパスポート試験 問99

完成した懸賞ページを本社の Web サイトで公開するために,サイト内でのリンクを設定したい。公開に当たっては懸賞付きアンケートの実施をトップページで告知して,トップページから懸賞ページへのスムーズな誘導と,N 町店紹介のページのアクセス数の増加を図りたい。最も適切なサイトのページ構成を示した図はどれか。  なお,図中の □ はサイトの1画面(ページ)を,→ はページのリンク経路を示す。

図
  • 縦一列の直列構成: トップページ → 店舗一覧のページ → N町店紹介のページ → 懸賞ページ(太枠)。各ページ間は下向き矢印1本ずつの単一リンク経路で分岐なし。
  • トップページ → 店舗一覧のページ → N町店紹介のページ の縦3段に加え、トップページ → 懸賞ページ(太枠)。懸賞ページへはトップページから直接リンクのみ。
  • トップページ → 店舗一覧のページ。トップページからと店舗一覧のページからの2本が N町店紹介のページ に合流し、N町店紹介のページ → 懸賞ページ(太枠)。
  • トップページ → 店舗一覧のページ → N町店紹介のページ の縦並びに加え、店舗一覧のページ → 懸賞ページ(太枠) と N町店紹介のページ → 懸賞ページ の2本が懸賞ページへ流入。

ユーザビリティ · 人間中心設計 · リダイレクト

4. 出典: 平成24年度 秋期 ITパスポート試験 問74

オンラインヘルプに関する記述として, 適切なものはどれか。

  • 1台の PC だけでは処理に長時間掛かるような大量の仕事を, ネットワークにに接続された多数の PC に分散して並列に処理させることによって, 高速な処理を実現すること
  • PC 本体, 周辺機器にトラブルが発生したとき, 利用者が対応方法などを問い合わせるサポート窓口のこと
  • アプリケーションソフトの操作が複雑であっても, 質問に答えていく対話形式によって簡単に操作が行えるようにする機能のこと
  • ハードウェア, ソフトウェアの操作についての説明などを, 印刷物としてではなく, PC の画面で検索, ハイパリンクなどを利用して閲覧できる機能やサービスのこと

ヘルプ機能

5. 出典: 平成24年度 春期 ITパスポート試験 問53

Webページの見栄えをデザインするためのものはどれか。

  • cookie
  • CSS
  • CUI
  • SSL

CSS

6. 出典: 平成25年度 秋期 ITパスポート試験 問80

Web ページの作成・編集において, Web サイト全体の色調やデザインに統一性をもたせたい場合, HTML と組み合わせて利用すると効果的なものはどれか。

  • CSS (Cascading Style Sheets)
  • SNS (Social Networking Service)
  • SQL (Structured Query Language)
  • XML (Extensible Markup Language)

CSS

7. 出典: 平成25年度 春期 ITパスポート試験 問65

PC の操作画面で使用されているプルダウンメニューに関する記述として, 適切なものはどれか。

  • エラーメッセージを表示したり, 少量のデータを入力するために用いる。
  • 画面に表示されている複数の選択項目から, 必要なものを全て選ぶ。
  • キーボード入力の際, 過去の入力履歴を基に次の入力内容を予想し表示する。
  • タイトル部分をクリックすることで選択項目の一覧が表示され, その中から一つ選ぶ。

プルダウンメニュー

8. 出典: 平成26年度 秋期 ITパスポート試験 問93

図2のテストの採点結果入力のワークシートに、組別の得点分布表を作成するために、セルB40に計算式を入力してセルB40〜G50に複写する。セルB40に入れる適切な式はどれか。 〔ワークシートの説明〕 (1) セルA40〜A50には、得点を示す数値として、それぞれ0〜10を入力する。 (2) セルB40〜B50には、P組の0〜10点の人数を、それぞれ表示する式を入力する。 (3) 同様にセルC40〜C50にはQ組、セルD40〜D50にはR組、セルE40〜E50にはS組、セルF40〜F50にはT組、セルG40〜G50にはU組の得点別人数を表示する式を入力する。 | | A | B | C | D | E | F | G | |---|---|---|---|---|---|---|---| | 1 | | P組 | Q組 | R組 | S組 | T組 | U組 | | ⋮ | | | | | | | | | 40 | 0 | | | | | | | | 41 | 1 | | | | | | | | 42 | 2 | | | | | | | | ⋮ | ⋮ | | | | | | | | 50 | 10 | | | | | | | 注記 網掛けの部分は、表示していない。 図2 テストの採点結果入力のワークシート

図
  • 条件付個数(B$2〜B$36,=A$40)
  • 条件付個数(B$2〜B$36,=$A40)
  • 条件付個数($B2〜$B36,=A$40)
  • 条件付個数($B2〜$B36,=$A40)

チェックボックス · ラジオボタン

9. 出典: 平成26年度 春期 ITパスポート試験 問32

次の記述 a〜d のうち, システム利用者にとって使いやすい画面を設計するために考慮するものだけを全て挙げたものはどれか。 a 障害が発生したときの修復時間 b 操作方法の覚えやすさ c プッシュボタンの配置 d 文字のサイズや色

  • a, b, c
  • a, b, d
  • a, c, d
  • b, c, d

ユーザビリティ · 人間中心設計

10. 出典: 平成26年度 春期 ITパスポート試験 問93

入力項目“種別”の入力に使用する GUI (Graphical User Interface) 部品として, 適切なものはどれか。

  • スクロールバー
  • チェックボックス
  • テキストボックス
  • ラジオボタン

ラジオボタン · チェックボックス

11. 出典: 平成26年度 春期 ITパスポート試験 問94

申請画面での入力間違いを防ぐために, 複数の入力項目間でシステムが行うことのできるエラーチェックはどれか。

  • 決裁金額の入力が必要な種別の場合, 決裁金額の入力がされているかどうか。
  • 件名に対して, 決裁金額が妥当かどうか。
  • 東議内容が, 件名に対して適切な記述になっているかどうか。
  • 東議内容に対して, 必要な添付資料があるかどうか。[テクノロジ〕

GUI · ユーザビリティ

12. 出典: 平成29年度 秋期 ITパスポート試験 問58

キーボード入力を補助する機能の一つであり, 入力中の文字から過去の入力履歴を参照して, 候補となる文字列の一覧を表示することで, 文字入力の手間を軽減するものはどれか。

  • インデント
  • オートコンプリート
  • オートフィルタ
  • ハイパリンク

GUI · ユーザビリティ

13. 出典: 平成29年度 春期 ITパスポート試験 問59

タッチパネルの複数のポイントに同時に触れて操作する入力方式はどれか。

  • タッチタイプ
  • ダブルクリック
  • マルチタスク
  • マルチタッチ

マルチタッチインタフェース · タッチパネル

14. 出典: 平成31年度 春期 ITパスポート試験 問81

Web サイトを構築する際にスタイルシートを用いる理由として, 適切なものはどれか。

  • Web サーバと Web ブラウザ間で安全にデータをやり取りできるようになる。
  • Web サイトの更新情報を利用者に知らせることができるようになる。
  • Web サイトの利用者を識別できるようになる。
  • 複数の Web ページの見た目を統一することが容易にできるようになる。

CSS

15. 出典: 令和7年度 ITパスポート試験 問79

サムネイルの説明として, 適切なものはどれか。

  • 画像や文書ファイルの内容を縮小して表示したもの
  • 処理の内容や対象が分かる小さな絵や記号のこと
  • ネット上で利用者の分身として動作するキャラクターのこと
  • 複数のファイルを一つのファイルにまとめたもの

サムネイル

16. 出典: 令和8年度 ITパスポート試験 問60

レスポンシブ Web デザインに関する記述として, 適切なものはどれか。

  • PC, スマートフォンなど, 多くの種類の端末で, 見やすく, かつ操作しやすくなるように, 表示する端末の画面サイズなどに応じて Web サイトの画面レイアウトが変化する。
  • Web ブラウザで動画コンテンツをストリーミング再生するとき, サーバやネットワークの負荷が軽減されるように, 複数のコンテンツ配信サーバのうち, 利用者に適したサーバに接続させてデータを取得する。
  • スマートフォンなどの端末向けの Web アプリケーションにおいて, 歩数や移動速度などを計測できるように, 端末に内蔵された加速度センサーやジャイロセンサーのデータを使用する。
  • 操作説明書を読まなくても Web サイトの使用方法を理解できるように, Web ブラウザの利用者がマウスポインタを Web コンテンツに重ねたとき, ポップアップを用いて機能の説明, 対象の状態などを表示する。

レスポンシブWebデザイン · モバイルファースト

17. 出典: 令和8年度 ITパスポート試験 問66

アプリケーションソフトウェアの操作を行うとき,質問に答えていく対話形式によって,複雑な操作を簡単に行えるようにする機能はどれか。

  • アーカイブ
  • ウィザード
  • オートコンプリート
  • ポップアップウィンドウ