The html main element on 27 homepages: 24 have one, and one holds 3% of the page

FIELD TEST · 2026-08-22 · 27 homepages · single crawl · landmarks parsed

Sample and method: the same 30-site panel in use since 2026-08-15, each homepage fetched once on 2026-08-22 with a browser user agent. We recorded which sectioning landmarks the delivered HTML contains, then counted the visible text characters inside <main> against the visible text in the whole body.

The html main element is present on 24 of 27 homepages, and it holds a median 83% of the page's visible text. The spread is what makes the median useless on its own: from 3.2% on nextjs.org to 97.0% on substack.com. Having the landmark and putting your page inside it are two different achievements.

How we measured it

One HTTP request per site, no rendering, no retries. The inclusion rule was fixed before the run: status 200, body at least 10,000 bytes, body containing <body. Three of the 30 failed it — stackoverflow.com and medium.com returned 403, www.reddit.com returned an 8,393-byte shell — leaving 27 homepages.

Text was counted as characters in text nodes, with script, style, noscript, template and svg contents excluded and whitespace collapsed. We re-ran four sites through a second, independent extraction to check the parser; the two methods agreed within about one percentage point.

What the html main element is supposed to be

The HTML Living Standard, section 4.4.14, read 2026-08-22, is one sentence long on the point: "The main element represents the dominant contents of the document." The same section adds a constraint most people never check: "A document must not have more than one main element that does not have the hidden attribute specified."

That matters here because one site in the panel breaks it. nextjs.org ships two <main> elements, neither with a hidden attribute, and between them they hold 223 of the homepage's 6,902 visible characters.

A landmark is a claim about where the content is. An empty one is a wrong claim, not a missing feature.

How much of the page is actually inside it

Sorted by share, the panel splits into three groups rather than a curve.

Thirteen of the 24 sites with a <main> keep more than 80% of their text inside it. Six keep less than half: nextjs.org at 3.2%, then www.canva.com, figma.com, www.notion.com, vercel.com and www.shopify.com, all between 38% and 46%. Those five are marketing homepages where the navigation, the mega-menu and the footer carry a large share of the words, which is a real design choice and not a bug.

Next.js is a different case. Its homepage has 6,902 characters of visible text and 223 of them sit inside its two <main> elements — the tagline and the hero paragraph. Everything else, including the entire body of the page, sits outside.

The three homepages with no main at all

Absence is not the same failure. Two of these three are among the most readable pages in the panel.

MDN's homepage has no <main> and eight <article> elements. Hacker News has none of anything: no main, no nav, no header, no footer, and, as an earlier pass through the same crawl found, no headings either. It is also one of the most heavily read pages on this list.

Across the panel, nav appears on 25 of 27, footer on 25, header on 24, and <article> on only 7. Ars Technica alone ships 40 <article> elements, one per story card.

What this crawl cannot tell you

It cannot tell you that a low share is a problem. Extraction libraries and answer engines do not read <main> and stop; most use density and position heuristics, and a page with no landmark at all can be extracted cleanly. We did not test any extractor against these pages, so nothing here says an AI crawler got less from Next.js than from Substack.

We also cannot separate "text a reader sees" from "text in the markup". A mega-menu that is collapsed on screen still contributes its words to our body count, which is exactly why the marketing sites land near 40%. A different counting rule would move those numbers and we did not build one.

And this is one page per site. A documentation page or an article page on the same domain almost certainly wraps its content differently, and none of that is visible here.

What to do with your own markup

This is a ten-minute check on a template, not a project.

• Wrap the part of the page that is the reason someone came in a single <main>, and check the character share once.
• Keep exactly one visible <main> per document — that is a spec requirement, not a preference.
• Do not add the landmark and leave the content outside it. That is the Next.js shape, and it tells any consumer the wrong thing.
• Do not assume a missing <main> is why your page reads badly to machines. Check what the page actually delivers first.

What a crawler receives from your URL, before any of this markup is interpreted, is what the AI crawler check reports. Two adjacent measurements: what AI crawlers get from JavaScript sites counted the raw text volume on the same kind of pages, and the docs-versus-homepage comparison found the emptier page is usually not the one you would guess.

Common questions

How did you measure this?

One homepage request per site on 2026-08-22, browser user agent, no JavaScript execution. Landmarks were counted from the delivered HTML, and text characters inside <main> were compared against text characters in the whole body, excluding script, style, noscript, template and svg content.

What is the html main element for?

Per the HTML Living Standard it "represents the dominant contents of the document" — the part that is not the header, the navigation, the sidebar or the footer.

Can a page have two main elements?

Only if all but one carry the hidden attribute. The spec states a document must not have more than one main element without hidden. One site in this panel of 27 ships two visible ones.

Does using main help AI crawlers read my page?

We do not know, and this crawl did not test it. What we can say is that 24 of 27 large sites use the landmark, and that on a quarter of them it holds less than half the page.