Meta Title & Description Length Checker

How to use

1. Paste your page URL into the URL field and click Fetch. The tool fetches the live page server-side and populates the Title and Description fields with your current tags.
2. Alternatively, type or paste text directly into the Title and Description fields without fetching — useful for drafting copy before a page is published.
3. Watch the SERP Preview panel update in real time. The preview renders title in blue and description in grey, mimicking Google's Search result layout.
4. Check the pixel badge next to the title field. Green (≤ 600 px) means Google will display the full title. Amber or red means truncation is likely — shorten the title until it turns green.
5. Toggle Desktop / Mobile to see how the snippet scales on different viewports. Mobile Google uses slightly less width, so long titles can break there first.
6. Review the Checklist below the preview. Each row shows ✓ pass, ⚠ warning, or ✗ fail for one specific meta-tag requirement. Rows with a fix hint tell you exactly what to add or change.

How it works

Clicking Fetch calls the /api/page-meta endpoint, which requests your URL with a standard browser User-Agent and returns the raw HTML <head> section. The JavaScript running in your browser then:

1. Reads <title>, <meta name="description">, og:title, og:description, og:image, og:type, twitter:card, twitter:title, twitter:description, the canonical link, and the first <h1>.
2. Measures title length in characters and estimates rendered pixel width using per-character width averages calibrated against Google's Sans-Serif font rendering at 20 px — the rendering limit is approximately 600 px for titles.
3. Runs 11 checklist rules and assigns each a pass / warning / fail status with a fix hint where relevant.
4. Renders the SERP preview card using the fetched title and description, or live from the input fields if you typed manually.

Worked example

URL fetched: https://quickatwork.com/about

The description at 175 characters is over the 160-character desktop limit — the checklist row would show ⚠ and suggest trimming it. The title at 52 characters is well within the safe zone.

Reference: limits at a glance

Tips for better SERP snippets

• Front-load your primary keyword. Put the most important term near the start of the title so it stays visible even when truncated.
• Write descriptions as calls to action. A description like "Learn how to…" or "Calculate your X instantly" gives searchers a reason to click over competitors with the same ranking.
• Keep the description under 155 characters — not 160 — to account for font-width variation across devices and query contexts.
• Match og:title to your <title> (or shorten it). Social networks display og:title at larger sizes than Google, so a shorter og:title sometimes performs better.
• Use the Desktop/Mobile toggle before publishing, especially if your title is between 50 and 60 characters — that range is safe on desktop but sometimes clips on mobile.
• Fix og:image first. A missing or broken OG image is the most visible social-sharing defect and is quick to add.

Canonical tags and meta titles

The canonical tag (<link rel="canonical" href="...">) tells search engines which URL is the authoritative version of a page when the same content is accessible at multiple URLs. It interacts with meta titles in two ways:

Indexing: Google only indexes the canonical URL, so optimising the title and description on a non-canonical variant has no effect in search results. If the checker shows a canonical URL that differs from the fetched URL, confirm you are testing the correct page.

Duplicate content signals: If two pages have identical or near-identical <title> tags but different canonical URLs, Google may select the canonical it considers most authoritative regardless of which you specified. The checklist flags when the canonical URL does not match the fetched URL — review this before optimising the title copy.

Pagination: Paginated series (page=1, page=2) should each have a self-referencing canonical, not all point to page 1. Using <link rel="canonical"> pointing all pages to page 1 collapses them into one result; use it only if the first page truly represents the full content.

Common meta tag mistakes

Duplicate titles across pages. Google's Search Console flags duplicate <title> elements as a quality issue. If your CMS generates the same title for multiple pages (e.g., category pages with no unique text), each indexed URL gets the same title in search results, and they compete with each other. Every page that you want to rank independently needs a unique title.

Keyword stuffing in the title. "Buy running shoes | best running shoes India | cheap running shoes online" is a classic example. Google understands synonyms and context — repeating variants of the same keyword in the title does not improve ranking and makes the snippet look spammy to users. Write the title for the human reader first; include one primary keyword naturally.

Missing canonical on HTTPS page. If both http:// and https:// versions of your page are accessible (even if one redirects), include a canonical pointing to the HTTPS version on every page. Redirect handling alone does not always prevent the HTTP variant from being crawled.

Setting og:description longer than 200 characters. While platforms technically accept longer strings, descriptions over 200 characters are visually truncated in most share cards. The checklist flags this; keep og:description concise and front-load the most compelling phrase.

Sources

• Google Search Central — Title links in search results
• Google Search Central — Control your snippets
• The Open Graph Protocol — ogp.me
• Twitter Developer Docs — Cards

Last updated: October 2026