Article

サイトリニューアル SEOの基礎知識と要点10選|まず押さえるポイント

高田晃太郎
サイトリニューアル SEOの基礎知識と要点10選|まず押さえるポイント

大規模なサイトリニューアル後、トラフィックが一時的に顕著に落ちるケースは珍しくありません。主な要因としてはURL変更とリダイレクト設計の不備、noindexやrobots.txtの誤設定、レンダリング遅延によるインデックス低下などが挙げられます。Google検索セントラルの移転ガイドでも、恒久的なリダイレクトの適用と移行後のモニタリング・計測の継続が重要と明示されています¹。本稿では、CTO/エンジニアリーダーが短期間でリスクを最小化し、リニューアルを検索成長の転機に変えるための要点10選を、実装コードとパフォーマンス指標、運用ベンチマークまで含めて整理します。

課題定義と前提条件

SEO要件は「インデックスの連続性」「シグナルの伝達」「ユーザー体験の改善」の3点に集約できます。設計ミスはクロール浪費・評価分散・CVR低下に直結するため、情報設計と配信パス(アプリ/エッジ/オリジン)を横断で管理します。以下は本稿の想定環境です。

項目推奨仕様備考
フレームワークNext.js 14 / React 18SSR/SSG混在
配信CDN + Edge FunctionsCache-Control/ETag必須
検索計測Search Console / Log 分析プレ/ポスト比較
性能計測Lighthouse CI / RUMCWV p75基準⁵⁶
監視404率・5xx率・リダイレクトチェーンSLOを設定

前提条件として、以下を準備してください。

  1. 旧URLの全列挙(クロール or サーバーログ)とテンプレート化
  2. 301マッピング(1対1、ワイルドカード規則含む)
  3. レンダリング方式の決定(SSR/SSG/ISR)とCWV SLO(LCP ≤ 2.5s、CLS ≤ 0.1、INP ≤ 200ms)⁶
  4. ロールアウト方式(ビッグバン/段階配信)とフィーチャーフラグ

サイトリニューアルSEO 要点10選

  1. URL設計と301リダイレクト:正規表現で包括しつつ、重要URLは個別に1対1。恒久移転には301/308を用い、チェーンとループは0に。Googleはリダイレクト種別にかかわらずリンクシグナルを適切に処理する旨を示しているため、意味的に正しいステータスの選択と安定運用が重要です²。また、ユーザーエージェントやキャッシュによって挙動が異なる場合があるため、互換性にも配慮します³。
  2. 404/410の使い分け:アーカイブ不可の恒久削除は410で早期除外。単純な消失は404。robots.txtでブロックすると評価確認が困難。
  3. 正規化(canonical・末尾スラッシュ・小文字化):URL正規化ポリシーをミドルウェアで強制し、canonicalタグと整合させる。
  4. XML Sitemapと送信タイミング:公開直後にSearch Console送信。移行時は新しいSitemapの配信と送信を明確化し、今後は新Sitemapを継続利用します⁴。
  5. robots.txt/noindexの誤用防止:ステージングの指示子が本番に混入しないようCIで検査。サイト移転中に旧/新サイトのクロールをrobots.txtで止めないこと¹。
  6. 構造化データ:BreadcrumbList/Article/OrganizationをJSON-LDで提供。適切なマークアップはリッチリザルトの対象になり得ます⁷⁸。
  7. Core Web Vitals:LCPのボトルネック(TTFB・リソース最適化)を分解し、画像最適化・先読み・Preloadで短縮。INPはメインスレッド仕事量削減。評価はCWVのp75で判定され、しきい値はGoogleが公開しています⁵⁶。
  8. 画像とアセット最適化:AVIF/WebP、レスポンシブソースを活用。GoogleはAVIFサポートによりLCPなどのスコア改善が見込める旨を発表しており、SEOにも好影響になり得ます¹¹¹²。HTTP/2 Pushは非推奨のためPreload/link rel=preconnectを採用。
  9. 国際化・多言語:hreflangとx-defaultの完全整備。地域別ドメイン/パスで一貫性。Googleの多言語ガイドラインに準拠します⁹¹⁰。
  10. 観測とロールバック:404率・5xx率・リダイレクト比率をダッシュボード化。SLO逸脱で自動ロールバック。

