🏷️ メタタグ生成

HTML
<title>My Awesome Page</title>
<meta name="description" content="A short description of the page for search engines." />

<meta property="og:type" content="website" />
<meta property="og:title" content="My Awesome Page" />
<meta property="og:description" content="A short description of the page for search engines." />
<meta property="og:url" content="https://example.com/" />
<meta property="og:image" content="https://example.com/og-image.png" />
<meta property="og:site_name" content="My Site" />

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="My Awesome Page" />
<meta name="twitter:description" content="A short description of the page for search engines." />
<meta name="twitter:image" content="https://example.com/og-image.png" />

ページタイトル・説明文・URL・画像URLなどを入力するだけで、基本的なSEOメタタグに加えて、OGP(Open Graph)タグとTwitterカードタグをまとめて生成できるツールです。SNSでシェアされたときの表示を整えたいときに便利です。

使い方

  1. ページタイトルと説明文を入力します。
  2. ページURL・画像URL・サイト名を入力します。
  3. Twitterカードの種類を選ぶと、HTMLタグが自動的に生成されます。「コピー」でコピーして<head>内に貼り付けます。

よくある質問

OGP画像の推奨サイズはどのくらいですか?

一般的には1200×630ピクセル程度が推奨されています。

summaryとsummary_large_imageの違いは何ですか?

summaryは小さな正方形の画像、summary_large_imageは横長の大きな画像でカードが表示される形式です。ほとんどの場合summary_large_imageが見栄えが良く推奨されます。

生成されたタグはどこに貼り付ければいいですか?

HTMLファイルの<head>タグ内に貼り付けてください。