【H29第5回】ウェブデザイン技能検定3級過去問

この記事の前提条件

対象: ウェブデザイン技能検定3級を受験する方(平成29年度第5回 学科試験)
難易度: ★★☆
所要時間: 約20分

平成29年度第5回の学科問題を、全25問すべて理由つきで解説します。

目次 非表示

目次へ

1. 2択問題(正しい=1、間違い=2)

第1問: セキュリティ的にHTML文書内の属性値はクォーテーションで囲むことが推奨されている

答え: 1(正しい)。属性値をクォート(引用符)で囲むことで、属性値の誤認識やインジェクション攻撃のリスクを減らせるため、推奨されています。

第2問: head要素はbody要素の前に記述する

答え: 1(正しい)。HTML文書の構造上、head要素はbody要素より前に記述します。

第3問: 疑似クラス:hoverはa要素のみに指定できる

答え: 2(誤り):hoverはa要素に限らず、あらゆる要素に指定できる疑似クラスです。

第4問: 加法混色とは、赤・青・黄色の3色の組み合わせによる色表現の方法である

答え: 2(誤り)。加法混色(光の三原色)は赤・緑・青(RGB)の組み合わせです。赤・青・黄色は色料の三原色に近い伝統的な概念で、加法混色ではありません。

第5問: 画像データであれば、拡張子を.jpegに変更すればJPEG形式のファイル形式となる

答え: 2(誤り)。拡張子を変更しただけでは、ファイルの内部データ構造(実際の形式)は変わりません。実際に変換処理を行わない限り、中身は元の形式のままです。

第6問: HTML5では、ルビを表示させるための要素が定義されている

答え: 1(正しい)ruby要素・rt要素などが定義されています。

第7問: 背景色が白のとき、アクセシビリティを高くするのであれば文字色はできるだけ薄い色を使用した方が良い

答え: 2(誤り)。薄い色は白背景とのコントラスト比が低くなり、逆にアクセシビリティが下がります。濃い色(黒に近い色)を使う方が適切です。

第8問: ドメイン名「example.com」における「.com」のように、ドメイン名をドットで分割した最後の文字列を特にトップレベルドメインという

答え: 1(正しい)。正しい定義です。

第9問: HTML5では、brタグ内にスラッシュを入れて<br />と書くと文法エラーとなる

答え: 2(誤り)。自己終了形式の<br />は、HTML5でも有効な書き方です。

第10問: クロスブラウザチェックの説明

答え: 1(正しい)。複数のブラウザで仕様通りに表示・動作するかを検証する作業、という説明は正しいです。

2. 選択問題

第11問: VDT作業者が心身の負担を少なくするための作業姿勢として、不適切なものはどれか

  • ①ディスプレイ画面から40〜50cm離し、視線が少し画面を見下げるように配置する
  • ②肩の力を抜いて、前傾し過ぎないようにする
  • ③椅子に深く腰をかけて背もたれに背を十分にあて、足裏全体が床に接した姿勢を基本とする
  • ④リラックスできるように足を組んだ体勢を維持する

答え: ④。足を組む姿勢は骨盤の歪みや血行不良を招くため、VDT作業の推奨姿勢としては不適切です。①②③はいずれも正しい推奨姿勢です。

第12問: 日常的に行うべきセキュリティ対策として不適切なものはどれか

  • ①クリアスクリーンポリシーに則り、パソコンやスマートフォンなどは画面をロックしておく
  • ②セキュリティソフトを導入し、パターンファイルを常に最新の状態に更新する
  • ③差出人がアドレス帳登録者や著名な組織・企業であれば不正メールではないと判断し、添付ファイルを開く
  • ④OSやアプリケーションソフトにセキュリティパッチを適用し、最新のバージョンに更新する

答え: ③。差出人名やメールアドレスは容易に偽装(なりすまし)できるため、「登録者や著名な組織だから安全」と判断するのは危険です。①②④はいずれも適切な対策です。

第13問: src.jsというJavaScriptファイルを、HTMLに読み込む際のコードはどれか

  • ①<script type=”text/javascript” src=”src.js”></script>
  • ②<link rel=”stylesheet” href=”src.js”>
  • ③<a href=”src.js”></a>
  • ④<body onload=”src.js”></body>

答え: ①。JavaScriptファイルを読み込むのはscript要素の役割です。②のlink要素はCSSファイルの読み込み用、③のa要素は単なるハイパーリンク、④のonload属性はJavaScriptのコード文字列を直接書く場所であり、ファイルパスの指定には使いません。

第14問: http://example.com/css/style.cssにコードが記述されている場合、main.pngが表示されるパスはどれか

background: url(../img/main.png) というCSSコード
  • ①/img/css/main.png
  • ②/img/main.png
  • ③/css/img/main.png
  • ④/css/main.png

答え: ②。CSS内の相対パスは、そのCSSファイル自身の場所を基準に解決されます。style.css/css/フォルダにあるので、そこから../で1つ上のルート(/)に上がり、img/main.pngと続けると/img/main.pngになります。

