OGプレビュー確認チェックリスト（X / LinkedIn）

公開前に、OG画像・タイトル・説明文が正しく表示されるかを確認するための手順です。

1. 事前確認（ローカル）

• docs 配下で npm run build を実行する
• .vitepress/dist/articles/*.html の og:title / og:description / og:image / og:url を確認する

2. 公開後URLで確認（必須）

以下のURLを本番ドメインで確認します。

• https://mechphaistos.com/knowledge/articles/maintenance-ai-equipment-index
• https://mechphaistos.com/knowledge/articles/maintenance-ai-adoption-roadmap
• https://mechphaistos.com/knowledge/articles/maintenance-ai-anomaly-detection
• https://mechphaistos.com/knowledge/articles/maintenance-ai-spare-parts-demand-forecast
• https://mechphaistos.com/knowledge/articles/maintenance-ai-inspection-optimization

3. X（Twitter）での確認

1. X Card Validator を開く
2. 対象URLを1つずつ入力してプレビュー表示を確認
3. サムネイルが古い場合は再クロールを実行

確認ポイント:

• タイトルが記事意図と一致している
• 説明文が途中で不自然に切れていない
• 画像が記事ごとに個別画像になっている

4. LinkedInでの確認

1. LinkedIn Post Inspector を開く
2. 対象URLを入力して Inspect
3. キャッシュ更新後のプレビューを確認

確認ポイント:

• タイトル・説明文の差し替えが反映されている
• OG画像の比率崩れがない

5. 反映されないときの対処

• URL末尾に ?v=20260303 のようなクエリを一時的に付与して再検証
• 再デプロイ後に再度バリデータでクロール
• og:url が canonical URL と一致しているか確認

6. 完了条件

• 5記事すべてで、X / LinkedIn の両方にて
  • 正しいタイトル
  • 正しい説明文
  • 正しい個別OG画像 が表示されること