I had a job interview on thursday and it seems this blog is actually looked at, so I had some motivation to put some time into it.
Since this iteration of my blog (the previous jekyll based included), I was never really happy with its look. It wasn’t really responsive and just a lot of gray (well, except the purple-ish header); it looked like one of those “we want to look modern but actually are not” pages. So I tackled that.
This new design is based on the old one, but some things were reordered. It’s now (fully?) responsive, tested from 1920px width down to less than 200px (not fun to read because small display, but layout works) - it even supports the Surface Duo and other split-screen devices using the same CSS features (vertical split only).
While the front page listed posts by category before, duplicating posts that are in more than one category, I now go for the traditional “most recent posts”. But then categories were lost … so I added them as tags, which can even be clicked to get all posts in that category.
I also took care for it to be accessible, asking a girlfriend for help (check out their blog if you do web design! https://dysphoric.dev). With their comments, I spotted the less-than-optimal contrast for code, the missing visibility of what is focused (nagivation without mouse) and some missing margins. I found the basics myself before, using the Chromium-builtin Lighthouse - but since the front page does not have any code blocks, I missed those for example. Another good tool to check if its accessible is .. w3m. If your page looks good in that, you probably use atleast the basic semantic elements (this page works fine in w3m and elinks, though I may improve the tag list on posts). Oh and note how this page does not have any javascript - why should it? But since most pages aren’t like that, this is noteworthy nowadays ..
In the backend it’s still based on hugo,
all content in markdown files pushed to gitlab and the CI/CD deploys it to gitlab pages. All
that takes around ~30 seconds after a git push
and any client request is served from static
files, no backend server software needed.
It was fun to do some HTML and CSS again, testing if it’s responsible and checking for accessibility. Since most of my webdev work is web apps, this was a change from what I usually do with these tools.