Hugo gets simpler responsive images with Render Hooks

What changed

It has been reported that Hugo users can now drop a single render hook into layouts/_default/_markup/render-image.html to generate resized JPEG and WebP files automatically. No more shortcode gymnastics. The new hook builds a srcset directly on the tag and points first to WebP with a JPEG fallback — the old wrapper is gone. It’s a tidy bit of evolution: the template looks similar to the old shortcode, but it behaves a little differently under the hood.

Page bundles and a cleaner workflow

Gone too is the insistence on a central /assets/images/ folder. With page bundles you can keep images next to the Markdown they belong to, making content and assets live together. In your Hugo config you can also set default imaging options — for example, WebP quality — which the render hook will honor. It has been reported that these defaults make the setup feel more “configure once, forget it.”

This is a small change with an outsized effect. Fewer boilerplate snippets, less HTML noise, and a smoother Markdown-first authoring flow. Who doesn’t love fewer moving parts? For folks who survived the shortcodes era, this feels like decluttering your desk — and yes, there’s a little relief in that.

Why does it matter beyond convenience? Faster builds, smaller payloads, and modern browser support mean better UX and simpler maintenance. The industry trend toward making static sites smarter, not louder, carries on — and Hugo just made one more pragmatic, developer-friendly move.

Sources: mijndertstuij.nl, Hacker News