Draftcamp

メタタグ生成器

タイトル、説明、Open Graph、Twitterタグを生成しピクセル確認

ブラウザ内で完結。テキストは一切アップロードされません

0 / 600px
0 / 920px

1200x630、絶対URL、HTTPS

タイトルを入力してタグを生成しよう

タイトル、説明、正規URL、Open Graph、Twitterタグが生成され、貼り付け準備完了です。

まだ重要なメタタグはどれか

多くのガイドより少ないです。ページにはタイトル、説明、カノニカル、リンク共有時に正しく表示されるためのOpen Graphが必要です。他はほとんどがテンプレートからの名残で、検索の仕組みが変わった今は不要です。

本当に必要なものだけです。

  • タイトル - 最も強力なページ内関連シグナルで、実際にクリックされる文言。
  • 説明文 - ランキング要因ではありません。広告文であり、すでにランクインしている時にクリックを獲得します。
  • 正規URL - 検索に正しいURLを伝えます。リダイレクトではなく200を返すURLを指定しましょう。リダイレクトを指す正規URLはよくある見落としでコストがかかります。
  • og:image - 共有されるリンクとSlackで壊れて見えるリンクの違いです。

削除すべきもの

  • keywords - 2009年以降Googleに無視されています。
  • revisit-after, author, distribution - どの検索エンジンも読みません。
  • 重複したTwitterタグ - XはOpen Graphにフォールバックします。 twitter:card 本当に何かを付け加えています。

タグがあるなら、切り捨てられずに表示されるか確認しよう。 SERPプレビューで測ろう 出荷前に。

よくある質問

Open GraphとTwitterタグは両方必要?
ほとんどの場合不要です。XはTwitterタグがなければOpen Graphにフォールバックするので、og:titleとog:descriptionで十分です。明示的に追加すべきタグはtwitter:cardだけで、リンクが小さなサムネか大きな画像かを決め、クリック率に大きく影響します。
og:imageの推奨サイズは?
1200×630ピクセル、約5MB以下、HTTPSの絶対URLで提供してください。相対パスは使えません:カードを取得するクローラーにページの文脈がないため解決できません。重要な内容は端に寄せないでください。プラットフォームごとにトリミングが異なります。
Googleは自分が書いた説明文を使う?
場合によります。Googleはページの内容がメタ説明よりクエリに合っていると判断すると説明文を再生成します。特にロングテールクエリで多いです。それでも書いておくべきです。ブランドやナビゲーション検索ではクリック率に直結するためです。
keywordsメタタグは追加する価値ある?
いいえ。Googleは2009年からkeywordsメタタグを無視しており公言しています。このジェネレーターは意図的に出力しません。もしツールがkeywords欄を提供するなら、そのツールのアドバイスがどれだけ最新かの指標と考えていいでしょう。
タイトルの引用符がエスケープされるのはなぜ?
HTML属性内のダブルクオートをエスケープしないと早期に閉じてタグが切れてしまうからです。生成コードはアンパサンド、引用符、山括弧をエスケープし、貼り付けた内容が正しいHTMLとして正確に表示されるようにしています。