Add WebP versions of photos
This commit is contained in:
+42
-6
@@ -89,12 +89,48 @@
|
||||
<p>Select an area to view:</p>
|
||||
|
||||
<div class="area-grid">
|
||||
<a class="area-card" href="/wood-shop/"><img width="1024" height="768" src="/assets/wood-shop-4-1024x768.jpg" srcset="/assets/wood-shop-4-1024x768.jpg 1024w, /assets/wood-shop-4.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="Wood Shop" loading="lazy" decoding="async" /><span>Wood Shop</span></a>
|
||||
<a class="area-card" href="/metal-shop/"><img width="1024" height="768" src="/assets/metal-shop-4-1024x768.jpg" srcset="/assets/metal-shop-4-1024x768.jpg 1024w, /assets/metal-shop-4.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="Metal Shop" loading="lazy" decoding="async" /><span>Metal Shop</span></a>
|
||||
<a class="area-card" href="/laser-cutters/"><img width="1024" height="768" src="/assets/laser-cutters-2-1024x768.jpg" srcset="/assets/laser-cutters-2-1024x768.jpg 1024w, /assets/laser-cutters-2.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="Laser Cutters" loading="lazy" decoding="async" /><span>Laser Cutters</span></a>
|
||||
<a class="area-card" href="/sewing-room/"><img width="1024" height="768" src="/assets/sewing-room-1-1024x768.jpg" srcset="/assets/sewing-room-1-1024x768.jpg 1024w, /assets/sewing-room-1.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="Sewing Room" loading="lazy" decoding="async" /><span>Sewing Room</span></a>
|
||||
<a class="area-card" href="/electronics-lab/"><img width="1024" height="768" src="/assets/electronics-lab-1-1024x768.jpg" srcset="/assets/electronics-lab-1-1024x768.jpg 1024w, /assets/electronics-lab-1.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="Electronics Lab" loading="lazy" decoding="async" /><span>Electronics Lab</span></a>
|
||||
<a class="area-card" href="/3d-printers/"><img width="1024" height="768" src="/assets/3d-printers-4-1024x768.jpg" srcset="/assets/3d-printers-4-1024x768.jpg 1024w, /assets/3d-printers-4.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="3D Printers" loading="lazy" decoding="async" /><span>3D Printers</span></a>
|
||||
<a class="area-card" href="/wood-shop/">
|
||||
<picture>
|
||||
<source type="image/webp" srcset="/assets/wood-shop-4-1024x768.webp 1024w, /assets/wood-shop-4.webp 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" />
|
||||
<img width="1024" height="768" src="/assets/wood-shop-4-1024x768.jpg" srcset="/assets/wood-shop-4-1024x768.jpg 1024w, /assets/wood-shop-4.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="Wood Shop" loading="lazy" decoding="async" />
|
||||
</picture>
|
||||
<span>Wood Shop</span>
|
||||
</a>
|
||||
<a class="area-card" href="/metal-shop/">
|
||||
<picture>
|
||||
<source type="image/webp" srcset="/assets/metal-shop-4-1024x768.webp 1024w, /assets/metal-shop-4.webp 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" />
|
||||
<img width="1024" height="768" src="/assets/metal-shop-4-1024x768.jpg" srcset="/assets/metal-shop-4-1024x768.jpg 1024w, /assets/metal-shop-4.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="Metal Shop" loading="lazy" decoding="async" />
|
||||
</picture>
|
||||
<span>Metal Shop</span>
|
||||
</a>
|
||||
<a class="area-card" href="/laser-cutters/">
|
||||
<picture>
|
||||
<source type="image/webp" srcset="/assets/laser-cutters-2-1024x768.webp 1024w, /assets/laser-cutters-2.webp 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" />
|
||||
<img width="1024" height="768" src="/assets/laser-cutters-2-1024x768.jpg" srcset="/assets/laser-cutters-2-1024x768.jpg 1024w, /assets/laser-cutters-2.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="Laser Cutters" loading="lazy" decoding="async" />
|
||||
</picture>
|
||||
<span>Laser Cutters</span>
|
||||
</a>
|
||||
<a class="area-card" href="/sewing-room/">
|
||||
<picture>
|
||||
<source type="image/webp" srcset="/assets/sewing-room-1-1024x768.webp 1024w, /assets/sewing-room-1.webp 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" />
|
||||
<img width="1024" height="768" src="/assets/sewing-room-1-1024x768.jpg" srcset="/assets/sewing-room-1-1024x768.jpg 1024w, /assets/sewing-room-1.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="Sewing Room" loading="lazy" decoding="async" />
|
||||
</picture>
|
||||
<span>Sewing Room</span>
|
||||
</a>
|
||||
<a class="area-card" href="/electronics-lab/">
|
||||
<picture>
|
||||
<source type="image/webp" srcset="/assets/electronics-lab-1-1024x768.webp 1024w, /assets/electronics-lab-1.webp 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" />
|
||||
<img width="1024" height="768" src="/assets/electronics-lab-1-1024x768.jpg" srcset="/assets/electronics-lab-1-1024x768.jpg 1024w, /assets/electronics-lab-1.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="Electronics Lab" loading="lazy" decoding="async" />
|
||||
</picture>
|
||||
<span>Electronics Lab</span>
|
||||
</a>
|
||||
<a class="area-card" href="/3d-printers/">
|
||||
<picture>
|
||||
<source type="image/webp" srcset="/assets/3d-printers-4-1024x768.webp 1024w, /assets/3d-printers-4.webp 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" />
|
||||
<img width="1024" height="768" src="/assets/3d-printers-4-1024x768.jpg" srcset="/assets/3d-printers-4-1024x768.jpg 1024w, /assets/3d-printers-4.jpg 1280w" sizes="(max-width: 560px) calc(100vw - 56px), 367px" alt="3D Printers" loading="lazy" decoding="async" />
|
||||
</picture>
|
||||
<span>3D Printers</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<p id="facilities">Facilities available to members include (training may be required):</p>
|
||||
|
||||
Reference in New Issue
Block a user