SEO Fundamentals

Search engine optimization starts with HTML: search engines read your markup to decide what a page is about and how to show it.

The elements that matter most

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>How to Store Sourdough Bread So It Stays Fresh | Corner Bakery</title>
    <meta name="description" content="Keep sourdough fresh for days: the best ways to store it at room temperature, when to freeze it, and how to revive a stale loaf.">
    <link rel="canonical" href="https://cornerbakery.example/guides/storing-sourdough">
  </head>
  <body>
    <main>
      <article>
        <h1>How to Store Sourdough Bread</h1>
        <p>Sourdough keeps longer than most breads, if you store it right.</p>
        <h2>At room temperature</h2>
        <p>Keep it cut side down on a board, or in a paper or cloth bag.</p>
        <h2>In the freezer</h2>
        <p>Slice it first, so you can toast slices straight from frozen.</p>
      </article>
    </main>
  </body>
</html>

• title — the most important on-page signal and usually the clickable headline in results. Put the specific topic first, keep it roughly under 60 characters so it isn't cut off, and make every page's title unique.
• meta name="description" — often used as the snippet under the title (search engines may pick other text from the page). It isn't a ranking factor, but a good one earns clicks. Aim for one or two sentences.
• Headings — an h1 that matches the page's topic, and h2s that describe sections.
• Real text — search engines index text, not text inside images.
• Descriptive links — link text tells search engines what the target page is about.

<meta name="keywords"> is ignored by major search engines — don't bother.

Canonical URLs

The same content often lives at several URLs (?sort=price, http:// vs https://, with and without www). rel="canonical" names the preferred one, so ranking signals aren't split. Use absolute URLs. Our Canonical URL Checker checks a page's canonical tag.

Controlling indexing

<meta name="robots" content="noindex, follow">

noindex keeps a page out of search results (thank-you pages, internal search results); nofollow asks crawlers not to follow the page's links. robots.txt is different: it controls crawling, not indexing — a page blocked in robots.txt can't be crawled, so its noindex tag can't even be seen. Our Robots.txt Generator helps write one.

For a single link:

<a href="https://example.com/partner" rel="sponsored">Our partner</a>
<a href="https://example.com/user-site" rel="ugc nofollow">A commenter's site</a>

sponsored marks paid links; ugc marks user-generated content.

Semantic HTML helps

Landmarks, headings, lists, tables, time, and alt text all help search engines understand content the same way they help screen readers. Fast pages (Level 3) and mobile-friendly pages (the viewport) matter too.

Test pages with our On-Page SEO Checker and Search Engine Spider Simulator.

Practice

Write the title, description, and canonical link for a page listing gluten-free cakes at https://cornerbakery.example/cakes/gluten-free.

<title>Gluten-Free Cakes — Order Online | Corner Bakery</title>
<meta name="description" content="Chocolate, lemon, and carrot cakes made without gluten in a dedicated kitchen. Order by 2 p.m. for next-day pickup.">
<link rel="canonical" href="https://cornerbakery.example/cakes/gluten-free">