お問い合わせ
お問い合わせ
ホーム > WordPress > SEO対策 > Twitterカード（Xカード）の設定と見え方の違い【初心者向け】

Twitterカード（Xカード）の設定と見え方の違い【初心者向け】

WordPress
Twitterカード（Xカード）の種類と見え方の違いを解説するイメージ画像
Twitterカード（Xカード）の種類と表示の違いを視覚的にまとめたアイキャッチ画像です。

X（旧Twitter）では、URLを投稿するとページの概要を自動で読み取り、カード形式で表示されます。
この機能は「Twitterカード（Xカード）」と呼ばれ、適切に設定するとクリック率の向上や投稿の視認性向上につながります。
本記事では、Twitterカードの基本、設定方法、種類ごとの表示の違いについて初心者向けに整理します。

Twitterカード（Xカード）とは

Twitterカードとは、X上でWebページの内容を視覚的に伝える仕組みです。
OGP（Open Graph Protocol）の情報や Twitter独自のメタタグを基に生成され、投稿されたURLの見え方をコントロールできます。

OGPの基本的な役割については、
metaタグの基本とSEOにおける役割
でも詳しくまとめています。

なぜTwitterカードの設定が重要なのか

Twitterカードが適切に設定されていると、以下のメリットがあります。

  • 投稿内容が目に止まりやすくなる
  • プレビュー画像で視認性が向上する
  • 投稿リンクのクリック率向上が期待できる
  • SNS流入時のブランドイメージが安定する

特に画像の表示品質は大切で、OGP画像の最適化については
WordPressで安全に出力するためのエスケープ関数まとめ や
EWWW Image Optimizerの画像最適化ガイド
でも関連知識として触れています。

Twitterカードの種類と見え方の違い

Twitterカードには複数の種類があり、設定内容によって表示が変わります。
代表的な2種類は以下のとおりです。

1. Summary Card（サマリーカード）

テキスト中心のコンパクトなカードです。

  • 小さめのサムネイル画像
  • タイトル
  • 説明文
  • サイト名

文章主体のページや、ニュース・コラムなどでよく使われます。

2. Summary Card with Large Image（大きな画像付きカード）

大きい横長の画像が表示され、視覚的な訴求力が強くなります。

  • 横幅いっぱいの大きなサムネイル
  • タイトル
  • 説明文

ブログや商品ページなど、画像を強調したいページで採用されることが多い形式です。
画像サイズや比率については
画像のalt属性の正しい書き方とSEO効果
の中でも補足しています。

Twitterカードに必要なタグ

Twitterカードを表示するには、以下のメタタグを head 内に入れる必要があります。

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="ページタイトル">
<meta name="twitter:description" content="ページ説明文">
<meta name="twitter:image" content="画像URL">

一般的には、OGPタグと併用しながら設定します。
OGPタグの考え方は
固定ページのURLを取得する方法
など URL やリンク設定の記事と合わせて理解しておくと便利です。

WordPressで設定する場合

WordPressでは、専用プラグインを使うことで Twitterカードを簡単に設定できます。
代表的な方法は次の通りです。

● SEOプラグインを使用する方法

AIOSEO や Yoast SEO などのSEOプラグインでは、
Twitterカード用の画像・タイトル・説明文が個別に設定できます。

AIOSEOの構造については
WP REST API のアクセス制御方法
で触れているため、併せて確認すると設定の理解が深まります。

● テーマ側で出力される場合

一部テーマでは、OGPやTwitterカードのタグが自動生成されます。
テーマファイルを編集する場合は、
WordPressでテーマファイルを編集する方法
や
子テーマの作り方とfunctions.phpを安全に編集する手順
を参考に、必ず子テーマ側でカスタマイズするのが安全です。

設定を反映させるポイント

Twitterカードはすぐに反映されないことがあります。
特に画像を変更した際は、キャッシュの影響で旧画像が表示されるケースがあります。

反映確認には Twitter Card Validator（X Card Validator）が有効です。
URLを入力するだけで、現在読み取られているカード情報が確認できます。

また、WordPress環境の場合は、キャッシュプラグインが影響することもあります。
キャッシュ管理の考え方は
WordPressプラグインの基本と安全な使い方
なども参考になります。

Twitterカードの最適な画像サイズ

Twitter公式推奨のサイズは次のとおりです。

  • 推奨：1200 × 630px（OGPと同じ）
  • 最低：600 × 335px
  • 形式：JPG / PNG

画像は左右が切れないよう適切な余白を確保する必要があります。
OGP画像の作り方については
WP Debug とエラーログの見方
や
テーマカスタマイズの基本と安全な作業手順
の OGP 例でも触れています。

よくある表示トラブルと対処法

Twitterカードで起きやすいトラブルには、次のようなものがあります。

● 画像が表示されない

OGP画像の URL が正しく設定されていない、またはサイト側の権限設定が原因となる場合があります。

● 古い画像が表示され続ける

キャッシュ（サイト側・ブラウザ側・X側）の影響です。バリデータで再取得を行うと改善することがあります。

● タイトルが途中で切れてしまう

タイトル文字数が長い場合、表示上省略されることがあります。
タイトル最適化の考え方は
wp_enqueue_style / wp_enqueue_script の基本
の記事でも、メタ情報の整理に触れています。

まとめ

Twitterカード（Xカード）は、X上でのリンク表示を最適化するための重要な仕組みです。
適切に設定されていると、投稿の視認性向上やクリック率改善が期待できます。

  • Summary と Large Image の2種類がある
  • 画像は 1200 × 630px が基本
  • 反映されない場合はバリデータで確認
  • WordPressでは SEOプラグインで簡単に設定可能
  • OGPやメタタグと合わせて管理すると効果が高まる

WebサイトのSNS流入を安定させるためにも、Twitterカードを正しく設定しておくことは非常に重要です。