Twitter（X）カードジェネレーター
X（Twitter）のリンクプレビュー用のtwitter:cardメタタグを生成します。summaryまたはsummary_large_image、siteとcreatorのハンドル、タイトル、説明、画像、altに対応します。
300×157 px 以上、比率 2:1（例: 1200×600）。
<meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="@example"> <meta name="twitter:title" content="My Awesome Article"> <meta name="twitter:description" content="A short summary shown in the card."> <meta name="twitter:image" content="https://example.com/card.png"> <meta name="twitter:image:alt" content="Article cover">
Twitterカードジェネレーターとは？
このジェネレーターは、X（旧Twitter）がリンクカードの表示に使う twitter: メタタグを書き出します。カードタイプ（summaryまたはsummary_large_image）、@siteと@creatorのアカウント、タイトル、説明、画像、画像のaltテキストを扱います。
Twitterカードジェネレーターの使い方
- カードタイプを選びます。summary（小さな正方形の画像）またはsummary_large_image（横長の画像）です。
- siteとcreatorのハンドルを入力します。@を省略した場合は自動で追加されます。
- タイトル、説明、画像URL、altテキストを入力します。
- タグをページの<head>にコピーします。
例
summary, @example, title Hello
<meta name="twitter:card" content="summary"> <meta name="twitter:site" content="@example"> <meta name="twitter:title" content="Hello"> <meta name="twitter:description" content="A short summary shown in the card."> <meta name="twitter:image" content="https://example.com/card.png"> <meta name="twitter:image:alt" content="Article cover">
Twitterカードジェネレーターを使うべき場面
Xで大きな画像カードを表示したい、または作成者のアカウントをクレジットしたいときに使います。ページにすでにOpen Graphタグがある場合は、twitter:cardと、Xでは異なる値にしたいものだけが必要です。
Twitterカードジェネレーターの仕組み
ツールは常にtwitter:cardを出力し、そのほかのタグは入力されている場合にのみ、HTMLエスケープして追加します。ハンドルは@で始まるよう正規化されます。image:altは画像とともにのみ追加されます。Xは、設定されていないものについてOpen Graphタグ（og:title、og:description、og:image）にフォールバックするため、twitter:のセットは最小限で構いません。
一般的な使用例
- 通常のリンクを、Xで大きな画像カードにする。
- 記事を、著者の@ハンドルに紐づける。
- FacebookとXで異なる画像を使う。
- アクセシビリティのために、カード画像にaltテキストを追加する。
よくある質問
Open Graphタグがあれば、Twitterタグは必要ですか。
カードタイプを選ぶためにはtwitter:cardだけが必要です。それ以外は、Xがog:title、og:description、og:imageを再利用します。
どの画像サイズを使うべきですか。
summary_large_imageは、最小300×157、理想は1200×600（2:1）です。summaryは、最小144×144の正方形です。
Xへの名称変更後も機能しますか。
はい。Xは引き続きtwitter:メタタグを読み取ります。