HTML5レベル2はJavaScriptを中心に、DOM、イベント、非同期処理、Web API、グラフィックスやマルチメディアなど、ブラウザで動くアプリの振る舞いを読み解く試験です。

更新日 2026-09-04

HTML5プロフェッショナル認定 レベル2 攻略ガイド

HTML5レベル2はJavaScriptを中心に、DOM、イベント、非同期処理、Web API、グラフィックスやマルチメディアなど、ブラウザで動くアプリの振る舞いを読み解く試験です。

このページ内のミニケース、コード、計算例は、学習方法を説明するために資格合格.webが独自に作成したものです。実際のHTML5プロフェッショナル認定 レベル2の非公開試験問題を転載・再現したものではありません。

最初に、試験形式と勉強方法を同じものにしない

HTML5プロフェッショナル認定 レベル2は、CBT。約40〜45問、試験本体約80分(NDA/アンケート込み90分)として実施されます。試験時間は90分、問題数は45問です。形式を知る目的は数字を暗記することではなく、どの練習に時間を使うかを決めることです。

同じ一時間を使うとしても、知識を増やす時間、実際に手を動かす時間、問題文を読む時間、計算やコードを追う時間では得られる力が違います。試験直前に足りない練習へ気付くのではなく、最初から試験形式に合わせて学習方法を選びます。

この試験で使う判断軸

1. スコープとthis

宣言位置・呼び出し方。

この観点は、正解を丸暗記するためではなく、初めて見る文章や条件でも候補を減らすために使います。問題演習で迷ったときは、『スコープとthis』のどこで判断が止まったかをメモすると、復習先を絞りやすくなります。

2. DOMは木構造

取得・変更・追加・削除。

この観点は、正解を丸暗記するためではなく、初めて見る文章や条件でも候補を減らすために使います。問題演習で迷ったときは、『DOMは木構造』のどこで判断が止まったかをメモすると、復習先を絞りやすくなります。

3. 非同期はキューの順

Promise/async/event。

この観点は、正解を丸暗記するためではなく、初めて見る文章や条件でも候補を減らすために使います。問題演習で迷ったときは、『非同期はキューの順』のどこで判断が止まったかをメモすると、復習先を絞りやすくなります。

4. Web APIは権限と寿命

Storage、通信、Worker等。

この観点は、正解を丸暗記するためではなく、初めて見る文章や条件でも候補を減らすために使います。問題演習で迷ったときは、『Web APIは権限と寿命』のどこで判断が止まったかをメモすると、復習先を絞りやすくなります。

JSスコープ

HTML5プロフェッショナル認定 レベル2のJSスコープ。スコープとthisから条件確認、判断、根拠確認へ進む流れ。

  1. スコープとthis宣言位置・呼び出し方。
  2. 条件を確認問題文・作業要件の条件を一つずつ分ける
  3. 判断・操作条件に合う候補だけを残す
  4. 根拠を確認なぜ他候補ではないかを説明する
JSスコープを、試験で使う判断順として整理した資格合格.web独自図。

JavaScriptは出力を追う前にスコープ

var/let/const、ブロックスコープ、クロージャを変数がどこから見えるかで図にします。

ここで大事なのは、説明を読んで分かった気になるところで止めないことです。自分で短い例を一つ作る、条件を一つ変えて結果を予測する、別の選択肢が正解になる条件を言葉にする、という小さな確認を入れます。これだけで暗記と理解を分けやすくなります。

DOM

HTML5プロフェッショナル認定 レベル2のDOM。DOMは木構造から条件確認、判断、根拠確認へ進む流れ。

  1. DOMは木構造取得・変更・追加・削除。
  2. 条件を確認問題文・作業要件の条件を一つずつ分ける
  3. 判断・操作条件に合う候補だけを残す
  4. 根拠を確認なぜ他候補ではないかを説明する
DOMを、試験で使う判断順として整理した資格合格.web独自図。

DOMはHTML文字列ではなくノードの木

親子・兄弟、querySelector、イベントターゲットをDOMツリー上で追い、追加・削除後の木の変化を確認します。

ここで大事なのは、説明を読んで分かった気になるところで止めないことです。自分で短い例を一つ作る、条件を一つ変えて結果を予測する、別の選択肢が正解になる条件を言葉にする、という小さな確認を入れます。これだけで暗記と理解を分けやすくなります。

event伝播

HTML5プロフェッショナル認定 レベル2のevent伝播。非同期はキューの順から条件確認、判断、根拠確認へ進む流れ。

  1. 非同期はキューの順Promise/async/event。
  2. 条件を確認問題文・作業要件の条件を一つずつ分ける
  3. 判断・操作条件に合う候補だけを残す
  4. 根拠を確認なぜ他候補ではないかを説明する
event伝播を、試験で使う判断順として整理した資格合格.web独自図。

イベントはどの要素で発生しどこまで伝播するか

capture/bubble、preventDefault、stopPropagationをイベントが通る経路で理解します。

