the IT Hustle
ツール実践マニュアル概要

メタタグ

Open Graph と Twitter Card のメタタグをソーシャル共有用のライブプレビュー付きで生成します。

100%無料・制限なし
Meta Information
Title0/60
説明0/160
URL
画像URL
OGタイプ
Twitterハンドル
Previews
Google Search Result
https://example.com
Page Title
Page description will appear here. Write a compelling meta description to improve click-through rates.
Facebook Card
No image set
example.com
Page Title
Description preview
Twitter Card
No image set
Page Title
Description preview
example.com
Generated HTML
<!-- Primary Meta Tags -->

<!-- Open Graph / Facebook -->
<meta property="og:type" content="website" />

<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image" />
ライブプレビュー
Google検索結果、Facebookシェア、Twitterカードでページがどのように表示されるか、リアルタイムで確認できます。
SEOベストプラクティス
タイトル（60文字）と説明文（160文字）の文字数インジケーターにより、SEOガイドラインに沿ったメタタグを作成できます。
100%クライアントサイド
データはブラウザから離れません。サーバー通信、ログ記録、トラッキングなし。完全にプライベートです。

メタタグを生成する方法

The IT Hustle の無料メタタグジェネレーターで、最適化されたメタタグとソーシャルカードを作成しましょう。

  1. 1
    ページ情報を入力するページのタイトル、説明文、キーワード、URLを入力します。
  2. 2
    ソーシャル共有を設定する画像URLやサイトのハンドルを含むOpen GraphとTwitter Cardのプロパティを設定します。
  3. 3
    ソーシャルカードをプレビューするGoogle、Facebook、Twitter、LinkedInで共有された際の表示を正確に確認できます。
  4. 4
    HTMLをコピーする生成されたメタタグのHTMLをコピーし、ページのhead要素内に貼り付けます。

よくある質問

Open Graphタグは、Facebook、LinkedInなどのソーシャルプラットフォームで共有された際のページの見え方を制御します。プレビューに表示されるタイトル、説明文、画像を定義します。

Twitter Cardは、Twitter/X上でリンクがどのように表示されるかを制御するメタタグです。サマリー、大きな画像、その他のリッチメディア形式を表示できます。

150〜160文字を目安にしてください。Googleはこれより長い説明文を検索結果で切り詰めることがあります。一文字一文字を無駄にしないようにしましょう。

関連ツール

SEO チェッカーRobots.txt & サイトマップファビコンジェネレーター