🔗 SEO & Social Guide

Meta Tags Guide: Open Graph, Twitter Cards & SEO Length (2026)

📅 August 2026⏱ 8 min read✍️ ToolLoom Editorial

Ever shared a link and watched WhatsApp pull the wrong image, or a random paragraph of your page instead of a real description? That's not a bug — it's a missing meta tag. Here's what each tag actually controls, and the exact limits that keep Google from cutting your title short.

📋 In This Article
  1. Why link previews break without meta tags
  2. SEO meta tags — title and description limits
  3. Open Graph tags — controlling social previews
  4. Twitter Card tags — a separate system
  5. Open Graph image size — getting the crop right
  6. Worked example — a complete tag set
  7. What each platform actually reads
  8. Common meta tag mistakes
  9. Frequently asked questions

Why Link Previews Break Without Meta Tags

When you paste a URL into WhatsApp, Facebook, or Twitter/X, the platform doesn't just display a plain blue link — it tries to build a rich preview card with a title, description, and image. To do this, it looks for specific meta tags in the page's HTML <head>. If those tags don't exist, the platform falls back to guessing: often grabbing the regular page <title> and the first image it happens to find in the markup, which is frequently the wrong one — a logo, an icon, or unrelated content.

🔍
SEO Meta Tags
Control how your page appears in Google search results.
📘
Open Graph Tags
Control previews on Facebook, LinkedIn, WhatsApp and most other platforms.
🐦
Twitter Card Tags
A separate, dedicated tag system specifically for X/Twitter previews.
🖼️
Preview Image
Explicitly set via og:image — otherwise the platform guesses.

SEO Meta Tags — Title and Description Limits

These are the tags Google reads to build your search result snippet. Google doesn't enforce a strict character count — it actually truncates based on pixel width — but staying within these ranges reliably avoids the ellipsis cutoff on most devices.

TagRecommended LengthWhat Happens If Too Long
<title>50–60 charactersTruncated with an ellipsis (...) in search results
meta description140–155 charactersCut off around 155–160 characters, again with an ellipsis
💡

Being too short wastes an opportunity too — a 15-character title uses only a fraction of the available display width. Aim to use the full recommended range with genuinely descriptive, keyword-relevant text rather than the bare minimum.

Open Graph Tags — Controlling Social Previews

Open Graph (OG) tags were originally introduced by Facebook and have since become the de facto standard read by most social and messaging platforms, including LinkedIn and WhatsApp. Four tags cover the essentials:

TagPurpose
og:titleThe headline shown on the preview card
og:descriptionThe supporting text shown beneath the title
og:imageThe preview image — ideally 1200×630px
og:urlThe canonical URL the card should point to

Twitter Card Tags — A Separate System

Twitter/X uses its own tag namespace (twitter:*) rather than relying purely on Open Graph. While X can sometimes fall back to reading OG tags if Twitter Card tags are absent, that fallback isn't guaranteed to render correctly — including dedicated Twitter Card tags gives predictable results specifically on that platform.

TagPurpose
twitter:cardCard type — usually "summary_large_image" for a big preview image
twitter:titleHeadline shown on the card
twitter:descriptionSupporting description text
twitter:imagePreview image for the card

Open Graph Image Size — Getting the Crop Right

Recommended OG Image
1200 × 630 pixels (1.91:1 aspect ratio)

This size and aspect ratio displays as a large, uncropped preview card on Facebook, LinkedIn, WhatsApp and most other platforms. Using a much smaller image often forces a small thumbnail-style preview instead of the large card format, and using a mismatched aspect ratio can trigger awkward automatic cropping that cuts off important parts of your image.

Worked Example — A Complete Tag Set

For a blog post titled "10 Home Loan Mistakes," a properly built tag set covers all three systems:

TagValue
<title>10 Home Loan Mistakes That Cost You Lakhs (2026)
meta descriptionAvoid these 10 common home loan mistakes that quietly add lakhs in extra interest over your loan tenure — with real examples.
og:title10 Home Loan Mistakes That Cost You Lakhs
og:image1200×630px featured image URL
twitter:cardsummary_large_image

With this full set in place, the same link will show a properly sized, correctly cropped card with the intended title and description on Google, Facebook, WhatsApp, and X — instead of three different, inconsistent guesses. Try ToolLoom's Meta Tag Generator to build and preview this exact tag set live, for any page.

What Each Platform Actually Reads

Common Meta Tag Mistakes

🔗 Generate Your Meta Tags — Free

SEO, Open Graph and Twitter Card tags with a live preview for Google, Facebook, Twitter/X and WhatsApp.

Open Meta Tag Generator →

Frequently Asked Questions

This happens when a page has no Open Graph tags defined, so the platform falls back to guessing — typically pulling the page's regular <title> tag and the first image it happens to find in the HTML, which is often not the image you'd want shown. Adding explicit og:title, og:description, and og:image tags gives you direct control instead of leaving it to the platform's guesswork.
A meta description (<meta name="description">) is what Google and other search engines may show underneath your title in search results. An Open Graph description (og:description) is what social platforms like Facebook, LinkedIn and WhatsApp show underneath the title when the link is shared. They can be set to the same text, but keeping them separate lets you optimise each for its specific context — search intent versus social scroll-stopping.
Twitter/X can fall back to reading Open Graph tags if dedicated Twitter Card tags (twitter:card, twitter:title, twitter:image, etc.) are missing, but this fallback isn't always reliable and gives you less control over exactly how the card renders on that specific platform. Including both tag sets ensures predictable, correct previews across every platform rather than hoping a fallback behaves as expected.
1200 x 630 pixels is the widely recommended standard, giving a 1.91:1 aspect ratio that Facebook, LinkedIn, WhatsApp and most other platforms display as a large, uncropped preview card. Using a much smaller image can result in a tiny thumbnail-style preview instead of the large card format, and using a mismatched aspect ratio can cause awkward automatic cropping.
Google occasionally generates its own title or snippet when it judges the page's actual on-page title or meta description doesn't accurately represent the page content, or when the provided text is too generic, keyword-stuffed, or doesn't match what a user searching that specific query is likely looking for. Writing natural, specific, accurately descriptive titles and descriptions reduces (though doesn't eliminate) how often this rewriting happens.
Meta title and description don't directly influence Google's ranking algorithm the way page content, backlinks, and technical SEO factors do. Their real impact is on click-through rate — a compelling, accurate title and description in search results makes more people choose to click your listing over a competitor's, and Google does factor click-through and engagement signals into ranking over time, making meta tags an indirect but genuinely meaningful lever.
About ToolLoom: We build free tools for Indian students, professionals and creators. All tag generation and previews run instantly in your browser — nothing is fetched, crawled, or stored. Found an error? Email contact@toolloom.in

More from ToolLoom