Celebrating a Year of d00k.net
This time a year ago, d00k.net opened for the first time. The dates are a bit fuzzy, the domain was purchased in early March around my birthday, but I consider the site’s first real day to be when it was added to the XXIVV Webring on March 22nd. Dates aside, in just this one year the site has changed a lot. I tended to work on it sporadically, for reasons I’ll get to later, and it’s visual language, style and purpose has grown and changed as well over the past 12 months. I want to take this post to look over some of these changes, as well as take a look at where I want the site to go over the next year.
Purpose
I started d00k.net mostly just out of a desire to have a website. I’d spent the last year surfing the web more, and webrings like the XXIIVV webring dragged me in easily. The idea of a personal wiki or site really shouldn’t have been that radical for me, but I’ve really only started using the internet properly in the past maybe 5 or 6 years? These sites made me realise how a website could help me, to motivate me to create and share work but also to help me get better idea of who I was and how everything I do and love links back to me. It sounds a bit strange trying to describe, but I know the results have shown for themselves that this really worked.
Going forward, I can see it’s purpose changing to being more outward. I make a lot of guides, or well get rather annoyed when I don’t and forget how to do or use something. I’d love to put a lot more of these guides together both for myself and others, overall just fleshing out the Knowledge wiki to be properly useful.
Design
Being a designer, my instant goal was of course to make a website that looked good. But having been introduced to concepts like frugal computing and the smol web, I had a greater inspiration to build a website that both looked good and ran as small as I could possibly make it. But we’ll get into that specific rabbit hole in a bit.
The first iteration of my own d00k.net was admittedly a design failure. I had been struggling with grasping Hugo, and used Lizbeth Poirer’s ritualdust.com as a references to work from. Through her site I was brought to thomasorus.com whose notes on web development, and the site itself, were incredibly helpful. I was really inspired by the theming both sites did, and attempted something similar. The end result was.. definitely something. At the time I thought it was cool, but I honestly have no clue how I put up with it for so long. It had to change.
The redesign, which you’re looking at now (hopefully), didn’t start from scratch as much as it took the old design and made it actually palatable. Specifically, I took the colour scheme from the most usable section, the journal, and made it the site-wide theme. To make each section it’s own however, I made the header bar theme-able and made a new range of colours for it. I was inspired by a technique I found on He Can Jog’s site of tiny gifs as a sort of repeating texture for backgrounds which really took the new design to the next level.
I also began to create a unique visual language for thumbnails on the site, almost entirely by accident. So when redesigning the entire style, I thought I’d lean in on this a lot more, which is how the frontpage came to look like it has. I’m immensely proud of these, even if they are rather small, it’s something I’d love to replicate more throughout the site in the future.
Making the site small
Like a lot of people with websites, whenever I did any work with the site I tried to improve the size or efficiency of assets and the like. From the start, I followed Rekka Bellum’s guide for image optimisation, eventually tweaking it for example to output images in 720px wide. If I stopped there, it probably would’ve been fine. My site doesn’t run any javascript, it isn’t some electron nightmare hog etc. But if there’s room for save even a kilobyte, I’ll take it.
Some changes were small, like streamlining my css and compressing the file, but some were a lot bigger and some were just downright ridiculous of me. Once I began using SVGs a lot more, I tried reducing their size by hand, and while this worked pretty well, I eventually started using Oh My SVG which is absolute magic and beats me everytime at downsizing SVGs. The real insanity came with fonts.
At the start, the site used 3 fonts (text, headers and links). I eventually changed my main font to League Spartan Variable, keeping Barlow as the header font and CMRDD as the link font. Each was equally as large, but instead of using something like fontsquirrel to reduce their character set, I decided to subset them myself.. manually. I had gotten a bit too comfortable at this point with Fontforge, and thought why not? And don’t get me wrong, it paid off, the site font files are absurdly small now, but I don’t know if it’s totally worth it. One thing I did manage to do was edit and successfully output a variable font from Fontforge, which apparently shouldn’t be possible? I haven’t been able to repeat it again which has been frustrating. I’ve gotten around this by creating a fallback font which just the icons I want to add to the site (like my logo’s🗦 & 🗧) Since the redesign, I’ve also removed the 3rd font for links, deciding to style them instead.
Currently my main page sits at around 30kb, I think originally it could’ve been something like 140 or 170kb. My main goal has been to keep under a mb for any page, and so far this has been successful. The largest page is one of my photography galleries, around 800kb. Maybe hasn’t been the greatest use of my time, but seeing the total page size gives me a huge grin every time I see it.
What’s next?
My own static site generator. Hugo was alright to start with, I don’t wanna say it’s been bad but it hasn’t been great either. I had to hack together my own shortcodes for images, and I use rawhtml inputs every time I want to add a list of links to a page. Sometimes hugo makes illogical decisions generating pages, that I just cannot wrap my head around, and I’d much rather have an SSG that I can more properly control the output of. I’ve decided at least to use python, whether it’s a home-made job or an existing solution I’m not sure of yet. I do know when I get to it, I plan to do another wash over of the CSS. I threw my styling for bodies of text together mostly on instinct, and it could do with some proper logic and decisions behind it. I also want to add time into the site, since I don’t even track the date right now, but I want to do something cool and unique here.
Maybe next year I’ll have made enough changes to warrant another anniversary post, but I hope not! For everyone who has checked out my site, found it useful, or even just liked it, thank you! I hope for other people who may be considering making a site that d00k.net can inspire you just like other sites inspired me. Thanks for reading, and see you soon.
Dook.
