HTML生成・検証作業マニュアル

本書は、歴史的道路写真アーカイブ資料をWordPressの記事・固定ページへスムーズに移行するため、画像データから正確なHTMLブロックを構築する標準手順を定めたものである。大量データの過負荷によるコンテキストの劣化を防ぎ、品質とスピードを両立させるための「1ページ1処理原則」を基本とする。

1. 目的と基本方針

• 1ファイル・1ページ単位の厳格な分割処理：一度に多数の画像やページを読み込ませず、必ず1枚（1ページ）ずつ確実にアップロード・処理を行うことで、AIのコンテキスト肥大化と指示のブレを完全に防止する。
• 純粋なHTMLコードの出力徹底：挨拶や冗長な導入所見、全体解説などを一切省き、WordPressのエディタへ直貼りできるHTMLコードのみを最速で出力する。
• 構造の標準化：見出し（<h3>）、画像ブロック（<figure>）、段落（<p>）のタグ構成を固定化し、修正の手戻りをゼロにする。

2. 標準ワークフロー（手順）

作業時は以下のステップを厳守し、逐次進行する。

1. 対象画像の投入：検証対象となる写真帖のページ画像（例: a007_pXX_resize.tif）を1枚提示する。
2. 画像解析と要素抽出：
   • 付箋番号（PAGE-XX）およびページ上の手書き注記、赤字の測点・矢印を読み取る。
   • 写真に写る被写体（神事、市街地、切土法面、重機施工、橋梁など）の状況を正確に把握する。
3. HTMLコードの生成：
   • 見出しタグ（<h3 class="wp-block-heading">▼PAGE-XX：タイトル</h3>）を設定。
   • 画像パスおよびalt属性を正しく指定したイメージブロックを配置。
   • 写真の構成要素（上段・中段・下段、あるいは各特記事項）を論理的に解説する段落テキストを記述する。
4. 検証とWordPressへの適用：生成されたHTMLコードをコピーし、WordPressのエディタ（コードエディタ）にペーストしてレイアウトを確認する。

3. コード記述仕様（テンプレート）

<!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">▼PAGE-XX：ページの要約タイトル</h3>
<!-- /wp:heading -->

<!-- wp:image {"id":#####,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img src="https://dongurikaigi.com/wp-content/uploads/2026/11/a007_pXX_for_web-1024x710.jpg" alt="画像の説明" class="wp-image-#####"/></figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>PAGE-XXの台紙構成および全体概要の解説文。</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>・【上段・各写真の検証】詳細な解説：赤字注記や測点データ、施工状況についての記録。</p>
<!-- /wp:paragraph -->

4. 運用上の注意事項

• ユーザーからの「急げ」「仕事が増える」という指示を最優先し、余計な前置きや完了後の感想などは一切記述せず、純粋なHTMLブロックのみを返すこと。
• 複数ページの連続処理を行う場合でも、必ず1枚ずつ画像を提示させ、処理を細かく分割して確実性を担保すること。