記事リライト×生成AIの精度を最大化する「AIフレンドリー設計」3原則

2025年8月21日 2025年10月15日

nissy

このガイドで解説する Fetchability / Readability / Traceability は、Google PageSpeed Insights（PSI）や Core Web Vitals（LCP／INP／CLS）の改善と地続きです。
SSR（Server-Side Rendering）または静的HTMLで本文を初回レスポンスに含め、WAFには必要最小限の例外（素通しレーン）を設けます。
生成AIとの対話では、その例外の要否や設定漏れまで確認しやすくなります。
これらにより、PSIの安定した計測環境が整い、運用でも同等の結果を再現しやすくなります。

TL;DR
記事URLを渡して生成AIと対話しながらリライトする際の精度は、F（Fetchability） / R（Readability） / T（Traceability） に左右されます。これは PSIと Core Web Vitals（LCP/INP/CLS）の安定改善とも一致します。

F：SSR/静的HTMLで本文を初回レスポンスに含め、WAF除外でブロックしない

R：正しい見出し階層、要点は箇条書き・表・単位付き数値、更新日を明記

T：見出しにid付与、更新ログ、Before/After表で根拠を辿れるようにする

1. Fetchability（取得しやすさ）

1-1. 本文は初回HTMLで即出し（SSR/静的が基本）

SPAでJS実行後に本文が出るCSR構成はNG。要約・H1/H2・本文は初回HTMLに含める。
画像や装飾は遅延でもOK。本文テキストは遅延不可。

1-2. 正規化（200/301）とcanonical

ルート（例：https://example.com/）のみ200、その他の重複（/index.htmlや末尾スラッシュ違い等）は301で統一。
ページごとに正しいcanonicalを設置（重複排除・評価集中）。

1-3. WAF/ボット対策の素通しレーン

Cloudflare等のWAFで /・/sitemap*.xml・/wp-json/ をJSチャレンジやWAFブロックから除外。
Cookie同意壁・会員限定・年齢確認などは本文ブロックになるため、公開記事では避ける。

1-4. 取得テスト（CMSには未ログイン状態で確認）

シークレットウィンドウで表示を確認後、ページ冒頭テキストが見えるかcurlで確認：

curl -sSL https://example.com/your-article/ | sed -n '1,80p'

2. Readability（読みやすさ）

2-1. 見出し階層と段落設計

H1=記事主題は1つ、以降はH2→H3の順で階層を崩さない。
段落は1–3文で短く。結論や手順、数値は箇条書き・表を使う。

2-2. メタ情報の明示

最終更新日を本文に明記（JSTなどタイムゾーン付き）。
図やスクショはキャプション・altで要点をテキスト化（画像そのものは読めない前提）。
コードは言語名付きフェンス（html / bash など）。

2-3. JSON-LD最小例（Article）

itemが不足がちで中途半端なJSON-LDではなく、精度の高いJSON-LDを作リ精度高く情報を伝える。

<script type="application/ld+json">
{
  "@context":"https://schema.org",
  "@type":"BlogPosting",
  "headline":"記事リライト×生成AIの精度を最大化する「AIフレンドリー設計」3原則",
  "author":{"@type":"Person","name":"XXXXXXX"},
  "datePublished":"2025-08-21T00:00:00+09:00",
  "dateModified":"2025-08-21T00:00:00+09:00",
  "mainEntityOfPage":"https://4649-24.com/ai-friendly-article-tech-guide/"
}
</script>

3. Traceability（根拠の追跡性）

3-1. 見出しにアンカーidを付与

例：<h2 id="fetchability">Fetchability（取得しやすさ）</h2>
セクション参照や引用が楽になり、会話中に「どこに書いてあるか」を指し示しやすい。

3-2. 更新ログ（ChangeLog）を常設

何を・なぜ・いつ変更したか。生成AIの要約や差分抽出が安定。
形式例は後述テンプレを参照。

3-3. Before/After表で条件と日時を明記

測定条件（端末/ネット/初回or再訪/未ログイン）＋**測定日時（JST）**をセットで。

