plaintext.brennan.day

Colophon

1,298 words
ORIGINAL: https://brennan.day/colophon/

A short "how it's made" page for this site.

How this site is built

This website is currently built with 🎈 Eleventy (11ty) v3.1.5, a wonderful static site generator that prioritizes speed and simplicity. The domain brennan.day is registered on Porkbun and hosted on Netlify with automatic HTTPS via Let's Encrypt. The site uses Deflect.ca nameservers for enhanced DDoS protection and digital security.

The CSS is custom-built with no external frameworks, prioritizing performance and maintainability. The site uses two companion colour palettes, Sunflower (light mode) and Moonflower (dark mode): vivid rainbows over near-black and near-white greyscale backgrounds. You can see the full palette breakdown on the style guide. The typefaces* are served by Bunny Fonts (a privacy-friendly, no-tracking Google Fonts alternative): Young Serif for titles and content headings, Newsreader for body text, and Public Sans for navigation, the sidebar, and metadata. Code is a system monospace stack (Cascadia Code, Source Code Pro, Menlo).

The site features the Tomatic cursor set by JefTriforce, available at RW-Designer. These cute, fat cursors are licensed under Creative Commons: Attribution + Noncommercial.

The site's 88x31 button was created using the Button Generator from Ritual.

Drafts are usually written first as Markdown files in 750 Words, a practice of mine since September 2011. Other times, I write in Bear for note-taking and idea capture.

Content is then transferred to the local git repository on GitLab, with changes saved using git. Development and formatting done in Sublime Text 4.

Tech stack for brennan.day:

Publication details

Digital Security & Resilience

This site uses Deflect.ca for DNS management and DDoS protection. Deflect is a Canadian social enterprise by eQualitie that provides free DDoS mitigation and website security services to civil society organizations, independent media, and human rights groups worldwide. Founded in 2011, Deflect protects organizations facing digital threats and censorship, supporting approximately 2% of the global internet population annually. Their work has defended sites like Black Lives Matter, Ukrainian independent media, and countless human rights organizations against cyber attacks.

Enhanced Markdown Capabilities

The site supports extended markdown features for rich content creation:

These features enable technical writing, academic content, and expressive formatting while maintaining the simplicity of plain text authoring. See the style guide for a complete demonstration of all markdown capabilities.

IndieWeb Features

This site follows IndieWeb principles:

All 9 of 9 key IndieWeb building blocks are implemented, as verified by an IndieWeb checker.

Principles

Current Site Statistics

Performance Optimizations

The site has been optimized for faster builds and better development experience:

See I Made My Eleventy Build 5× Faster for build-time benchmarks and Cleaning House for the config refactor.

Operational Notes

These details are mostly for future-me (or anyone curious enough to poke at the source).

Commit Conventions

All commits follow type: description in lowercase, imperative tense. The types are tailored to a personal blog so the changelog is readable at a glance. Each type has a clear, non-overlapping job:

Type Purpose
post: New essay, blog post, or other published written content
edit: Corrections, revisions, or expansions to existing written content
update: Routine data refreshes like comments, stats, now page, friends list
design: Visual, layout, or CSS changes
build: Site infrastructure, config, tooling, or dependency changes
fix: Code bugs only; prose corrections use edit: instead
ci: CI/CD pipeline changes (GitLab CI, Netlify config)
a11y: Accessibility improvements like ARIA, contrast, alt text, semantics
perf: Performance improvements like build speed, asset size, caching
refactor: Code restructuring without behaviour change
revert: Undoing a previous commit

The distinction between post: and edit: matters most: someone scanning the changelog can immediately see which days had new writing versus housekeeping. update: absorbs all the automated, timestamped noise (comment syncs, stats refreshes) without polluting either. fix: is reserved strictly for broken code.

Local Development

Prerequisites:

Commands:

npm install
npm start              # Standard development server
npm run start:fast     # Quieter development output
npm run start:clean    # Start with clean cache

The dev server runs at http://localhost:8081 with incremental builds enabled.

To build the site:

npm run build          # Production build
npm run build:clean    # Clean build from scratch
npm run build:perf     # Test build speed without writing files

For debugging and performance profiling:

npm run debug          # Verbose Eleventy output
npm run debug:perf     # Performance profiling with timing

Webmentions

Webmentions are fetched from webmention.io at build time. The build expects a token:

export WEBMENTION_IO_TOKEN=your_token_here

Deployment

Hosting is on Netlify with continuous deployment from GitLab.

Build settings: