/ #hugo  #responsive 

Responsive Images

My quest for a slimmer website is ongoing. The newest addition tackles responsive images. This technique allows the browser to select an optimal format for an image, for example a small image on a mobile phone and a larger one, on a desktop. The technique I use is based off of the works by Laura Kalbag, Adam Wills and Nils Norman Haukås. I use the same Hugo Image Processing techniques as in other parts of the Hugo Chaschper template, this time in a figure shortcut that overrides the Hugo internal one. ...

Jens-Christian Fischer
/ #hugo  #image 

Slimming

The Website Obesity Crisis is a wonderful talk about the sheer size that even simple websites have. Thanks to @stilkov for the pointer: 2025-01-06: There used to be a link to twitter here, but somewhere in the last few years since I deployed my blog the twitter API changed/broke/whatever. I have therfore removed the content. That led me to look at the size of this blog and it was scary: The weight of the front page of this humble blog is a whopping 5 MB. When looking for the culprits, I came across two problematic areas: ...

Jens-Christian Fischer
/ #tech  #hugo 

Travis checks Chaschper

One of these “ohh - that’s a nice idea, I should totally also implement that” ideas. I stumbled upon the Dream Plus Hugo theme, that included a little badge that linked to a Travis CI build status. Using CI (Continous Integration) to check the sanity of the template seemed like a good thing to me, so I looked around on how various people do this. I found one template by Vicky Lai that included HTML checking. After a bit of fiddling around, to get the correct command line incantations going, and some more fixing of malformed HTML, the Hugo Chaschper template now is tested, the exampleSite is updated to include some “real” content and a number of niggling issues in the HTML have been fixed (missig alt image attributes, a malformed <script</script> tag). ...

Jens-Christian Fischer
/ #hugo  #css 

Chaschper Galleries

The new version of the Chaschper template that I’m using to power this blog has gained a new capability: Image galleries. I started out with a gallery by VickyLai to see how to do that in general. From there I looked at How to Build a Responsive Image Gallery with Flexbox to do some basic layouting and Fluidbox to style the images and load larger versions. I didn’t quite like the way, the galleries were defined in the original example, so I came up with the following scheme: ...

Jens-Christian Fischer
/ #indieweb 

More Indieweb

I wrote about the Intro to Indieweb yesterday. Reading up on it, starting to read the people behind it or using it, I feel a similar rush as I did back in the days when I started blogging. This is the evolution of the Web I remember, this feels right. (And it also feels like a tiny bubble in the huge silo dominated web-simulacron we have around us today). Time to beat the drum, I guess and start on working on making it more accessible for people that aren’t as technology savy as the early adopters. ...

Jens-Christian Fischer