学習効率UP】ウェブデザイン技能検定3級試験(平成28年度第4回)の過去問題を徹底解説!!

過去問の解説(平成28年度第4回学科試験)

ウェブデザイン技能検定3級学科(平成28年第4回試験)

〇平成28年度-第4回学科試験の過去問題と解答pdfはこちら

第1問の解説

答え=2 index.htmlをデフォルトドキュメントと言って、ファイル名を省略しても表示されるファイルのことです。このデフォルトドキュメントには5種類あって、以下のファイル名がそれにあたります。

index.html
index.htm
index.shtml
index.cgi
index.php

この中で、たいていのサーバーは基本的にはindex.htmlを優先順位が一番高いファイルと認識しますが、100%ではありません。中にはindex.phpを優先順位が一番高いファイルと認識するサーバーもあります。ファイル名を省略しても良いものはindex~で、例えばtop.htmlなど、ファイル名がindex以外の場合は、省略するとエラーになります。

この問題では「必ずindex.htmlが表示される」と問われているので、答えはNOとなります。

第2問の解説

答え=2tr:nth-child(even) は疑似クラスのひとつで、()内に指定した内容でスタイルを適用するというCSSです。()ないには整数・奇数を表すodd・偶数を表すeven・数式を指定する2n+~と書きます。

数式で奇数を指定するには2n+1、偶数を指定するには2n+0と書きます。ちなみにこれを2n+3と書いた場合は、3番目の子要素からスタートして、その後2つおきにスタイルが適用されます。

以下にこれを表に指定した際を図版で解説してみたので参照ください。
図版1 図鑑2 図版3

第3問の解説

答え=1 例えば同じ写真を使って、一つはサイトのロゴの素材として、一つは記事中写真として使っている場合、当然代替テキストの内容は変わってきます。

第4問の解説

答え=1 「サイバーセキュリティ基本法」は、サイバーセキュリティに関する施策を総合的かつ効率的に推進するため、基本理念を定め、国の責務等を明らかにし、サイバーセキュリティ戦略の策定その他当該施策の基本となる事項等を規定しているとのことです。
もっと詳しく見る>>

第5問の解説

答え=2 ウェブページの背景には画像だけでなく、GIFアニメーションも表示できます。

第6問の解説

答え=1 VDT作業は長時間同じ姿勢での作業ですので、作業休止時にはストレッチをしたりなど、だいたい5分~10分くらいの時間は休憩時間外として法で定められています。

第7問の解説

答え=1 ラジオボタンはフォームの入力時に見ますが、チェックボックスとこんがらないように注意してください。複数ある選択肢の中から1つを選ぶのがラジオボタン、複数選択する場合はチェックボックスです。

第8問の解説

答え=1 ユーザーエージェントとは、私たちがデータを利用する際に用いるソフトウェアやハードウェアのことをいいます。身近なものでは、サイトを訪問する際に使うブラウザ(Chrome、Safari、IE)などのことをいいます。

第9問の解説

答え=2これを解くにはテーブル要素を理解しておく必要があります。テーブルを構成する要素の基本は「th」「tr」「td」です。それぞれに役割があります。

th→テーブル(表)の見出しを作成
tr→テーブル(表)の行を作成
td→テーブル(表)のセル(データを書き込むマス)を作成

エクセルを使っている方はすぐにイメージできると思います。エクセルだと新規に立ち上げた時点で空白のセルができていますが、HTMLの場合はこのセルから作っていかないといけません。

表を作る際にエクセルだと最初にセルを連結して、その表のタイトルや見出しを入力していくことが多いと思いますが、それがHTMLのtableではthにあたり、横一列の行がtr、それぞれのセルがtdにあたります。

第10問の解説

答え=2HTML5以前では、ページ内にh1はひとつしか書けませんでしたが、HTML5からは各セクションごとにh1を使えるようになりました。結果ページ内にh1が複数存在することになりますので、答えは2となります。ちなみにh1とは大見出し、sectionは一つのセクション(かたまり)のことです。

第11問の解説

答え=3SSHとは、暗号や認証の技術を利用して、安全にリモートコンピュータと通信するためのプロトコルのことをいいます。たいだい名前に「S」がついていますので、この問題だと4番のHTTPは選択肢から消してOKです。残りのSMTP、TLS、SFTPのどれかなんですが、それぞれの意味が分からないと、これはちょっとひっかかってしまうかもしれません。

SMTP→メール送信のプロトコル
TLS→SSLをもとに開発された、Webページにセキュリティ機能を追加する技術
SFTP→SSHで暗号化された通信路を使って、安全にファイルを送受信するプロトコル

問題はSSHの仕組みを使ってとありますので、答えは3番の「SFTP」となります。
もっと詳しく見る>>

