A declarative extension layer for application-grade HTML.

What HTML6 is

HTML5 gave the web semantic structure. HTML6 is a proposal for the next layer up: declarative application behaviour — state, interaction, form lifecycle, and navigation — expressed directly in markup rather than assembled in JavaScript.

It ships today as a small runtime that reads plain HTML attributes and elements and wires up the behaviour they describe. Nothing about it requires a new parser or a new browser: unknown elements already degrade gracefully, and the runtime does the rest.

Declarative state & actions

State lives in a <state> element instead of a JavaScript variable. Elements read it with when, and buttons mutate it with action — no event listeners written by hand.

<state name="menu" value="closed"></state>

<button action="toggle" target="menu">Toggle menu</button>

<div when="menu == open">
  The menu is open.
</div>

The same primitive extends to numeric state, so counters need no script at all:

Forms with built-in pending states

Submission feedback — the disabled button, the "Submitting…" label, the error summary — is one of the most re-implemented patterns in every framework. HTML6 proposes expressing it declaratively.

<form>
  <input name="email" type="email" required>

  <button type="submit" pending-text="Submitting...">
    Submit
  </button>
</form>

This demo simulates a 900ms round trip: the button disables, its label swaps to pending-text, and a bare-required field surfaces an accessible error rather than the browser's default tooltip.

Partial navigation

A link can ask the runtime to fetch its destination and swap only one region of the current page, pushing history as it goes. If the fetch fails, or the runtime is absent, the link behaves as an ordinary navigation.

<a
  href="/inbox"
  update="#content"
  history="push">
  Inbox
</a>

Declarative components

Rather than inventing a competing component model, HTML6 leans on Shadow DOM that browsers already ship. A <component> wrapper just gives the declaration a name.

<component name="user-card">
  <template shadowrootmode="open">
    <article>
      <slot></slot>
    </article>
  </template>
</component>

<user-card>Colm Lenehan — Maintainer</user-card>

Accessibility is load-bearing, not optional

Every state change above the fold in this document announces through the same primitives assistive technology already understands: live regions for when transitions, disabled/aria-busy pairing for pending submits, and focus retention across partial navigation. None of it is automatic in every case — authors are still responsible for a coherent interface — but the defaults lean toward correctness.

Browser compatibility

HTML6 is a compatibility layer, not a replacement parser. Any browser shipping today already parses unrecognised elements without error, so the runtime — two files, html6.js and html6.css — attaches the described behaviour on top of the DOM you already have. The repository's minibrowser/ directory documents one integration path, loading the runtime into a WKWebView as a document-end user script.