A personal website.
Diplowhat?
A diplograph is a machine that produces multiple copies of text at the same time, for example one that’s simultaneously a typewriter and braille embosser.
See, I used to—actually the name doesn’t make any sense, now that I think about it?
Colophon
Diplograph
Diplograph is generated with a custom engine I call Ink, written in TypeScript (external link) and running in NodeJS (external link). Ink generates a static website that requires no server side processing.
I write with iA Writer (external link). I develop with Visual Studio Code (external link).
CSS is written in Sass (external link). Markup is mostly hand-written HTML, but the occasional snippet is written in Pug (external link), based on HAML (external link).
Typography
The serif type is EB Garamond (external link), a wonderful revival of Claude Garamont’s sixteenth century types. Text requiring extended character support is set in Junicode 2 (external link). The sans-serif is Inter (external link). Header navigation is Archivo (external link). The monospaced accent type on the front page is DM Mono (external link). Code is set in Fira Code (external link).
The icons are Cole Bemis’ Feather (external link), packaged into a font with Inkscape (external link), svgicons2svgfont (external link), and svg2ttf (external link).
Fonts are processed with pyftsubset (external link), part of fonttools (external link).
License information for these types can be found at Additional Notices and Licenses.
The curly quotes algorithm is based on David Dunham’s Smart Quotes algorithm (external link).
Math is typeset with .
Design
Diagrams and charts use the Color Universal Design (external link) palette, from Color Universal Design-The Selection of Four Easily Distinguishable Colors for all Color Vision Types- by Y. Ichihara and M. Okabe and K. Iga and Y. Tanaka and K. Musha and K. Ito (2008).
Code is highlighted with Shiki (external link). The code themes are Atom (external link)’s One Light and One Dark. The layout is inspired by the parallel Docco (external link) style.
Bibliographic information is stored in CSL-JSON (external link). The processing is custom. The style is not quite MLA-ish.
Photography
My camera is an old Canon EOS 500D. I use a few different lenses but usually travel with a Canon EF 17–40mm ƒ/4L USM. Many of my photos these days are taken with my iPhone.
Media
Images are prepared with ImageMagick (external link). Exiv2 (external link) is used to process metadata. PNG images are optimized with OptiPNG (external link) and JPEG images are optimized with MozJPEG (external link).
Videos are processed with ffmpeg (external link) and captioned with Aegisub (external link).
Maps
Maps use Natural Earth (external link) data and are rendered with Mapnik (external link). The map on the archives page is a Kavrayskiy VII projection. Pins are projected with PROJ (external link). Unless otherwise noted, geo data is expressed in WGS 84 (EPSG:4326) coordinates.
Diplograph and Cookies
Diplograph does not use any cookies or other local storage mechanisms for tracking.
Diplograph and JavaScript
Diplograph does not require JavaScript to be enabled. Some pages might have interactive examples or tools that use JavaScript, but there will usually be a small note letting you know about these.