Reference guide · html-css-js · Published 2026-08-15 · 4 min read

How sites define structure in HTML

Site structure in HTML: how pages, internal links, nav and landmarks form information architecture for users and crawlers.

The structure is HTML, not a sitemap

A website has no structure until HTML says so. The structure a visitor and a crawler perceive is a graph: pages connected by links, organised by placement in the nav, levels of headings, and repeated site-wide elements. The same pages undirected by links read as a pile, so structure is a property of the markup, the links and the headings, all three live in HTML.

Here is the shape of a small site in one diagram:

Home
|-- Services
|   |-- Web design
|   |-- SEO
|-- About
|   |-- Team
|   |-- Careers
|-- Journal
    |-- Post: launch retro
    |-- Post: box model check
+ Footer links: Privacy, Terms, Sitemap
+ Header logo link to Home

Three markers make that shape readable: every page reachable, a nav at each level, and the heading layers between them.

The three markers that structure encodes

  1. The nav landmarks. A <nav> element wraps the primary menu, and its links define the top level for a visitor and the crawl entry points for Google. The logo link back to Home in the header defines the reset point. The semantic HTML article covers the landmark elements used here.
  2. The heading layers. An <h1> titles the page, <h2> groups the sections, and <h3> beneath every <h2> organises the reading order. Crawlers use headings to split a long page into topics, and users navigate the heading list to jump to a section. Flat pages that skip the chapter levels get treated as one long block.
  3. The internal link graph. Links between pages define depth: how many clicks from Home a page sits at, and which pages cluster together. A page linked only in the footer is structurally shallow, similar to one linked twice on Home.

Structure change is a crawl event

Every restructure is a crawl event for the search engine: moved pages need 301 redirects, removed sections need 410s, and the nav needs a warm environment before the new hierarchy enters the index. The crawl budget and site shape article maps the crawler side, and the technical SEO indexing article covers how to steer the index itself. On the user side, structure changes are the biggest single source of "I cannot find the X" tickets, so any redesign that changes the nav should ship with a search function and a clear breadcrumb.

HTML structure review, quick checklist

  1. Every page has one meaningful <h1> and a cleanly ordered heading chain.
  2. The page nav contains the top-level links, and the footer contains secondary links, with stable aria-labels.
  3. Each primary section is reachable within two clicks from Home.
  4. Internal links use real pages, no href="#" remains, and every link has text.
  5. Home links to the most important sections; the important pages get the majority of the links.
  6. The crawl map and this HTML shape line up.

The standards line

HTML structure and information architecture are the same subject. The semantic HTML reference defines the elements a structured page is built from, this article defines the arrangement that draws the user's mental map, and the crawler graph that search engines read is the technical SEO project. All three end at the same sentence: the best structure is the one the reader can predict.

Need a website built, fixed, optimised, migrated or replaced?

This technical resource is written by CSMBAC, a small design and development studio. If you would rather hand the problem to a professional, the website service page explains how we build enquiry-ready websites.

Explore website services