About This Site

The Platform

I built this site using Hugo, a really wonderful open source static website generator written in Go. It’s hosted over at Netlify, or on Amazon’s S3, depending on how I feel or what particular month it is.

I’ve been advocating static website generators since at least 2011. They suit most use-case scenarios, are secure (no database, and you can’t hack static HTML) and serving static pages offers the least server overhead. In other words, they’re fast.

I use Hugo because Go is a fast language; it compiles, so unlike the slightly more popular Jekyll, I don’t have to install lots of gems (a convenience I pass on to my clients, too).


I crafted the CSS by hand from scratch using Atom, the open source text editor. This time around I was finally able to use the new CSS Grid and flexbox stuff they baked into the language in the past year or so.

Look: four lines to do this site’s pagination!


    ul {
        list-style-type: none;
        display: flex;
        align-items: center;
        justify-content: center;


That’s crazy, compared to the 20 odd lines my same pagination used to require.

Similar story with the site’s grid. Look at this.


// tablet, desktop

@media (min-width: 700px) {

.storyWrapper {
    grid-template-columns: 2fr 4fr 1fr;
    "preamble preamble preamble"
    "sidebar content ."
    "epilogue epilogue epilogue"


That’s the responsive layout for the ‘story’ pages. That’s everything layout related for the story text and sidebar, between the header and the footer. How awesome and minimalist is that?

Do you know how irritatingly hard that used to be? Since… forever?

Finally, this is the CSS for the Newsletter Sign-up form and button behaviour in different browser widths (not font and colours).

    display: flex;  
    margin: 0 auto;


.newsletterform input[type=“text”] {

    flex: 1 1 auto;
    justify-content: center;


@media (min-width: 700px) {

    .newsletterform{ width:500px;}  


I have no words for how much cleaner that is, compared with the dozens of lines of nonsense and floats and positioning hacks we used to have to use. Positioning forms correctly across multiple browsers and widths was always the bane of my existence.

The Illustrations

Many of them are just post-processed .pngs from photographs, but I’ve also hand illustrated a few for upcoming stories this year.

The illustration of me on the front page, I drew myself by hand in Photoshop — using a Goddamned mouse! Who does that? Nobody does that! I was very determined that day, I think.

I’m in Spain at the moment, and I left my Cintiq back in Boston because ‘luggage space’, so I felt like I had no choice.

The Bookcover

I’m pretty pleased with the cover design for The Harvard Skull Fiasco. I’ve done about four iterations of that, but I wound up feeling this strong nostalgia for old Penguin Classics. Their design is timeless. That book cover is just a place holder, to make this website a little prettier, and not ‘for production use’, as web-developers would put it. But still, it wasn’t a bad bit of work.

Any Questions?

If you have any questions about how I do this stuff, hit me up. It can take me some time, but I will get back to you.