令和2年度 第2回
答え=×
要素名とはそれこそ種類はたくさんあるのですが、例えば<p>、<div>、<br>などのことを言います。
HTML5.2の要素名は大文字、小文字のどちらでもかまいません。以前はHTML4かxhtmlのどちらかでコーディングしていたのですが、xhtmlのほうは小文字でないとエラーになりますので、この時期のソースコードはどちらでも対応可能な小文字オンリーが主流でした。現在はコーディングはほぼHTML5で統一されていますので、どちらでも大丈夫です。
答え=×
著作権は知的財産権のひとつではありますが、審査を経て登録する必要はありません。逆に登録してからでないと保護の対象にはならないものには商標権などがあります。
著作権とは自分の考えや気持ちを作品として表現した「著作物」、著作物を創作した人「著作者」に対して法律によって与えられる権利のことを言います。保護の対象となるものには「音楽」「本」「絵画」「写真」「映画」などがあります。WEBデザイナーが著作権を意識する機会と言えば「イラストを使用する」「写真を使用する」などでしょうか。
これらはフリー素材など著作権フリーにしてあるものであれば大丈夫ですが、以外は基本著作権に引っかかると思ってください。無断で使用するとトラブルの元になりますよ。
答え=○
こちらは厚生労働省より「情報機器作業における労働衛生管理のためのガイドライン」というものが策定されていて、事業主は長時間のパソコン業務によって作業者の健康を損なわないように、働き方を管理する義務が課せられています。
例えば連続作業時間が1時間を超えないようにする。超える際は間に小休止する時間を設けるなどがあります。
答え=×
pxはピクセルと言って、大きさは画面が大きい小さい関係なく統一の大きさで出力することから「絶対単位」と言われています。WEBデザインでのpxの利点は、どのモニターでみても統一の大きさで表示できるというところです。
ひと昔前はインターネットといえばパソコンで見るのが主流でしたので、ブラウザのウインドウを広げたり狭めたりしてもレイアウトが崩れないように絶対単位(px)で制作するのが主流でしたが、現在ではPC、タブレット、スマホと、人それぞれでWEBサイトを見る環境が多様化しているため、画面の大きさによってレイアウトが変化しない絶対単位は、逆に困ったことになることが多くなるため使う機会が少なくなってきました。
一つのHTMLファイルで見る環境(画面の大きさ)によってレイアウトを変化させる手法を「レスポンシブデザイン」と言いますが、現在はこちらの作り方が主流です。レスポンシブデザインで制作する際は、絶対単位ではなく相対単位で作成しないと画面の大きさによってレイアウトが変化しません。現在は要所でpxを使うこともありますが、ほぼほぼ相対単位の%、vw、remなどの単位を用いて制作するのが主流となっています。
答え=×
GIF形式も透過GIFと言って透明にすることができますが、こちらはあくまで0か100かであって半透明にはできません。完全な透明か完全な不透明のどちらかということですね。
半透明とは薄っすら透けて下のパーツも薄っすら見える状態のことです。これはPNGでは可能ですがGIFでは再現はできません。
答え=○
header要素のことを説明すると「header要素は文書やセクションのヘッダを表す」とそのままですね(笑)。
ちょっと意味が分かりにくいかと思うのですが、文書やセクションの冒頭となる見出しや概要、ナビゲーションのリンクなどを記述する場合に<header>~</header>でその部分を囲んで記述します。
例えばWEBサイトを見るとほぼどこのサイトもページの上部にサイトのロゴやナビゲーションリンクを設置しているのを見かけますがこれのことです。
答え=○
マージンとはそのボックスの外側の余白領域になります。CSSで各要素にマージンを設定していないと各ブロックがくっついてしまって見にくいですよね。
cssでmargin-top: 10px;と記述した際、そのボックスの上に10pxの余白を設けるという意味になります。逆にボックスの内側に余白を設けたい際はpadding(パディング)と記述します。パディングの場合は透明ではなく、そのボックスで指定した背景画像や色がそのまま表示されます。
ボックスにボーダーを指定した際はpaddingを設定しないと、例えばボックス内の文章とボーダーがくっついてしまって見にくくなります。
答え=×
スクリーンリーダーとは、視覚障害者の方がコンピュータを操作するために、マウスに変わり情報を音声で読み上げることによって、操作を補助するソフトウェアです。
サイトを見ているユーザーは色々な方がいますので、皆が皆スクリーンリーダーを使用することはありません。文字の大きさを変えて読みたい人もいるので、アクセシビリティを意識したサイトを作る上で、色々な使い方に対応していなくてはいけません。
答え=○
マルウェアとはコンピューターウイルスを総称した呼び名です。
これらは特徴によって細かく分類されるのですが、大きく分けて以下の3つはおぼえてください。
ワーム→単体で存在でき、自己増殖する。
ウイルス→単体で存在できず(他のファイルに寄生して)、自己増殖する。
トロイの木馬→無害のファイルになりすまして存在し、自己増殖はできない。
答え=×
アスペクト比とは映像(映画、テレビ、動画)などにおける縦横比のことをいいます。ワイド(16:9)とスタンダード(4:3)の2つを基本とします。
2000年前半まではワイド(16:9)といえば映画で、テレビは4:3の比率が多かったのですが、今はテレビもYouTubeもワイド(16:9)のサイズが主流です。
答え=1 HTMLでのp要素の意味は「段落」です。長めの文章はそれぞれの段落ごとにp要素で囲みます。こうすると囲んだ上下に1行分程度の空きができ、読みやすい文章をレイアウトできます。
答え=2
補色とはその色の正反対の色のことです。代表的な組み合わせだと「赤と青緑」「オレンジと青」「黄色と紫」「赤紫と緑」などがあります。
この補色の関係を知っておくと、デザインの際の色使いで役にたちます。補色の組み合わせ=色がケンカするということなので、この組み合わせを避けることで、変な色使いになりにくくなります。あえて補色を使って、ある一点だけ色をケンカさせて目立たせるデザインもありますが、慣れないうちは補色の組み合わせを避けるだけで、それなりにプロっぽいデザインにすることができます。
答え=4 「blockquote」とは、引用・転載文であることを示すタグです。比較的長いテキストを段落ごと引用する際に使用されます。逆に短いテキストの場合は<blockquote>タグではなく<q>タグを使用して引用・抜粋を行います。
答え=3 HTML5ではtable要素に対しての装飾は全てCSSで行うこととなっています。HTML5以前では、装飾もテーブルタグに直接書き込んでいましたが、今は構造はHTMLで、装飾はCSSでと完全に分離した書き方が推奨されています。
margin: 10px 20px 30px 40px;
答え=2
marginやpaddingは一行で一気に上下左右の余白の値を書くことができます。この際の値が適用される順番は円を描いて時計周りとおぼえてください。
問題のmargin: 10px 20px 30px 40px;と書いた際の余白は、10px(上) 20px(右) 30px(下) 40px(左)となります。
答え=2
不正アクセス行為の禁止等に関する法律ではフィッシング行為に対して以下のように規制しています。
識別符号の入力を不正に要求する行為の禁止
フィッシングサイト構築(7条1号)と電子メール送信(7条2号)によるフィッシング行為を禁止する。違反者は1年以下の懲役または50万円以下の罰金に処せられる(12条4号)。
全ての機能を A から利用できるようにする。
答え=3
JIS X 8341-3では、高齢者や障害のある人を含む全ての利用者が、使用している端末、ウェブブラウザ、支援技術などに関係なく、ウェブコンテンツを利用することができるようにと示しています。Webサイト制作者はこれらを考慮したサイトを設計、制作しないといけませんよという、サイト作成のガイドラインと理解していただけると大丈夫です。
その中で全ての機能をキーボードから利用できるようにと書かれています。マウスやタッチパネルなどの入力装置は、必ずしも皆が備えているものではないので、それらがないとできない物は見ている方に対して不親切ですよということですね。
答え=1
HTML5ではmedium、big、largeは使用できません。他にもこれまで使えていたけどHTML5では使えないといったタグが多々ありますが、試験でどのタグが出てくるかはその時にならないと分からないので、できれば可能な限りおぼえておいた方が得策です。
詳しくは以下のサイトを参照ください。
もっと詳しく見る>>
答え=3 CSSは外部でも直接HTML内に記述することもできます。直接HTML内に記述する際は「style="●●●●"」と記述します。
OSやアプリケーションソフト、ネットワークシステムなどにおいて、プログラムの不具合や設計ミスが原因となって生じた、セキュリティ上の弱点や欠陥のことを A という。
答え=2 セキュリティの穴(ホール)。そのまんまですね。こちらはそのまま丸暗記しましょう。
答え=2 頭に!があるとおぼえてください。またこちらの宣言は最初の一行目にあれば良いので、/で閉じる必要はありません。
答え=3
画像が表示できない環境では、alt属性に指定されているテキストが画像の代わりとして表示されますが、altに何も情報を入れていないと×だけが表示されます。
画像に対してその説明となる短い文章をalt属性に入れるのは、アクセシビリティ上必須とされていますので、面倒ですが画像を入れたら、alt属性にも説明を入れるようにしましょう。
答え=4
非可逆圧縮とは、人の目では判別できない領域の画像情報を削除して、効率よくデータ量を軽くするための圧縮技術です。こちらは画像情報を削除するわけですので、一度JPEGに変換した画像は元には戻りません。とはいえ、正直人の目ではどこがどう削除されたのかはまったく分からないので問題はありません。
ただしJPEG画像は保存を繰り返す度に画質が劣化していくので、あまり過度に繰り返して保存すると、劣化が目に見えて判別できるほどになりますのでご注意ください。
これとは逆に可逆圧縮方式というものがあります。問題ではPNGがそれです。こちらは画像内の情報を削除しないので元に戻せるというのが特長です。ただ写真をPNGで保存してもデータ容量が重いままですので、色数が少ないイラストや文字を画像化したものなどが向いています。
ちなみに筆者は現在はPNGで保存していたイラストなどはsvgで保存することが多いです。
答え=4
input要素にスライダーのコントロールを付けるには「range」を指定します。input要素には他にも複数の属性が指定できますので、興味がある方は以下を参照ください。
もっと詳しく見る>>
製品やシステム、サービスの利用、もしくは予想された使い方によってもたらされる人々の知覚と反応のことを A という。
答え=2 こちらの問題はよく出てきますね。こちらは私も3級を受けた時にそうだったのですが、人々の知覚と反応と来たら「ユーザエクスペリエンス」とおぼえましょう。