ZeroTool Workbench

Meta タグジェネレーター

<head> メタタグを一括生成 — Open Graph・Twitter カード・Schema.org JSON-LD・SEO 基本項目。Google / Facebook / Twitter / Discord のリアルタイムプレビュー対応。完全ブラウザ完結。

100% クライアントサイド データはブラウザ外に出ません 無料 · 登録不要
Basic SEO
Open Graph
Twitter Card
Schema.org JSON-LD

Outputs a minimal JSON-LD with name / description / url / image fields.

Generated <head> meta 
 
  
            
  
 
関連ツール
 
    Robots.txt ジェネレーター robots.txtをオンラインで生成。User-agentルール・許可/禁止パス・Sitemap URLを設定。完全ブラウザ完結。     Favicon ジェネレーター 絵文字・テキスト・画像・SVGから完全なファビコンセットを生成。ICO・複数サイズPNG・apple-touch-icon・webmanifestを一括出力。完全ブラウザ完結。     URL パーサー URLをプロトコル・ホスト・ポート・パス・クエリパラメータ・ハッシュに即座に分解。ブラウザネイティブ解析。     UUID ジェネレーター v4 UUIDを即座に生成。単体またはバッチ対応。     カラーコンバーター HEX・RGB・HSL形式間のカラー変換。ライブプレビュー付き。     正規表現テスター マッチハイライトとキャプチャグループ詳細付きでリアルタイムに正規表現をテスト。   
 
  
  
   
使い方


  1. タイトル、説明文、正規 URL の 3 つの中核フィールドを入力します。
  2. og:image URL を設定してソーシャルプレビューを正しく表示。1200x630 の PNG / JPEG が万能です。
  3. Twitter カード形式 を選択：ヒーロー画像付き投稿は summary_large_image、コンパクト表示なら summary。
  4. 必要に応じて Schema.org @type を選び、最小の JSON-LD ブロックを出力します。
  5. 右側プレビューのタブを切り替え、Google SERP / Facebook / Twitter (X) / Discord での展開を確認。
  6. 生成された HTML をコピーし、ページの <head> 内に貼り付けます。


生成される内容


  • 基本 SEO メタ——title、description、canonical、author、keywords、theme-color、viewport、robots。
  • Open Graph——og:type、og:title、og:description、og:url、og:site_name、og:image（width / height / alt 含む）、og:locale。
  • Twitter カード——twitter:card、twitter:site、twitter:creator、twitter:title、twitter:description、twitter:image。
  • Schema.org JSON-LD——最小の WebPage / Article / Product / Organization ブロック（name / description / url / image）。


画像サイズ早見表


プラットフォーム推奨サイズアスペクト比
Facebook / LinkedIn / Discord1200x6301.91:1
Twitter summary_large_image1200x6002:1
Twitter summary400x4001:1
Pinterest1000x15002:3


出力をどこに貼るか


生成されたメタブロックは <head> 内、<meta charset> の直後・サードパーティスクリプトの前に置くのがおすすめ。クローラーは順序を気にしませんが、ソーシャルメタを 1 か所にまとめておくと監査が楽になります。


同じ SEO スタックで併用するなら：Robots.txt ジェネレーター（クロール規則）と Favicon ジェネレーター（アイコンセット）が便利です。
  
  
 
FAQ
 
 Open Graph と Twitter カードの違いは？ 
Open Graph（og:）は Facebook が提唱したソーシャルプレビュー規格で、LinkedIn・Slack・Discord・iMessage など主要プラットフォームが現在ほぼすべて対応します。Twitter（X）は独自の twitter:* タグでカード形式を細かく制御します。両方が存在する場合、Twitter は自前のタグを優先し、欠けている項目だけ Open Graph にフォールバックするため、両方併記が一般的です。
 
 og:image の推奨サイズは？ 
1200x630 px（1.91:1）が Facebook・LinkedIn・Discord 共通の安全値です。Twitter の summary_large_image は 2:1 を期待するため 1200x600 も問題なく表示されます。ファイルサイズは 5 MB 以下、PNG または JPEG が安心。多くのプラットフォームは og:image:width / og:image:height を尊重して配信します。
 
 Open Graph と Schema.org JSON-LD は両方必要？ 
対象が異なります。Open Graph はソーシャルプラットフォームの unfurl プレビュー用、Schema.org JSON-LD は Google のリッチリザルトとクローラーのセマンティック理解用です。重複は title / description / image くらいで小さく、検索のリッチスニペットと SNS のリッチプレビューを同時に取りに行きたいなら、両方書くのが定石です。
 
 このツールは画像をアップロードしますか？ 
アップロードしません。画像 URL は生成されたメタブロックに文字列として埋め込まれ、プレビュー側では img の src として参照されるだけです。サーバーへのリクエストもアップロードもなく、データはブラウザから一切外に出ません。
 
 Canonical URL が Open Graph にとって重要な理由は？ 
Canonical URL は og:url としても出力されます。指定がないとソーシャルプラットフォームはリクエスト URL から推測しますが、リクエスト URL は utm パラメータやスラッシュ有無、www / apex の違いで頻繁にブレます。誤った canonical はシェア数を分散させ、同一記事の重複排除を壊します。