FIX browser image selection

layouts/partials/components/image.html

@@ -2,6 +2,8 @@
 type: string - default
 url: string
 alt: string
+width: int
+height: int
 -->
 {{ $avatar := "avatar"}}
 {{ $sizes := slice "320" "640" "960" "1280" }}
@@ -16,7 +18,7 @@ alt: string
       {{ range $i, $size := $sizes }}
         {{ $dir }}/{{ $name }}-{{ $size }}{{ $ext }}.avif {{ $size }}w, 
       {{ end }}
-      {{ .url }}.avif
+      {{ .url }}.avif {{ .width }}w
     "
   />
   <source 
@@ -25,13 +27,21 @@ alt: string
       {{ range $i, $size := $sizes }}
         {{ $dir }}/{{ $name }}-{{ $size }}{{ $ext }}.webp {{ $size }}w, 
       {{ end }}
-      {{ .url }}.webp
+      {{ .url }}.webp {{ .width }}w
     "
   />
   <img 
     class="{{if eq .type $avatar}}avatar{{end}}" 
-    alt="{{ .alt }}" 
+    width="{{ .width }}" 
+    height="{{ .height }}"
+    srcset="
+      {{ range $i, $size := $sizes }}
+        {{ $dir }}/{{ $name }}-{{ $size }}{{ $ext }} {{ $size }}w, 
+      {{ end }}
+      {{ .url }} {{ .width }}w
+    "
     src="{{ .url }}"
+    alt="{{ .alt }}" 
     loading="lazy"
     decoding="async"
   >