ここで大事なのは、説明を読んで分かった気になるところで止めないことです。自分で短い例を一つ作る、条件を一つ変えて結果を予測する、別の選択肢が正解になる条件を言葉にする、という小さな確認を入れます。これだけで暗記と理解を分けやすくなります。

非同期キュー

HTML5プロフェッショナル認定 レベル2の非同期キュー。Web APIは権限と寿命から条件確認、判断、根拠確認へ進む流れ。

  1. Web APIは権限と寿命Storage、通信、Worker等。
  2. 条件を確認問題文・作業要件の条件を一つずつ分ける
  3. 判断・操作条件に合う候補だけを残す
  4. 根拠を確認なぜ他候補ではないかを説明する
非同期キューを、試験で使う判断順として整理した資格合格.web独自図。

Promiseとasync/awaitは実行順問題として練習

同期処理、microtask、timer等が混ざるとき、キューへ入るタイミングを書きます。

ここで大事なのは、説明を読んで分かった気になるところで止めないことです。自分で短い例を一つ作る、条件を一つ変えて結果を予測する、別の選択肢が正解になる条件を言葉にする、という小さな確認を入れます。これだけで暗記と理解を分けやすくなります。

Storage/Cookie

HTML5プロフェッショナル認定 レベル2のStorage/Cookie。スコープとthisから条件確認、判断、根拠確認へ進む流れ。

  1. スコープとthis宣言位置・呼び出し方。
  2. 条件を確認問題文・作業要件の条件を一つずつ分ける
  3. 判断・操作条件に合う候補だけを残す
  4. 根拠を確認なぜ他候補ではないかを説明する
Storage/Cookieを、試験で使う判断順として整理した資格合格.web独自図。

Web Storageや通信は保存場所・寿命・送信範囲

localStorage/sessionStorage、Cookieを期限、サーバ送信、同一オリジン等で比較します。

ここで大事なのは、説明を読んで分かった気になるところで止めないことです。自分で短い例を一つ作る、条件を一つ変えて結果を予測する、別の選択肢が正解になる条件を言葉にする、という小さな確認を入れます。これだけで暗記と理解を分けやすくなります。

学習サイクル

HTML5プロフェッショナル認定 レベル2の学習サイクル。DOMは木構造から条件確認、判断、根拠確認へ進む流れ。

  1. DOMは木構造取得・変更・追加・削除。
  2. 条件を確認問題文・作業要件の条件を一つずつ分ける
  3. 判断・操作条件に合う候補だけを残す
  4. 根拠を確認なぜ他候補ではないかを説明する
学習サイクルを、試験で使う判断順として整理した資格合格.web独自図。

API問題は使えるかだけでなくセキュリティ制約

CORS、同一オリジン、権限要求などブラウザの安全モデルを選択肢判断に使います。

ここで大事なのは、説明を読んで分かった気になるところで止めないことです。自分で短い例を一つ作る、条件を一つ変えて結果を予測する、別の選択肢が正解になる条件を言葉にする、という小さな確認を入れます。これだけで暗記と理解を分けやすくなります。

正解した問題も、理由を説明できなければ復習候補

選択式では、消去法や偶然で正解することがあります。実技試験でも、たまたま一度だけ手順が通っただけでは再現性があるとは言えません。そこで結果を正解・不正解の二択だけで見ないようにします。

同じ正解でも、迷った問題は次に似た問題が出たとき再び崩れる可能性があります。逆に不正解でも単純な入力ミスなら、教材を最初から読み直すより、そのミスを起こした確認手順だけ直す方が効率的です。

資格合格.webでは『読む→試す→原因を見る』を短く回す

教材を全部終えてから問題演習へ進む方式は、範囲が広い資格ほど最初の内容を忘れやすくなります。一つのテーマを学んだら数問・数タスクだけ試し、間違えた原因を確認して戻ります。

  1. 教材で一つのテーマを理解する
  2. 問題または実技タスクで使ってみる
  3. 正誤だけでなく迷った原因を確認する
  4. 必要な比較図・教材へ戻る
  5. まとまった段階で模擬試験や総合演習を行う

この往復を短くすると、『分からない範囲』ではなく『分からない理由』が見つかります。弱点分析も分野名だけを見るのではなく、知識不足、似た概念の混同、条件読み落とし、時間不足などへ一段掘り下げます。

学習の前半・中盤・仕上げで、同じ勉強を続けない

学習を始めたばかりの時期と、本番が近い時期では、同じ一時間でも使い方を変えます。最初から模擬試験だけを何度も回すと、知らない範囲を発見しても土台へ戻れません。反対に、直前まで教材を最初から読み続けると、知識を問題や作業へ変換する練習が不足します。

前半:全体像と基本操作に一度触れる

前半は、正答率を高く見せることより、試験範囲の地図を頭に作る時期です。知らない言葉が多くても、そこで一つずつ深追いしすぎません。各テーマについて「何をするものか」「似たものと何が違うか」「どんな問題や作業で使うか」を一度確認し、短い演習へ進みます。

