---
title: SEO
description: title・meta description・OGP・canonical などのメタ情報、構造化データ、sitemap.xml と robots.txt、リニューアル時のリダイレクト、Search Console
---

検索エンジンがページの内容を正しく理解し、検索結果に適切に表示できるようにするためのルールです。
見出しの書き方は[見出しタグ](/frontend/html/heading)を参照してください。

## メタ情報

ページごとに固有の値を設定します。テンプレートの初期値や、全ページ共通の値のまま公開しないでください。

```html
<head>
  <title>会社概要 | 株式会社〇〇</title>
  <meta name="description" content="株式会社〇〇の会社概要。所在地、沿革、事業内容を紹介します。" />
  <link rel="canonical" href="https://example.com/company/" />

  <meta property="og:type" content="website" />
  <meta property="og:title" content="会社概要 | 株式会社〇〇" />
  <meta property="og:description" content="株式会社〇〇の会社概要。所在地、沿革、事業内容を紹介します。" />
  <meta property="og:url" content="https://example.com/company/" />
  <meta property="og:image" content="https://example.com/ogp.png" />
  <meta name="twitter:card" content="summary_large_image" />
</head>
```

- **title**: 「ページ名 | サイト名」の形にします。トップページはサイト名と、サイトの内容を表す短い説明にします。
- **meta description**: ページの内容を要約した文章にします。検索結果に表示される文章の候補になります。
- **canonical**: 絶対 URL で、そのページの正規の URL を指定します。クエリ付きの URL や、`index.html` の有無など、同じ内容に複数の URL でアクセスできる場合に、評価を 1 つの URL にまとめます。
- **OGP**: `og:image` と `og:url` は絶対 URL で指定します。`og:image` の画像は 1200 × 630px を基本とします。

## 構造化データ

検索結果にパンくずリストや記事の情報などを表示させたい場合は、JSON-LD で構造化データを記述します（[スクリプトの読み込み](/frontend/js/loading#構造化データ)）。
`@type` ごとに必要なプロパティが異なるため、[Google 検索セントラルのドキュメント](https://developers.google.com/search/docs/appearance/structured-data)に従ってください。記述したら[リッチリザルトテスト](https://search.google.com/test/rich-results)で確認します。

## sitemap.xml と robots.txt

- **sitemap.xml**: 公開するページの URL を一覧にします。[開発環境テンプレート](/frontend/environment)の静的サイト用テンプレートでは、ビルド時に自動で生成されます。
- **robots.txt**: クロールさせないパスがある場合に設定し、`Sitemap:` で sitemap.xml の URL を示します。

```text robots.txt
User-agent: *
Disallow:

Sitemap: https://example.com/sitemap.xml
```

:::warning[robots.txt ではインデックスを防げない]
robots.txt の `Disallow` はクロールを止めるだけで、ほかのページからリンクされた URL は検索結果に表示されることがあります。検索結果に出したくないページには `<meta name="robots" content="noindex">` を指定し、robots.txt ではブロックしないでください（ブロックすると noindex を読み取れません）。
:::

テスト環境・ステージング環境は検索エンジンにインデックスさせないよう、アクセス制限と noindex を設定します（[デプロイ](/deploy-release/deploy#環境の分離)）。

## ページが存在しないとき

存在しない URL にアクセスされたら、404 ページを表示し、ステータスコードも 404 を返します。見た目だけ 404 ページで、ステータスコードが 200 のままになっていないか確認してください。
404 ページには、トップページやサイト内検索への導線を置きます。

## リニューアル時のリダイレクト

URL が変わるリニューアルでは、旧 URL から新 URL へ 301 リダイレクトを設定します。設定しないと、検索エンジンの評価や外部からのリンク、ブックマークが引き継がれません。

- 旧サイトの URL を一覧にして、それぞれの移転先を決めます。一覧は、旧サイトの sitemap.xml や、アクセス解析・Search Console のデータから作ります。
- 移転先のないページを、まとめてトップページへリダイレクトしないでください。内容が対応するページがない場合は 404 を返します。
- リダイレクトは、少なくとも 1 年間は残します。

詳しくは [Google 検索セントラルの URL 変更を伴うサイト移転](https://developers.google.com/search/docs/crawling-indexing/site-move-with-url-changes)を参照してください。

## Search Console

公開したサイトは [Google Search Console](https://search.google.com/search-console) に登録し、sitemap.xml を送信します。
インデックスの状況やエラーを確認できるため、公開後やリニューアル後は、しばらく状況を確認してください。

## 参考リソース

- [Google 検索セントラル SEO スターターガイド](https://developers.google.com/search/docs/fundamentals/seo-starter-guide)
