Progressive Enhancement
Building so the core experience works without scripts, with richer behavior layered on top.
Progressive enhancement is the practice of delivering a functional baseline in HTML and CSS, then layering scripted behavior on top for environments that support it. The order matters: the baseline is the product, and enhancement is optional.
It is not primarily about people who disable JavaScript. It is about the far more common cases where scripts have not arrived yet, failed to load, threw an error, or are blocked — and about crawlers, link previewers, and assistive technology, none of which are guaranteed to execute anything.
Modern CSS has made the pattern more attractive by moving capabilities that once required scripts into the platform: disclosure widgets via native elements, scroll-driven animation via CSS timelines, container-relative layout, and view transitions. Each is a case where the no-script path is not a degraded fallback but simply the implementation.
The design constraint it imposes is real and worth stating. An entrance animation that starts at zero opacity and is revealed by script means that without script the content is invisible — the enhancement became load-bearing. For any surface that must render without JavaScript, animation has to be limited to interaction rather than entrance, or the baseline is broken. See Motion Design and Islands Architecture.
See also11
Semantic HTML
Using elements for their meaning, so the document conveys structure without extra description.
Design & Interface24 connections
Server-Side Rendering
Producing a page's HTML on the server so the first response is already content.
Web Platform23 connections
Accessibility
Designing so that people with disabilities can use a thing, and the standards that make it checkable.
Design & Interface44 connections
Hydration
Attaching client-side behavior to server-rendered markup without rebuilding it.
Web Platform18 connections
React Server Components
Components that execute only on the server and never ship their code to the browser.
Web Platform21 connections
Document Object Model
The live tree of objects a browser builds from a document, and the surface every UI framework writes to.
Web Platform27 connections
Static Site Generation
Rendering every page to a file at build time, so serving is just handing over bytes.
Web Platform19 connections
Form Validation
Checking what people type into a web form before accepting it, done in the browser for fast feedback and on the server for safety, and harder than it looks because real names, addresses, and numbers break simple rules.
Web Platform11 connections
Accordion
A stack of headings that each expand to reveal a section of content, saving space on long pages and small screens at the cost of hiding what readers might have needed to see.
Design & Interface12 connections
Progressive Web App
A website that can be installed like a native app, launched from the home screen in its own window and used offline, built from a manifest, a service worker and HTTPS.
Web Platform9 connections
Fail-Safe
A design principle in which a system that breaks falls into a safe state rather than a dangerous one, as when a railway signal drops to stop or a train's brakes apply if their air line is cut.
Testing & Verification6 connections
Linked from23
- AccordionDesign & Interface
A stack of headings that each expand to reveal a section of content, saving space on long pages and small screens at the cost of hiding what readers might have needed to see.
- Color ContrastDesign & Interface
The measured luminance difference between foreground and background, and the accessibility floor it must clear.
- Defensive ProgrammingTesting & Verification
Writing code that anticipates misuse and bad input, checking assumptions and handling the unexpected rather than trusting callers, along with the debate over when defense should give way to failing loudly.
- Document Object ModelWeb Platform
The live tree of objects a browser builds from a document, and the surface every UI framework writes to.
- EasingDesign & Interface
The curve mapping elapsed time to progress, and the main reason motion feels right or wrong.
- Fail-SafeTesting & Verification
A design principle in which a system that breaks falls into a safe state rather than a dangerous one, as when a railway signal drops to stop or a train's brakes apply if their air line is cut.
- Form ValidationWeb Platform
Checking what people type into a web form before accepting it, done in the browser for fast feedback and on the server for safety, and harder than it looks because real names, addresses, and numbers break simple rules.
- HTMLWeb Platform
The markup language every web page is written in, invented at CERN around 1990 as a simple way to tag documents and link them, and grown by thirty years of browser competition into an application platform.
- HydrationWeb Platform
Attaching client-side behavior to server-rendered markup without rebuilding it.
- Islands ArchitectureWeb Platform
Rendering a page as static HTML with small independently interactive regions.
- Motion DesignDesign & Interface
Using movement to communicate change, continuity, and hierarchy rather than to decorate.
- Progressive Web AppWeb Platform
A website that can be installed like a native app, launched from the home screen in its own window and used offline, built from a manifest, a service worker and HTTPS.
- Reduced MotionDesign & Interface
An operating-system preference signaling that animation should be minimized, for real medical reasons.
- Responsive ImagesWeb Platform
Offering the browser several versions of an image so it can download the smallest one that still looks sharp on this screen at this layout size.
- RSSData & Content
A syndication format letting readers subscribe to a site without an intermediary.
- Semantic HTMLDesign & Interface
Using elements for their meaning, so the document conveys structure without extra description.
- Server-Side RenderingWeb Platform
Producing a page's HTML on the server so the first response is already content.
- Service WorkerWeb Platform
A background script the browser runs between a page and the network, able to intercept requests even when no page is open.
- Single-Page ApplicationWeb Platform
A web app that loads one HTML page and then rewrites it with JavaScript as the user navigates, trading a slower, heavier first load for app-like transitions afterwards.
- Staggered AnimationDesign & Interface
Offsetting the start of sibling animations so a group reveals in sequence.
- User Agent StringWeb Platform
The header every browser sends to identify itself, which grew into a pile of mutual impersonations because sites served different pages to different browsers, and why it's being frozen.
- View TransitionsWeb Platform
A browser API that animates between two states of a page, or between two pages, by snapshotting the old and new views and morphing between them.
- Web ComponentsWeb Platform
A set of browser-native APIs for building reusable, encapsulated HTML elements without a framework.