Website Basics
Website Title Examples
40+ real website title examples grouped by page type — homepage, product, blog, portfolio, and more — plus good vs weak titles, Google’s best practices, and a copyable title worksheet.
A page title is the text that appears in the browser tab and, in most cases, as the clickable headline on a search results page. Technically it is the <title> element in the <head> of every HTML document, and it is often the first thing a visitor reads when deciding whether to click your link.
This page collects 40+ real website title examples grouped by page type — homepage, about, contact, product, service, blog, category, landing page, portfolio, personal, and ecommerce — plus good vs weak titles and a copyable worksheet you can fill in. It is part of the website basics library.
What is a website title?
A website title (sometimes called a page title or title tag) is the name of a single page, not the name of the whole site. Here is what it looks like in the HTML of every page:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Northwind Coffee | Fresh Roast, Delivered</title>
</head>
<body>
<h1>Fresh roast, delivered daily</h1>
</body>
</html>
The title text shows up in two places that matter:
- The browser tab — every open tab needs a readable label.
- The search result — the title link is the headline people click.
This mockup shows the same title in all three places at once: the browser tab, the search result, and the page heading.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<style>
body { margin: 0; font-family: system-ui, sans-serif; background: #f3f4f6; padding: 24px; }
.tabbar { display: flex; gap: 6px; margin-bottom: 16px; }
.tab { padding: 6px 12px; border-radius: 8px 8px 0 0; background: #e5e7eb; font-size: 12px; color: #333; }
.tab.active { background: #fff; font-weight: 600; }
.serp { background: #fff; padding: 16px; border-radius: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.result-title { color: #1a0dab; font-size: 18px; font-weight: 600; }
.result-url { color: #1a7f37; font-size: 13px; margin-top: 2px; }
.result-snippet { color: #4b5563; font-size: 13px; margin-top: 4px; }
.page { background: #fff; margin-top: 16px; padding: 24px; border-radius: 8px; }
.page h1 { font-size: 28px; margin: 0 0 8px; }
.page p { color: #4b5563; margin: 0; }
</style>
</head>
<body>
<div class="tabbar">
<span class="tab active">Northwind Coffee | Fresh Roast, Delivered</span>
<span class="tab">Shop</span>
</div>
<div class="serp">
<div class="result-title">Northwind Coffee | Fresh Roast, Delivered</div>
<div class="result-url">https://www.northwindcoffee.com</div>
<div class="result-snippet">Single-origin beans roasted in small batches and shipped within 48 hours of roasting.</div>
</div>
<div class="page">
<h1>Fresh roast, delivered</h1>
<p>The H1 heading can differ from the title, but it should stay close in meaning.</p>
</div>
</body>
</html>
The title is set once per page. The site name is a separate thing — see website name examples for how the brand, domain, and title fit together.
Website title vs website name vs H1
These three get confused because they often contain the same words. They are different elements with different jobs.
| Website name | Page title | H1 heading | |
|---|---|---|---|
| What it is | The brand that identifies the whole site | The name of one page | The main heading on the page |
| Example (this page) | Basic Website Example | 40+ Website Title Examples for Every Page Type | (the heading above) |
| Where it appears | Header logo, footer, favicon | Browser tab, search results | Top of the page body |
| How many per site | One | One per page | One per page |
| Change it per page? | No — it is the site-wide brand | Yes, and you should | Yes |
The website name is set once for the whole site; the page title is a per-page decision. A clean name becomes a clean address, too — see website URL examples.
40+ website title examples by page type
Every title below follows a pattern you can reuse. The titles in these tables are representative examples of each pattern; a short set of real, stable titles you can open in a browser today is collected in its own section further down.
Homepage titles
The homepage title is the only one that represents the whole brand, so it usually combines the site name with a short description of what the site offers.
| Example title tag | Why it works |
|---|---|
| The brand alone — this is the word people type (real) | |
| Wikipedia, the free encyclopedia | Name plus a one-line description of the site (real) |
| Northwind Coffee | Fresh Roast, Delivered | Brand first, benefit second, separated by a pipe |
| Acme Web Studio | Web Design & Development Agency | Name plus what the company does |
| Summit Plumbing | 24/7 Emergency Plumber in Denver | Name, service, and location in one glance |
| Cedar & Stone Landscaping - Garden Design and Install | Brand plus the two services offered |
About page titles
About pages answer "who is behind this?" — the title should say what the page is and who it describes.
| Example title tag | Why it works |
|---|---|
| About Us | Summit Plumbing | Page name plus brand |
| Our Story - Northwind Coffee | Tells the reader what kind of page to expect |
| About the Author - Jane Rivera | Personal site, name in the title |
| About | Acme Web Studio | Short and clear when the brand is already known |
Contact page titles
| Example title tag | Why it works |
|---|---|
| Contact Us | Summit Plumbing | The words people search for |
| Get in Touch - Northwind Coffee | Friendly alternative to "Contact" |
| Contact & Directions | Summit Plumbing | Adds the practical details visitors want |
Product titles
| Example title tag | Why it works |
|---|---|
| Hario V60 Pour-Over Kettle | Northwind Coffee | Product name first, then brand |
| Men's Leather Bifold Wallet - Brown | Acme Goods | Product, category, and a distinguishing detail |
| Skylark Saddle, 17" | Summit Cycles | Model, size, and brand — everything a shopper needs |
| iPhone 16 Pro - Apple | Product line plus brand, short and consistent |
Service titles
| Example title tag | Why it works |
|---|---|
| Emergency Plumber in Denver | Summit Plumbing | Service + location, the way people search |
| Web Design Services - Acme Web Studio | Service plus brand |
| Tree Removal in Austin, TX | Lone Star Arborists | For local intent, the location can lead |
Blog post titles
| Example title tag | Why it works |
|---|---|
| How to Write a Website Title: 7 Formulas That Earn Clicks | Benefit-led and matches the article |
| Why Your Website Title Matters for SEO | A question readers actually ask |
| The 7 Best Coffee Brewing Methods - Northwind Coffee | Numbered and concrete, brand at the end |
Category titles
| Example title tag | Why it works |
|---|---|
| Coffee Makers | Northwind Coffee | Category first, brand second |
| Leather Wallets - Men | Acme Goods | Category plus the sub-filter |
| Web Design Blog | Acme Web Studio | Predictable repetition across a section |
Landing page titles
| Example title tag | Why it works |
|---|---|
| Free Website Audit for Restaurants | LocalFresh | The offer, stated plainly |
| Get Your 2026 Pricing Guide - Northwind Coffee | Direct call to action |
| Download the Free SEO Checklist | Acme Web Studio | Action verb, value, brand |
Portfolio titles
| Example title tag | Why it works |
|---|---|
| Work | Jane Rivera, Product Designer | The role tells visitors what they will see |
| Portfolio - Samuel Chen Photography | Page name plus name |
| Case Studies | Acme Web Studio | What agencies call their portfolio |
Personal website titles
| Example title tag | Why it works |
|---|---|
| Seth's Blog | A person's name is the strongest brand (real) |
| Jane Rivera - Product Designer | Name plus the thing she does |
| Paul Graham | The name alone works for a writer's site (real) |
Ecommerce titles
| Example title tag | Why it works |
|---|---|
| Nike Air Max 270 - Nike.com | Product then brand, consistent across thousands of pages |
| Linen Button-Down Shirt - Men | Everlane | Product, category, brand — a template that scales |
| Women's Trail Running Shoes | Merrell | A category page made for browsing |
Good vs weak website titles
The pairs below are illustrative examples that show the difference between a title that earns a click and one that gets rewritten or skipped.
| Instead of this (weak) | Try this (stronger) | Why |
|---|---|---|
| Home | Summit Plumbing | 24/7 Emergency Plumber in Denver | "Home" tells the searcher nothing |
| Welcome to our website | Acme Web Studio | Web Design & Development Agency | "Welcome to" is filler; lead with the offer |
| Plumbing plumbers emergency plumbing repair Denver | Emergency Plumber in Denver | Summit Plumbing | Keyword stuffing reads like spam |
| Acme Web Studio LLC Inc Corp Denver CO 80211 | Acme Web Studio | Web Design & Development Agency | Boilerplate and address stuffing waste the display |
| Untitled | Hario V60 Pour-Over Kettle | Northwind Coffee | An empty title makes search engines guess |
| A Really Long Title That Lists Every Single Thing This Page Covers In Great Detail And Keeps Going | 40+ Website Title Examples for Every Page Type | Once a title is too wide, it is cut off mid-sentence |
Real title tags you can open today
If you want to study titles in the wild, these stable, publicly visible titles are a good starting point. Open each site and look at the browser tab:
| Site | Title shown in the tab |
|---|---|
| Wikipedia | Wikipedia, the free encyclopedia |
| IMDb | IMDb: Ratings, Reviews, and Where to Watch the Best Movies & TV Shows |
| Amazon | Amazon.com. Spend less. Smile more. |
| MDN Web Docs | The <title> element - HTML: HyperText Markup Language | MDN |
Notice the pattern: each one names the page or brand first and only then adds supporting detail, and each stays short enough to read at a glance.
How to write a website title
Google uses the <title> element as its main source for the title link in search results, but it can rewrite titles when they are missing, vague, or spammy. These rules, from Google's title-link guidance, keep titles strong enough that Google usually shows them as written:
- Give every page a unique title. Never reuse one title across pages.
- Be descriptive and concise. Avoid vague labels like "Home" or "Profile". There is no fixed limit, but titles are truncated as needed to fit the device width — roughly 50-60 characters is a safe target.
- Front-load the important words. The start of the title is what stays visible when the rest is cut off.
- Never keyword-stuff. Repeating the same phrase is a spam policy and reads badly to people.
- Brand titles with a delimiter. Put the brand at the start or end, separated by a pipe, hyphen, or colon:
Page Name | Brand. - Keep the title and H1 aligned. Google reads the H1 too, so the two should describe the same page.
A quick formula for most pages:
Keyword + benefit | Brand
For product, service, and category pages the formula becomes a template:
- Product pages:
Product - Category | Brand - Service pages:
Service in Location | Brand - Category pages:
Category | Brand
Website title worksheet (copy and fill in)
Use this worksheet to draft a title for every page you publish:
# Website title worksheet
One sentence describing this page: ___
## Formulas (fill in and combine)
1. [Keyword] + [benefit] | [Brand] = ___
2. [What the page is] - [Brand] = ___
3. [Product] - [Category] | [Brand] = ___
4. [Service] in [Location] | [Brand] = ___
5. [Question the reader asks] - [Brand] = ___
## Draft three titles
| Title | Characters | Clear at a glance? | Final pick |
| --- | --- | --- | --- |
| ___ | ___ | ___ | ___ |
| ___ | ___ | ___ | ___ |
| ___ | ___ | ___ | ___ |
## Final checks
- [ ] Under ~60 characters (fits within ~600 pixels)
- [ ] Unique from every other page on the site
- [ ] Says what the page is, not "Home" or "Welcome"
- [ ] Keyword appears once, naturally
- [ ] Brand separated with |, -, or :
- [ ] H1 matches the title in meaning
FAQ
Frequently asked questions
What is a website title example?
Is the website title the same as the website name?
What is a good homepage title?
How long should a website title be?
Why does Google show a different title than the one I wrote?
What to do next
Once titles are set, the rest of the page structure needs the same attention — the website structure examples page shows how pages connect, and the website URL examples page covers clean addresses. For titles in context on real sites, see the business website examples and portfolio website examples galleries.