Dan Romero

How this website works

GitHub Pages

Hosting is on GitHub Pages. My rationale: I already had a GitHub premium account and thought the integrated version control support for both the site’s design and content was compelling.

Jekyll

The content management system is Jekyll. I chose to use a static site generator over a hosted CMS for several reasons:

As for why Jekyll over other static site generators (like Hugo or Pelican): the excellent GitHub Pages Jekyll support. I can upload Markdown files and GitHub takes care of all generating. One downside of using Jekyll was the lack of native mobile apps for iPhone and iPad, but I don’t post frequently enough that this is a major issue, and in a pinch GitHub’s mobile website works well enough for quick edits.2

Custom Theme

The Jekyll theme for this website is custom. I originally started with an out-of-the-box Jekyll theme called Minima but it felt too generic. After an underwhelming search for a better Jekyll theme, I decided to build my own.

My goals for the design were as follows:

Since I wanted to minimize dependencies, I started with a blank CSS file. I thought this perfect version of MFW was pretty close to my ideal text-focused design. Using that as a base, I removed and added some declarations, tweaked the typography setting to something I found visually suitable on both desktop and mobile, and that was it.

As for the layouts and includes, I simplified them as much as possible.

You can find an open source version of the theme on GitHub.

Ulysses

Ulysses is my Markdown editor of choice on macOS and iOS. (I will write about this setup in more detail at some point.)

Open Graph

Twitter’s default way of displaying a URL in a tweet is fairly bland. Inspired by Daniel Gross, I’ve been manually making images for my posts in Keynote, exporting as a JPEG and then including the image URL in the front matter. The front matter image URL is then automatically included via a Liquid variable in the header.html include for my Jekyll site. Twitter OG support has a few specific quarks. It works in iMessage, WhatsApp, Telegram, too.

A tip: Twitter will cache the first version of the OG content for a given URL. So if you make changes to content or the OG image, you have to manually refresh the cache using the Twitter card validator. Just drop in the URL of your post and Twitter’s servers will re-cache the latest content.

Hover

Hover is my domain registrar.4

Google Analytics

Google Analytics for traffic stats. Passively looking to change to something more lightweight that works well with GitHub Pages and Jekyll.

  1. I believe we will still be consuming most text on the internet via HTML in the next 10 years. 

  2. I found getting Jekyll set up in local macOS environment to be a bit tricky. If you have a guide that’s current as of February 2020, feel free to share with me and I’ll link to it here. 

  3. Favorites include: Gwern, Alexey Guzey, Dan Wang, Kevin Kwok, Florent Crivello, Devon Zuegel, Patrick Collison, Sriram Krishnan, Daniel Gross, Peter Norvig, and Nintil

  4. If you are using GitHub Pages for hosting, be sure to enable HTTPS on your GitHub Pages settings page. Otherwise, both Chrome and Safari will display a “site not secure” warning. When setting this up, I ran into some DNS caching issue when trying to test the HTTPS URL for the site. The best solution was to a) try from another device and/or Internet connection (e.g. my iPhone cellular data vs. Wi-Fi) b) go do something else for 30-60 minutes and let the cache expire. 🤷‍♂️ 

First published on February 10, 2020