Notes on typography, mostly for English or English-related language contexts.

guidelines

• Set font size to ≥16px
• Set paragraph widths, i.e. measure, to ~45–80 characters

For apostrophes, both the typewriter (’) and punctuation (’) variants are valid. Although I personally prefer the latter purely for style. Similarly, for quotation marks, curly (“”) over straight ("").

Side note: did you know <q> elements automatically set quotation marks according to the parent element’s language?

L’essentiel est invisible pour les yeux. —Antoine de Saint-Exupéry

somewhat obscure

Here are some non–widely-used typographical symbols and elements. Doesn’t this page look eesome with all of these symbols—like an old countryside manor or a dusty grimoire?

---

• Dinkuses are used to divide text or sections, or for completely ornamental reasons. These can take the form of increased whitespace but symbols like three spaced asterisks or bullets in a row (∗ ∗ ∗), asterisms (⁂), or fleurons (❦) may be used as well. The HTML <hr> tag represents a thematic break and could be used as a dinkus.
• The numero sign (№) can be used to abbreviate the word “number(s),” e.g. № 42.
• Commonly used by lawyers, the section sign (§) is used to reference sections of a document like Article § A.

ligatures

I love ligatures. Wikipedia has a list of English words that may be spelled with them — færie, œuvre, etc. Archaic, but gorgeous.

Ꜳ ꜳ Æ æ Ꜵ ꜵ Ꜷ ꜷ Ꜹ ꜹ Ꜽ ꜽ Œ œ Ꝏ ꝏ Ꝡ ꝡ

dashes

symbolnameusagee.g. -hyphen-minusitem marker in bullet lists commonly as dashes or minus signs hyphenation of compound wordscold-blooded ‒figure dashtelephone numbers123‒456‒7890 –en dashitem marker in bulleted lists range of values1–5, © 1710–2025, October–December relationships between two thingsBangkok–Tbilisi flight compound adjectives where at least one element is an unhyphenated compoundnon–solar-powered, San Francisco–based —em dashitem marker in bulleted lists can be used as an alternative to parentheses or colonsmy favourite things—cats, art, and travel quote attributionI don’t know if you’ve ever noticed this, but first impressions are often entirely wrong. — Lemony Snicket

There are also the two-em dash (⸺) and the three-em dash (⸻).

spaces

Spacing between italicised and non-italicised texts may be narrow in certain cases — usually when the italicised ends with a tall minuscule or majuscule — and can be remedied with either a thin space   or hair space  

variation	default	hair space	thin space
(portal)
( portal )
( portal )

Hair space could also be used in variables with subscript and superscript elements.

variation	default	hair space
zy	x8
z y	x 8

Use non-breaking spaces   between numbers and units to prevent or between words where potential line breaks could be awkward.

numbers

Speaking of numbers, in paragraphs:

• Use word forms of integers zero to nine
• Integers above nine may be written in either numeral or word form, e.g. 42 or forty-two
• Integers twenty-one to ninety-nine that aren’t multiples of ten are hyphenated
• Sentences shouldn’t start with a numeral

Rules for singular and plural nouns:

• Nouns following an unsigned digit 1 are singular, e.g. 1 cat
• Nouns following simple fractions are singular, e.g. 1/2 teaspoon
• Nouns following mixed numbers are plural, e.g. 2 1/2 teaspoons
• Nouns following other decimal numbers are plural, e.g. 0 cats, -1 degrees, 0.4 grams, 30 days

formats

Copyright notices should contain the word “copyright” expressed as a symbol, abbreviation, or word; the year of first publication or a range of years (often from first publication to the present year); and the owner’s name. Sound recordings use the phonogram symbol ℗ instead of ©. The order matters not.

© 2024 A. N. OtherCopr. 2024 A. N. OtherCopyright 2000–2024 A. N. Other

abbreviations

Abbreviations are shortened forms of words or phrases. Acronyms are the preferred term for abbreviations pronounced as words; in initialisms, letters are pronounced individually. Numeronyms are acronyms with numbers, e.g. a11y and i18n.

typeexample contractionI’mI am titlesDr. or DrDoctor initialism*e.g.*exempli gratia D.C.District of Columbia HTMLHyperText Markup Language acronymGIF Graphics Interchange Format lollaughing out loud shorteningdinodinosaur hippohippopotamus

Rules regarding plural forms of abbreviations and the inclusion of periods vary and are debated, e.g. 1 g, 5 g, two GIFs.

resources and rabbit holes

• Links § Typography
• Address formats in different countries
• Wikipedia’s Manual of Style, especially § Formatting