probeo

How to add twitter:card and twitter:image:alt?

og:twitter:card page

The issue

A page without twitter:card doesn’t say which card a link to it should become when it’s shared on X, so the page has no say in whether the preview shows a large image or a small one. A twitter:image without twitter:image:alt reaches people using a screen reader with no description. The page looks complete, and the gap shows only in the shared post.

The cause is usually a template that sets the Open Graph tags and stops there. X reads its own twitter: tags, and twitter:card is the one with no Open Graph equivalent.

Scope

Each page that declares at least one og: property is checked. Probeo reads the twitter: tags from <meta name="…">, the form X’s documentation uses. A tag written as <meta property="twitter:card"> isn’t read, so it’s reported missing.

How to check you have it

  • In probeo: the page reports Missing twitter:card, or Missing twitter:image:alt when the page has a twitter:image without one. Both are warnings, stored as og:twitter:card and og:twitter:image:alt.
  • By hand: view the page source and search the <head> for name="twitter:card", and for twitter:image:alt wherever twitter:image is set.
  • With a tool: share the URL in a draft post on X and look at the card it builds before posting.

The fix

Add a twitter:card tag to every page, and a twitter:image:alt wherever a twitter:image is set.

summary_large_image shows a wide image above the title; summary shows a small square one beside it. Without its own twitter:image, the card can use the page’s og:image, so the alt text that matters most is og:image:alt; see image alt and size.

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="https://example.com/images/annual-report-share.png">
<meta name="twitter:image:alt" content="A calendar with the annual report due date circled">

Done when: every page declares a card type, every twitter:image has its alt text, and the check above comes back clean.

Do not

  • Do not write the twitter: tags with property=; use name=.
  • Do not set a twitter:image that differs from og:image unless the card needs a different crop.
  • Do not reuse the page title as the image’s alt text.

FAQ

Does a page need separate Twitter tags for the title and description?

No. Probeo checks only twitter:card and twitter:image:alt. For the title, description and image, X can use the page’s Open Graph tags.

Which card type should a page use?

summary_large_image for pages with a share image worth seeing large, such as articles and landing pages. summary for pages whose image is a logo or an icon.

Why isn’t a page with no Open Graph tags checked?

Probeo treats a page with no og: property as one that hasn’t opted into share previews, and checks none of its share tags, twitter: tags included.

Which product detects this

Probeo checks this on every page of your site as part of Site Clarity. This page explains one instance; the product tells you every page that has it.