第15問: OSI参照モデルにおいて、第3層に該当するものはどれか

  • ①物理層
  • ②データリンク層
  • ③ネットワーク層
  • ④トランスポート層

答え: ③。OSI参照モデルは下から、物理層(第1)・データリンク層(第2)・ネットワーク層(第3)・トランスポート層(第4)と続きます。

第16問: aside要素に関する説明のうち適切なものはどれか

  • ①main要素を含むことはできない
  • ②ナビゲーション要素を含むことはできない
  • ③箇条書きを含むことはできない
  • ④h1要素を含むことはできない

答え: ①main要素は、asideのようなセクショニングコンテンツの子孫として配置できないという制約があります。②のnav要素(ミニナビ等)、③の箇条書き、④のh1要素はいずれもaside内に含めることができます。

第17問: JavaScriptに関する説明のうち適切なものはどれか

  • ①DOMアクセスのためにのみ使用される
  • ②要素内のコンテンツの変更はできない
  • ③一般的にHTMLの先頭に記述することで、すべての要素に確実にアクセスできる
  • ④サーバから動的にデータを取得することができる

答え: ④。Ajaxなどにより、サーバから動的にデータを取得できます。①DOM操作以外にも計算処理やイベント処理など用途は多岐にわたり、②innerHTML等でコンテンツの変更が可能で、③HTMLの先頭(head内)に書くと、まだ読み込まれていない後続の要素にはアクセスできないため、いずれも誤りです。

第18問: 無彩色ではないものはどれか

  • ①黒
  • ②白
  • ③赤
  • ④灰

答え: ③。黒・白・灰はいずれも彩度を持たない「無彩色」です。赤は彩度を持つ「有彩色」にあたります。

第19問: レスポンシブウェブデザインに関する説明として適切なものはどれか

  • ①ユーザのTPOに合わせてレイアウトが自動的に変わるウェブデザイン手法
  • ②ユーザの好みに合わせてデザインが変わるウェブデザイン手法
  • ③ウェブデザイナーの意図通りにデザインを強制的に合わせる手法
  • ④デバイスの環境に応じてレイアウトが自動的に変わるウェブデザイン手法

答え: ④。レスポンシブウェブデザインは、画面サイズなどデバイスの環境に応じて、レイアウトが自動的に最適化される手法です。

第20問: 1つの段落であることを示すために使用する要素として、最も適切なものはどれか

  • ①p要素
  • ②br要素
  • ③div要素
  • ④section要素

答え: ①。段落を表す要素はp要素です。

第21問: HTTPステータスコード「404 Not Found」が表しているものはどれか

  • ①リクエストが成功した
  • ②リソースが見つからなかった
  • ③不正なゲートウェイ
  • ④サービス利用不可

答え: ②。404は、指定されたリソース(ページやファイル)が見つからなかったことを示すコードです。

第22問: CSSのcolorプロパティに指定できない値はどれか

  • ①#ggg
  • ②inherit
  • ③rgb(255, 0, 0)
  • ④rgb(100%, 0%, 0%)

答え: ①。16進数カラーコードで使える文字は0〜9とa〜fのみで、「g」は無効な文字です。②③④はいずれも有効な値です。

第23問: HTML5において、使用できない要素はどれか

  • ①b
  • ②s
  • ③small
  • ④basefont

答え: ④basefont要素はHTML5で廃止されました。①②③(b, s, small)はHTML5でも使用できます。

第24問: img要素のalt属性に指定すべきテキストの内容として最も適切なものはどれか

  • ①簡潔な画像の説明
  • ②視覚的にどのように見える画像であるかの説明
  • ③画像が利用できないときに、画像の代わりとして使えるテキスト
  • ④どのような画像であるのかを検索エンジンに効率よく伝えるテキスト

答え: ③。alt属性の本来の目的は、画像が表示できない場合の代替情報を提供することです。①「簡潔さ」や④「検索エンジン向け」は本質からズレた説明で、②の「見た目の説明」は必ずしも必要ではありません(何を伝える画像かが重要です)。

第25問: できるだけ多くの人が利用可能となるように最初から意図してデザインすることを何というか

  • ①アダプティブデザイン
  • ②ユニバーサルデザイン
  • ③グレイスフル・デグラデーション
  • ④プログレッシブ・エンハンスメント

答え: ②。「ユニバーサルデザイン」は、特定の対象者を限定せず、できるだけ多くの人が使えるように最初から設計する考え方です。

まとめ

  • CSS内の相対パスは、HTMLページではなくCSSファイル自身の場所を基準に解決される
  • 加法混色(RGB)と伝統的な色の三原色を混同しない
  • 差出人情報は偽装できるため、「知っている相手だから安全」という判断は危険
  • alt属性は「代替テキスト」が本質。見た目の説明やSEO目的の説明ではない点に注意する