diff --git a/layouts/partials/images/figure.html b/layouts/partials/images/figure.html
new file mode 100644
index 0000000..1d853a7
--- /dev/null
+++ b/layouts/partials/images/figure.html
@@ -0,0 +1,4 @@
+<figure class="{{ .figureClass }} {{ .wrapperClass }}">
+  {{ partial "images/picture" (merge .ctx (dict "className" (printf "%s %s" .figureImgClass .className))) }}
+  <figcaption class="{{ .figureCaptionClass }}">{{ .caption }}</figcaption>
+</figure>
diff --git a/layouts/partials/images/image.html b/layouts/partials/images/image.html
index 4c7cf0e..61913dc 100644
--- a/layouts/partials/images/image.html
+++ b/layouts/partials/images/image.html
@@ -214,11 +214,16 @@
     {{- $figureClass := default "figure" $siteParams.figure_class_name }}
     {{- $figureCaptionClass := default "figure-caption" $siteParams.figure_caption_class_name }}
     {{- $figureImgClass := default "figure-img" $siteParams.figure_image_class_name }}
-    <figure class="{{ $figureClass }} {{ $wrapperClass }}">
-      {{ partial "images/picture" (merge $ctx (dict "className" (printf "%s %s" $figureImgClass $className))) }}
-      <figcaption class="{{ $figureCaptionClass }}">{{ $caption }}</figcaption>
-    </figure>
+    {{- partial "images/figure" (dict
+      "figureClass" $figureClass
+      "wrapperClass" $wrapperClass
+      "figureImgClass" $figureImgClass
+      "className" $className
+      "figureCaptionClass" $figureCaptionClass
+      "caption" $caption
+      "ctx" $ctx
+    ) }}
   {{- else }}
-    {{ partial "images/picture" (merge $ctx (dict "wrapperClass" $wrapperClass)) }}
+    {{- partial "images/picture" (merge $ctx (dict "wrapperClass" $wrapperClass)) }}
   {{- end }}
 {{- end -}}
diff --git a/layouts/partials/images/picture.html b/layouts/partials/images/picture.html
index b2f07d2..6d9b829 100644
--- a/layouts/partials/images/picture.html
+++ b/layouts/partials/images/picture.html
@@ -2,15 +2,33 @@
   {{- range .sources }}
     <source srcset="{{ .srcset }}" type="{{ .type }}" />
   {{- end }}
-  <img
-    class="{{ .className }}"
-    src="{{ .src }}"
-    alt="{{ .alt }}"
-    {{ if .lazyLoading }}loading="lazy"{{ end }}
-    {{ with .naturalHeight }}height="{{ . }}"{{ end }}
-    {{ with .naturalWidth }}width="{{ . }}"{{ end }}
-    {{ with .style }}{{ printf `style="%s"` (delimit . `; `) | safeHTMLAttr }}{{ end }}
-    {{ if and .original .originalSrc }}data-src="{{ .originalSrc }}"{{ end }}
-    {{ if and .original .originalWidth }}data-width="{{ .originalWidth }}"{{ end }}
-    {{ if and .original .originalHeight }}data-height="{{ .originalHeight }}"{{ end }} />
+  {{- $attrs := slice
+    (printf `class="%s"` .className)
+    (printf `src="%s"` .src)
+    (printf `alt="%s"` .alt)
+  }}
+  {{- if .lazyLoading }}
+    {{- $attrs = $attrs | append `loading="lazy"` }}
+  {{- end }}
+  {{- with .naturalHeight }}
+    {{- $attrs = $attrs | append (printf `height="%d"` .) }}
+  {{- end }}
+  {{- with .naturalWidth }}
+    {{- $attrs = $attrs | append (printf `width="%d"` .) }}
+  {{- end }}
+  {{- with .style }}
+    {{- $attrs = $attrs | append (printf `style="%s"` (delimit . `; `)) }}
+  {{- end }}
+  {{- if .original }}
+    {{- with .originalSrc }}
+      {{- $attrs = $attrs | append (printf `data-src="%s"` .) }}
+    {{- end }}
+    {{- with .originalWidth }}
+      {{- $attrs = $attrs | append (printf `data-width="%d"` .) }}
+    {{- end }}
+    {{- with .originalHeight }}
+      {{- $attrs = $attrs | append (printf `data-height="%d"` .) }}
+    {{- end }}
+  {{- end }}
+  <img {{ delimit $attrs " " | safeHTMLAttr }} />
 </picture>