Progressive enhancement
Progressive enhancement is the design strategy of building a page that works at a minimum HTML+CSS baseline, then layering interactive enhancements on top via JavaScript. A progressively-enhanced form submits via plain HTML if JavaScript fails or is disabled, then optionally upgrades to a JS-enhanced experience.
Progressive enhancement was the dominant frontend philosophy in the 2010s, fell out of fashion during the SPA era, and has returned to mainstream practice with Next.js App Router, Remix, and similar frameworks that treat form submissions as server actions with optional JavaScript enhancement. The model produces resilience (the page works even if JS fails to load, errors, or is blocked), accessibility (screen readers and keyboard users get the baseline experience), and SEO friendliness (crawlers see complete content). The cost is the discipline of building the baseline and the enhancement separately, though modern frameworks reduce that cost substantially.
Related terms
- Semantic HTML
Semantic HTML uses HTML elements according to their meaning — <button> for buttons, <nav> for navigation, <article> for self-contained content, <h1>-<h6> for hierarchical headings — rather than reaching for <div> with styling.
- Accessibility tree
The accessibility tree is the structured representation of a webpage that assistive technologies — screen readers, voice control, switch devices — read instead of the visual rendering.
- Island architecture
Island architecture is the frontend pattern where most of a page is static server-rendered HTML with no client JavaScript, and only the interactive components (the 'islands') hydrate independently.