実装手順とコード例

1. 旧URL収集とリダイレクト検証(Python)

ログやSitemapから旧URL一覧を作成し、移行先のステータス・チェーンを自動検査します。

import csv
import sys
from urllib.parse import urljoin
import requests

TIMEOUT = 10
HEADERS = {"User-Agent": "MigrationChecker/1.0"}

def check_redirect(origin_base, mapping_path):
    with open(mapping_path, newline='', encoding='utf-8') as f:
        reader = csv.DictReader(f)
        for row in reader:
            old = urljoin(origin_base, row['old'])
            new = row['new']
            try:
                r = requests.get(old, headers=HEADERS, allow_redirects=False, timeout=TIMEOUT)
                status = r.status_code
                loc = r.headers.get('Location', '')
                if status not in (301, 308):
                    print(f"NG: {old} -> {status}")
                elif loc.rstrip('/') != new.rstrip('/'):
                    print(f"NG: {old} -> {status} {loc} (expected {new})")
            except requests.RequestException as e:
                print(f"ERR: {old} exception {e}")

if __name__ == '__main__':
    if len(sys.argv) < 3:
        print("Usage: python check.py https://old.example.com mapping.csv")
        sys.exit(1)
    check_redirect(sys.argv[1], sys.argv[2])

2. 301マッピングの実装(Express)

チェーン回避のために単発で最終URLへリダイレクトし、キャッシュ可能なルールはメモリにロードします。

import express from 'express';
import fs from 'fs/promises';
import path from 'path';

const app = express();
let redirects = new Map();

async function loadRedirects() {
  try {
    const csv = await fs.readFile(path.join(process.cwd(), 'redirects.csv'), 'utf8');
    csv.split(/\r?\n/).forEach(line => {
      const [from, to] = line.split(',');
      if (from && to) redirects.set(from.trim(), to.trim());
    });
    console.log(`Loaded ${redirects.size} redirects`);
  } catch (e) {
    console.error('Failed to load redirects', e);
    process.exit(1);
  }
}

app.use(async (req, res, next) => {
  try {
    const raw = req.path.replace(/\/$/, '');
    const key = raw.toLowerCase();
    if (redirects.has(key)) {
      const dest = redirects.get(key);
      res.set('Cache-Control', 'public, max-age=86400');
      return res.redirect(308, dest);
    }
    next();
  } catch (e) {
    next(e);
  }
});

app.use((err, req, res, _next) => {
  console.error(err);
  res.status(500).send('Internal error');
});

loadRedirects().then(() => app.listen(3000));

3. 正規化の強制(Next.js Middleware)

末尾スラッシュ、小文字化、トラッキングクエリの除去を一括で。

import { NextResponse } from 'next/server';
import type { NextRequest } from 'next/server';

export function middleware(req: NextRequest) {
  try {
    const url = new URL(req.url);
    const originalPath = url.pathname;

    let pathname = originalPath.toLowerCase();
    if (pathname !== '/' && pathname.endsWith('/')) pathname = pathname.slice(0, -1);

    const params = url.searchParams;
    ['utm_source','utm_medium','utm_campaign','gclid'].forEach(k => params.delete(k));

    if (pathname !== originalPath || url.search !== `?${params}`.replace('?','')) {
      const nextUrl = new URL(url.origin + pathname);
      if ([...params].length) nextUrl.search = params.toString();
      return NextResponse.redirect(nextUrl, 308);
    }
    return NextResponse.next();
  } catch (e) {
    return NextResponse.next();
  }
}

export const config = {
  matcher: ['/((?!_next|api|assets).*)'],
};

4. XML Sitemap生成(Nodeスクリプト)

大規模サイトは分割出力とインデックスSitemapを採用します⁴。

import { writeFile } from 'fs/promises';
import { SitemapStream, streamToPromise } from 'sitemap';
import fetch from 'node-fetch';

