Document Structure Timeline
From the first HTML tags to responsive layout systems and web components, track how we learned to give structure to meaning.
Open timelineWeb Story for Makers
Four adventures in building the web—where do you want to start?
From static documents to component systems, design tokens, Jamstack, and AI helpers, the craft of building for the web keeps expanding. This hub introduces four companion timelines—structure, styling, interaction, and tooling—so you can jump straight to the thread you need.
Each series narrates the same loop—pain, need, fix—highlighting the people who noticed friction and the prototypes they shared. Follow the sequence and the intimidating jargon quickly turns into relatable stories.
Skim the cards below for a quick orientation, then dive into the timeline that matches your current project. Every page offers modal stories with plain-language glossaries when the terminology ramps up.
Four Web Making Timelines
Builders in each era chased different questions: How do we structure documents? How do we make screens inviting? How do we add rich interaction? How do we collaborate faster? These timelines trace how those questions intertwined.
Styling Evolution Timeline
CSS, Flexbox, Grid, design systems, and container queries—see how we kept refining the craft of readable, resilient layouts.
Open timelineBrowser Interaction Timeline
JavaScript, Ajax, SPAs, Service Workers, WebAssembly, WebGPU—follow how the browser earned app-like superpowers.
Open timelineWeb Tools Timeline
From FTP clients and Dreamweaver to npm, bundlers, Vite, and AI copilots, explore how toolchains accelerated delivery.
Open timelineNo discipline grows alone
Better structure empowered styling. Immersive interaction demanded smarter tools. Whenever you finish one timeline, another will point toward the next leap. Keep this hub bookmarked whenever you need a fresh perspective.
Further Reading
Key archives and documentation that informed every timeline in this web making series.