Giving this blog the start of a makeover
Today I updated the CSS a bit:
- Improved contrast by darkening the background.
- Added a green grid background image on the non-blog side (invisible on mobile).
- Made the blog column responsive (it used to have a fixed
max-width
of 864px! in 2024! the horror). Now, it has 55%max-width
in landscape and nomax-width
in portrait. It looks a little weird in 4:3 so I could handle that someday, mayhaps. - Added a few buttons and a blinkie below the footer. Some of them have links or titles! Check them out!!
And some other things:
- The RSS feed no longer includes a summary, because I like to read the whole article inside the feed reader
- The 404 page is in the same style as the rest of the site now
This flexbox tutorial helped me put together the images in the footer.
Upcoming?⌗
There’s still something I’d like to fix: I use hugo to generate this blog, and it generates the 404 page as 404.html, not not_found.html, so I have to move it myself before uploading. I haven’t found a way to make it generate as not_found.html directly.
On desktop, there’s a lot of space on the right side, so I’m thinking about including more visually interesting elements like those fancy sticky notes I’ve seen on other websites. I already like the grid, it’s simple but makes the page feel layered.
I want the blog part to stay sober and easily readable, though.
Since none of this is visible on mobile, I also want to add a separate page to see this content on.
Cutting room floor⌗
I picked the background image out of an old web asset library, and tried a few other options:
A blue tile background from BACKGROUNDS with EMMA.
A printed circuit board background from BACKGROUNDS with EMMA.
A red roses background from BACKGROUNDS with EMMA.
I might still swap to the red roses background someday, but it’s a little heavy. Sadly the printed circuit board image is too bright compared to the rest of the website.