メタタグ・OGP生成
新しいページを公開するときや、SNS でシェアされたときの表示を整えたいときに。head に貼るタグを一式作り、検索結果とカードの見え方を確認できます。
🔒 入力内容はお使いのブラウザ内だけで処理され、サーバーには送信されません。
基本
OGP・SNS カード
JSON-LD(構造化データ)
見た目の確認
実際の表示は端末やサービスの仕様で変わります。目安としてお使いください。OGP 画像は入力した URL からブラウザが直接読み込みます。
使い方
- ページタイトルと説明文を入力します。文字数がすぐ下に出て、目安を超えると色が変わります。
- ページの URL、OGP 画像の URL、サイト名を入力します。URL は
https://から始まる絶対 URL にします。 - 必要なら Twitter Card、favicon、JSON-LD の種類を選びます。
- 「生成する」を押し、結果を HTML の
<head>内に貼り付けます。下の「見た目の確認」で表示イメージを確認します。
生成するタグと目安
| タグ | 内容 | 目安 |
|---|---|---|
| title | タブと検索結果の見出し | 全角 30 字前後。超えた分は検索結果で省略されます |
| meta description | 検索結果の説明文 | 全角 80〜120 字。検索語によっては本文から抜粋されることもあります |
| canonical | 正規の URL | 自分自身の URL を書くのが基本です |
| robots | 検索エンジンへの指示 | 指定しなければ index, follow と同じ |
| og:* | SNS でシェアされたときの表示 | og:image は 1200×630、絶対 URL |
| twitter:card | X での表示形式 | summary_large_image で大きな画像、summary で小さな正方形 |
| JSON-LD | 構造化データ | 組織名やロゴ、記事の日付・著者を伝えます |
「全角換算」は全角を 1、半角英数を 0.5 として数えた値です。og:title と og:description は title と description と同じ内容で出力するので、SNS 向けに変えたい場合は生成後に書き換えてください。
こんな時に
- 新しいページを作るとき: head に入れる基本のタグを一式そろえられます。
- SNS でシェアされたときの画像や文章を整えたいとき: OGP 画像と説明文を入れてカードのイメージを確認します。
- 会社サイトや記事に構造化データを付けたいとき: JSON-LD の雛形を作れます。
注意
- 見た目の確認はイメージです。検索結果の表示幅やカードのレイアウトは、端末やサービスの仕様で変わります。
- OGP 画像のプレビューは、入力した URL からお使いのブラウザが直接読み込みます。入力内容がこのサイトのサーバーへ送られることはありません。
- JSON-LD の内容は、ページに実際に書かれている情報と一致させてください。
よくある質問
title と description は何文字にすればよいですか?
検索結果に表示される長さは画面幅やフォントで変わるため、決まった上限はありません。本ツールでは、日本語で全角 30 字前後を title の目安、80〜120 字を description の目安として警告を出しています。超えた分は「…」で省略されるだけで、ペナルティではありません。
og:image の推奨サイズは?
1200×630 ピクセル(比率 1.91:1)が、X・Facebook・LINE などで大きく表示される一般的なサイズです。ファイルは 1MB 以下、形式は JPEG か PNG が無難です。URL は https:// から始まる絶対 URL で指定してください。相対パスは認識されません。
SNS に貼っても古い画像が出ます。
SNS 側がキャッシュしています。画像の URL を変える(ファイル名か ?v=2 のようなクエリを付ける)のが確実です。Facebook はシェアデバッガーで再取得できます。
JSON-LD は必ず必要ですか?
必須ではありません。検索結果に組織名やロゴ、記事の日付などを伝えたいときに使います。入力した内容が実際のページと一致していることが前提で、ページに書いていない情報を構造化データだけに入れることは検索エンジンのガイドラインで認められていません。