見出しは大きさではなく階層

HTML入門 / 全 5

作成品質の確認

全チェックの通過状況

スライド 4 / 4枚、チェック 5 / 5項目が通過

全項目通過・次へ進めます

完成後の5チェック

本文・学習内容

本文・要件・正解コード・前後レッスンを監査。h1を増やさず、自己紹介・趣味・経歴を同じ深さのh2として置く契約に固定。

通過

ソース・課題との接続

実デッキ4枚を配線。教材JSONを実レッスン採点へ優先適用し、textsチェックでh2の個数・順序・内容、count maxでh1の上限を確認。

通過

見た目・操作

全4枚を個別・全体で操作し、原寸画像と印刷を目視。狭画面、quiz、キーボード、hydration、runtime error、stage overflowなし。切替アニメ中の欠けた撮影を検知し、完了待ちをQAへ追加して証拠を再取得。

通過

再利用・パターンマスター

既存4パターンを再利用し、各カードを目視。フォールバックなし。本文内heading-outlineはデッキへ重複再掲していない。

通過

型・テスト・回帰

前後レッスンと全教材を回帰確認。全体typecheckには既存のroute生成・shared-ui・HtmlLessonView CodingLessonPageProps等の基準エラーがあるが、今回追加したchecks/html-track-contractsには該当エラーなし。

通過

見出しを拾うと構造が見える

見出しの階層は、ブラウザや検索エンジンがページの構造を理解する手がかりになります。

見出しから見たページの構造

文字何のまとまりか
h1山田 太郎ページ全体
h2自己紹介ページの中の1章
h2趣味ページの中の1章
h2経歴ページの中の1章

囲った h1 がページ全体、その下の h2 が同じ深さの3つの章です。

これは見出しから構造を確認する表です。画面に目次が自動で表示されるという意味ではありません。

2 / 5

このスライドが付いているレッスンを開く