sidenote
This article is a stub. You can help the IndieWeb wiki by expanding it with relevant information.
sidenotes and margin notes are notes in the margin of a web page and are visually connected to the text to which they relate.
Looking for rich, interactive asides that relate to specific parts of an article (e.g. comments, Webmention responses to fragments)? See marginalia.
Difference between sidenotes and margin notes
The two terms are sometimes used interchangeably, but some writers distinguish them [1]. A "sidenote" is numbered and anchored to a specific point in the text, much like a footnotes. A "margin note" is the unnumbered variant, with no fixed anchor.
Why
Sidenotes (and margin notes) are useful to convey "aside" text or references related to the main content, but are not strictly necessary to read.
While footnotes remain the de facto standard for this kind of text, sidenotes do not require the reader to jump back and forth, which makes them ideal for websites.
IndieWeb Examples
Tracy Durnell uses sidenotes on her website.
- Documented how her sitenotes work at https://tracydurnell.com/2026/02/02/super-simple-sidenotes/.
V.H. Belvadi uses sidenotes on his website.
Lesley Lai uses margin notes extensively on his blog posts.
Articles
- Eric Meyer wrote an article about implementing sidenotes with a custom element and CSS anchor positioning: https://meyerweb.com/eric/thoughts/2025/10/29/custom-asidenotes/
See Also
- example: https://clagnut.com/blog/2395
- footnote
