Working on the website instead of the blog itself

Another blog post, another meta post about blogging. In my previous entry, I was saying how important it is to actually write stuff on a blog, and not procrastinate by updating its container instead. Well, I have not done that; the opposite actually.

Since the beginning of the year, I spent most of my evenings updating the code behind the Jolly Teapot and its features. I’ve used the word “tweaking” in the past, but this time it felt bigger than that. Each of these changes feels like an improvement, and serves a purpose: either making the website faster and easier to read, or improving my focus on writing.

1. The CSS

This time, it was not really about making it as small as possible, it was about getting rid of low value elements, shrinking not only the weight of the stylesheet, but its complexity. I’ve managed to reduce the file size by around 25%, but more importantly, it is now simpler, more elegant, and much easier to maintain.

2. The HTML

This was a big one. This work was also about making things simpler and more elegant, but, unlike the CSS, this was never really done before. I should have kept track of all the unnecessary divs and paragraph blocks I’ve removed, because you probably could build a whole other website with them. The result is impressive: the size of the HTML was reduced by more or less 70%, according to my most-visited website of January: GTMetrics.

3. The favicon(s)

The favicon situation on the web is a mess, and I would strongly recommend not looking too much into it, like I did. I’ve spent hours trying to create the smallest PNG file possible — which technically cannot go below 67 bytes — and wondering why the compressed file on the server appeared to be eight times bigger than the local file. Some epic and useless drama right there, but in the end, the favicon — which was way too big to begin with — is now 250% smaller.

4. The logo

The favicon file itself is not the only one that was offered an update: I’ve let go of the previous teapot logo, and I now use just a basic coloured square: good enough, and recognisable enough all things considered. Also, I never really liked this teapot logo in the first place, as it felt a bit redundant with my website’s name.

5. The template

If you follow me on Twitter, you already know that this very template is now available for all lucky Blot users. This template is very minimal, and not as easy to use and feature-rich as the default templates available on Blot. To make it slightly different than this site’s template, it uses this very nice #FF4500 highlight colour, of which I’m now kind of jealous.

6. The interface

It took me a while to figure this one out, but this is what happens when you learn HTML as you go. The homepage now highlights the entire link of each entry, instead of highlighting separately the title and the summary, which felt cheap and wrong. It’s the little things, but this one also allowed me to get rid of a lot of code on the page, making it lighter, faster, more efficient, etc. The homepage now behaves almost like a “real” website.

7. The details

I am probably the only one who would be able to notice the little, numerous changes here and there. From the content width to the way the blockquotes are displayed, all of these changes — I think — make the reading experience better than before. The switch from Avenir Next to Avenir¹ will probably go unnoticed too, but this was actually a very hard decision to make, mostly justified by a more pleasing font weight distribution, allowing me to get rid of some CSS code at the same time.²

I wondered if I should pick an easier-to-read font too: finding the balance between “looking great” and “perfect to read on any screen” is harder than I expected, espacially while sticking to system fonts, but now that most screens have Retina qualities and crazy pixel densities, and that most browsers have a handy “Reader mode” available, I believe Avenir is good enough.³

8. The photographs

Only the best Jolly Teapot fans will have seen this — hi Mom — but there has been a Photographs page somewhere on this website at one point. The idea came to life after trying out the summer 2021 hit app: Glass. I didn’t use it long but I thought: “Why not having a few of my photos displayed on my site instead?” So I did. But again, to focus on the essence of this blog, I abandoned the idea and deleted the page.

9. The newsletter

Same goal, same story with the newsletter: focusing on writing blog posts, not a newsletter. I liked the idea of having a seasonal newsletter, just to share my favourite links of the previous months. But this is not blogging, so it had to be either automated, or terminated. I couldn’t find an easy way to offer reader what would basically be a way to subscribe to the RSS feed via email, so the newsletter is now gone.

10. The Twitter account

At this point I am pretty sure you know what I am going to say: focus, no distraction, yadda yadda. The Jolly Teapot Twitter feed was automated though, so I could have left it as it was, but focus is not only about stopping to spend time doing other things, it’s also stopping thinking about things. Having this second Twitter account felt a little like carrying an extra bag. No thanks. Bye bye, one Twitter account is plenty enough.

To summarise

Everything listed here was made to help me focus more on writing, and spend less time on sharing, and endlessly wondering if the website is good enough: now it is. So I will now follow Tom MacWright’s lead when he says:

If you’re trying to blog, write. Work in the ‘posts’ and ‘drafts’ folders. Create TODO lists and schedules to get posts live. Stay out of the blog configuration, templates, plugins, and whatnot.

Now, sure, it’s fun to tinker from time to time. This blog, macwright.org, changes over time, at the pace of about 100 lines of code a year, mostly deletions. But this change is limited and intentionally sporadic, never happening more than a few times a year.

For me this will translates as only updating the code and layout of the Jolly Teapot once a year. In January, I will allow myself to change things, like I did this month. After January, only fixing glitches will be allowed. I will otherwise “maintain” the new template source code on GitHub if it feels necessary, and update the Blot-available template accordingly, but this website will stay the same for at least eleven months.

This January decision is only a part of the many little changes I’ve forced myself to do in 2022, but maybe this is a story for another post. I will also try to avoid “meta blogging” entries in the future: it is easy to write about blogging itself, harder to focus on the specific topics that I want to write about that require reading a lot of related news. Now that my extra time is free of tweaking the design, I guess I’ll have more time to do so.