第12問の解説

答え=4#000000は黒のことなので、背景色は#ffffffの白が一番コントラスト比が高くなります。色のコントラスト比を考える際は、0~fの色の流れを理解しておくと便利です。

0(黒)→1→2→3→4→5→6→7→8→9 →a→b→c→d→e→f(白)

0(黒)からf(白)に向かって、どんどん色が薄くなっていきますので、1番の#000000(黒)の背景に黒の文字がのっても全然見えないので×、2、3番の#999999や#aaaaaaは、中間よりちょっと薄いグレーなので、その上に黒の文字がのっても見えなくはないですが見にくいので×、答えは背景が白の4となります。

第13問の解説

答え=1 代替テキストの役目は、その画像が表示されない時の代わりとなるテキストなので、この場合は1番の「検索」が一番適切です。

第14問の解説

答え=4 プロポーショナルフォントとは、文字により幅が異なるフォントのことで、文字の幅を調整して、表示や印刷の見栄えを良くする目的で使用されます。

第15問の解説

答え=3 WCAGとはWeb Content Accessibility Guidelinesの
それぞれの頭文字をとって合わせた読み方です。これはそのまま丸暗記しましょう。

第16問の解説

答え=4 これはIT知識というよりも、一般常識があれば誰もが解ける問題だと思います。この手の問題は、読み違いや勘違いに気をつけていれば大丈夫でしょう。

第17問の解説

答え=4 レシポンシブデザインは、現在のウェブサイト作成の主流で、デバイスの環境に応じてレイアウトが自動的に変わるウェブデザイン手法のことをいいます。PCで見る人にはこのCSS、スマホで見る人にはこのCSSを読み込んで表示といった具合です。

この見極めの仕方は、そのページを表示させるデバイスの横幅で判断しますので、実際はPCで見ていても、意図的にブラウザの横幅をスマホレベルにまで縮めると、スマホ用のCSSに切り変わって表示されます。

第18問の解説

答え=3 この問題の見極めポイントは、「li」と「li a」のスタイル設定がどうなっているかです。図を見ると、通常リストはデフォルトで文頭に・がつくのですがそれがないこと、リストに設定したリンクも、通常なら下線がつくのですがそれがないことを踏まえて、「li」と「li a」それぞれにnoneを設定して、デフォルトのスタイルをリセットしていると考えます。答えはおのずと3番になります。

第19問の解説

答え=3 opacityはその要素の透明度を指定するスタイルです。「opacity: 1」で完全な不透明、「opacity: 0」で完全な透明になります。半透明にしたい時は、どのくらいの透明度にしたいかで値を変えていきますが、中間程度だと「opacity: 0.5」という書き方をします。

第20問の解説

答え=1 descriptionとはウェブページの説明文を入れるところです。検索エンジンに表示された際、このdescriptionに記載した内容がそのまま表示されます。あまりに長い文章だと、途中で省略されて表示されるため、おおよそ120文字程度におさめるのが一般的です。

第21問の解説

答え=4camel caseとは、各単語の頭文字を大文字で表記する方法のことで、単語区切りですべての先頭の文字を大文字にした「アッパーキャメルケース」、一番最初の単語の頭文字のみ小文字で、以下は大文字の「ローワーキャメルケース」とあります。


Web Design Professional Skills→アッパーキャメルケース
web Design Professional Skills→ローワーキャメルケース

※見やすいように単語の区切りでスペースを入れています。

第22問の解説

答え=2複数行の文字列で構成されたテキストファイルを、異なるOSで開いた際に一行になってしまうのは、OS個々の改行コードの違いによるものです。メジャーどころでいうと、Windowsの改行コードは「CR+LF」、MacOSやLinuxの改行コードは「LF」です。ちなみに古いMacOS(9以前)は「CR」でした。

これらの問題を回避するには、テキストエディタでファイルを保存する際に、改行コードを任意で変えてあげるとOKです。例えばMacOSで作ったテキストファイルをWindowsで開く際には、Mac側で改行コードをCR+LFにして新規保存することで、Windowsでも問題なく開くことができます。

第23問の解説

答え=1 これは説明というよりかは、ここには「content」と書くとおぼえましょう。

第24問の解説

答え=1 HTMLで段落を表す際のタグは<P>です。その他の<br>は改行、<pre>は半角スペースや改行をそのまま表示、<div>はひとかたまりの範囲(ブロック要素)として定義します。

第25問の解説

答え=2 線や円をXMLで記述できる画像形式をSVG(スケーラブル・ベクター・グラフィックス)と言います。現在のHTML5では、直接HTML内に記述できるようになっています。四択の中のその他の画像は全てビットマップ形式の画像で、Photoshopなどのグラフィックツールを用いて作成します。

目次へ戻る