Meta tags and page titles in No-Code - Full Explanation

Introduction

When you visit a website, you often see a title on the browser tab and sometimes descriptions in search results. These come from meta tags and page titles, which help browsers and search engines understand what the page is about.

Explanation

Page Title

The page title is the text shown on the browser tab and in search engine results. It summarizes the main topic of the webpage in a few words. A clear and relevant title helps users quickly know what the page contains.

The page title is the main label that identifies a webpage to users and search engines.

Meta Description Tag

The meta description is a short summary of the webpage content. It is not visible on the page itself but is often shown in search engine results below the title. A good meta description encourages people to click on the link.

Meta descriptions provide a brief summary that can attract visitors from search results.

Meta Keywords Tag

Meta keywords are a list of important words related to the page content. They were once used by search engines to understand page topics but are now mostly ignored. Including them does not affect modern search rankings.

Meta keywords are mostly outdated and do not influence search engine rankings today.

Meta Robots Tag

The meta robots tag tells search engines how to treat the page, such as whether to index it or follow its links. This helps control what appears in search results and how search engines explore the site.

Meta robots tags guide search engines on indexing and crawling behavior.

Real World Analogy

Imagine a library where each book has a title on its cover and a short summary on the back. The title helps you find the book on the shelf, and the summary helps you decide if you want to read it. Sometimes, there are notes for the librarian about how to handle the book.

Page Title → The book's title on the cover that tells you what the book is about

Meta Description Tag → The summary on the back cover that helps you decide to read the book

Meta Keywords Tag → The list of topics inside the book that used to help librarians categorize it

Meta Robots Tag → The librarian's instructions on how to handle or display the book

Diagram

Diagram

┌─────────────────────────────┐
│        Webpage Head          │
├─────────────┬───────────────┤
│ Page Title  │ Meta Tags     │
│ (Browser   │ ┌─────────────┐│
│  Tab Name) │ │ Description ││
│            │ │ Keywords    ││
│            │ │ Robots      ││
│            │ └─────────────┘│
└─────────────┴───────────────┘

This diagram shows the webpage head containing the page title and various meta tags that provide information to browsers and search engines.

Key Facts

Page Title → Text shown on the browser tab and search results summarizing the page.

Meta Description → A short summary of the page content shown in search engine results.

Meta Keywords → A list of keywords related to the page, mostly ignored by modern search engines.

Meta Robots → Instructions for search engines on how to index and crawl the page.

Common Confusions

Believing meta keywords still improve search rankings.

Believing meta keywords still improve search rankings. Meta keywords are ignored by most search engines today and do not affect rankings.

Thinking the page title is visible on the webpage itself.

Thinking the page title is visible on the webpage itself. The page title appears in the browser tab and search results, not usually on the page content.

Assuming meta descriptions always appear in search results.

Assuming meta descriptions always appear in search results. Search engines may choose to show other text from the page instead of the meta description.

Summary

Page titles label webpages clearly for users and search engines.

Meta descriptions provide summaries that can attract clicks from search results.

Meta keywords are outdated and meta robots tags control search engine behavior.

Practice

1. What is the main purpose of a page title in a webpage?

easy

A. To name the webpage and show it in browser tabs and search results

B. To add images to the webpage

C. To create links to other websites

D. To change the background color of the page

Solution

1. Step 1: Understand what a page title does

   The page title is the name shown on browser tabs and search results.

2. Step 2: Identify the correct purpose

   It helps users know what the page is about by naming it clearly.

3. Final Answer:

   To name the webpage and show it in browser tabs and search results -> Option A

4. Quick Check:

   Page title = webpage name [OK]

Hint: Page titles name your page for browsers and search [OK]

Common Mistakes:

• Thinking page titles add images
• Confusing titles with page design
• Believing titles create links

2. Which HTML tag is used to set the page title that appears in the browser tab?

easy

A. <meta>

B. <header>

C. <title>

D. <body>

Solution

1. Step 1: Identify the tag for page title

   The <title> tag is used inside the <head> section to set the page title.

2. Step 2: Differentiate from other tags

   <meta> is for metadata, <header> is for page header content, and <body> is for main content.

3. Final Answer:

   <title> -> Option C

4. Quick Check:

   Page title tag = <title> [OK]

Hint: Page title uses <title> tag inside <head> [OK]

Common Mistakes:

• Using <meta> tag for title
• Confusing <header> with title
• Placing title outside <head>

3. What will happen if a webpage has no meta description tag?

medium

A. The page background will turn white

B. The page title will not appear in the browser tab

C. The webpage will not load in browsers

D. Search engines will show no description or guess content for search results

Solution

1. Step 1: Understand meta description role

   The meta description tag gives search engines a summary to show in search results.

2. Step 2: Effect of missing meta description

   If missing, search engines try to guess content or show no description, but the page still loads and title shows.

3. Final Answer:

   Search engines will show no description or guess content for search results -> Option D

4. Quick Check:

   Missing meta description = no summary shown [OK]

Hint: No meta description means search engines guess summary [OK]

Common Mistakes:

• Thinking page won't load
• Confusing meta description with page title
• Believing background color changes

4. A webpage has this meta tag: <meta name="description" content="">. What is the problem here?

medium

A. The meta tag is missing the name attribute

B. The content attribute is empty, so no description is provided

C. The meta tag should be inside the <body> tag

D. The meta tag is missing the charset attribute

Solution

1. Step 1: Check the meta tag attributes

   The meta tag has name="description" but content="" is empty, so no description text is given.

2. Step 2: Identify correct usage

   The meta description needs meaningful content inside the content attribute to help search engines.

3. Final Answer:

   The content attribute is empty, so no description is provided -> Option B

4. Quick Check:

   Empty content means no description [OK]

Hint: Meta description needs content filled, not empty [OK]

Common Mistakes:

• Thinking name attribute is missing
• Placing meta tag inside <body>
• Confusing charset with description

5. You want your webpage to appear clearly in search results with a good title and summary. Which combination is best to achieve this?

hard

A. Use a clear <title> tag and a meaningful tag

B. Use only a tag and no title

C. Use multiple <title> tags with different texts

D. Use tag only without a title

Solution

1. Step 1: Understand importance of title and meta description

   The <title> tag names the page for browsers and search results. The <meta name="description"> tag provides a summary for search engines.

2. Step 2: Evaluate options for best SEO practice

   Using a clear title and meaningful description helps the page show well in search results. Multiple titles or missing titles hurt clarity.

3. Final Answer:

   Use a clear <title> tag and a meaningful <meta name="description"> tag -> Option A

4. Quick Check:

   Clear title + description = better search display [OK]

Hint: Combine clear title and meta description for best search results [OK]

Common Mistakes:

• Using multiple titles causing confusion
• Relying only on keywords meta tag
• Skipping title tag entirely