<output> is currently underused in so many SPAs and apps, because it announces

1. Convert the PDF in a browser or automate it using a browser automation tool
2. https://weasyprint.org/ / https://stirlingpdf.io/

and more

Raw HTML and CSS?

1. It's fast
2. It's easy
3. Pure HTML is evergreen
4. I can host it anywhere, often for free
5. Accessibility and SEO benefits are automatic
6. It won’t need security patches
7. There are no build steps

I totally agree: using HTML as much as possible, then CSS, then JS to enhance it in this order.

The API can respond with HTML fragments anyway for an HTML table.

Seach content in collapsible sections.

That's great!

Put an id inside the <details> body

Link protocols
relative link protocol
Text fragments
href="#" scrolls to top
href="" reloads the page
href="." reloads the page and remove hash and search strings
href="?" reloads the page, remove the hash and search strings but preserve the query symbol.
href="data:" handle data URLs
href="video.mp4#t=10,20" for media fragments (support is not there yet)

A modal is a small view in the window: this view makes the rest of the content inert.

It makes HTML accessible

See their events https://html.energy/events.html

There are many methods that break performance and accessibility such as dynamic css classes and div and span soup.

Topics adressed from the outline:

1. It’s not just bad HTML – it’s meaningless markup
2. Semantic rot wrecks performance
   1. Big DOMs are slow to render
   2. Complex trees cause layout thrashing
   3. Redundant CSS increases recalculation cost
   4. Autogenerated classes break caching and targeting
   5. Animations and the compositing catastrophe (with properties triggering the layout engine)
   6. Autogenerated classes break caching and targeting
3. Semantic tags can provide layout hints
4. (AI) Agents are the new users and they care about structure
5. Structure is resilience, isn't optional

Likewise, content-visibility: auto is one of the most underrated tools in the modern CSS arsenal. It lets the browser skip rendering elements
that aren’t visible on-screen – effectively “virtualising” them. That’s huge for long pages, feeds, or infinite scroll components.

and I didn't know about the contain CSS property.

contain: layout; tells the browser it doesn’t need to recalculate layout outside the element.
will-change: transform; hints that a compositing layer is needed.
isolation: isolate; and contain: paint; can help prevent visual spillover and force GPU layers.

Structurally speaking, then, a paragraph is a group of related inline elements. In this case, inline words, but it could also include any of the items described as “phrasing content"

<hgroup> issu the tag to use for heading with multiple inline content.

Interesting comment about email development: we can do pretty much everything but the developers have to rely heavily on progressive enhancement.

A valid minimal HTML page

Being messy with class names :)