Title and Meta Description Tags in HTML

The <title> and <meta name="description"> tags are the gateway to your content. They don’t appear on the visible page, but search engines use them to display your site in search results. That makes them powerful tools for visibility, engagement, and click-throughs.

The <title> tag defines the title of your web page. It appears:

• In the browser tab
• As the blue link in Google search results
• When bookmarking or sharing links

Example:

<title>Cherry vs Banana: Which Fruit Is Healthier?</title>

[ Appears at the top of the browser tab and as the search result headline ]

Best Practices:

• Keep it under 60 characters
• Use your most important keyword early
• Make it specific, unique, and compelling

This tag provides a summary of the page content for search engine snippets. While not a direct ranking factor, it strongly affects click-through rate.

Example:

<meta name="description" content="Compare the nutritional benefits of bananas and cherries. Learn which fruit fits your diet and boosts your health.">

[ Appears as the search snippet below the title ]

Best Practices:

• Keep it under 160 characters
• Make it a call to curiosity — like an ad preview
• Use action phrases: “Learn how”, “Discover”, “Compare”
• Include target keywords naturally

<head>
  <meta charset="UTF-8">
  <title>Apple, Banana & Cherry Facts - A Delicious Comparison</title>
  <meta name="description" content="Explore the flavors and benefits of apples, bananas, and cherries. Which one will win your heart — and your health?">
</head>

[ Search engines display the title and description in the search results ]

While the <title> tag is a direct ranking factor, the meta description helps improve click-through rates (CTR), which indirectly boosts rankings.

What Search Engines Do:

• Title: Helps search engines understand page topic and intent
• Description: Summarizes what users can expect if they click
• May rewrite both if your tags are missing, duplicated, or irrelevant

Here are some quick tips when writing titles and descriptions:

• Match your page content — avoid clickbait
• Each page should have a unique title and description
• Put your brand name last in the title (if needed)
• A/B test meta tags using analytics to find what works

Title and description tags are the front door of your HTML page — and your brand. You now know how to:

• Write concise, compelling <title> tags
• Create optimized <meta name="description"> snippets
• Understand their impact on search results and click-throughs

Choose the option that lists all and only the correct statements.

1. Keep descriptions under 160 characters
2. Include relevant keywords naturally
3. Use duplicate descriptions across pages
4. Write engaging, clear summaries

Choose the option that lists all and only the correct statements.

1. meta viewport tag
2. meta charset tag
3. meta description tag
4. meta robots tag

Next up, we’ll dive into building a fully optimized <head> section — including social sharing tags, viewport settings, and performance-oriented meta configurations.