Designing Simple Websites
Published by James Gallagher on .
This article takes approximately 5 minutes to read.
I have been setting myself a challenge in my recent web projects. When I start working on a new site, I like to ask how I can make the site as simple as possible. I aim to build the most stripped down version of a site that I can that works.
On the flip side, tools like WordPress only offer creators a certain level of control over their work. I believe you can develop your own plugins for sites like WordPress but it’s not something I could do. I much prefer to design a website myself. When you only know how to use WordPress, you don’t know that there are other options out there. One of these options is building a website yourself.
Elegance in Simplicity
The fewer tags on a page, the better. This has become a pseudo-mantra for me. This website is a great example, and to date one of only two examples that I can cite. I hope to build more simple websites as I come up with ideas. I have periods where I get a lot of ideas and times when I have none. I’m presently still figuring out what my next website will be. Anyway, to the point.
I used to be a big believer in complex code. It made me feel good, honestly, to know how to write complex websites. Telling other people that I had built my website in React meant something to me. It shouldn’t have meant anything. Technologies don’t matter as much as the end result. It did, and I used it as a way to over-engineer every aspect of my site. Hence, I decided to start from scratch with this one.
Code does not need to be inherently complex. It is just that it’s so easy to make it complex. It is easy to add in new features because I have the technical aptitude to do so, without first considering whether they are necessary. Just because you have the skills to do something, it does not mean you need to do it. I have the skills to build more advanced websites; I am just choosing not to use them.
It’s for the Users
Simplicity is not just for me. It’s for you, the users, the readers, whatever you want to call yourself. Open up this web page in your browser’s developer console. You will see that it is simple. There are two web requests made: one to this HTML file and one to the corresponding CSS file. I have already said this in another post. It bears repeating because how important I consider this to be. My site is simple. It could just be a plain HTML file with no styles, but I did want to take some creative liberty over its design.
You get information quick on this site. The site loads almost instantaneously. Imagine if this was the experience you had on all websites. What I was thinking about today is how much easier it would be if technical documentation was written in plain text, with embedded code snippets when necessary. It would make finding documentation so much easier. You wouldn’t have to learn how every company or API structures their documentation. It would just be in plain HTML, maybe with some basic CSS.
Having a simple site is good for me. It is easier for me to maintain. Uploading new posts is a bit manual but that is the price I have chosen to pay for having this website. I don’t mind dragging a markdown file into the Jekyll version of this site every day or so. I may not do it every day but I try to do it when I can. This is much better for me than having a site over which I have little control. I know what every line of code on this site does; I could not say the same if my site was hosted on another platform.
Design simple websites. I want to reduce the number of tags that I use on my sites. When I use a tag, I want to make sure that it is semantic. I recently added in an <article> tag onto my blog for the purposes of clarity. It’s much better than enclosing the contents of every web page in a <div> tag. If you happen to read the source code for this blog, you may want to thank me for this clarity. It makes it so easy to know what is going on.