responsive images in content pages

[armno]

• https://discourse.gohugo.io/t/easy-way-to-serve-responsive-images-with-hugo/16184/3
• https://laurakalbag.com/processing-responsive-images-with-hugo/
• ~https://dev.to/stereobooster/responsive-images-for-hugo-dn9~
• with current lazyload.js https://www.adamwills.io/blog/responsive-images-hugo/

[armno]

Image sizes

• small - 500px
• medium - 800px
• large - TBA mai mee

[armno]

medium-zoom supports zooming to image's full size https://github.com/francoischalifour/medium-zoom#attributes

[armno]

excellent tweet clarifying srcset and sizes attributes https://twitter.com/csswizardry/status/836960832789565440

[armno]

html 5.2 from W3C said <figcaption> must be a descendant of <figure> https://www.w3.org/TR/html52/grouping-content.html#the-figcaption-element

whereas the html standards from WHATWG states that <figcaption> must be the first or last child element of the <figure> element only https://html.spec.whatwg.org/multipage/grouping-content.html#the-figcaption-element

[armno]

jake's post is also gold: https://jakearchibald.com/2015/anatomy-of-responsive-images/

[armno]

https://armno.in.th/2019/07/25/hugo-image-resize/