Twitter and X Cards
Twitter Cards, still named that way in the markup even though the platform is now X, are meta tags that control how a link preview looks when shared on X. If they are missing, X falls back to Open Graph tags.
  • The one tag worth adding on top of Open Graph is twitter:card, usually set to summary_large_image.
  • X reads og:title, og:description and og:image when twitter-specific versions are absent.
  • Card tags use the name attribute. Open Graph uses property.
  • Use a 1200 by 630 image for large cards, under 5 MB.
  • The official Card Validator no longer shows previews, so test by composing a post.

Twitter Cards are X's own flavour of sharing metadata. The tag names still begin with twitter: and that has not changed with the rebrand. Because X falls back to Open Graph for most values, the practical setup is short.

Minimum setup

If your Open Graph tags are in place, this one line is enough to get a large image card:

 <meta name="twitter:card" content="summary_large_image" /> 

Full setup

 <meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@yourbrand" />
<meta name="twitter:creator" content="@authorhandle" />
<meta name="twitter:title" content="Canonical Tags: The Complete Guide" />
<meta name="twitter:description" content="What canonical tags do, how to implement them and the mistakes to avoid." />
<meta name="twitter:image" content="https://www.example.com/images/canonical-tags-og.png" />
<meta name="twitter:image:alt" content="Diagram showing duplicate URLs pointing to one canonical page" /> 

Card types

  • summary: a small square thumbnail beside the title and description.
  • summary_large_image: a full-width image. The best choice for most content.
  • player: an embedded video or audio player. Requires approval and an https iframe.
  • app: a card promoting a mobile app with a download link.

Tag reference

  • twitter:card sets the card type. Required.
  • twitter:site is the handle of the website or publisher.
  • twitter:creator is the handle of the individual author.
  • twitter:title falls back to og:title. Keep it under about 70 characters.
  • twitter:description falls back to og:description. Up to about 200 characters.
  • twitter:image falls back to og:image.
  • twitter:image:alt describes the image for people using screen readers, up to 420 characters.

Image guidelines

  • Large card: a 1.91 to 1 or 2 to 1 ratio. 1200 by 630 pixels works well and matches Open Graph, so one image serves both.
  • Summary card: square, at least 144 by 144 pixels.
  • Formats: JPG, PNG, WebP and GIF. Only the first frame of an animated GIF is used. SVG is not supported.
  • File size: under 5 MB.

How cards display now

X has changed how link cards look more than once in recent years, at one point removing headlines from large image cards and later restoring them in a different layout. The lesson is that the image has to carry the message on its own. If the title disappears again, an image with a clear, readable headline built in still works.

When to set twitter-specific values

Mostly you will not need to. Add separate values only when you want different wording or a differently cropped image for X than for other platforms.

Common mistakes

  • Leaving out twitter:card, which gives you a small default card or none.
  • Using property instead of name for twitter tags. It is commonly tolerated, but name is correct.
  • Relative image URLs or images blocked by robots.txt. The X crawler identifies itself as Twitterbot and must be allowed to fetch both page and image.
  • Tags added by client-side JavaScript, which the crawler will not see.
  • Image text too close to the edges, where cropping removes it.
  • Handles written without the @ symbol.

How to test

The Card Validator at cards-dev.twitter.com stopped showing previews in 2022. The reliable method now is to paste the URL into the post composer and look at the card that appears, without publishing. X caches cards for around a week, so adding a harmless query string to the URL forces a fresh fetch while testing.

Does it affect SEO?

No, not as a ranking factor. Like Open Graph, it affects how your content performs when shared, and wider distribution can lead to links and brand searches.

The GEO angle

X content feeds Grok directly, so posts linking to your pages are part of how that assistant learns about your brand. Clear cards make those posts more likely to be engaged with and shared. Beyond X, the same clean head metadata helps any AI agent that fetches your page identify the title, author and publisher quickly.

Add your title here

This is a paragraph. Writing in paragraphs lets visitors find what they are looking for quickly and easily. Make sure the title suits the content of this text.

Contact Us Amy Time