Well, it has only been... 2 months since I last did this exercise. But I've been thinking about this for a while, even as I was redoing my previous design. This time around, I decided to just go ahead and do it and see where the cards fell, and I was very pleased with the result I came up with.

So why now? #

A lot of it has to do with a few factors:

• I am moving away from technical writing, which has not been a major focus for this blog as of late (not withstanding that Ramp enjoys most of the fruits of that labor) in favor of creative writing.
• The old design was simply not suitable for long-form story telling, which is a topic I have gotten progressively more interested in. (As in, I am looking to post novels on this website.)
• The performance, readability, and accessibility of the old site could be much better.
• The old design worked best being image-heavy, but I simply don't provide images for every post, nor do I want to. (I also don't want to just use DALL-E or look up stock images for the sake of having images.) In some cases, images are just a flat-out tall order. One post in the works is a novel, and I don't have the resources or desire to commission an artist to draw things for it, especially when the universe is still, to some degree, fluid.
• Finally, I just felt tired of fighting my extensively hacked-up template, and wanted a fresh start.

So what's new? #

I rebuilt the entire website's style with UnoCSS. This proved to be surprisingly less painful than expected. With only a few hours of effort, I got a sketch of a design I was happy with, and with a few more hours of work, I integrated it into my existing Eleventy setup.

Some of the highlights of the new design:

New font stack #

I am now using Inter as the primary font for the website. It's a very readable font, and will provide consistency across platforms. I may be a Mac user, but that doesn't apply to everyone who reads this blog. It also seems to work well enough with my creative writing, but we will see if I need to change things around.

I am also embracing serif fonts, and I went with the Source Serif 4 font for this. It will prove to be a good font for my longest-form creative writing in particular, where I often have characters writing letters as part of the story. Previously, I used an italicized version of Source Sans Pro for this purpose, a font I was not attached to but was the only one I felt working with using the original template, as that's the font it used.

Finally, I swapped out Source Code Pro for JetBrains Mono. Turthfully, JetBrains Mono has been a font I have been using since it came out in 2019, and I have carried it over to every code editor I use. It looks great on the code snippets on this website.

New color scheme #

Out with the messy mix of colors. We're going simple: hues of blacks and whites, with a corresponding dark/light theme to switch. This time, light mode wasn't an afterthought - I consciously considered it in the design.

I otherwise kept this simple. I was certainly inspired by brutalist design, and I am mostly happy with the choices I made. My biggest hope is that the site is more legible and readable, which is important as I take the blog more decisively in that direction.

Improved code syntax highlighting #

I swapped out Eleventy's official syntax highlighting plugin for Shiki via its support for markdown-it. There were a few hiccups getting this working, mostly boiling down to the fact that Eleventy only supports "after the fact" asynchronous configuration, and it didn't seem that Eleventy was consistently applying the Shiki plugin to the markdown-it integration after initializing, but it seems to mostly work.

The most notable difference is that the theme will change in light mode to an appropriate light theme. Enjoy this little delight!

Get dropped off on the blog #

...since you are not here to read a short blurb about me, that's what the about page is for (or my LinkedIn).

You get a list of eight posts to read, and you can go back in the archives as far back as you please. I am not going to waste your time.

A touch of animation #

I added a few animations to the site, mostly to make the site feel more alive. There's a nice "slide-in" effect that I use mostly for post listing and the header to each post.

What's next? #

You'll see me continue to publish technical content here, but I'm going to have an increased focus on creative writing as that is where my passion and interest is right now. I have quite a few stories in the works, and I am looking forward to sharing them with you.

There will probably be more changes coming to this site, but I think the "big bang" is finally over with. I do have some next steps ahead:

• I need to queue up some more content, both creative and technical in nature. Keep an eye out...
• Eleventy v3 came out. Time to put aside another weekend to upgrade the site.