Section 9 - Image optimisations

Author: andreituicu

starter/07-Omnifood-Desktop/img/hero.png

@@ -97,11 +97,16 @@ <h1 class="heading-primary">
             </div>
           </div>
           <div class="hero-image-box">
-            <img
-              src="img/hero.png"
-              class="hero-img"
-              alt="Woman enjoying food, meals in storage and food bowls on a table"
-            />
+            <picture>
+              <source srcset="img/hero.webp" type="image/webp" />
+              <source srcset="img/hero.png" type="image/png" />
+
+              <img
+                src="img/hero.png"
+                class="hero-img"
+                alt="Woman enjoying food, meals in storage and food bowls on a table"
+              />
+            </picture>
           </div>
         </div>
       </section>