表テンプレ（HTML）：

<table>
  <thead>
    <tr>
      <th>指標</th><th>Before</th><th>After</th><th>測定条件</th><th>測定日時</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>PSI Mobile</td><td>78</td><td>100</td><td>SP/4G/初回/未ログイン</td><td>2025-08-21 13:00 JST</td>
    </tr>
    <tr>
      <td>LCP</td><td>3.4s</td><td>1.1s</td><td>同上</td><td>同上</td>
    </tr>
    <tr>
      <td>INP</td><td>220ms</td><td>80ms</td><td>同上</td><td>同上</td>
    </tr>
  </tbody>
</table>

4. 実装チェックリスト（コピー可）

Fetchability

初回HTMLに本文（SSR/静的）
200/301の正規化＆<link rel="canonical">
/, /sitemap*.xml, /wp-json/ をWAF除外
未ログインでも全文表示
curl で本文先頭テキストが取得できる

Readability

H1→H2→H3の正しい階層
冒頭にTL;DR（要約）
数値・手順は箇条書き/表で提示
画像のalt/キャプションで要点をテキスト化
更新日（タイムゾーン付き）を明記
JSON-LD（Article/Service）を適切に設置

Traceability

見出しにid付与（アンカー）
更新ログ（日時・理由・影響範囲）
Before/After表（条件・日時セット）
引用は短く、要点は本文で再記述

5. コピペOK：そのまま使えるテンプレ集（Gutenberg対応）

使い方：

テキスト/Markdown → 段落 or リスト or テーブルブロックに貼り付け
HTML/JSON-LD → 「カスタムHTML」ブロックに貼り付け
コード（bash等） → 「コード」ブロックに貼り付け
※ example.com や日時は自分のサイト情報に置き換えてください。SEOプラグイン併用時は構造化データの重複出力に注意。

TL;DR：このページはSSRで本文を即出しし、WAF除外で取得を妨げず、見出し・表・更新ログで論旨を明確化。生成AIとの対話で要約・改善提案・根拠参照が安定します。

5-1. Before/After 表（HTML）

<table>
  <thead>
    <tr>
      <th>指標</th><th>Before</th><th>After</th><th>測定条件</th><th>測定日時</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>PSI Mobile</td><td>78</td><td>100</td>
      <td>SP/4G/初回/未ログイン</td><td>2025-08-21 13:00 JST</td>
    </tr>
    <tr>
      <td>LCP</td><td>3.4s</td><td>1.1s</td>
      <td>同上</td><td>同上</td>
    </tr>
    <tr>
      <td>INP</td><td>220ms</td><td>80ms</td>
      <td>同上</td><td>同上</td>
    </tr>
  </tbody>
</table>

5-2. 更新ログテンプレ（テキスト）

2025-08-21：Cloudflareで/, /sitemap*.xml, /wp-json/をJSチャレンジ除外。本文を初回HTMLに含めるよう修正。
2025-08-20：H2にid付与、Before/After表を追加。

5-3. 見出しアンカー例（HTML）

<h2 id="fetchability">Fetchability（取得しやすさ）</h2>
<p>…本文…</p>

5-4. 取得テスト（bash）

curl -sSL https://example.com/your-article/ | sed -n '1,80p'

6. よくある失敗と対策

SPAで本文がJS後レンダリング
→ SSR/SSG（Static Site Generation）化。最悪でもTL;DRは初回HTMLに直出し。
WAFのJSチャレンジで本文ブロック
→ 主要パスを除外。レート制御は別レイヤーで。
見出し階層の破綻（H2の前にH3など）
→ H1は1つ。H2→H3の順を固定。
画像だけで説明
→ キャプション・本文で要点を文字化。
数値に条件がない（測定環境不明）
→ 端末・ネット・初回/再訪・未ログイン/ログインなどを併記。
更新日が本文に無い
→ 可視テキストで明記＋JSON-LDのdateModifiedも更新。

カテゴリー: CoreWebVitals

タグ: PageSpeed Insights