令和4年度 第3回
答え=×
JPEGは人の目では認識しづらい部分のデータを間引くことで、見た目では間引く前と変わらない感じで、かつファイルサイズを軽くする保存形式です。
認識しづらい部分とはいえ、JPEG画像を編集して再度JPEGで保存など、一つの画像でJPEG保存を何回も繰り返すと、その都度データが間引かれていくため、回数を重ねると明らかに劣化が目立ってくるので注意が必要です。
WEB制作の現場では、画像データは必ずpsd、bmp、pngなど、保存しても劣化しない形式のものをマスターデータとして用意し、編集する際はこちらに手を加えてJPEGで書き出すのが一般的です。
答え=×
著作権の侵害は、その行為をおこなった時点でアウトです。個人的なサイトだからとか、人にあまり見られていないなどは理由にはなりません。
サイトを運営していて、画像をネットから拾ってきて使用するなどは、法律を知らないとあるある行為っぽいですが、これはNG行為ですので絶対にやってはいけません。
答え=×
cssでmarginを上下左右個別に一気に指定する際は「margin: 値 値 値 値;」と書きます。この場合は先頭から上、右、下、左となります。時計回りと覚えるとおぼえやすいです。
ちなみにこれが値が3つだったら先頭が上、真ん中が左右、最後が下になります。値が2つだったら先頭が上下、最後が左右、1つだったら上下左右が全て同じとなります。
答え=○
アンケートや問い合わせフォームなどによく使われることが多いので、皆さんも見たことがあると思います。
この問題はおそらく、ラジオボタンとチェックボックスがごっちゃになっていないかを見ているものと思われます。
ラジオボタンは、複数の候補の中から1つだけを選ぶ際に用います。逆に複数選択可とする際は、チェックボックスを用います。
答え=×
スクリーンリーダーとは、目が不自由な方がストレスなくWEBサイトを利用できるように、画面に表示されている内容や、使っている人が操作した内容を音声で読み上げてくれるソフトウェアです。
こちらはアクセシビリティに配慮したWEBサイトを設計するために必要なことですが、だからといって文字の大きさを変更できないようにしたのでは本末転倒です。
あやゆる人に配慮したサイトとするには、音声読み上げも文字の大きさ変更もできないといけません。
答え=× 互いに白黒ではあるのですが、モノクロは白と黒の2色のみ、グレースケールは白から黒までの間のグレー階調も含めたモノクロです。白黒ですが、当然グレースケールのほうが使える濃淡が豊富になります。
答え=○
マージンとはそのボックスの外側の領域のことです。要素に余白を用いる際に指定します。この領域は常に透明で、ここにそのボックスに対しての背景を含めることはできません。
逆にパディングはそのボックスの内側に対する余白で、この場合はそのボックスに対しての背景を含めます。
マージンとパディングの違いはよく問われているので、しっかりとお互いの特性を理解しておきましょう。
答え=×
titleは、そのWebページのタイトルを表すために使います。ここで入れたタイトルは「ブラウザのタブ」や「ブックマーク名」「検索結果」など、さまざまな場所で使用されます。ユーザビリティ、SEO対策、どちらの観点からもとても重要なタグですので、指定しておくほうが好ましいです。
なお、titleに入れることができるのはテキストのみで、ページ内に1つしか入れることはできません。
ここまで見ると、ではなぜ正解が×なの?と思われるでしょうが、タイトルはなくても閲覧には支障はありません。
この場合はページに「無題」と自動で表示されます。ただ、SEO的には超マイナスになるため、ユーザーがページを検索エンジンで探せなくなり、アクセスが集まらなくなります。
問題は「必ず1つ配置する必要があるYESかNOか」なので、こういう聞き方をされるとNOとなります。
答え=○
ワームとは独立したプログラムであり、自己を複製して拡散する性質を持つマルウェアです。
マルウエアの種類は複数あります。今回はワームですが、試験の回によって聞いてくるマルウエアを変えてきますので、できるだけ多くの種類を覚えるのが得策なのですが、数が多くて大変ですので、以下によく試験で問われるマルウエアを記載します。最低でも以下は必ずおぼえて、何が来ても答えられるようにしておきましょう。
更に余裕がある方は、詳しく解説されたサイトのリンクを貼っておきますのでご覧ください。
答え=×
meta charsetはそのサイトの文字コードを指定します。現在はmetacharset="UTF-8"と書くのが一般的です。これを入れておかないと文字化けを起こすことがありますので、ご注意ください。
ちなみに言語指定の際はhtml lang="ja"と書きます。jaは日本語という意味です。
答え=3 CSSの文法ですのでここは丸暗記してください。cssではすべての要素に指定する際*で記述します。
答え=3
一つひとつ見ていきます。
まず1の「グレア防止」ですが、グレアとはディスプレイから発する光のことです。子どもの頃、真っ暗な部屋でテレビを見ると目を悪くするよ!と親から言われたことがあると思うのですが、まさしくこのことです。モニターを見る作業を行う際は、部屋の電気(間接照明)を付けましょうということです。
2の「過度に長時間にわたり行われることのないようにする」は、長時間座ったままの姿勢でモニターを見ていると体に悪いので当然のことですね。
3の「軽い運動等を行う場合は常に上司の許可を求める」は、職場の文化で個々認識にずれが生じそうなのですが、法的にはこれらの行為は休憩には入りません。逆に会社は作業者にこれらの行為をさせるよう義務付けられています。ただし、数分といった常識の範囲内です。30分もやっていたら休憩になりますのでご注意を。
もし、ちょっと体操をしていて上司に怒られたら、その上司は法律を知らないだけですので、その際はやさしく教えてあげてください。
答え=4
Webサイトは見る人の環境で作り手が意図しない形で表示されたりします(例えば見る側で画像や動画を表示させないように設定している、回線の混雑で画像が表示されない、またはすごくタイムラグが生じるなど)。そういった際に穴が空いた箇所が空白なだけだと、見る側はよく分からないですよね。その場合に備えて、画像が表示されない時は、その画像の説明がテキストで表示されるなどの処理をしておかないと不親切です。
例えは画像で説明しましたが、非テキストコンテンツ全てにあてはまります。
JISX8341-3はアクセシビリティのガイドラインです。8341(やさしい)とおぼえておいてください。この数字が出たら「見る人にやさしいWEBサイト作りのためのガイドライン」とすぐにピンと来るようになると思います。
答え=4 13問で説明したとおり、JISX8341-3はウェブコンテンツのアクセシビリティに関するガイドラインです。
答え=1
まずSSHとファイルを転送するプロトコルについて説明します。
SSHとは、「Security Shell」の略で、他のコンピューターに遠隔でログインしたり、特定のサーバに入ったりするためのプロトコルまたはソフトウェアです。SSHを使うことで、認証部分を含めてすべての通信が暗号化されることで、第三者に簡単に解読できないようにする仕組みです。
次にファイルを転送するプロトコルはFTPです。WEBサイトの更新など、サーバーにFileZillaなどのFTPソフトを使ってアクセスして、ファイルを更新するなどの作業は、WEBサイト制作の現場ではよくある光景です。
以上からSFTPは「SSH+FTP」のイメージ(暗号化されたファイル転送)と解釈すると分かりやすいかと思います。
答え=3
要素を画面上で表示されないようにするには、CSSに「display:none;」と記述します。
これを使う場面は、例えばスマホの時は表示させないけど、PCでは表示する、またはその逆など、見る人の環境に合わせて条件分岐で表示や非表示を切り替えたい際によく使います。
display:none;を単体で使うことはあまりありません。というのも表示させないのなら、そもそもその部分のHTML記述を削除するほうが望ましいからです。
スマホでは表示させない(display:none;)けど、PCでは表示する(display:block;)など、メディアクエリで条件を分岐させて記述する!レスポンシブサイトの作成ではよく使う方法です。
答え=2
こちらも文法でそう規定されているので、丸暗記してください。
ちなみに1はCSSでのコメント時、3はSQLでのコメント時、4はJavaScriptでのコメント時です。
答え=2
onclickは「クリックしたら○○の処理を行う」という意味になります。
他にもonload「ページが読み込まれたら○○の処理を行う」、onmouseover「要素内にカーソルが移動したら○○の処理を行う」などあります。これらを総称してイベントハンドラと言います。
答え=1
p要素にul要素を入れ子で使用できません。他にもHTMLにはできるできないのルールがあって慣れるまでは結構面倒です。以下のサイトで詳しく説明されていますので、興味がある方はこちらを参考ください。
もっと詳しく見る»
答え=1
プログレスバーとは、ファイル転送やダウンロード時など、処理の進捗状況を棒状の領域の内部の色の変化によって表示するものです。
身近なものでは、例えばスマホでアプリをインストールする際、ダウンロードやインストールの進捗状況が円グラフで左上に出ます。この場合はバーではなく円なので、プログレスリングなどと呼ばれています。
答え=3
HTMLではpre~/preで囲んだ領域は、整形済みテキストとして表示します。
整形済みテキストとは、あらかじめマークアップを行う前に整形してあるテキストのことです。
例えばHTMLの文章で改行をする際はbrタグを入れますが、preで囲んだ領域はbrタグがなくても、スペースや改行などをそのまま等幅フォントで表示します。
答え=1
HTMLでinput typeを使う場面は入力フォームを作成する際です。input type="text"で、一行のテキストボックスが作成されます。
ここに最大文字数を指定したい時は、input type="text" maxlength="6"というように、半角スペースに続いて文字数制限をした属性を追加します。
答え=4 blockquoteは、引用・転載文であることを示すタグです。長文テキストを引用する際に使用されます。
答え=2
光の三原色ではR(赤)G(緑)B(青)三つの光の掛け合わせで様々な色を再現します。それぞれ0~255までの階調を持っており、3つ全てが0で黒、すべてがマックスの255で白になります。
身近なところでは、スマホやパソコン、テレビモニターなどは、この原理で色を再現しています。
答え=4
こちらは入力フォームを作成する際の記述になります。皆さんも作成したことはなくても入力した経験はあると思うので、どのようなものかはイメージできると思いますが、フォームでは名前の入力欄やラジオボタン、チェックボックスなど、様々なタイプを指定できます。
その中で、送信ボタンとしたい際はtype属性にsubmit、リセットボタンにしたい際はresetと記述します。他にもたくさん用意されていますので、興味がある方は、以下のサイトで分かりやすく説明されていますので参考ください。
もっと詳しく見る»