ベーシック練習問題 - CG

ベーシック 練習問題1
以下は,スマートフォンにおける画面の分割と配置,ナビゲーションの種類と特徴に関する
問題である.a~d の問いに最も適するものを解答群から選び,記号で答えよ.
図1
図2
a.図1のナビゲーション手法の名称はどれか.
【解答群】
ア.スライド
イ.ドロップダウン
ウ.タブ
エ.ランダムアクセス
b.図2のタブナビゲーションの説明として適切でないものはどれか.
【解答群】
ア.階層化された情報を提示したい場合に適している.
イ.選択肢を一目で把握しやすい.
ウ.1タップで目的の画面に移動することができる.
エ.ナビゲーションの項目数が多いと視認性と操作性が下がってしまう.
c.図3のナビゲーションの名称はどれか.
図3
【解答群】
ア.グローバルナビゲーション
イ.ローカルナビゲーション
ウ.リモートナビゲーション
エ.パンくずリスト
d.パンくずリストのナビゲーションの説明として,正しいものはどれか.
【解答群】
ア.ナビゲーションとしてだけではなく,現在位置を示す役割も果たす.
イ.同一コンテンツ間を自在に移動することができる.
ウ.Web サイトの階層構造とは関係なく,関連性のある別のコンテンツへ直接移動するこ
とができる.
エ.特定のカテゴリ内にだけ配置することが望ましい.
問題テーマ
スマートフォンにおける画面分割とナビゲーション手法
出題のねらい(作問意図)
この問題では,スマートフォンにおける画面の分割と配置,および情報の全体像を提示する効
果的なナビゲーション手法について問うています.
考え方(問題の解法・解説)
a: スマートフォンは画面が小さいため,コンテンツ閲覧中はコンテンツエリアを画面いっぱ
いに表示するようにします.画面上部にメニューボタンを設け,メニューボタンをタップす
ると,ナビゲーションエリアが下方に向かってアニメーションをともなって出現する手法
を,ドロップダウンとよびます.
b: タブナビゲーションは,選択肢があらかじめすべて表示されているため,選択肢を一目で
把握しやすく,1タップで目的の画面に移動することができます.ただし,項目数が多いと
タブが小さくなってしまい視認性や操作性が下がってしまうほか,項目が並列に並ぶため階
層化された項目のナビゲーションには適していません.
c:図3のリンク構造はグローバルナビゲーションになります.基本的にすべての Web ページ上
で同じ位置にレイアウトされるナビゲーションのことを指します.Web サイト全体を自在に
移動するためのメニュー,トップページへのリンクが必要になります.
d: パンくずリストは,上位階層への移動を可能にするだけでなく,現在の位置情報を示す役
割も果たします.
正解答
【解答:a. イ
b. ア
c. ア
d. ア】
ベーシック 練習問題2
以下は,HTML と CSS の記述方法に関する問題である.a~d の問いに最も適するものを解
答群から選び,記号で答えよ.
@charset "utf-8";
body{
color : white;
}
h1{
color : gray;
}
p{
color : green;
}
.recommended{
color : red;
}
図1
図2
a.図1の A の名称として正しいものはどれか.
【解答群】
ア.要素名
イ.ヘッダ
ウ.内容
エ.クラス
b.CSS ファイルを HTML 文書に反映させるためには,HTML 文書内に link タグで指定を行う.
図2の CSS を図1の HTML に反映させるため,図3の記述を行う箇所として正しい箇所はど
こか.
<link rel="stylesheet" type="text/css" href=base.css">
図3
【解答群】
ア.①
イ.②
ウ.③
エ.④
c.図1の HTML に対し,図2の CSS を適用した場合.図1の B のテキストに適用される色はど
れか.
【解答群】
ア.white
イ.gray
ウ.green
エ.red
d. HTML と CSS を異なるファイルで管理した場合の説明として,適切でないものはどれか.
【解答群】
ア.構造と装飾が分離されることで,それぞれの修正が容易になる.
イ.HTML 文書の再利用性が高まる.
ウ.さまざまな表示デバイスへの対応が容易になる.
エ.CSS のセレクタの記述を省略することができる.
問題テーマ
HTML および CSS の記述
出題のねらい(作問意図)
この問題は,HTML および CSS の記述の方法を問うています.
考え方(問題の解法・解説)
a: HTML タグにおける,< >あるいは</ >との間にある文字列を要素名とよんでいます.
b: HTML ファイルに CSS ファイルの内容を反映させるためには,HTML 文書の head 要素内に,
CSS ファイルを読み込むための記述を行います.
c: B のテキストは,body 要素内の p 要素です.そのため,CSS で p 要素に対して指定された
green が反映されます.
d: HTML と CSS を異なるファイルで管理した場合,HTML と CSS を別々に記述することにな
るため,セレクタを記述して装飾の対象となる要素を指定する必要があります.
正解答
【解答:a. ア
b. ウ
c. ウ
d. エ】