Like a little mini CSS Zen Garden, here’s one compenent styled five very different ways.
Crucially, the order of the markup doesn’t consider the appearance—it’s concerned purely with what makes sense semantically. And now with CSS grid, elements can be rearranged regardless of source order.
CSS is powerful and capable of doing amazingly beautiful things. Let’s embrace that and keep the HTML semantical instead of adapting it to the need of the next design change.
This is an excellent one-stop shop of interface patterns:
This is an organic collection of common JS patterns that can be replaced with just HTML, CSS, and no, or very low, JS. As HTML and CSS continue to mature, this collection should expand.
This episode of the Shop Talk Show is the dictionary definition of “rambling” but I had a lot of fun rambling with Chris and Dave!
Another clever use of clamp() and calc() for web typography, but this time it’s adjusting letter-spacing.
Explore the platform. Challenge yourself to discover what the modern web can do natively. Pure HTML, CSS, and a bit of vanilla JS…
This is a nifty initiative:
This site lets you rank the proposals you care about, giving us data we can use when reviewing which proposals should be taken on for 2026.
For the record, here’s my top ten:
- Cross-document view transitions
- Speculation Rules API
img sizes="auto" loading="lazy"- Customizable/stylable
select- Invoker commands
- Interoperable rendering of HTML
fieldset/legend- Web Share API
- CSS scroll-driven animations
- CSS
accent-colorproperty- CSS
hanging-punctuationproperty
Have you got the perfect talk for this event? Let me know!
A one-day event all about what you can in web browsers today: Brighton, March 12th, 2026. Tickets are just £225+VAT!
Try writing your HTML in HTML, your CSS in CSS, and your JavaScript in JavaScript.
Defining the inputs instead of trying to control the outputs.
An exception to my general rule that ARIA attributes should be added with JavaScript.