ウェブデザイン技能検定2級 H30年度 第1回学科試験問題
正しいものは1、間違っているものは2を選択する問題です。
▶解答をクリックすると解答/解説が表示されます。
シングルページアプリケーション(SPA)は、1 つのページの中で内容を更新するため、画面が遷移しても URL が変わることは決してない。
解答
2.間違い
URLは、ページ内のユーザインターフェースの遷移でも逐次変化し、ブラウザの履歴で前の画面に遡さかのぼることが可能です。
解答
1.正しい
サイバーセキュリティ基本法では、国や事業者に対するのと同様に、国民にもサイバーセキュリティの確保に努 めることを責務として定めている。
解答
2.間違い
第九条を以下に引用します。
国民は、基本理念にのっとり、サイバーセキュリティの重要性に関する関心と理解を深め、サイバーセキュリティの確保に必要な注意を払うよう努めるものとする。
PHP において、print は関数である。
解答
2.間違い
print は、関数ではなく言語構造の範疇になります。
HTML5.2 では、dl 要素の内部において div 要素を使用し、dt 要素と dd 要素をグループ化することができる。
解答
1.正しい
CSS では 16 進数のカラーコードを 3 桁に省略することが可能だが、「#24c」と省略されたカラーコードは 6 桁の 場合は「#2244cc」となる。
解答
1.正しい
WCAG2.0 では、ロゴの一部となっているテキストについては、4.5:1 のコントラスト比がなくてもよいとされてい る。
解答
1.正しい
HTML5.2 の仕様書には、meta 要素による次のような指定はするべきではないと明記されている。
<meta name="viewport" content="user-scalable=no">
解答
1.正しい
んー、どこに書いてあるかよく分かりませんでした…。モバイル端末にズーム無しは駄目ってことなんですかね?
イーサネットとは、1000BASE-T の規格のみを指す。
解答
2.間違い
10BASE-Tに始まり100BASE-TXが普及し、今日では1000BASE-Tが普及しつつある。また、新たな規格として10GBASE-T規格が決定された。さらなる高速規格として40GbEや100GbEが調整段階にある。
ウェブサイトでの目的を達成するために、途中の過程を測る中間指標となるものを「KGI」という。
HTML5 において、外部 JavaScript ファイルを読み込むときは、<script href="sample.js"></script>のよう に記述する。
解答
2.間違い
<script src="sample.js"></script> ですね。
HTML5 では条件を満たせば img 要素の alt 属性を省略することができる。
CSS の font-family プロパティで複数の候補がカンマ区切りで指定されている場合、一番最後に書かれている フォントファミリから優先される。
解答
2.間違い
最初に書かれている方から優先されます。
document.querySelectorAll() で取得できるものは配列である。
解答
2.間違い
Node Listを取得します。配列ではなくノードのコレクションと思っておけば良いかと。
HTML5.2 における figcaption 要素は、figure 要素の要素内容の先頭か末尾にしか配置できない。
解答
2.間違い
<figure>~</figure>の中であれば問題ありません。
ここからは4択の問題となります。
文字の間隔を指定する CSS プロパティはどれか。以下より 1 つ選択しなさい。
1. text-indent
2. white-space
3. letter-spacing
4. word-spacing
解答
3
1はテキスト1行目の インデントの指定をします。2はテキストの 半角スペース・タブ・改行の扱い方 を指定します。4は単語と単語の間隔を指定します。
HTML5.2 において body 要素内に配置できない要素はどれか。以下より 1 つ選択しなさい。
1. link 要素
2. title 要素
3. style 要素
4. script 要素
解答
2
他にbase要素があります。
CSS で文法的に正しい指定はどれか。以下より 1 つ選択しなさい。
1. p { color: inherit; }
2. p { border: "none"; }
3. p { border-width: 3; }
4. p { background: "red"; }
解答
1
2はダブルクォートが不要。3は単位が必要。4はダブルクォートが不要です。
ワイヤーフレームに関する説明として、最も適切なものを以下より 1 つ選択しなさい。
1. 詳細なサイトマップに存在するすべてのページに対して作成する。
2. 視覚的要素も可能な限り盛り込んでビジュアルデザインに踏み込んだ検討を行う。
3. スクリーンサイズによって出す情報量は変化が無いので1つのサイズだけ検討すれば良い。
4. ナビゲーション、情報のグループ化、順序、優先度の検討に利用する。
JavaScript で 425×1.08 を計算する場合、最も正確な値となるものはどれか。以下より 1 つ選択しなさい。
1. 425 * 108 / 100;
2. 425 x 108 / 100;
3. 425 * 1.08;
4. 425 x 1.08;
解答
1
小数のまま計算すると誤差が出るため、整数化してから除算した方が正確な値になります。
ウェブサーバへのセキュリティ対策として、不適切なものを以下より 1 つ選択しなさい。
1. ウェブ公開用のディレクトリに配置されているファイルは、一般的には外部から閲覧が可能となるため、 公開する必要のないファイルは、公開用ディレクトリに配置しないようにする。
2. ウェブサイトの運営に必要のないサービスがウェブサーバ上で稼動している場合、そのサービスに対 しては管理が不十分になりやすく、ぜい弱性が残されたままの状態で稼動している可能性があるた め、必要のないサービスは削除する。
3. ウェブサーバをリモート操作する際の認証方法として、パスワード認証と暗号技術による公開鍵認証 などを併用している場合、サーバに負荷がかかり可用性が低下するため、パスワード認証以外の認 証は行わないようにする。
4. OS やアプリケーションにぜい弱性があった場合、そのぜい弱性をついて不正アクセスされる場合が あるため、OS やアプリケーションのベンダーなどから提供されるぜい弱性情報を随時入手して、OS やアプリケーションを最新の状態に保つようにする。
解答
3
セキュリティ対策としては失格ですね。
「upper camel case」を採用した HTML や CSS のコーディング規約を作る場合、そのルールに合致している文 字列はどれか。最も適切なものを以下より 1 つ選択しなさい。
1. mainmenu
2. subTopic
3. anser_list
4. PreEntry
解答
4
camel caseとは単語の頭文字を大文字にする表記ですが、upper camel caseは先頭文字も大文字にする表記方法です。
「個人情報の保護に関する法律(個人情報保護法)」において、「個人情報取扱事業者は、個人情報を取得した 場合は、あらかじめその利用目的を公表している場合を除き、速やかに、その利用目的を、本人に通知し、または 公表しなければならない」と規定されている。ここでの「公表」の事例として、該当しないものを以下より 1 つ選択しな さい。
解答
3
会員向けに限定されているので公表とは言えません。
SVG とは何の略称か。正しいものを以下より 1 つ選択しなさい。
マウスオーバーにより画像表示を切り替えたい。次のコードの A の部分に当てはまるものはどれか。最も適切なものを以下より 1 つ選択しなさい。
<img src="top.png" alt="トップページへ" onmouseover=" A ">
解答
4
ダブルクォートの中なのでシングルクォートを用います。
次に示したのは、ウェブコンテンツ JIS(JISX8341-3)の達成基準 2.4.1 である。 A にあてはまる語句として、最も適切なものはどれか。以下より 1 つ選択しなさい。
2.4.1 ブロック A の達成基準
複数のウェブページ上で繰り返されているコンテンツのブロックを A するメカニズムが利用できる (レベル A)。
1. 検索
2. 拡大
3. スキップ
4. レスポンシブ化
解答
3
安全色彩の説明として、最も適切なものはどれか。以下より 1 つ選択しなさい。
1. 長時間作業して目に優しい色
2. 色相差により誤認識が起きない色
3. JIS により定められた安全を確保するための色
4. JIS により定められた画面表示と印刷した色が完全に一致する色
解答
3
WAI-ARIA の WAI とは、何の略称か。適切なものを以下より 1 つ選択しなさい。
1. Web Accessibility Initiative
2. W3C Accessibility Information
3. Way of Accessibility Improvement
4. Working-group of Accessibility Information
解答
1
UNIX サーバでファイルのパーミッションを 3 桁の数字で設定する場合、十の位に該当するユーザはどれか。以 下より 1 つ選択しなさい。
1. 匿名ユーザ
2. グループ
3. 所有者 (オーナー)
4. 一般ユーザ
解答
2
百の位が所有者、十の位がグループ、一の位が一般ユーザとなります。
body 要素の中に記述した要素を操作したいので、その処理は関数 init( )に定め、次の JavaScript コードによ り、イベントリスナーとして呼び出すことにした。このとき、 A に与えるべきイベントとして、最も適切なものはど れか。以下より 1 つ選択しなさい。
document.addEventListener(' A ', init);
1. loaded
2. complete
3. DOMContentLoaded
4. onload
解答
3
load でも可です。
HTML ドキュメントの body 要素には、①のように id="items"が指定された ul 要素があり、その中に li 要素 3 つを含めた。このとき、②の JavaScript コードで li 要素のテキストを取り出し、配列にして変数(定数)items に納 めたい。その際、 A から C のいずれにも使われない項目はどれか。以下より 1 つ選択しなさい。
①
<ul id="items">
<li>項目 1</li>
<li>項目 2</li> <li>項目 3</li>
</ul>
②
const items = Array.from(
document. A ('#items li')
). B ((item) C
item.textContent
);
1. querySelectorAll
2. filter
3. map
4. =>
解答
2
querySelectorAll()でidがitemsのli要素を全て取得し、配列にするため map() を使い item.textContent をitemに格納するため=>を使います。filterは条件に一致にした要素のみを格納するため条件がない今回は使いません。
HTML5.2 において、img要素に指定可能な次の属性のうち、アクセシビリティに関係しているものはどれか。以 下より 1 つ選択しなさい。
1. sizes 属性
2. srcset 属性
3. longdesc 属性
4. crossorigin 属性
背景色と文字色のカラーコードの組み合わせのうち、コントラスト比が一番大きい組み合わせはどれか。最も適 切なものを以下より 1 つ選択しなさい。
1. 背景色 #505050 : 文字色 #111111
2. 背景色 #e6e6e6 : 文字色 #111111
3. 背景色 #c2c2c2 : 文字色 #111111
4. 背景色 #2f2f2f : 文字色 #111111
解答
2
1は 2.3:1 、2は 15.1:1 、3は 10.6:1 4は、1.4:1 となります。計算方法は以下に引用します。以下の公式を用いて、各文字(すべて同一ではない限り)の相対輝度を測る:
色の相対輝度 L = 0.2126 * R + 0.7152 * G + 0.0722 * B と定義されている。この場合のR, G 及び B は:
RsRGB <= 0.03928 の場合:R = RsRGB/12.92、それ以外の場合: R = ((RsRGB+0.055)/1.055) ^ 2.4
GsRGB <= 0.03928 の場合:G = GsRGB/12.92、それ以外の場合:G = ((GsRGB+0.055)/1.055) ^ 2.4
BsRGB <= 0.03928 の場合:B = BsRGB/12.92、それ以外の場合:B = ((BsRGB+0.055)/1.055) ^ 2.4
注記: また、RsRGB, GsRGB, 及び BsRGBは以下のように定義される:
RsRGB = R8bit/255
GsRGB = G8bit/255
BsRGB = B8bit/255
注記: "^"記号は指数演算子である。
注記: エイリアス文字では文字の端から2ピクセルの部分の相対輝度の値を使用する。
同じ公式を用いて、文字のすぐ隣の背景のピクセルの相対輝度を測る。
次の公式を用いて、コントラスト比を算出する。
(L1 + 0.05) / (L2 + 0.05)
L1は前景または背景色の明るい方の相対輝度である。及び、
L2は前景または背景色の暗い方の相対輝度である。
PHP で次のようなコードがある場合、255 という値を出力するコードはどれか。以下より 1 つ選択しなさい。
$color = array('red' => 255, 'green' => 0, 'blue' => 128);
1. print $color.red;
2. print $color['red'];
3. print $color->red;
4. print $color;
aside 要素に関する説明のうち、最も適切なものはどれか。以下より 1 つ選択しなさい。
1. 視覚的にメインコンテンツの横に配置するための要素である。
2. メインコンテンツ内に配置することはできない要素である。
3. 広告などのマークアップに適している要素である。
4. ブログサイトなどで記事を表示するのに適している要素である。
解答
3
前後の要素の内容とある程度の関連はあるものの、その部分だけを切り離せると考えられる補足的な情報を表すために使用されます。
iframe 要素が使用できない HTML のバージョンはどれか。以下より 1 つ選択しなさい。
解答
4
HTML5.2 において使用可能な要素はどれか。以下より 1 つ選択しなさい。
1. image 要素
2. picture 要素
3. photo 要素
4. graphic 要素
解答
2
1は廃止。3と4はありません。
入力など、何らかのアクションをユーザに求める場合の制限時間の説明として、適切なものを以下より1つ選択し なさい。
1. 中断復帰(制限時間後も同じ状態から再開できる)機能を提供するのが望ましい。
2. 制限時間はユーザに求めるアクションの種類や量によらず、システムの都合で設定してよい。
3. 制限時間はどんな場合でも設定してはいけない。
4. 制限時間がある場合でも、そのことを事前に教える必要はない。
解答
1
次の CSS セレクタのうち、適用対象が他の 3 つとは異なるものはどれか。以下より 1 つ選択しなさい。
1. p:nth-child(1n+0)
2. p:nth-child(n)
3. p:nth-child(0)
4. p
解答
3
3はp要素の最初だけ。他はp要素全てを指定します。