Skip to main content
📄 HTML & the platform·Module A6 · Lesson 2
TaskBuild a per-page title following the pattern '[Keyword] — [Page] | [Brand]'. For a blog post about Python decorators: title 'Python decorators — when and how to use them | CodeMentor'. Plus meta description.

<title> patterns: keyword, page name, brand

75 XP6 min
Theory

The proven shape

[Primary keyword] — [Page-specific qualifier] | [Brand]

Examples:

  • Learn FastAPI — interactive course | CodeMentor AI
  • Python list comprehension — tutorial with examples | CodeMentor AI
  • Pricing — Pro, Student, Free | CodeMentor AI

Length

Google truncates at ~580 pixels (≈ 50-60 characters in English, fewer with capital-heavy or Cyrillic). Hitting > 60 chars usually means part of your title becomes "…" in the SERP. Front-load the keyword.

Capitalization

  • Sentence case — "Learn FastAPI" (modern, easy to read).
  • Title Case — "Learn FastAPI Interactively" (heavier, classic blog style).
  • ALL CAPS — never, looks like spam.

Sentence case is the safer default in 2026.

Don't keyword-stuff

<title>FastAPI tutorial Python REST API microservices async Python web framework</title>

Google detects "title tag stuffing" and either rewrites your title to something generic OR ranks you lower. Bad trade.

Per-language hreflang link to the localized title

If your /pricing page has both /pricing (EN) and /uk/pricing (UK), each has its OWN <title> in its OWN language. Don't translate the title in the HTML at request time — set it per-URL.

🔒

Sign up to start coding

Theory is open to everyone. The interactive editor, live preview, and check are unlocked with a 7-day free trial — card required, cancel anytime.

Sign up — free trial →

First 10 lessons in each track are free. No card needed for those.

PreviousNext lesson →

Get one Python or web tip a day — by email

Short, hand-written, no spam. Unsubscribe in one click.