Website

HTML lazy image loading

Adding lazy image loading to Hugo's figure shortcode

3 minute read

The HTML <img /> tag has this handy attribute loading="lazy" that enables lazy image loading, so that images are only loaded whenever the user scrolls all the way down to their position. This makes page loading super-fast, and reduces the amount of wasted bandwidth, especially when browsing from page to page. In the past this was achieved by a few lines of custom JavaScript code, but it is supported by all major browsers, both for PC and mobile. It should always be used unless there’s a very good reason not to, to the point where it can probably be argued that it should be the default behavior of images.

Create your static photo gallery with thumbsup

Do not post your photos in online services that do not respect your rights, create your own static HTML photo gallery for your website with thumbsup

4 minute read

It is nowadays commonplace to upload your valued photos to online services that don’t respect your rights like Flickr, Google Photos or Instagram. While these sites have a social component that may help you build an audience and have a wider reach, usually their terms and conditions are abusive to end users. In this post I’ll be discussing how to create your own static HTML photo gallery that you can host on your website using thumbsup, a static gallery generator written in Python that produces totally customizable photo galleries. You can host your high resolution photos in your private server and have the gallery link to them. The photo gallery on this very site is generated using this method.

7 minute read

Search functionality in a small website like mine is usually arguably useless. I, for once, never even care to check whether a specific website offers it. I find a post that interests me via a search engine or aggregator, navigate to the page, read the post and then leave. However, I am not against local, serverless indexing and searching, even though most search engines provide site-specific searches. That is why I moved the search function of this website to a local, JavaScript-based implementation. How to do it? Read on.

CSS prefers-color-scheme to implement a dark theme

How to implement a dark theme for your website, plus a small discussion on the recent redesign that aims at simplifying the experience

5 minute read

If you are like me and you like your user interfaces to be as dark as possible, you have the dark mode preference of your browser enabled. You may have noted that this site has now a dark mode which is activated by default. This is done by querying the prefers-color-scheme setting in the browser. This post describes how this is done, and it discusses a few tweaks I have implemented design-wise to simplify things and remove useless visual elements.

New simpler design

New less bloated website design

1 minute read

I’ve once again changed the design of the site to make it cleaner, more simple and above all, less bloated. I’ve removed a bunch of javascript code (for instance, MathJax is no longer loaded by the main template but by the actual pages that really need it). Also, I’ve simplified the color palette settling on a black on white scheme with green for links and titles. Old (left) and new (right) design side-by-side.

Moving to Hugo

Bye bye paid web hosting + Drupal, hello GitLab + Hugo

3 minute read

Hugo SSG

The idea of ditching both my web hosting provider and Drupal has been at the back of my mind for a few months.

Bear with me. Since about 2011 I have been maintaining this website using the cheapest hosting tier my hosting offers – At least it was the cheapest at the time I got it. They call it The Essential and it costs over 300 bucks for 2 years. It is not a lot, but it is definitely too much for my purposes of hosting a small blog where I provide occasional updates on my projects, my portfolio and my CV.

Also, loading times are horribly long and the complexity of managing the Drupal installation (upgrades/updates) and also the database takes way too much of my time. Only the thought of updating to Drupal 8 sends shivers down my spine and ultimately got me searching for better options.

Website design by myself. See the privacy policy.
All content on this site is licensed under CC-BY-NC-SA 4.0.