この段階で大切なのは、苦手を隠さないことです。正答率が低くても構いません。むしろ早い段階で弱い分野が見つかれば、残りの学習期間をそこへ使えます。資格合格.webの弱点分析も、完成度を評価する成績表ではなく、次に戻る場所を見つける地図として使います。

中盤:似たものを比較し、間違い方を固定しない

一度範囲へ触れた後は、同じ教材を最初から読み直すより、問題演習で迷った箇所を中心に戻ります。ここで見るのは「正解は何か」だけではありません。自分が選んだ答えはどんな条件なら正解になるのか、正解との差は何だったのかを説明します。

同じ分野の不正解でも原因は複数あります。用語そのものを知らない、二つの概念を混同した、計算やコードの途中でずれた、問題文の条件を読み落とした、操作手順の確認を飛ばした、時間不足で焦った、といった原因を分けます。原因が違えば復習方法も変わります。

仕上げ:本番と同じ制約の中で再現できるかを見る

仕上げでは、新しい知識を増やす量を減らし、時間、問題数、操作環境など本番の制約を意識します。CBT。約40〜45問、試験本体約80分(NDA/アンケート込み90分)という形式に合わせ、知識を知っているだけでなく、時間内に取り出せるか、必要な操作を最後まで完了できるかを確認します。

一度だけ高得点が出たことより、別の問題でも同じ根拠で判断できることを重視します。模擬試験の結果は「合格・不合格の予言」ではなく、次の復習先を決める材料です。点数が上がっていても同じ種類のミスが続くなら、その弱点は残っています。

図は眺めるためではなく、自分で再現するために使う

このガイドには六つの図を入れています。図を一度見て分かった気になるだけでは、問題文が変わったときに使えません。図を閉じた後に、紙やメモへ主要な箱と矢印だけを書き直してみてください。全部の文章を再現する必要はなく、「どこから判断を始め、何を比べ、どこへ進むか」が書ければ十分です。

比較図なら、片方だけを説明するのではなく「AではなくBを選ぶ条件」を言葉にします。フロー図なら、途中の条件を一つ反対にしたとき行き先がどう変わるかを考えます。階層図なら、上下関係と役割を自分の言葉で説明します。見る学習を、自分で判断する学習へ変えるための使い方です。

公式情報と攻略情報を同じものにしない

試験時間、受験料、配信方法、認定の有効性などはLPI-Japanの公式情報を最終基準にします。現在このページでは「16,500円(税込)」として整理していますが、料金や申込方式は変更されることがあります。資格合格.webは申込前の最終確認先ではなく、学習と受験準備を一つにつなぐ入口として使い、申込直前には必ず公式ページへ進みます。

一方、どの順番で勉強するか、どう比較すると迷いにくいか、間違いをどう分類するかという攻略部分は、資格合格.web独自の編集内容です。公式情報と独自学習法を画面上でも混同させず、事実には確認日と出典を持たせ、攻略には「なぜこの方法を使うか」が分かる説明を残します。

『覚えた数』ではなく『説明できる境界』を増やす

資格学習で伸び悩むと、覚える用語や問題数をさらに増やしたくなります。しかし本番で迷うのは、知らない言葉だけではありません。二つとも知っているのに違いが曖昧、公式は覚えたのにどの値を入れるか分からない、コマンド名は知っているのに実行結果を予測できない、といった「境界が曖昧な知識」が失点になります。

復習するときは一つの用語を長く説明するより、似た二つを並べて違いを一文で言えるか試します。手順なら「この一段を飛ばすと何が起きるか」、計算なら「この値の単位は何か」、コードなら「この行が実行される条件は何か」を確認します。こうして境界を一つずつ明確にすると、初めて見る文章でも既知のルールへ分解しやすくなります。

試験直前は新しい知識を増やしすぎない

直前に知らない用語や手順を見つけると不安になりますが、残り時間が少ないほど、これまで複数回間違えたもの、迷った比較、時間を使いすぎた問題を優先します。新しい教材を増やすより、自分の間違い履歴を使って取りこぼしを減らします。

受験料・試験時間・配信方式・認定更新などは変更される場合があります。このガイドの資格情報は2026-09-04時点で整理していますが、申込直前には資格情報ページからLPI-Japanの公式案内を確認してください。

このガイドを読み終えたら

基礎用語が曖昧なら学習教材へ進みます。用語は分かるのに問題で迷うなら問題演習へ進み、似た概念を取り違える場面を探します。すでに演習が進んでいるなら弱点分析から原因を絞り、仕上げ段階では模擬試験・総合演習で時間配分と判断速度まで確認します。

HTML5プロフェッショナル認定 レベル2で目指すのは、答えの形を大量に覚えることではありません。問題文や作業要件から必要な知識を選び、自分の根拠で判断できる状態です。その状態を作るために、資格合格.webでは文章・図・教材・問題演習を行き来できる構成にします。