The field guide / HTML5

HTML5 Static Website Builder

HTML5 is a familiar label for modern HTML features. The standard continues to evolve as the HTML Living Standard. For a static website, the most useful features are often the simple ones: meaningful landmarks, responsive media, native disclosure controls, and links that work before JavaScript loads.

HTML. CSS. Ship.: bright cyan and orange typography card about accessible static website foundations.
A useful fit
Semantic, resilient interfaces
Authoring layer
Modern HTML elements
What you deliver
Browser-native reading & navigation

Use meaning as your starting point

Use article for a self-contained piece that could stand independently, and section for a meaningful group with a heading. A page can contain several navigation regions; give additional regions clear labels so a reader can distinguish the main navigation from an article’s contents.

Keep the source order sensible. Moving blocks around visually does not necessarily change the order encountered by assistive technology. Treat the document outline and keyboard sequence as design decisions, not as details to repair after styling.

Reach for native controls first

A details element with a summary can present a frequently asked question without a custom interaction script. Links handle navigation; buttons handle actions. Native elements provide a starting set of browser behaviors that custom substitutes would need to recreate.

Use these controls in their intended context and verify them with a keyboard. A disclosure still needs a clear label, sufficient contrast, and readable expanded content. A native element is a useful foundation rather than a substitute for testing.

Enhance the page progressively

The essential content and destinations should remain present when optional scripts fail. A mobile menu can enhance a visible navigation list, while article text and related links remain ordinary markup. Avoid making the first rendering of useful content depend on a network request.

Provide explicit image dimensions and choose sensible loading behavior: a prominent first-screen image should be available promptly, while lower-page artwork can load later. Continue with HTML document planning, responsive CSS, and the accessibility walkthrough.

Questions about HTML5

Is HTML5 a separate tool I need to install?

No. It is commonly used to describe modern HTML capabilities. You write HTML documents and test them in the browsers your audience uses.

Does semantic HTML guarantee accessibility?

No. It provides meaningful structure and native behaviors, but text alternatives, contrast, interaction design, content quality, and testing still matter.

Primary reference: WHATWG: HTML sections and landmarks.