Sidenotes, previews, and other quiet machinery

This post exists to exercise the reading machinery: margin sidenotes, hover previews, and embedded images. None of it is required to read the words — that's the whole point.¹

Sidenotes are the good kind of footnote. On a wide screen the note floats into the margin next to its reference, so you can read it without losing your place. They borrow both margins — left and right — so several notes in the same passage can each sit beside their own mention instead of piling up in a single column.

The idea is old. Edward Tufte popularized it for the web, and gwern.net refined the mechanics: notes that reflow as the window changes, and collapse gracefully when the screen is too narrow to spare a margin.²

On a narrow screen, or with JavaScript off, the very same notes simply appear at the bottom as ordinary footnotes — nothing is lost, and a 1999 browser renders it fine.³

Hover previews are a separate idea, and they're compiled at build time rather than fetched live. A link to the Wikipedia article on hypertext carries a small card; so does a paper like Attention Is All You Need.

Internal links — say, the quiet demo on the other side — pull their card straight from the post index, with no network round-trip at all.⁴

Images work too, and zoom on hover:

That's the whole demo. Delete this file whenever real posts arrive.