目次HTML生成
入力・設定
出力
ここにプレビューが表示されます。
目次リンク（#id）を機能させるには、元のHTML側の見出し（Hタグ）に id を付与してください。
目次HTMLの作り方（3ステップ）
- URLを入力する
目次を作りたいページのURLを入力します。URLからの取得はサーバー代行で行うため、CORS制限の影響を受けにくくなります。 - 見出しレベル（H2/H3/H4など）を選ぶ
抽出対象の見出しレベルと、目次のリスト形式（ul/ol）を選びます。記事の構成に合わせると読みやすくなります。 - 生成してコピー／保存する
「目次HTMLを生成」を押すと、目次HTMLとID提案一覧が生成されます。必要に応じてコピーして記事へ貼り付けてください。
主な活用シーン
生成した目次HTMLは、以下のようなシーンで活用できます。
- 長文記事・技術記事の読みやすさ（回遊性）を高めたい。
- マニュアル／ナレッジで章立てを明確にして見つけやすくしたい。
- LPや特集ページで、ページ内の主要セクションへ誘導したい。
- WordPress／静的サイトのテンプレに、目次ブロックを手軽に挿入したい。
- 既存HTML資産（社内文書・FAQページ等）の整理に使いたい。
よくある質問
A : はい。公開している範囲については無料でお使いいただけます。会員登録やログインも不要です。
A : ブラウザから直接外部サイトへ取得するのではなく、サーバー側で代行取得したHTMLを受け取って解析します。これによりCORS制限の影響を受けにくくなります。
A : 入力内容を保存しない前提です。URL取得はサーバー代行ですが、取得したHTMLを永続保存する設計ではありません。機密情報の扱いが必要な場合は、HTML貼り付けの利用を避けるなど運用でご調整ください。
A : 目次のリンク先となる見出し側（Hタグ）に、対応するid属性が付与されている必要があります。本ツールは「ID提案一覧」も出力するため、見出しHTMLへ id を付けてください。
A : はい。日本語見出しは英数字IDへ変換しづらい場合があるため、section-1 のような連番IDを提案することがあります。必要に応じて任意のIDへ変更してください。
A : 可能です。抽出対象の見出しレベルで H1 を含む選択肢があります。ただし一般的には、記事タイトル（H1）は目次に含めず、H2以降を目次にすることが多いです。
利用条件・注意事項・免責等
利用条件
本ツールは、次の条件でご利用いただけます。
-
完全無料
ツールの利用料金はかかりません。 -
登録不要
アカウント作成やログインなしで、そのまま使えます。 -
商用利用OK
生成した目次HTMLは、業務サイト・ブログ・資料等の商用用途でも利用できます。 -
入力保存なし
入力内容を保存されません（URLからのデータ取得はサーバー代行しております）。
外部サイトの取得・転載・二次利用に関しては、各サイトの利用規約や著作権に従ってください。サーバー代行取得はSSRF対策やレート制限等の安全策を実装していますが、利用者側でもアクセス対象URLの妥当性をご確認ください。
注意事項・免責
本ページの機能を利用したことにより発生したいかなる損害についても、 本ページの作成者・公開者・管理者は一切の責任を負いかねます。
- 本ツールは、取得HTMLから見出し文字列（textContent）を抽出して目次を生成します。元HTMLをそのまま画面に描画しないため、XSSの原因となるHTML出力は原則行いません。
- 目次リンクを機能させるには、見出し（Hタグ）にid属性を付与する必要があります。出力される「ID提案一覧」を参考に設定してください。
- URL取得はサーバー代行ですが、SSRF対策のため内部IP/予約IP等へのアクセスは遮断します（取得できないURLがあるのは仕様です）。
ご利用は、必ずご自身の責任のもとでお願いいたします。