HTML5レベル2の合格体験記【JavaScript読解中心の独学合格法】
HTML5プロフェッショナル認定試験レベル2(Ver2.5)に独学で合格した汎用ペルソナの体験記です。レベル1合格後にレベル2へ挑戦し、JavaScript(ES6)とブラウザAPIのコード読解を軸に学習した記録を、学習配分・つまずきポイントまで具体的にまとめます。
- 想定像:Webサイト制作の経験はあるフロントエンド寄りの社会人(20代後半)
- 前提:HTML5レベル1にすでに合格済み
- 学習期間:約2ヶ月
- 総学習時間:約110時間
- 学習スタイル:JavaScript・コード読解中心の独学
受験のきっかけ
レベル1でマークアップとスタイル、Web全般の基礎を学んだものの、JavaScriptで動きをつける実装力に自信が持てなかったのが受験のきっかけです。レベル2はJavaScript(ES6)やブラウザAPIといった「動的なWeb」の知識を体系的に整理できると考え、レベル1合格の流れで挑戦しました。
学習スケジュール(実際にかけた時間の一例)
| 期間 | 内容 | 1日の学習時間 | 累計 |
|---|---|---|---|
| 1〜2週目 | JavaScript言語仕様(変数・関数・スコープ・クロージャ) | 1.5時間 | 約20時間 |
| 3週目 | ES6機能(アロー関数・分割代入・テンプレートリテラル・モジュール) | 1.5時間 | 約30時間 |
| 4週目 | 非同期処理(Promise・async/await・fetch) | 2時間 | 約44時間 |
| 5週目 | DOM操作・イベント・ブラウザAPI | 2時間 | 約58時間 |
| 6週目 | Canvas・ストレージ(localStorage・IndexedDB)・通信(WebSocket) | 2時間 | 約72時間 |
| 7週目 | デバイス性能・セキュリティ(CORS等) | 2時間 | 約86時間 |
| 8週目 | 問題演習で総仕上げ+苦手分野の復習 | 3時間 | 約110時間 |
JavaScriptの経験が浅い人はここに+30〜40時間ほど見ておくと安心です。逆に普段からコードを書いている人は80時間前後で到達できます。
使用した教材
- メインテキスト:現行Ver2.5対応の対策テキスト&問題集
- 一問一答:当サイトのHTML5レベル2一問一答(用語・仕様の反復)
- 一次情報:MDN Web Docsなどで各APIの仕様を確認
学習方法のコツ
1仕様を読むだけでなくコードを動かす
レベル2はコード読解が中心です。テキストを読むだけでは頭に入りにくいため、ブラウザの開発者ツールやエディタで小さなサンプルを実際に動かすと一気に理解が進みました。
2非同期処理は時系列で整理する
Promise・async/awaitは「いつ何が実行されるか」を時系列で書き出すと混乱が減ります。同期処理との違いを図解してから問題に取り組むのがおすすめです。
3APIはカテゴリで束ねて覚える
DOM・ストレージ・通信・Canvasなど、用途ごとにAPIをまとめて整理すると、どの場面でどのAPIを使うかが頭に残りやすくなりました。
つまずきポイントと克服法
つまずき1:クロージャ・プロトタイプ
JavaScript特有の概念で最初は手こずりました。具体的なコード例で「何が保持され、何が共有されるか」を追うことで腑に落ちました。
つまずき2:非同期処理とイベントループ
コールバック・Promise・async/awaitの関係が混乱の元。同じ処理を3つの書き方で実装して比較し、挙動の違いを体で覚えました。
つまずき3:Canvas・ストレージ系API
普段の制作で使う機会が少ないAPIは知識が薄くなりがち。頻出メソッドに絞って手を動かすことで、コード読解問題に対応できるようになりました。
これから受験する方へ
- レベル2の認定はレベル1の認定が前提。まずはレベル1から固めるのが王道
- 暗記より「コードが何をしているか読める力」を重視する
- 非同期処理とAPIは早めに着手し、繰り返し触れる
- 合格率は非公表のため、過去の合格者数値に惑わされず自分の理解度で判断する
レベル2はJavaScript実装力を整理する良い機会になります。レベル1で学んだ基礎の上に、コードを動かしながら一歩ずつ積み上げていきましょう。
HTML5レベル2 一問一答 →