【2026年出題基準】ウェブデザイン技能検定実技試験完全ガイド
ウェブデザイン開発技能士（旧ウェブデザイン技能士）出題基準（2025.1.1 ～ 2027.12.31）まで施行される出題基準に正確に合わせたウェブデザイン技能士実技試験の内容に最適化されている実技試験専門講義として、HTML+CSS+JQUERYパブリッシング、コーディングワークスのウェブデザイン開発技能士実技試験講義は一味違います。 2026年ウェブデザイン開発技能士のすべての試験タイプ（A, B, C, D, E, Fタイプ）を完璧に制作した授業動画がすべて反映されています。
Webデザイン機能士実技試験レイアウト制作映像が追加アップデート
こんにちは。コーディングワークスです。
Webデザイン機能士実技試験レイアウト制作映像が追加アップデートされました。
追加された映像は背景色でレイアウトを作る映像です。背景色でレイアウトを作成すると、ボーダーを使用した従来の方法よりも、より簡単に製作できます。背景色で作成されたレイアウトモジュール製作完成本ファイルは、モジュール製作完成本ダウンロード資料室からダウンロードできます。
追加のビデオリスト
- 水平固定レイアウト（A1〜A4） - 背景色を使用してHTML + CSS構造を作成する
- 水平100％ワイヤフレーム（B1～B4） - 背景色を使用してHTML + CSS構造を作成する
- 縦2列ワイヤフレーム（C1〜C4） - 背景色を使用してHTML + CSS構造を作成する
ボーダーでレイアウトワイヤフレームを作成するときは、box-sizing：border-boxを必ず使用してください。しかし、box-sizing：border-boxが慣れていない人には不慣れです。
そのため、背景色としてレイアウトワイヤフレームを作成するとボーダーを使用しないため、box-sizing: border-boxについて気にする必要はありません。
ボーダーにすることと背景色にするには2つの利点があります。
受講生の方々が2つすべて経験してみて、自分に合った方法で製作してください。
私の立場でお勧めします...
ボーダーでレイアウトを作るのがあまり難しくない方であれば、ボーダーでレイアウトを作ることをお勧めします。
背景色でレイアウトを作成するとき、とにかく背景色はレイアウトをキャッチする目的で、中に内容を入れるときに削除される部分なので、色に大きく気をつけて作る必要は全くありません。
ただ、区別できるほど色違いだけでいいです。
※添付のグレーカラー画像をご参考の上、背景色でレイアウト作成してください。
