-
-
【ウェブデザイン技能検定】3級学科試験対策オリジナル演習問題一覧
続きを見る
ウェブデザイン技能検定3級の対策オリジナル演習問題(全25問)となっています。本演習問題は、該当回に対応できるように作成しています。
過去問はウェブデザイン技能検定の公式HPより取得できます。
正誤判定⚪︎×問題:第1問~第10問
第1問
CSSで margin: 10px 20px 30px 40px; と指定した場合、順番は「上・右・下・左」である。
正解:○
解説:margin や padding の4値指定は上から時計回りです。
第2問
スクリーンリーダー利用者への配慮だけを考えれば、文字サイズを利用者が変更できない設定でもアクセシビリティ上問題はない。
正解:×
解説:アクセシビリティでは、弱視の利用者などが文字サイズを変更できることも重要です。文字サイズを固定して変更できなくすると、利用しにくくなる場合があります。
第3問
企業ロゴ画像の代替テキストには、「ロゴ」や「logo」という単語を必ず含めなければならない。
正解:×
解説:代替テキストは画像の目的を伝えることが重要です。ロゴ画像であれば企業名やブランド名だけで十分な場合も多く、「ロゴ」という語を必ず含める必要はありません。
ただし、画像がリンクになっている場合、代替テキストには「画像そのものの説明(ロゴ、バナーなど)」ではなく、「そのリンクがどこへ繋がっているか」や「その画像が表す組織名」を記述するのが原則です。
第4問
HTMLでは、tr要素をtable要素の子要素として配置できる。
正解:○
解説:tr要素は表の行を表す要素です。tableの直下、またはthead・tbody・tfoot内に配置できます。
第5問
ディスプレイ上での読みやすさを考慮した安全衛生上の指針では、文字の大きさ(高さ)は視認性を保つために、最低でも3mm以上確保することが推奨されている。
正解:○
解説:ユーザーの目の疲労軽減や情報の伝達をスムーズにするための物理的な推奨サイズです 。
第6問
ワームは、他のプログラムに寄生することなく、自ら複製しながらネットワーク上に広がるマルウェアである。
正解:○
解説:ワームは自己増殖型のマルウェアです。ウイルスのように他のプログラムへ寄生する必要がなく、ネットワークを通じて自律的に感染を拡大します。
第7問
DNS(DomainNameSystem)は、ネットワーク上で「ドメイン名」と「IPアドレス」を相互に変換し、通信の宛先を特定するためのシステムである 。
正解:○
解説:インターネット通信において、名前解決を行う不可欠な仕組みです 。
第8問
他人の著作物を無断で自分のウェブサイトに公開した場合、アクセス数が少ない場合でも著作権侵害になる場合がある。
正解:○
解説:権利者の許可なく公開すれば、アクセス数に関係なく著作権侵害となる可能性があります。
第9問
相互に排他的な複数の選択項目の中から1つだけ選択させる場合には、チェックボックスを利用する。
正解:×
解説:相互に排他的な複数の選択項目の中から1つだけ選択させる場合にはラジオボタンを使用します。
チェックボックスは複数の選択肢から「該当するもの全て」を選ばせたい場合等に使用します。
第10問
Webサイトを通じて問い合わせなどの個人情報を取得する場合、運営者はあらかじめ利用目的をサイト内に明記するか、本人へ通知する義務がある。
正解:○
解説:個人情報保護法に基づき、適正な取得と利用目的の公表が求められます 。
四者択一:第11問~第25問
第11問
プログレスバー(Progress Bar)の主な役割として、最も適切なものはどれですか?
- 画面表示領域を移動させる
- 特定の機能をオン・オフに切り替える
- 複数選択肢の中から1つを選択する
- 処理やタスクの進捗状況を視覚的に表示する
正解:3
解説:プログレスバーは、ファイルのダウンロードやインストールなど、進行中のタスクがどの程度完了しているかをパーセンテージやバーの長さで示すUI要素です。
スクロールバー:画面表示領域を移動させる。:設問にもある通り、(Scroll Bar) の役割です。
トグルスイッチ:特定の機能をオン・オフに切り替える。
ラジオボタン:複数選択肢の中から1つを選択する。
第12問
次のHTMLで、下線部は何と呼ばれるか。
HTML
<button onclick="openMenu()">メニュー</button>
- イベントリスナー
- イベントハンドラ
- コールバック関数
- イベントオブジェクト
正解:2
解説:onclick属性のように、イベント発生時に実行する処理を指定するものをイベントハンドラといいます。
第13問
次のHTMLのAに入る記述として最も適切なものを選びなさい。
HTML
<video controls poster="A">
<source src="travel.mp4">
</video>
- travel.mp4
- 動画サムネイル
- travel.jpg
- src="travel.jpg"
正解:3
解説:poster属性には、動画を再生する前に表示する画像ファイルを指定します。属性値には画像ファイル名のみを指定します。
第14問
利用者が入力や操作を行うインタラクティブコンテンツに分類される要素はどれか。
- hr
- code
- label
- textarea
正解:4
解説:textarea:ユーザーが複数行のテキストを入力・編集できる領域を作成する要素であり、インタラクティブ・コンテンツに分類されます。
label:フォーム部品のラベルを示す要素で、フロー・コンテンツやフェージング・コンテンツに分類されます。
hr:段落単位でのトピックの区切り(テーマの変更)を表す要素で、フロー・コンテンツに分類されます。
code:プログラムのコードやコンピュータで認識できるテキストを示す要素で、フェージング・コンテンツに分類されます。
インタラクティブコンテンツは他に下記があります。
<button>
<details>
<embed>
<input>(type="hidden" を除く)
<select>
第15問
SSHを利用して安全にファイル転送を行うプロトコルはどれか。
- FTP
- HTTPS
- SFTP
- POP3
正解:3
解説:SFTP(SSH File Transfer Protocol)は、SSHの通信を利用して暗号化されたファイル転送を行うプロトコルです。
第16問
閲覧する権限がないリソースへアクセスした際に、ウェブサーバから返されるHTTPステータスコードとして適切なものはどれか。
- 401 Unauthorized
- 403 Forbidden
- 404 Not Found
- 500 Internal Server Error
正解:2
解説:403 Forbiddenは、サーバは要求を理解しているものの、アクセス権限がないため処理を拒否したことを示します。404はリソースが見つからない場合、500はサーバ内部のエラーです。
第17問
JPEG形式の特徴として適切なものはどれか。
- ベクター形式である
- 可逆圧縮を採用している
- 写真データに適している
- アニメーション表示が可能である
正解:3
解説:JPEGはラスタ形式の非可逆圧縮方式で、写真に向いています。PNGは透過対応、GIFはアニメーション対応、SVGはベクター形式が特徴です。
第18問
光の三原色に含まれる色はどれか。
- 赤
- 黄
- 白
- 黒
正解:1
解説:光の三原色は「赤(Red)・緑(Green)・青(Blue)」です。黄は色料の三原色に含まれる色です。
第19問
HTMLで順番に意味がある項目を番号付きで表示する場合に使用する要素はどれか。
- ul
- dl
- ol
- menu
正解:3
解説:ol(Ordered List)は番号付きリストを表します。ulは順不同リスト、dlは定義リストです。
第20問
HTMLのq要素は、どのような内容を表すために使用する要素か。
- 用語の定義
- 短い引用
- 質問文
- 強調したい文章
正解:2
解説:q要素は、文章中の短い引用を表す要素です。長い引用にはblockquote要素を使用します。
第21問
HTMLやCSSを解析し、画面上にWebページを表示(レンダリング)する役割を担うソフトウェアはどれか。
- FTPクライアント
- Webブラウザ
- DNSサーバ
- Webサーバ
正解:2
解説:WebブラウザはHTMLやCSSを解釈し、レイアウトを計算してWebページを表示します。Webサーバはページを配信する役割を持ちます。
第22問
img要素で画像を表示する際、画像ファイルの場所を指定するために必ず必要となる属性はどれか。
- alt
- title
- src
- loading
正解:3
解説:src属性は表示する画像ファイルのURLを指定する必須属性です。alt属性はアクセシビリティのために重要ですが必須ではありません。
第23問
HTML、CSSが次のように指定されている場合、この文字の色は何色になるか。
HTML
<p class="sample">テキスト</p>
CSS
p.sample { color: red; }
*.sample { color: blue; }
.sample { color: green; }
p { color: yellow; }
- 赤
- 青
- 緑
- 黄
正解:1
解説:p.sampleは要素名とクラス名を組み合わせた指定で、他のセレクタより詳細度(セレクタの優先順位)が高いため、赤色になります。
セレクタ詳細度の内訳(要素数, クラス数)は下記の通りです。
【詳細度スコア】
p.sample:要素 1 + クラス 1
*.sample:全称 0 + クラス 1
.sample:要素 0 + クラス 1
p:要素 1 + クラス 0
第24問
ブログ記事やニュース記事など、独立した1つの記事全体をマークアップするのに最も適したHTML要素はどれか。
- nav
- figure
- section
- article
正解:4
解説:article:ブログ記事、ニュース記事、掲示板の投稿など、それ自体で自己完結し、独立して配布や再利用ができるコンテンツを表します。
section:文書や記事の中で、章・節・項などの論理的なセクションを表します(通常は見出し要素を伴います)。
nav:サイト内ナビゲーションやページ内リンクのグループを表します。
figure:図表、写真、挿絵、コード例など、本文から参照される自己完結したコンテンツを表します。
第25問
JIS X 8341-3のガイドライン1.1では、「全ての非テキストコンテンツには、代替となる A を提供する」と定められている。Aに当てはまる言葉はどれか 。
- グラフィック
- テキスト
- 音声信号
- メタデータ
正解:2
解説:画像などの非テキストコンテンツには、等価な情報を持つ「テキスト(代替テキスト)」を提供する必要があります 。
-
-
【ウェブデザイン技能検定】3級学科試験対策オリジナル演習問題一覧
続きを見る