Site Design
This is a short post describing how I built and designed this website. It should be helpful for anyone thinking about starting a new personal website or updating one they already have.
Jekyll
I first built this site back in 2015 and decided to use Jekyll, which is a static site generator, meaning I can develop locally using a server but only deploy static files like HTML, CSS, JS, and images. This approach works well for me and I think most personal sites.
If I was starting from scratch today I might consider something React-based like GatsbyJS but I would definitely still use a static site generator for my needs.
Hosting
A big plus of having a static site is that deployment is cheap. In the past I hosted the site on Amazon S3 but for the past year I’ve been using Netlify. It’s fantastic. Netlify handles so many things that I had to juggle in the past manually including HTTPS via Let’s Encrypt, CDN, minimizing assets, DNS, and more. And it is free until you reach a large audience size or add custom features.
Design
Over the years I’ve twiddled with the design on this site a lot. Probably too much but I view it as a lab for learning and playing around with layouts. These days I keep things very, very simple. Custom CSS and not much more. Lots of white space. I do use custom fonts which make a big difference in the look and feel, notably Concourse for the text, Equity for the headlines, and Triplicate for the code samples.
Probably the single best piece of advice I can give on design is to use a custom font. They’re worth the money. Matthew Butterick, who designed all three of my fonts, has a fantastic free online book, Practical Typography, that I strongly recommend.
In the past I’ve used Bootstrap and really fancy JavaScript but not anymore. Although I enviously look at well-designed websites by others, I think if you’re cutting edge with design you also become dated quickly. That slick animation is killer now but in two years will be old news. Since people come to my site for the content mainly, I largely resist the impulse to spend much time adding cool new features or redesigning the site very few months.
Comments
Currently I use Disqus for comments on my site. It’s not perfect–there are ads and additional tracking involved–however I’ve found readers are far more likely to leave a comment than email me with feedback. And I really enjoy the feedback on everything from small typos to larger debates about content I’ve written.
If I did have my own commenting system, I’d need to move off a static site architecture, which I don’t want to do. Also doing auto-detection of profanities and other things is non-trivial and Disqus handles it.
That said, I can definitely see a future where I don’t have any comments at all. It would mean a simpler site design. Faster loading times. And save me some time but I still value the interaction and don’t have that much spam so…worth it for now.
Additional Features
In the future I think adding search as well as specific category pages–Django, React, Python, JavaScript, etc–would be a good idea. But time is limited so that probably won’t happen for a while.
Big picture it is highly worth the effort to setup and automate a personal website for yourself. There is zero friction in my current setup and I enjoy the chance to fiddle with things when I need a break from formal projects.