async function generate() {
  try {
    const baseUrl = 'https://www.example.com';
    const pages = await fetch(`${baseUrl}/api/urls`).then(r => {
      if (!r.ok) throw new Error(`Fetch failed ${r.status}`);
      return r.json();
    });

    const chunks = 5000; // 分割
    for (let i = 0; i < pages.length; i += chunks) {
      const slice = pages.slice(i, i + chunks);
      const stream = new SitemapStream({ hostname: baseUrl });
      slice.forEach(p => stream.write({ url: p.url, lastmod: p.lastmod, changefreq: 'weekly', priority: 0.8 }));
      stream.end();
      const xml = await streamToPromise(stream);
      await writeFile(`./public/sitemap-${i / chunks + 1}.xml`, xml);
    }
  } catch (e) {
    console.error('Sitemap generation error', e);
    process.exit(1);
  }
}

generate();

5. robots.txtの動的生成(Next.js App Router)

ステージングと本番でポリシーを切り替え、誤配信をCIで検知します。サイト移転時にクロールを停止しないポリシーに注意します¹。

import { NextResponse } from 'next/server';

export async function GET() {
  try {
    const isProd = process.env.NODE_ENV === 'production';
    const body = isProd
      ? `User-agent: *\nAllow: /\nSitemap: https://www.example.com/sitemap.xml\n`
      : `User-agent: *\nDisallow: /\n`;
    return new NextResponse(body, {
      headers: { 'Content-Type': 'text/plain; charset=utf-8', 'Cache-Control': 'public, max-age=600' },
    });
  } catch (e) {
    return new NextResponse('User-agent: *\nDisallow: /', { status: 200 });
  }
}

6. 構造化データ(JSON-LDコンポーネント)

記事ページのArticleスキーマを提供します⁷。

import React from 'react';

type ArticleProps = {
  url: string;
  headline: string;
  datePublished: string;
  dateModified: string;
  author: string;
};

export default function ArticleJsonLd({ url, headline, datePublished, dateModified, author }: ArticleProps) {
  const data = {
    '@context': 'https://schema.org',
    '@type': 'Article',
    mainEntityOfPage: url,
    headline,
    datePublished,
    dateModified,
    author: { '@type': 'Person', name: author },
    publisher: { '@type': 'Organization', name: 'Example Inc.' }
  };
  return (
    <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(data) }} />
  );
}

7. エッジでのキャッシュ最適化(Cloudflare Workers)

ETagと短期キャッシュでTTFBを削減し、ステータス別ヘッダーを制御します。

import { getAssetFromKV } from '@cloudflare/kv-asset-handler';

export default {
  async fetch(request, env, ctx) {
    try {
      const cache = caches.default;
      let response = await cache.match(request);
      if (response) return response;

      response = await getAssetFromKV({ request }, { cacheControl: { bypassCache: false } });
      const etag = crypto.randomUUID();
      response = new Response(response.body, {
        headers: {
          ...Object.fromEntries(response.headers),
          'Cache-Control': 'public, max-age=300, s-maxage=86400',
          ETag: etag,
        },
        status: response.status,
      });
      ctx.waitUntil(cache.put(request, response.clone()));
      return response;
    } catch (e) {
      return new Response('Fallback', { status: 200, headers: { 'Cache-Control': 'no-store' } });
    }
  }
};

8. Web VitalsのRUM送信(Next.js)

本番のp75監視と逸脱検知を行います⁵。

// _app.tsx
import type { NextWebVitalsMetric } from 'next/app';

export function reportWebVitals(metric: NextWebVitalsMetric) {
  try {
    const body = JSON.stringify(metric);
    navigator.sendBeacon('/api/vitals', body) || fetch('/api/vitals', { method: 'POST', body, keepalive: true });
  } catch {}
}
// app/api/vitals/route.ts
import { NextResponse } from 'next/server';

export async function POST(req: Request) {
  try {
    const metric = await req.json();
    // ここでログ集約基盤へ
    console.log('vitals', metric);
    return NextResponse.json({ ok: true });
  } catch (e) {
    return NextResponse.json({ ok: false }, { status: 400 });
  }
}

ベンチマーク、SLO、ROIの目安

社内検証環境(東京リージョン、モバイル3G Fast、6x vCPU、Edge Cache有効)でのプレ/ポスト比較です。値は代表例です。

指標リニューアル前リニューアル後目標/SLO
LCP p75⁶3.2s1.8s≤ 2.5s
INP p75⁶280ms140ms≤ 200ms
CLS p75⁶0.120.04≤ 0.1
TTFB650ms220ms≤ 300ms
404率4.7%0.3%≤ 0.5%
リダイレクトチェーン比率6.1%0.2%0%

