A Flexible Responsive Image Solution for Hugo

Heads Up

The formatting in the examples for this page got messed up during a site migration.

While moving my site, I wanted to come up with a better way to handle images. My goal was to design a setup where the images look good on desktops, tablets, and phones. Something that's known as "Responsive Images" in the web industry. The software I moved to doesn't do it out of the box, but with some research, I was able to hack together a solution.

My goals were:

The code I came up with is:

_NOTE: This is a related post that needs to be combined in here link_

Other links to examine: