| 試験目的 | Webクリエイターに必要とされる、Webサイト制作のデザイン能力およびWebページのコーディング能力を認定します。 | ||
|---|---|---|---|
| マークアップ言語 | HTML5 | ||
| 受験環境 | Windows7, 8, 8.1,10 | ブラウザー | Internet Explorer 10,11、Chrome～、Firefox～、Edge＋Internet Explorer |
| Mac OS X | ブラウザー | Safari6, 7、Chrome～、Firefox～ | |
※Edge＋Internet Explorer受験についての注意点
知識問題：問題文は「Internet Explorer」で表示してください。
実技問題：問題文は「Internet Explorer」で表示し、作成するファイルは「Edge」で表示してください。
（問題文を「Edge」で表示することはできませんので、ご注意ください。）
| 認定基準 | レイアウト手法や色彩設計等、ユーザビリティやアクセシビリティを考慮したWebデザインを表現することができる。 また、スクリプトを用いた動きのあるWebページの表示、マルチデバイス対応、新規Webサイトを構築することができる。 | ||
|---|---|---|---|
| 出題形式 | 知識問題 | 内容 | Webサイトに関する知識 |
| 形式 | 多肢選択方式（4択） | ||
| 題数 | 20問（デザインカンプによる設問15問、文書による設問5問） | ||
| 時間 | 20分 | ||
| 実技問題 | 内容 | HTMLの作成、CSSの読込と作成、画像の表示、JavaScriptの読込 | |
| 形式 | 配布された問題データおよび素材データに基づき、問題文の指示に従って編集を行い、解答データを提出する。 | ||
| 題数 | 1テーマ（基本ページ1ページと5ページ程度のHTMLとCSSの作成、JavaScriptの対応、レスポンシブWebデザインの対応） | ||
| 時間 | テキストエディター使用：110分 Webページ作成ソフト使用：90分（公開試験では選択できません） | ||
| 合格基準 | 知識問題と実技問題の合計得点において得点率65％以上。 | ||
| 受験料 | 7,300円（税込） | ||
| 認定基準 | セマンテックWebを理解し、HTML5をマークアップすることができる。 また、CSSを用いてHTMLの構造を維持しつつ、Webページのデザインやレイアウトを表現することができる。 | ||
|---|---|---|---|
| 出題形式 | 実技問題 | 内容 | HTML5の変換、HTMLの作成、CSSの読込と作成、画像の表示 |
| 形式 | 配布された問題データおよび素材データに基づき、問題文の指示に従って編集を行い、解答データを提出する。 | ||
| 題数 | 1テーマ（4ページ程度のHTMLとCSSの作成） | ||
| 時間 | テキストエディター使用：70分 Webページ作成ソフト使用：60分（公開試験では選択できません） | ||
| 合格基準 | 実技問題の得点において得点率65％以上。 | ||
| 受験料 | 5,700円（税込） | ||
※出題範囲は、W3C勧告の状況により変更される場合があります。
| 科目 | 単元 | 項目 | 主な内容 | スタン ダード 実技 | エキス パート 実技 | エキス パート 知識 |
|---|---|---|---|---|---|---|
| 制作環境 | ||||||
| ファイルの操作 | 保存／複製／拡張子／ファイル名 | ○ | ○ | ○ | ||
| テキスト／ソースの操作 | コピー&ペースト／入力／変更／削除 | ○ | ○ | ○ | ||
| ブラウザー／ドメイン | ブラウザー名／レンダリングエンジン／名称と用途／URL／スキーム | ○ | ○ | ○ | ||
| ファイルの種類 | ||||||
| HTML／CSS | HTML／CSS言語の特徴、構造とデザインの分離 | ○ | ○ | ○ | ||
| 画像 | GIF／JPEG／PNGファイルの特徴、ビットマップ形式の特徴 | ○ | ○ | ○ | ||
| JavaScript | JavaScript言語の特徴、動的コンテンツの特徴 | ○ | ○ | |||
| SVG／Webフォント | ベクトル形式の特徴、フォントの表示形式の特徴 | ○ | ||||
| 動画／音声／リッチコンテンツ | 動画と音声の特徴、リッチコンテンツ（Flash）の特徴 | ○ | ||||
| Webサイトの構成と設計 | ||||||
| ページ構成 | ||||||
| 基本ページ／フォーマット | ○ | ○ | ○ | |||
| トップページ | ○ | ○ | ○ | |||
| テキストと画像のページ | ○ | ○ | ○ | |||
| テーブルのページ | ○ | ○ | ○ | |||
| フォームのページ | ○ | ○ | ○ | |||
| サムネイルのページ | ○ | ○ | ||||
| レスポンシブWebデザインの対応 | ○ | ○ | ||||
| レイアウト／パーツ設計 | ||||||
| ヘッダー領域／フッター領域 | ○ | ○ | ○ | |||
| ナビゲーション領域 | ○ | ○ | ○ | |||
| コンテンツ領域／メイン領域／サブ領域 | ○ | ○ | ○ | |||
| バナー／ボタン | ○ | ○ | ○ | |||
| 動的コンテンツ | ○ | ○ | ||||
| ユーザビリティ／アクセシビリティ | ||||||
| タイトル／見出しの統一 | タイトルと見出しのルール | ○ | ○ | ○ | ||
| 文字色と背景色 | 文字色と背景色のコントラスト | ○ | ○ | ○ | ||
| パンくずリスト | Webサイトの現在位置 | ○ | ○ | |||
| ページ内リンクの移動 | ページの先頭、アンカー | ○ | ○ | |||
| ユーザー導線 | ファーストビュー／Z軸／F軸／E軸 | ○ | ||||
| テキスト／リンク | 文字サイズ／下線の表示／未読リンクと既読リンクの明確化 | ○ | ||||
| ボタン／アイコン | 矢印／メタファー／アフォーダンス | ○ | ||||
| 色や形の表示 | 色に左右されないWebページの表示 | ○ | ||||
| 画像 | alt属性の配慮、凡例表示の配慮 | ○ | ||||
| 日付／金額／単語中のスペース | 音声ブラウザー対応 | ○ | ||||
| PDF／動画／フォーム／ダウンロードの取り扱い | 注釈／説明／サイズの表示と配慮 | ○ | ||||
| HTML | ||||||
| セマンテック／コンテンツモデル／カテゴリー | （X）HTML5の概念 | ○ | ○ | ○ | ||
| HTML5の移行 | HTML 4.01／XHTML 1.0からの移行 | ○ | ||||
| 文字参照／実体参照 | 記号の記述 | ○ | ○ | ○ | ||
| コメント | <!-- --> | ○ | ○ | ○ | ||
| 基本構造 | 文書型宣言／html要素／head要素／body要素／title要素／文字エンコード | ○ | ○ | ○ | ||
| 外部スタイルシート | ||||||
| 外部スタイルシートの読み込み | link要素／CSSファイルの読み込みに関連する属性 | ○ | ○ | ○ | ||
| メディアクエリー | link要素／メディアクエリーに関連する属性 | ○ | ○ | |||
| 汎用コンテナー | div要素／span要素 | ○ | ○ | ○ | ||
| ID名／クラス名 | id属性／class属性 | ○ | ○ | ○ | ||
| 見出し／段落／改行 | h1～h6要素／p要素／br要素 | ○ | ○ | ○ | ||
| 重要／コピーライト／連絡先 | strong要素／small要素／address要素 | ○ | ○ | ○ | ||
| リスト | ul要素／ol要素／li要素／dl要素／dt要素／dd要素／関連する属性 | ○ | ○ | ○ | ||
| ハイパーリンク | ||||||
| フレージングコンテンツ | フレージングコンテンツに対応するa要素／関連する属性 | ○ | ○ | ○ | ||
| フローコンテンツ | フローコンテンツに対応するa要素／関連する属性 | ○ | ○ | |||
| 画像 | img要素／関連する属性 | ○ | ○ | ○ | ||
| テーブル | ||||||
| 行と列／見出しセル／キャプション | table要素／tr要素／td要素／th要素／caption要素／関連する属性 | ○ | ○ | ○ | ||
| セルの結合 | colspan属性／rowspan属性 | ○ | ○ | ○ | ||
| 表の区分 | thead要素／tbody要素／tfoot要素 | ○ | ○ | |||
| フォーム | ||||||
| フォームの範囲 | form要素／関連する属性 | ○ | ○ | ○ | ||
| テキストフィールド | input要素／type属性（text）と関連する属性 | ○ | ○ | ○ | ||
| テキストエリア | textarea要素／関連する属性 | ○ | ○ | ○ | ||
| ラベル | label要素／関連する属性 | ○ | ○ | ○ | ||
| 送信ボタン | input要素／type属性（submit、image）と関連する属性 | ○ | ○ | ○ | ||
| 指定のある入力フォーム | input要素／type属性（tel、email）と関連する属性／required属性 | ○ | ○ | |||
| 選択フォーム | input要素／type属性（checkbox、radio）と関連する属性／select要素／option要素／関連する属性 | ○ | ○ | |||
| ヘッダー／フッター | header要素／footer要素 | ○ | ○ | ○ | ||
| セクション | article要素／section要素／nav要素／aside要素 | ○ | ○ | ○ | ||
| 日時 | time要素／関連する属性 | ○ | ○ | |||
| 図版 | figure要素／figcaption要素 | ○ | ○ | |||
| スクリプト | script要素／noscript要素 | ○ | ○ | |||
| CSS | ||||||
| 文字エンコード | @charset／関連する値 | ○ | ○ | ○ | ||
| コメント | /* */ | ○ | ○ | ○ | ||
| 外部スタイルシート | @import／関連するパスとファイル名 | ○ | ○ | ○ | ||
| セレクター／プロパティ | ||||||
| ユニバーサルセレクター／タイプセレクター | ○ | ○ | ○ | |||
| IDセレクター／クラスセレクター | ○ | ○ | ○ | |||
| 子孫セレクター／セレクターのグループ化 | ○ | ○ | ○ | |||
| リンク疑似クラス／ユーザーアクション擬似クラス | ○ | ○ | ○ | |||
| 属性セレクター | ○ | ○ | ||||
| 構造疑似クラス | ○ | ○ | ||||
| CSSの優先順位（詳細度の計算方法／!important） | ○ | |||||
| スタイル | ||||||
| 表示 | display／関連する値 | ○ | ○ | ○ | ||
| リスト | list-style／関連する個別のプロパティ／関連する値 | ○ | ○ | ○ | ||
| 幅／高さ | width（最大幅、最小幅含む）／height（最大高さ、最小高さ含む）／関連する値 | ○ | ○ | ○ | ||
| マージン／パディング | margin／padding／関連する個別のプロパティ／関連する値 | ○ | ○ | ○ | ||
| ボックス | overflow／関連する個別のプロパティ／関連する値 | ○ | ○ | ○ | ||
| ボックスの透明度 | opacity／関連する値 | ○ | ○ | ○ | ||
| ボーダー | border／関連する個別のプロパティ／関連する値 | ○ | ○ | ○ | ||
| 配置 | position／top／bottom／left／right／関連する値 | ○ | ○ | ○ | ||
| フロート／フロートの解除 | float／clear／関連する値 | ○ | ○ | ○ | ||
| 文字色／フォント | color／font／関連する個別のプロパティ／関連する値 | ○ | ○ | ○ | ||
| テキスト | text-indent／text-decoration／text-align／vertical-align／関連する値 | ○ | ○ | ○ | ||
| テーブル | table-layout／border-collapse／border-spacing／関連する値 | ○ | ○ | ○ | ||
| 背景（単体指定） | background／関連する個別のプロパティ／関連する値（単体指定） | ○ | ○ | ○ | ||
| 背景（複数指定） | background／関連する個別のプロパティ／関連する値（複数指定） | ○ | ○ | |||
| 技法／スタイリング | ||||||
| リセットCSS／ノーマライズCSS | ○ | ○ | ○ | |||
| 見出し／ボタンのスタイリング | ○ | ○ | ○ | |||
| マージンによる左右中央揃え | ○ | ○ | ○ | |||
| clearfix | ○ | ○ | ○ | |||
| CSSスプライト／CSSシグネチャ | ○ | ○ | ||||
| 交互する背景色 | ○ | ○ | ||||
| ビジュアルデザインと配色 | ||||||
| ビジュアルデザイン | グリッドシステム／縦横比（黄金比、白銀比、和のシェイプ、1/3）／グループ化・規則化（近接、整列、反復、対比、開閉）／タイポグラフィ／カーニング／ジャンプ率／シンメトリー | ○ | ||||
| 配色 | 70：25:5の法則（ベースカラー・メインカラー・アクセントカラー）／色の寒暖／色の軽重／色の遠近／色の三原色／色の三属性（色相・彩度・明度）／トーン／Webカラー | ○ | ||||
| 画像加工の操作 | トリミング／リサイズ／カラー補正／各種エフェクト | ○ | ||||
| 運営と管理 | プライバシーポリシー／SSL／サイトマップ／バリデート／ファイル転送 | ○ | ||||