Building a static website
17-NOV-2025
Published posts
Building a static website blog post series. Look at the first blog post or later on this page for background on this project.
Building a static website (part 1)
The first part of a series of blog posts in which I go through the various steps and design decisions I am using to build a static website. Each subsequent post will add further to the site design.
David – 01-AUG-2025, updated 13-AUG-2025
Building a static website (part 2: Introduction to images)
Building a static website from scratch using text files, bash scripts and free tools. In this blog post, I start looking at the subject of displaying images within webpages.
David – 07-AUG-2025
Building a static website (part 3: Screen sizes, logical and physical pixels, resolution and scaling factor)
Building a static website from scratch using text files, bash scripts and free tools. In this blog post, I start looking at the vexed issue of physical and logical sizes, resolution and scaling factor.
David – 18-AUG-2025
Building a static website (part 4: Adding some navigation)
Building a static website from scratch using text files, bash scripts and free tools. In this blog post, I take a detour into adding some basic site navigation, while exploring semantic HTML elements and website structure.
David – 21-AUG-2025, updated 06-SEP-2025
Building a static website (part 5: Introduction to responsive images)
Building a static website from scratch using text files, bash scripts and free tools. In this blog post, I start looking at the subject of displaying responsive images within webpages.
David – 30-AUG-2025, updated 06-SEP-2025
Building a static website (part 6: The CSS box model)
Building a static website from scratch using text files, bash scripts and free tools. In this blog post, I look at the CSS box model.
David – 06-SEP-2025, updated 07-OCT-2025
Building a static website (part 7: The CSS reset)
Building a static website from scratch using text files, bash scripts and free tools. In this blog post, I look at "resetting the CSS", to take better control of the layout.
David – 10-SEP-2025, updated 08-OCT-2025
Building a static website (part 8: Web typography basics)
Building a static website from scratch using text files, bash scripts and free tools. In this blog post, I look at some Web typography basics.
David – 08-OCT-2025, updated 15-OCT-2025
Web typography — more about fonts
Building a static website from scratch using text files, bash scripts and free tools. In this blog post, I look deeper into using fonts on webpages.
David — 15-OCT-2025, updated 17-NOV-2025
Building a static website (part 10: A first look at flexbox)
In this blog post, I look at using flexbox to implement a list of published blog posts.
David — 17-NOV-2025
Background and overview
Amazingly, I first registered the domain (saxbynet.com) on which this site is hosted, way back in 2002 and have had a personal website at that address, in one form or another, from around that time. However, I have not tended to regularly update it most of the time and it has never really been properly designed. This is now something I want to put right, especially as I do have the time to do so and have made some efforts on and off over the years.
Therefore, recently I took the decision to imagine designing my personal website from scratch and documenting the process of doing that through a series of blog posts. It is not entirely a clean sheet of paper, in the sense that I have taken some ideas from what I have done already, but I'm now trying to approach things in a more focused and logical way.
Why am I doing it this way?
There are of course plenty of static website generators and a new wave of AI-based site builders, so it's worth exploring why I'm doing it "the hard way".
If this were some kind of professional or commercial venture, it is highly likely that I would use one of the many services available to create it, but this is just a personal project and by building it myself, I'm going to learn a lot more than I would by using some other approach. It is also going to take lot longer, but that's fine, because it's all part of what I'm trying to achieve. DIY is the entire point of the exercise.
How are these blog posts organised?
One thing that is important to understand is that I am definitely building the ship while it's sailing. That means that I'm doing my best to make each separate blog post reflect the situation at the time of writing. For example, each post has its own separate CSS file, rather than a central one that I change over time. This allows me to make changes without affecting the existing posts, which gives a much better idea of how things are evolving as I try things out. Naturally, once I am finally in a position to have a design that I am happy with, future articles would then make use of what I've learned and I would have a central CSS file and icon set and so on.
I'm also intending to avoid making big updates to published blog posts. That isn't a strict rule, as there may be some circumstances where that is unavoidable, but it is once again aimed at trying to leave things largely looking as they did when I originally wrote to that particular post. Having said that, in the majority of cases, when I add a new blog post, I do go back to the previous one and update it to add a link to the latest post.
Note that this particular page is an exception, because clearly I will need to add links to the latest articles as they are published. I will also continue to update the CSS associated with this page.
Other considerations
- I've not planned the subjects I'm going to cover in advance, so these blog post will necessarily jump around to a certain extent, as I decide on what I want to look at, or need to look at.
- This is not intended to be a tutorial: I'm not trying to teach anybody, because I consider myself to be the one that is attempting to learn. I am just documenting my progress and documenting that for my own purposes. On the other hand, I would be more than happy if anyone finds some of this useful.
- There was no AI involved in the building of this site! All the words I've written here are my own, for better or worse. It's also my own photography and graphics, unless stated otherwise.
- At the time of writing, I'm not using any JavaScript. There is also no advertising or cookies.
- This website is designed and hosted on Linux-based systems and uses free and open source software wherever possible.