I decided recently to rebuild my long-neglected music website. It has been through a number of iterations over the years, from Wordpress to Squarespace, Micro.blog to Carrd. Each had their benefits, but over time would always start to fall out of date. The problem with listing upcoming gigs is that they never stay upcoming for very long…

I’ve always had some interest in designing for the web, and learnt some HTML and CSS as a teenager. My interest has been sparked again recently with the gradual rise of the ‘indie-web’. This means different things to different people, but broadly revolves around the idea of owning your own content, and hosting it at your own domain, rather than feeding the algorithms of Instagram and Facebook. 

I decided to take a hands-on approach to the website. I would build it myself, from scratch.

Looking around at various options, I settled on the static site generator, Hugo. Most websites you see now use databases and queries, checking for updates every time someone loads the site. Static sites are made up only of HTML, CSS and, optionally, Javascript, because the building happens at the time of publishing, rather than in the moment. This results in less interactivity, but what they lack in that department, they make up for in their tiny size and lightning-fast speed.

To start the project, I had to learn a little of how to use the terminal. I’ve always been terrified of this. It seems like a little window, looking directly into the core of your computer, and one wrong move, one ill-considered command, would be like dropping a spanner into the humming engine. Fortunately, a combination of good documentation and a little help from ChatGPT ensured I haven’t (so far) caused any irreparable damage. Once installed, the first step on the journey to a new website is as simple as:

Hugo new site ralphwyld

My design inspiration for the project came from beautifully clean and elegant sites such as robinsloan.com, manuelmoreale.com, and the ethos of simplicity behind the host of this blog, pika.pages. I find these sites a joy to read with their extended line-heights, simple typography, and limited colour palette. I also love the personal and unique voice behind them - like the author or artist themselves is telling the story, rather than another third-person biography.

Clean and simple

I came across a number of challenges along the way, which I’ll write about in the next few weeks, but most I was able to come with the help of trial and error, forums, and some ChatGPT. I’ve added to my HTML and CSS knowledge, as well as picking up a few little details about Go, the language Hugo runs on behind the scenes.

The result is here, and any feedback would be gratefully received:

ralphwyld.com

Although there are still some things to iron out on this project, and features I’d like to add, the hosting for another of my sites has run out and so I’ve started working on that now too…