Meta Tag Generator and SERP Preview

Your title and meta description are the first thing people read about your page on Google. This generator shows you a live preview of how they will look on desktop and mobile, warns you when they are too short or too long, and gives you ready meta tags with Open Graph tags for WhatsApp and Facebook, all in one place.

What meta tags are and why they matter

Meta tags are small pieces of code in the head of a web page. Visitors do not see them on the page itself, but search engines and social apps read them to understand the page and to build the snippet people see in results.

The two that matter most for search are:

• The title tag, which becomes the blue clickable headline on Google and the text in the browser tab.
• The meta description, which often becomes the grey text under that headline.

Google does not use the description as a ranking signal, and it sometimes rewrites both title and description. Even so, a clear title and a helpful description decide whether someone clicks your result or the one below it. More clicks from the same position is free traffic.

How to use the generator

1. Write your page title. The counter shows how many characters you used. Aim for about 30 to 60.

2. Write the meta description. One or two sentences, about 120 to 160 characters, that tell people what they will get.

3. Add the page URL and site name. The preview uses them to build the breadcrumb line just like Google does.

4. Add a share image URL if you have one. It is used for Open Graph tags, which control link previews on WhatsApp, Facebook and LinkedIn.

5. Check the preview. Switch between Desktop and Mobile to see where text gets cut off.

6. Read the checks under the preview and fix anything marked yellow or red.

7. Copy the tags and paste them into your page head, or copy the title and description into your SEO plugin fields.

Everything runs in your browser. Nothing you type is sent to our server.

How long should a title be?

Google cuts titles by pixel width, not by an exact character count. Wide letters like W and M take more space than i and l. In practice, titles up to about 60 characters usually show in full on desktop. Longer titles are cut with three dots.

That does not mean every title must be exactly 60 characters. A short, clear title is fine. What matters is that the important words come first, so they stay visible even if the end is cut.

How to write a description people click

Think of the description as a tiny advert for your page. A good one does three things:

• Matches the search. Use the words people actually type, once, in a natural sentence. Google bolds words that match the search, which catches the eye.
• Promises a clear result. Tell people what they will get: a free tool, a step by step guide, a price list.
• Gives a reason to choose you. Free, no signup, updated this year, written for Pakistan, with examples. Pick what is true for your page.

Every page should have its own description. Copying the same description across many pages wastes the chance to describe each one, and Google tends to ignore duplicated descriptions.

Desktop vs mobile preview

Most searches in Pakistan and many other countries happen on phones. The mobile result is narrower, so long titles wrap onto two lines and descriptions may be cut earlier. Check both views. If your title looks good on mobile and still fits on desktop, you are safe on both.

The preview also shows the site name and the breadcrumb path built from your URL. Short, readable URLs look cleaner in that line. If yours is long, the Slug Generator helps you shorten it.

What the generated tags include

Where to put the tags

WordPress with an SEO plugin

If you use Yoast SEO, Rank Math or a similar plugin, do not paste the code. Instead, copy the title and description you wrote here into the plugin’s fields for that page. The plugin prints the tags for you, including Open Graph.

WordPress without a plugin

Many custom themes, including the one on this site, print good title and description tags automatically. If yours does not, an SEO plugin is the easiest fix.

Plain HTML sites

Paste the tags inside the <head> section of each page, before the closing </head> tag. Each page needs its own title and description.

Common mistakes the checks catch

• Missing title or description. Google then picks text from the page, which is often a menu or a cookie notice.
• Too short. A two word title wastes space you could use to explain the page.
• Too long. Important words at the end get cut off.
• Repeated keywords. The same word three times in a title reads as spam to people and to Google.
• No share image. Links shared on WhatsApp show a plain grey box or a random picture.

Why Google sometimes changes your title

Google rewrites titles when it thinks another text on the page describes it better for a particular search. This happens more often when titles are very long, stuffed with keywords, the same across many pages, or do not match the main heading. The best way to keep your own title is to make it accurate, unique, and close to the H1 heading on the page.

Descriptions are rewritten even more often, because Google may show the sentence from your page that best matches each different search. A good description still helps, since it is used for the main searches the page targets.

A quick routine for every new page

1. Write the H1 heading and the page first.

2. Write a title that matches the H1 but is tuned for search, with the main topic first.

3. Write a description that promises what the page delivers.

4. Preview both here on desktop and mobile.

5. Check the share preview with the Open Graph Preview after publishing.

6. Add structured data if it fits, using the Schema Markup Generator.

Titles and descriptions for different page types

Home page

Lead with your brand and what you do: “Brand Name: What You Offer”. The description should explain who the site is for.

Blog post

Lead with the topic or question the post answers. Adding the year helps only if the content really is updated for that year.

Product page

Product name, a key detail and the shop name. Mention delivery or price range in the description if it sets you apart.

Local business page

Service plus city works best: “Car Rental in Gilgit”. Put the area you serve in the description so local searchers recognise you.

Tool page

Name the tool and the result: “SSL Checker: Is My Certificate Valid?”. Mention free and no signup if true, because that is what tool searchers look for.

Frequently asked questions