LAB / EXPLAINER

Complexity should be visible in the decisions, not the load time.

The static pages are real HTML. Native CSS provides the layout and light/dark themes. Optional Custom Elements add behavior only where needed.

01 / WHAT ARRIVES

HTML before the interaction.

Pages are built ahead of time with Eleventy and served as ordinary documents. A script failure cannot remove the navigation, project links, contact explanation, or case studies.

02 / WHAT ENHANCES

A little JavaScript, in context.

The Work gallery dynamically filters pre-rendered cards. The homepage imports the Canvas module only after pointer interaction; the Lab loads its own control logic. No React, hydration boot, or client-side router is required.

03 / HOW WE MOVE

Motion with a fallback.

CSS scroll-linked effects and same-origin View Transitions are progressive. Navigation remains ordinary anchor navigation if an API is unavailable. Users requesting reduced motion receive static content instead.

04 / WHAT WE VERIFY

Measured, not advertised.

CI measures compressed asset budgets and laboratory Lighthouse/Playwright results. Field Web Vitals and production reliability require a deployed site and visitor measurements; CI is not a substitute.

Return to the Lab