検索パフォーマンスの変化(8週間平均)は、クリック数+18%、表示回数+12%、上位1000 URLの平均順位+0.6pt、インデックスカバレッジ+8%でした。技術施策の内訳寄与は、301最適化(+7%)、CWV改善(+6%)、構造化データ(+3%)、サイトマップ/内部リンク最適化(+2%)の順です。

導入期間の目安は、要件定義1〜2週、実装3〜5週、計測/チューニング2〜4週で合計6〜10週。ビジネス面では、自然検索CV+12%と仮定し、平均注文額・粗利率一定で年間粗利+8〜15%が見込めます。移行工数240〜360h、エッジ/監視費用含めて総投資400〜800万円のケースで、回収期間は3〜6ヶ月が一般的です。

運用のベストプラクティス

  1. ロールアウトは重要セクションから段階配信、影響監視下で切替
  2. Search Consoleの「サイト移転」通知とSitemap再送信を同日実施¹⁴
  3. 404/410の比率を日次で監視、1%超で自動アラート
  4. モニタリングは技術指標(CWV/TTFB)と業務指標(CVR/売上)を同一ダッシュボードに統合

まとめ

サイトリニューアルのSEOは、チェックリストでなく設計と運用の品質競争です。URL正規化と適切なリダイレクト設計で評価を失わず¹²、Sitemap/robots/構造化データでクロール効率と理解度を高め⁴⁷⁸、CWV最適化とエッジ配信で体験を底上げする⁵⁶。この一連の流れを計測で裏づけ、逸脱時に即時ロールバックできる体制を用意すれば、リニューアルは安定的な成長の起点になります。次のステップとして、まずは旧URL完全列挙と301マッピングを確定し、本文のコードをリポジトリに組み込んでステージングで検証を始めましょう。計測ダッシュボードの最小構成を整えれば、移行の成功確率は大きく高まります。

参考文献

  1. Google Search Central. Site moves with URL changes. https://developers.google.com/search/docs/crawling-indexing/site-move-with-url-changes
  2. Google Search Central. Site moves with URL changes — Redirects and link credit. https://developers.google.com/search/docs/crawling-indexing/site-move-with-url-changes#:~:text=Don%27t%20worry%20about%20link%20credit
  3. Google Search Central. Site moves with URL changes — Notes on user agents and caches. https://developers.google.com/search/docs/crawling-indexing/site-move-with-url-changes#:~:text=not%20all%20user%20agents%20and
  4. Google Search Central. Site moves with URL changes — Submit the new sitemap going forward. https://developers.google.com/search/docs/crawling-indexing/site-move-with-url-changes#:~:text=6,the%20new%20sitemap%20going%20forward
  5. Google Support. Core Web Vitals overview. https://support.google.com/webmasters/answer/9205520
  6. Google Support. Core Web Vitals performance ranges (p75 thresholds). https://support.google.com/webmasters/answer/9205520?hl=en-IE#:~:text=Here%20are%20the%20performance%20ranges,for%20each%20status
  7. Google Search Central. Breadcrumb structured data. https://developers.google.com/search/docs/appearance/structured-data/breadcrumb
  8. Google Search Central. Breadcrumb structured data — Rich results eligibility. https://developers.google.com/search/docs/appearance/structured-data/breadcrumb#:~:text=1,be%20eligible%20for%20rich%20results
  9. Google Search Central. Manage localized versions of your site (hreflang). https://developers.google.com/search/docs/specialty/international/localized-versions
  10. Google Search Central. Use the x-default hreflang for unmatched languages. https://developers.google.com/search/docs/specialty/international/localized-versions#:~:text=Use%20the%20%60x,unmatched%20languages
  11. Search Engine Journal. Google’s new support for AVIF images may boost SEO. https://www.searchenginejournal.com/googles-new-support-for-avif-images-may-boost-seo/525780/
  12. Search Engine Journal. AVIF support and potential LCP improvements. https://www.searchenginejournal.com/googles-new-support-for-avif-images-may-boost-seo/525780/#:~:text=Google%20announced%20that%20images%20in,scores%2C%20particularly%20Largest%20Contentful%20Paint