A while ago I wrote a piece on getting stated with a website. It was OK but I wasn’t completely happy with it. I tried to write a follow up to it but it seemed better suited to a more wiki-style format so I created my HTML handbook.
Whilst researching for the second piece that was not to be, I came across a lot of great guides. I have collected links to them (as well as some links from the first piece) here.
Hopefully these can be useful if you want to have a website for yourself.
Hosting
Site hosting
- Bear blog - this gives you less customisation or design choice but very easy. Only for a blog, not a more freeform site. If you want to start publishing right now this is a good option.
- xmit - free, quick and allows custom domain names.
- Neocities - custom domain names require premium £5/month
- Web 1.0 hosting (dot) net - around 60MB for free.
Shared servers
These are all shared computer systems that you can make an account on and will host your site.
- SDF
- SDF EU
- Tilde.club (I’m part of this - my tilde club page)
- Other tildes - tilde club member ~pfhawkins keeps a list of similar projects to tilde club. There may well be more but I haven’t encountered them.
Self host
I you want you can host your website on hardware that you own. This isn’t too difficult. I’ve put the general steps below.
- Get a static IP address from your Internet Service Provider (ISP). My broadband is with Zen who seem to have this as standard so it wasn’t a problem for me. If you can’t do this you might need to use a dynamic IP address service like afraid (dot) org (paid) or DuckDNS.
- Find a device. This could be almost anything that you can leave powered on and connected to your router all the time however having low power usage and a good (preferably ethernet) connection is desirable. I use a Raspberry Pi 1 A+ right now but an old phone was sufficient when I first started.
- Set up a web server on the device. I recommend either Lighttpd (what I use), Nginx or Apache on some Linux-based OS. I use DietPi for my Pi and I really liked Alpine Linux on the iPhone (via iSH). Point the server to your website files so that you can connect to it when on the same network with a web browser a file on your server.
- Forward the ports 80 and 443 in your router to the web server device.
- Rent a domain name (country domains seem to be most affordable) or get a free (but possibly temporary) one from afraid (dot) org.
- Get a TLS/SSL certificate for your domain name using Let’s Encrypt’s Certbot and enable HTTPS on your web server.
- You have a website!
I also found a similar guide by LandChad (dot) net which is more opinionated and has commands to copy.
Tools
- Git - essential version control
- A text editor - Emacs, Vim or Nano are great; VSCode(ium) is definitely the easiest.
- A markdown editor like Obsidian or Marktext if you want to separate your writing from coding.
- A static site generator such as Jekyll, Hugo, Eleventy, BSSG or many, many more. I use Jekyll - it’s fine but I don’t really like it and I’m probably going to switch to something else soon.
- Accessibility/web standards checker like WAVE or axe.
Design
Reference
- The Odin Project
- MDN web docs
- The HTML standard
- Can I Use - information on support for features in browsers.
- Accessibility Support - same as Can I Use but for screen readers. The data seems to be rather out of date (it is community run) but I haven’t found a good alternative.
- Are my colors accessible
Opinions
- HTML for the people
- Creating a website - Whitefiles by Ray White
- My HTML handbook - This is where I put my notes about making HTML for this site.
- HTML Hell - bad practices to avoid.
- HTML Tips - Thomasorus
- Web best practices - Seirdy
- Motherf–king website, Better Motherf–king website and Just f–king use HTML (Strong language!) - websites don’t need to be complicated.
- accessiBe will get you sued
- The “Cheap” Web
- What is semantic HTML?
- The right tag for the job: why you should use semantic HTML
Inspiration
Here’s some websites that I like the design of.
- Kalechips
- Beepbird
- Landchad
- Disassociating
- Tommi
- Peter Molnar
- Godteeth
- Taylor Town
- jes
- Julia Evans
- CSS Zen garden - this isn’t a personal website but a interactive page that allows you to switch between a lot of different styles.
- Vale
- Don Marti
- David Bushell