カテゴリー: 開発ツール
HTML 見出し構造チェッカー
H1〜H6 の見出しをアウトライン化し、構造上の問題を検出
HTML を貼り付けると、H1 から H6 までの見出しをドキュメントのアウトラインとして表示し、H1 の欠落、複数の H1、見出しレベルの飛び越し、空の見出しを検出します。すべてブラウザ内で完結します。
見出しのアウトライン
H1How local browser tools workH2Why run tools in the browserH4A skipped levelH2Another sectionH3(空の見出し)
問題点
- H3 見出しにテキストがありません。
- 見出しレベルが H2 から H4 へ、レベルを飛ばして移動しています。
このページの処理はすべてブラウザ内で行われます。アップロードは一切ありません。
このツールでできること
スクリーンリーダーと検索エンジンはどちらもページの構造を理解するために見出しレベルに頼っているため、H1 の欠落、競合する2つの H1、H2 から H4 への飛び越しなどがあると、よく書かれたページでもナビゲートしづらくなってしまいます。このツールは貼り付けられた HTML からすべての見出しをドキュメントの順序どおりに抽出し、インデント付きのアウトラインとして表示したうえで、テンプレートの編集中に意図せず紛れ込みやすい構造上の問題を検出します。
使い方
- 入力欄にページや記事の HTML を貼り付けます。
- 見出しのアウトラインを確認し、ページ本来の構造と一致しているか確かめます。
- H1 の欠落や見出しレベルの飛び越しなど、検出された問題を修正します。
プライバシー
このツールはすべてブラウザ内で動作します。入力した内容がアップロード・保存・共有されることはなく、タブを閉じれば消えます。
よくある質問
- HTML はどこかにアップロードされますか?
- いいえ。ドキュメントはブラウザタブ内のトークナイザーによってテキストとして読み取られるだけで、描画やサーバーへの送信は行われません。
- 見出しレベルの飛び越しはなぜ問題なのですか?
- 支援技術の利用者は特定のレベルの見出し間をジャンプして移動することがよくあります。H2 から H4 へ直接飛ぶと、あるセクションが飛ばされたように見えたり、構造が分かりにくくなったりすることがあります。
- 空の alt 属性と空の見出しは同じものですか?
- いいえ、両者は無関係です。テキストのない <h3></h3> のような空の見出しは常に誤りであり、このツールでもそのように検出されます。一方、画像の空の alt 属性は別のパターンであり、多くの場合意図的なもので、Image Alt Text Auditor(画像 alt テキスト監査ツール)が扱います。