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.2, 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 CSS is custom-built with a Gruvbox-inspired colour scheme and no external frameworks, prioritizing performance and maintainability. The typefaces* used are Public Sans for body text, PT Serif for headings, and JetBrains Mono for code and metadata.

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:

Enhanced Markdown Capabilities

The site supports extended markdown features for rich content creation:

  • Mathematical expressions via KaTeX (inline $ and block $$ delimiters)
  • Emoji shortcodes that automatically convert to emoji characters
  • Standard markdown footnotes with proper styling and backlinks
  • Mermaid diagrams for visual representations of processes and relationships
  • Custom CSS classes for styled components (alerts, buttons, color utilities)

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:

  • Microformats2: Proper h-card, h-entry, and h-feed markup for machine-readable content
  • Webmentions: Configured with webmention.io for receiving interactions
  • POSSE: Publish (Own Site, Syndicate Elsewhere) - canonical content lives here first
  • IndieAuth: Currently, 14 rel-me verification links for identity across the web
  • RSS/Atom/JSON Feeds: Multiple feed formats at /feed.xml and /feed.json
  • Semantic HTML: Proper landmarks, ARIA labels, and accessibility features

Principles

  • Plain text survives. Markdown + git keeps the work portable and future-proof.
  • Performance matters. Shipping less is a form of respect. Target: 95+ Lighthouse scores.
  • Accessibility is non-negotiable. Sites that work for people, not screens. WCAG 2.1 AA compliance.
  • Progressive enhancement. Start with what works everywhere, enhance from there.
  • Own your data. Canonical content on my domain, syndicated elsewhere as desired.
  • Build in the open. Source code available on GitLab, documented for others to learn from.

Current Site Statistics

  • Build time: ~5.8 seconds (including search indexing)
  • Pages generated: 240 (239 HTML + JSON feed)
  • Blog posts: 50+ and growing
  • Static pages: 35+
  • Tag pages: 70+ with h-feed markup
  • Search index: 16,131 words across 236 pages
  • rel-me links: 75 for IndieWeb verification

Performance Optimizations

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

  • Filter caching: Implemented caching for expensive operations (83% improvement on totalWords filter)
  • Incremental builds: Only rebuilds changed files during development

See the performance documentation for detailed metrics and optimization strategies.

Operational Notes

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

Local Development

Prerequisites:

  • Node.js 18+ and npm

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:8080 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:

  • Build command: npm run build
  • Publish directory: _site
  • /uses - Tools and software I use daily
  • /accounts - All accounts and profiles I control
  • /why - Why this site exists
↑ TOP