Skip to the page

Queering Earth

Colophon

How this site is made

Queering Earth is drawn as a herbarium sheet in daylight: warm paper, dark ink, a few saturated accents, and specimens laid out the way a Victorian plate lays them out. This page says what that means, what the colours and the type are, and what we mean by the handful of words the site uses for its own parts.

The model: a Victorian specimen sheet

A herbarium is a collection of pressed plants. Each specimen is mounted on a sheet of paper, and beside it goes a label — what the thing is, who collected it, where, and when. The label is not decoration. It is the entire scientific value of the object: an unlabelled specimen is a dead plant, and a labelled one is evidence.

Nineteenth-century botanical books took that arrangement and made it beautiful. A plate from one of them is a page with a specimen drawn large, the parts of it laid out around the edges, and a caption in small engraved capitals along the bottom. Foxed cream paper, dark line work, one or two saturated colours doing all the work.

We build pages that way because it matches what the site actually does. Every piece here mounts somebody else's work and writes a label for it. Getting the label right — whose words these are, which edition, which year — is the whole job, exactly as it is in a herbarium.

Biophilic, and what that means here

Biophilic design is the practice of building environments that keep people in contact with living things and the patterns of living things — daylight, growth, organic form, natural materials — on the argument that human attention is calibrated for them and does badly without them.

On a website that cannot mean real plants, so it means the parts that survive translation:

The words this site uses

Five of them, borrowed from the herbarium and meant literally.

Specimen
The thing being read, and it is somebody else's: Woolf's essay, a painting, a myth, a word. A specimen is collected, not written. On the page it is the quotation in its ruled box.
Sheet
One page of this site — the paper the specimen is mounted on, and everything we say about it. The Army of the Upright is a sheet.
Label
The small ruled block near the top of a sheet: subject, maker, the date of the original, the date of the reading, and who read it. The label is where we speak. Their words are in the specimen; ours are on the label; the line between the two is drawn in the layout rather than left to a reader's good faith.
Plate
Two meanings, both in use. In a book, a plate is a full-page illustration — the borrowed botanical images below are plates. On this site, the front page is the plate: the sheet on which the others are mounted and numbered.
Card
How a sheet appears on the plate — kind, accession number, title, and a line about it. The coloured tape across the top of each card is the only thing distinguishing one from another at a glance.

One more, not yet in use: a run is a sequence of sheets sharing a lens. There is no run yet, and there will not be one until three sheets want the same shelf.

The palette

Every colour on the site is a token in one stylesheet, and no page writes a hex. That is not tidiness. Star Stuff once shipped forty-four of forty-six pages that printed blank, because they hardcoded colours the print sheet could not reach.

The house style asks for a contrast ratio of 7:1, not the usual 4.5:1. Three tokens clear it against the paper and are allowed to carry text. The rest are decoration — line art, rules, the tape on a card — and are never set as type.

The five decorative colours are the ones a butterfly wing gives you. They are used sparingly and never all at once.

The type

Two families, both variable, both with real fallback stacks. Fraunces sets the display, and it was chosen for one reason: it carries an axis called WONK, which exposes letterforms that deviate from the norm as a setting you can turn up. A site about queering normativity setting its masthead with the deviation axis open is the argument made in the type rather than described in prose.

Fraunces italic — wonk and soft, turned up

jasmine, gypsywort

The same face and the same words, axes at zero

jasmine, gypsywort

Look at the descenders. With the axis open, the g ends in a hook that does not close; with it shut, the same g curls into a tidy loop. The j and the y change with it. Most of the alphabet does not move at all — the deviation is small, and it is applied exactly where deviation is possible.

You are in plain view, so both lines above are set in your own reading face and the two settings are identical. That is plain view working, not a fault — the decoration is what got switched off.

Newsreader — the reading face

Considering how common illness is, how tremendous the spiritual change that it brings, how astonishing, when the lights of health go down, the undiscovered countries that are then disclosed.

Newsreader sets everything you actually read: body text at about 19px, line spacing 1.65, and a measure of roughly 66 characters. Body text on this site never goes below 18px and must survive 200% zoom.

Plain view

Every page has a plain view control at the top. It turns off the wonk, the rotation, the display faces, the paper wash, and the motion, and leaves the words exactly as they are.

It is a stylesheet, not a second document. There is one copy of every sentence on this site, and the decoration is a layer over ordinary semantic HTML. Never an image of text; never a decorative copy and an accessible copy. Two copies of the same words drift, and the accessible one is always the copy that rots.

The drawings

The botanical art at the top of each page is inline SVG — paths in the page, coloured by the same tokens as everything else, animated in CSS. Nothing is an image file, so it stays sharp at any size, prints as line work, and costs no extra request.

Motion is growth: stems draw themselves in, then leaves and wings unfurl. All of it is gated behind prefers-reduced-motion, so the reduced state is the completed drawing.

Borrowed plates

Where a page wants a real botanical illustration rather than our line work, it uses a public domain plate from a nineteenth-century book, most of them digitised by the Biodiversity Heritage Library, whose scans of out-of-copyright natural history are one of the quiet gifts of the open web.

A hand-coloured plate of a hard fern: eight bright green fronds radiating from a dense brown root mass, each frond finely divided into narrow paired leaflets, with two detail studies of a single leaflet at the lower corners.
Hard Fern, Blechnum boreale. The ferns of Great Britain, and their allies the club-mosses, pepperworts, and horsetails (London: Society for Promoting Christian Knowledge, 1855). Public domain.
A hand-coloured lithograph of two orchid blooms. Broad tawny sepals and petals, heavily freckled with dark red, spread around a frilled lip of deep pink and magenta with a yellow throat.
Plate 511, The Floral Magazine, volume 9 (London: L. Reeve & Co., 1870). Drawn and lithographed by Worthington G. Smith. Public domain.

Two rules govern them, and the second one has teeth.

Public domain, verified, not assumed. The Biodiversity Heritage Library hosts material under several different rights statements, and plenty of it is not public domain. A fern plate we nearly used here was marked “some rights reserved” and was put back.

Read the corner, not the catalogue. A plate carries its own attribution, engraved in the margin by the person who made it, and the catalogue record is a finding aid that can be wrong. A Curtis’s plate we considered is tagged Walter Wood Fitch in its record; the signature on the plate reads W. Fitch, and the artist was Walter Hood Fitch. The orchid above is credited from the words engraved at the bottom of the plate itself. The fern is credited to its book and no further, because the record names no artist and the signature is too faint to read in the scan — and a name we cannot read is not a name we will print.

How it is built

Static HTML files with no build step, one shared stylesheet, and a few small scripts that check the things we have got wrong before: markup that browsers silently rewrite, pages missing from the sitemap, and contrast measured on screen and under print emulation. Everything here is on GitHub.