michaelharley.net michaelharley.net sysop: michael · est. 2012

michaelharley.net sysop: michael · est. 2012

Style

This is my /style page: the editorial standards I write to. For a visual reference of the HTML elements and styles on the site, see the styleguide.

Quotes vs Italics

Rules of thumb for when to use quotation marks, italics, or neither:

  • Quotation marks for direct speech or verbatim text from a source.
  • Italics for emphasis, titles of long works (books, films, albums, TV series), words-as-words, and framing a rhetorical question or phrase as an object of discussion.
  • Neither when a colon plus plain prose reads cleaner.

Examples of the same rhetorical framing three ways:

The question being asked is: should Democrats be allowed to redraw districts now that they're in power in Virginia?

The question being asked is: should Democrats be allowed to redraw districts now that they're in power in Virginia?

She said, "I'm not voting for either of them."

A question takes a ? even when framed by italics or a colon.

Quotes with a Citation

When quoting a written source (an article, book, or web page), follow the quote with a <cite> attribution line: the author and the work's title, with the title linked to the source. The site styles the <cite> for you, on its own line below the quote in muted monospace with a leading em dash, so don't type the dash yourself. In markdown blog posts, use this format:

> The passage you're quoting goes here.
>
> <cite>Author Name, [Source Title](https://example.com/article)</cite>

Which renders as:

The passage you're quoting goes here.

Author Name, Source Title

For a spec-pure citation in a hand-written HTML post, place the attribution outside the blockquote in a <figure> / <figcaption>, and put the source URL in a machine-readable cite attribute on the <blockquote>:

<figure>
  <blockquote cite="https://example.com/article">
    <p>The passage you're quoting goes here.</p>
  </blockquote>
  <figcaption>— Author Name, <cite><a href="https://example.com/article">Source Title</a></cite></figcaption>
</figure>

Which renders as:

The passage you're quoting goes here.

— Author Name, Source Title

Use this only when you're hand-writing HTML; the markdown form above is the default for normal posts.

Fediverse / Mastodon Quotes

When quoting a Mastodon or fediverse post, use a blockquote with a <cite> attribution line (same treatment as the citations above) that includes display name, handle, and post date. The post content is preserved in our source files even if the original is deleted. In markdown blog posts, use this format:

> The text of the post you're quoting.
>
> <cite>Display Name ([@user@instance.social](https://instance.social/@user/123456789)) · Nov 20, 2025</cite>

If the post has no display name (or it's the same as the handle), drop the display-name parens:

> The text of the post you're quoting.
>
> <cite>[@user@instance.social](https://instance.social/@user/123456789) · Nov 20, 2025</cite>

Which renders as:

You don't mass-adopt the open web by mass adopting it, you mass-adopt the open web by making great stuff that makes people want to use the open web.

Ada Example (@example@mastodon.social) · Nov 20, 2025

The scripts/quote-toot.js tool generates this format automatically from a toot URL and copies it to the clipboard.

If the post may be removed, also consider archiving it and linking to the archived version as a fallback.

Update Banner

Used in blog posts to call out updates or corrections added after the original publication date. Uses an <aside> element with the update-banner class.

<aside class="update-banner" aria-label="Blog post update">
  <p><strong>01/15/2026 Update:</strong> Your update text here.</p>
</aside>

Footnotes

Use footnotes for asides you want to keep but don't want to interrupt the main line of thought. Good uses:

  • Sources and citations where an inline link would be clunky.
  • Clarifications and caveats (for example: "I mean X here, not Y").
  • Tangents and wry side-comments you can't let go of.
  • Attribution for a phrase or idea without breaking sentence rhythm.

Don't use footnotes for content that actually belongs in the paragraph, for simple links (use an inline link), or in short posts. Keep it to roughly 3 or 4 per post under normal circumstances.

Heuristic: write the post without footnotes first. On re-read, ask "is there anything I cut that I wish I'd kept?" That's footnote material.

Markdown syntax:

This is a sentence with a footnote.[^redistricting]

[^redistricting]: The footnote content. Use a descriptive name
    instead of a number; it auto-numbers in the output, and
    named references are easier to keep track of while editing.

Footnote definitions can go anywhere in the file, but end-of-file is conventional. Continuation lines in a multi-paragraph footnote are indented 4 spaces.

Which renders as:

This is a sentence with a footnote.[1]


  1. The footnote content. Use a descriptive name instead of a number; it auto-numbers in the output, and named references are easier to keep track of while editing. ↩︎