SEO Fundamentals
Search Engine Optimization starts with HTML. Before a page can rank, a search engine has to crawl it, parse its markup, and decide what the page is actually about. Good semantic HTML is the foundation everything else — meta tags, structured data, backlinks — is built on top of.
What search engines actually read
The title element — usually the strongest single signal of topic and the headline shown in results.
Headings (h1 through h6) — used to understand the outline and hierarchy of a page's content.
Body text — the actual words on the page, matched against what a searcher typed.
Alt text on images — describes visual content that crawlers cannot otherwise interpret, and supports image search.
Links — anchor text and destinations, used to understand relationships between pages and to discover new pages.
Structured data (JSON-LD/microdata) — explicit machine-readable facts about the page's content.
Meta description — not used for ranking directly, but shapes the snippet shown in results.
Crawlability basics
Before any of the above matters, a page has to be found and crawled at all.
Factor | Why it matters |
|---|---|
Internal links | Crawlers discover new pages primarily by following links from pages they already know |
robots.txt | Can block crawlers from an entire path, hiding those pages from search entirely |
meta robots noindex | Explicitly excludes an individual page from search results even if it is crawled |
XML sitemap | A direct list of URLs you want indexed, helpful for large or newly launched sites |
Working links / no dead ends | Broken links waste crawl budget and can strand crawlers on error pages |
Why semantic HTML helps SEO
Semantic elements — nav, main, article, header, footer, section — describe the role of content, not just its appearance. That structure lets crawlers (and assistive technology) understand a page's outline without guessing from a soup of generic divs.
<!-- Vague: a crawler has no idea what any of this is -->
<div class="top">...</div>
<div class="content">
<div class="post">...</div>
</div>
<!-- Semantic: role and hierarchy are explicit -->
<header>...</header>
<main>
<article>
<h1>Post Title</h1>
...
</article>
</main>One clear h1 per page communicates the primary topic.
A logical heading hierarchy (h1 then h2 then h3, without skipping levels) mirrors a well-organized outline.
article/section group related content so crawlers don't have to infer boundaries from styling.
Descriptive link text ("Read our pricing guide" vs "click here") tells both users and crawlers what the destination is about.