hugo

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.

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.