使い方
- タイトル、説明、ページのアドレス、プレビュー画像を入力します。
- 右側の検索結果とリンクプレビューを確認し、警告が示す点を修正します。
- タグをページの
<head>にコピーするか、ダウンロードします。
タグになるのは入力した項目のみです。すべての値はエスケープされるため、テキスト内の引用符や & で HTML が壊れることはありません。
重要なタグ
<title>は検索結果の見出しとブラウザのタブになります。検索結果に表示されるのは英字で約 60 文字です。<meta name="description">は、ページの内容に合うと検索エンジンが判断した場合に、その下に表示される抜粋です。70～160 文字を目安にしてください。<link rel="canonical">はページの唯一のアドレスを示し、別のアドレスのコピーと競合しないようにします。- Open Graph（
og:） タグは、Slack、LinkedIn、Facebook、iMessage、多くのチャットアプリがリンクプレビューのために読み取ります。 twitter:cardは X に大きな画像カードを要求します。それ以外は X も Open Graph タグを使います。
プレビュー画像
1200 × 630 ピクセル（1.91:1）、PNG または JPEG、5 MB 未満で、完全な https:// アドレスを使用してください。/og.png のような相対パスは機能しません。プレビューを作成するサービスは画像を独自に取得するためです。一部のアプリは正方形に切り取るので、重要なテキストは端から離してください。
よくある質問
メタキーワードは今も重要ですか？
いいえ。Google は何年も前から <meta name="keywords"> を無視しているため、このジェネレーターでは出力しません。
タグを更新してもリンクプレビューが変わらないのはなぜですか？
サービスはプレビューをキャッシュしており、数日間続くこともあります。LinkedIn の Post Inspector や Facebook のシェアデバッガーなど、多くのサービスにページを再取得するツールがあります。
タグはどこに置きますか？
<head> の中、閉じタグ </head> の前です。ページにすでに <title> や説明がある場合は、2 つ目を追加せずに置き換えてください。
ここのプレビューで実際の画像を確認できますか？
このページは lobsite.com からのみ画像を読み込むため、プレビューには画像の代わりにファイル名が表示されます。実際の表示は、ページを公開してチャットアプリで確認してください。