Optimise all images to WebP: img/ 20 MB down to 3.2 MB

45 images converted with cwebp (long side capped at 1600px; -q 82, or -q 90 -alpha_q 100 when transparent) and 97 references repointed across 13 HTML files. printtiresad.png stays PNG because every WebP encode of it came out larger. Verified: 0 missing references, 0 unreferenced files, all 45 WebP files decode, all 16 pages balance and serve 200, and the before/after width/height ratio-hint sets are identical. NOTE: the published site must be redeployed for the new assets to go live.
2026-09-10 19:44:17 +08:00 · 2026-09-10 19:44:17 +08:00 · 67a4cead97
commit 67a4cead97
parent 06fc0fd047
108 changed files with 139 additions and 110 deletions
--- a/TODO.md
+++ b/TODO.md
@ -20,7 +20,7 @@ Last updated: 2026-09-10.

 ## Content

- [ ] Refine any copy that reads wrong, page by page.
+- [x] Refine any copy that reads wrong, page by page.
 - [ ] Populate the galleries with more or real work items.
 - [ ] Add per-image captions (they are category-level only right now).

@ -30,8 +30,10 @@ Last updated: 2026-09-10.
  find or shoot a better crop.
 - [ ] Consider moving `writtenearplugs.jpg` from the Urban Moto grid into the
  Print gallery.
- [ ] Optimise images to WebP: `img/` is 20 MB of the 21 MB repo.
- [ ] Confirm the Forgejo repo (`2RE03-Design`) is private.
+- [x] Optimise images to WebP: `img/` was 20 MB of the 21 MB repo. Done: 45 images
+  converted (long side capped at 1600px, q82, or q90 with lossless alpha), `img/`
+  is now 3.2 MB. `printtiresad.png` stayed PNG because WebP came out larger.
+- [x] Confirm the Forgejo repo (`2RE03-Design`) is private.

 ## Done

--- a/case-studies.html
+++ b/case-studies.html
@ -48,57 +48,57 @@
      <div class="container">
        <ul class="case-list">
          <li class="case-item">
-            <a class="case-row" href="case-studies/mask-aid-project.html" data-case-image="img/site-mask-aid-project.jpg">
-              <img class="case-row__thumb" src="img/site-mask-aid-project.jpg" alt="" loading="lazy" width="88" height="66">
+            <a class="case-row" href="case-studies/mask-aid-project.html" data-case-image="img/site-mask-aid-project.webp">
+              <img class="case-row__thumb" src="img/site-mask-aid-project.webp" alt="" loading="lazy" width="88" height="66">
              <span class="case-row__name">Mask Aid Project</span>
              <span class="case-row__meta">Web Design</span>
            </a>
          </li>
          <li class="case-item">
-            <a class="case-row" href="case-studies/one-womans-art-and-magic.html" data-case-image="img/site-one-womans-art-and-magic.jpg">
-              <img class="case-row__thumb" src="img/site-one-womans-art-and-magic.jpg" alt="" loading="lazy" width="88" height="66">
+            <a class="case-row" href="case-studies/one-womans-art-and-magic.html" data-case-image="img/site-one-womans-art-and-magic.webp">
+              <img class="case-row__thumb" src="img/site-one-womans-art-and-magic.webp" alt="" loading="lazy" width="88" height="66">
              <span class="case-row__name">1 Woman's Art and Magic</span>
              <span class="case-row__meta">Book Design &amp; Web</span>
            </a>
          </li>
          <li class="case-item">
-            <a class="case-row" href="case-studies/sams-rules.html" data-case-image="img/writtensamsrules.png">
-              <img class="case-row__thumb" src="img/writtensamsrules.png" alt="" loading="lazy" width="88" height="66">
+            <a class="case-row" href="case-studies/sams-rules.html" data-case-image="img/writtensamsrules.webp">
+              <img class="case-row__thumb" src="img/writtensamsrules.webp" alt="" loading="lazy" width="88" height="66">
              <span class="case-row__name">Sam's Rules</span>
              <span class="case-row__meta">Book Design &amp; Web</span>
            </a>
          </li>
          <li class="case-item">
-            <a class="case-row" href="case-studies/mehavior.html" data-case-image="img/webmehavior.png">
-              <img class="case-row__thumb" src="img/webmehavior.png" alt="" loading="lazy" width="88" height="66">
+            <a class="case-row" href="case-studies/mehavior.html" data-case-image="img/webmehavior.webp">
+              <img class="case-row__thumb" src="img/webmehavior.webp" alt="" loading="lazy" width="88" height="66">
              <span class="case-row__name">Mehavior</span>
              <span class="case-row__meta">App Design &amp; Identity</span>
            </a>
          </li>
          <li class="case-item">
-            <a class="case-row" href="case-studies/jensens-red-barn.html" data-case-image="img/site-jensens-red-barn.jpg">
-              <img class="case-row__thumb" src="img/site-jensens-red-barn.jpg" alt="" loading="lazy" width="88" height="66">
+            <a class="case-row" href="case-studies/jensens-red-barn.html" data-case-image="img/site-jensens-red-barn.webp">
+              <img class="case-row__thumb" src="img/site-jensens-red-barn.webp" alt="" loading="lazy" width="88" height="66">
              <span class="case-row__name">Jensen's Red Barn</span>
              <span class="case-row__meta">Web Design</span>
            </a>
          </li>
          <li class="case-item">
-            <a class="case-row" href="case-studies/upscale-food-cart.html" data-case-image="img/3dcart.png">
-              <img class="case-row__thumb" src="img/3dcart.png" alt="" loading="lazy" width="88" height="66">
+            <a class="case-row" href="case-studies/upscale-food-cart.html" data-case-image="img/3dcart.webp">
+              <img class="case-row__thumb" src="img/3dcart.webp" alt="" loading="lazy" width="88" height="66">
              <span class="case-row__name">Upscale Food Cart</span>
              <span class="case-row__meta">3D Modeling</span>
            </a>
          </li>
          <li class="case-item">
-            <a class="case-row" href="case-studies/silver-lining.html" data-case-image="img/logosilverlining.png">
-              <img class="case-row__thumb" src="img/logosilverlining.png" alt="" loading="lazy" width="88" height="66">
+            <a class="case-row" href="case-studies/silver-lining.html" data-case-image="img/logosilverlining.webp">
+              <img class="case-row__thumb" src="img/logosilverlining.webp" alt="" loading="lazy" width="88" height="66">
              <span class="case-row__name">Silver Lining</span>
              <span class="case-row__meta">Logo &amp; Identity</span>
            </a>
          </li>
          <li class="case-item">
-            <a class="case-row" href="case-studies/victoria-fuller.html" data-case-image="img/webvictoria.png">
-              <img class="case-row__thumb" src="img/webvictoria.png" alt="" loading="lazy" width="88" height="66">
+            <a class="case-row" href="case-studies/victoria-fuller.html" data-case-image="img/webvictoria.webp">
+              <img class="case-row__thumb" src="img/webvictoria.webp" alt="" loading="lazy" width="88" height="66">
              <span class="case-row__name">Victoria Fuller</span>
              <span class="case-row__meta">Web Design</span>
            </a>
@ -111,8 +111,8 @@
            </a>
          </li>
          <li class="case-item">
-            <a class="case-row" href="case-studies/teach-each-other-ai.html" data-case-image="img/site-teach-each-other-ai.jpg">
-              <img class="case-row__thumb" src="img/site-teach-each-other-ai.jpg" alt="" loading="lazy" width="88" height="66">
+            <a class="case-row" href="case-studies/teach-each-other-ai.html" data-case-image="img/site-teach-each-other-ai.webp">
+              <img class="case-row__thumb" src="img/site-teach-each-other-ai.webp" alt="" loading="lazy" width="88" height="66">
              <span class="case-row__name">Teach Each Other AI</span>
              <span class="case-row__meta">Web Design</span>
            </a>
--- a/case-studies/jensens-red-barn.html
+++ b/case-studies/jensens-red-barn.html
@ -34,7 +34,7 @@
  </header>

  <main id="main">
-    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-jensens-red-barn.jpg')">
+    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-jensens-red-barn.webp')">
      <div class="container">
        <p class="eyebrow eyebrow-ink mb-2">Case Study &middot; Web Design</p>
        <h1>Jensen's Red Barn</h1>
@ -47,7 +47,7 @@
        <div class="row g-4 g-lg-5">
          <div class="col-lg-7">
            <figure class="card-work mb-0">
-              <img src="../img/site-jensens-red-barn.jpg" alt="Jensen's Red Barn homepage" width="1200" height="900">
+              <img src="../img/site-jensens-red-barn.webp" alt="Jensen's Red Barn homepage" width="1200" height="900">
            </figure>
          </div>
          <div class="col-lg-5">
--- a/case-studies/mask-aid-project.html
+++ b/case-studies/mask-aid-project.html
@ -34,7 +34,7 @@
  </header>

  <main id="main">
-    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-mask-aid-project.jpg')">
+    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-mask-aid-project.webp')">
      <div class="container">
        <p class="eyebrow eyebrow-ink mb-2">Case Study &middot; Web Design</p>
        <h1>Mask Aid Project</h1>
@ -47,7 +47,7 @@
        <div class="row g-4 g-lg-5">
          <div class="col-lg-7">
            <figure class="card-work mb-0">
-              <img src="../img/site-mask-aid-project.jpg" alt="Mask Aid Project homepage" width="1200" height="900">
+              <img src="../img/site-mask-aid-project.webp" alt="Mask Aid Project homepage" width="1200" height="900">
            </figure>
          </div>
          <div class="col-lg-5">
--- a/case-studies/mehavior.html
+++ b/case-studies/mehavior.html
@ -34,7 +34,7 @@
  </header>

  <main id="main">
-    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-mehavior.jpg'); --hero-position: center top">
+    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-mehavior.webp'); --hero-position: center top">
      <div class="container">
        <p class="eyebrow eyebrow-ink mb-2">Case Study &middot; App Design &amp; Identity</p>
        <h1>Mehavior</h1>
@ -47,7 +47,7 @@
        <div class="row g-4 g-lg-5">
          <div class="col-lg-7">
            <figure class="card-work mb-0">
-              <img src="../img/webmehavior.png" alt="Mehavior app interface design" width="1000" height="800">
+              <img src="../img/webmehavior.webp" alt="Mehavior app interface design" width="1000" height="800">
            </figure>
          </div>
          <div class="col-lg-5">
--- a/case-studies/one-womans-art-and-magic.html
+++ b/case-studies/one-womans-art-and-magic.html
@ -34,7 +34,7 @@
  </header>

  <main id="main">
-    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-one-womans-art-and-magic.jpg')">
+    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-one-womans-art-and-magic.webp')">
      <div class="container">
        <p class="eyebrow eyebrow-ink mb-2">Case Study &middot; Book Design &amp; Web</p>
        <h1>1 Woman's Art and Magic</h1>
@ -47,7 +47,7 @@
        <div class="row g-4 g-lg-5">
          <div class="col-lg-7">
            <figure class="card-work mb-0">
-              <img src="../img/site-one-womans-art-and-magic.jpg" alt="1 Woman's Art and Magic homepage" width="1200" height="900">
+              <img src="../img/site-one-womans-art-and-magic.webp" alt="1 Woman's Art and Magic homepage" width="1200" height="900">
            </figure>
          </div>
          <div class="col-lg-5">
--- a/case-studies/sams-rules.html
+++ b/case-studies/sams-rules.html
@ -34,7 +34,7 @@
  </header>

  <main id="main">
-    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-sams-rules.jpg')">
+    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-sams-rules.webp')">
      <div class="container">
        <p class="eyebrow eyebrow-ink mb-2">Case Study &middot; Book Design &amp; Web</p>
        <h1>Sam's Rules</h1>
@ -47,7 +47,7 @@
        <div class="row g-4 g-lg-5">
          <div class="col-lg-7">
            <figure class="card-work mb-0">
-              <img src="../img/writtensamsrules.png" alt="Sam's Rules book layout, design, and editing project" width="2048" height="2048">
+              <img src="../img/writtensamsrules.webp" alt="Sam's Rules book layout, design, and editing project" width="1600" height="1600">
            </figure>
          </div>
          <div class="col-lg-5">
--- a/case-studies/silver-lining.html
+++ b/case-studies/silver-lining.html
@ -34,7 +34,7 @@
  </header>

  <main id="main">
-    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-silver-lining.jpg')">
+    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-silver-lining.webp')">
      <div class="container">
        <p class="eyebrow eyebrow-ink mb-2">Case Study &middot; Logo &amp; Identity</p>
        <h1>Silver Lining</h1>
@ -47,7 +47,7 @@
        <div class="row g-4 g-lg-5">
          <div class="col-lg-7">
            <figure class="card-work mb-0">
-              <img src="../img/logosilverlining.png" alt="Silver Lining logo and identity project" width="1854" height="996">
+              <img src="../img/logosilverlining.webp" alt="Silver Lining logo and identity project" width="1600" height="860">
            </figure>
          </div>
          <div class="col-lg-5">
--- a/case-studies/teach-each-other-ai.html
+++ b/case-studies/teach-each-other-ai.html
@ -34,7 +34,7 @@
  </header>

  <main id="main">
-    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-teach-each-other-ai.jpg')">
+    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-teach-each-other-ai.webp')">
      <div class="container">
        <p class="eyebrow eyebrow-ink mb-2">Case Study &middot; Web Design</p>
        <h1>Teach Each Other AI</h1>
@ -47,7 +47,7 @@
        <div class="row g-4 g-lg-5">
          <div class="col-lg-7">
            <figure class="card-work mb-0">
-              <img src="../img/site-teach-each-other-ai.jpg" alt="Teach Each Other AI homepage" width="1200" height="900">
+              <img src="../img/site-teach-each-other-ai.webp" alt="Teach Each Other AI homepage" width="1200" height="900">
            </figure>
          </div>
          <div class="col-lg-5">
--- a/case-studies/upscale-food-cart.html
+++ b/case-studies/upscale-food-cart.html
@ -34,7 +34,7 @@
  </header>

  <main id="main">
-    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-upscale-food-cart.jpg')">
+    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-upscale-food-cart.webp')">
      <div class="container">
        <p class="eyebrow eyebrow-ink mb-2">Case Study &middot; 3D Modeling</p>
        <h1>Upscale Food Cart</h1>
@ -47,7 +47,7 @@
        <div class="row g-4 g-lg-5">
          <div class="col-lg-7">
            <figure class="card-work mb-0">
-              <img src="../img/3dcart.png" alt="Upscale Food Cart 3D design proposal" width="1024" height="754">
+              <img src="../img/3dcart.webp" alt="Upscale Food Cart 3D design proposal" width="1024" height="754">
            </figure>
          </div>
          <div class="col-lg-5">
--- a/case-studies/urban-moto.html
+++ b/case-studies/urban-moto.html
@ -34,7 +34,7 @@
  </header>

  <main id="main">
-    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-urban-moto.jpg')">
+    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-urban-moto.webp')">
      <div class="container">
        <p class="eyebrow eyebrow-ink mb-2">Case Study &middot; Print Design</p>
        <h1>Urban Moto</h1>
@ -54,17 +54,17 @@
              </div>
              <div class="col">
                <figure class="card-work card-work--frame mb-0">
-                  <img src="../img/printkincaidad.jpg" alt="Urban Moto print advertisement" width="800" height="600">
+                  <img src="../img/printkincaidad.webp" alt="Urban Moto print advertisement" width="800" height="600">
                </figure>
              </div>
              <div class="col">
                <figure class="card-work card-work--frame mb-0">
-                  <img src="../img/printmacchiariniad.png" alt="Urban Moto print advertisement" width="800" height="600">
+                  <img src="../img/printmacchiariniad.webp" alt="Urban Moto print advertisement" width="800" height="600">
                </figure>
              </div>
              <div class="col">
                <figure class="card-work card-work--frame mb-0">
-                  <img src="../img/writtenearplugs.jpg" alt="Urban Moto print advertisement" width="800" height="600">
+                  <img src="../img/writtenearplugs.webp" alt="Urban Moto print advertisement" width="800" height="600">
                </figure>
              </div>
            </div>
--- a/case-studies/victoria-fuller.html
+++ b/case-studies/victoria-fuller.html
@ -34,7 +34,7 @@
  </header>

  <main id="main">
-    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-victoria-fuller.jpg'); --hero-position: center 10%">
+    <section class="hero hero--compact hero--image" style="--hero-image: url('../img/hero-victoria-fuller.webp'); --hero-position: center 10%">
      <div class="container">
        <p class="eyebrow eyebrow-ink mb-2">Case Study &middot; Web Design</p>
        <h1>Victoria Fuller</h1>
@ -47,7 +47,7 @@
        <div class="row g-4 g-lg-5">
          <div class="col-lg-7">
            <figure class="card-work mb-0">
-              <img src="../img/webvictoria.png" alt="Victoria Fuller web design project" width="2060" height="1266">
+              <img src="../img/webvictoria.webp" alt="Victoria Fuller web design project" width="1600" height="983">
            </figure>
          </div>
          <div class="col-lg-5">
--- a/img/2plus5times3.jpg
+++ b/img/2plus5times3.jpg
--- a/img/2plus5times3.webp
+++ b/img/2plus5times3.webp
--- a/img/3d78williams.jpg
+++ b/img/3d78williams.jpg
--- a/img/3d78williams.webp
+++ b/img/3d78williams.webp
--- a/img/3dabandoned.jpg
+++ b/img/3dabandoned.jpg
--- a/img/3dabandoned.webp
+++ b/img/3dabandoned.webp
--- a/img/3dcart.png
+++ b/img/3dcart.png
--- a/img/3dcart.webp
+++ b/img/3dcart.webp
--- a/img/3dcoop.jpg
+++ b/img/3dcoop.jpg
--- a/img/3dcoop.webp
+++ b/img/3dcoop.webp
--- a/img/collage-1.jpg
+++ b/img/collage-1.jpg
--- a/img/collage-1.webp
+++ b/img/collage-1.webp
--- a/img/collage-2.jpg
+++ b/img/collage-2.jpg
--- a/img/collage-2.webp
+++ b/img/collage-2.webp
--- a/img/collage-3.jpg
+++ b/img/collage-3.jpg
--- a/img/collage-3.webp
+++ b/img/collage-3.webp
--- a/img/collage-4.jpg
+++ b/img/collage-4.jpg
--- a/img/collage-4.webp
+++ b/img/collage-4.webp
--- a/img/collage-5.jpg
+++ b/img/collage-5.jpg
--- a/img/collage-5.webp
+++ b/img/collage-5.webp
--- a/img/collage-6.jpg
+++ b/img/collage-6.jpg
--- a/img/collage-6.webp
+++ b/img/collage-6.webp
--- a/img/collage-7.jpg
+++ b/img/collage-7.jpg
--- a/img/collage-7.webp
+++ b/img/collage-7.webp
--- a/img/collage-8.jpg
+++ b/img/collage-8.jpg
--- a/img/collage-8.webp
+++ b/img/collage-8.webp
--- a/img/hero-jensens-red-barn.jpg
+++ b/img/hero-jensens-red-barn.jpg
--- a/img/hero-jensens-red-barn.webp
+++ b/img/hero-jensens-red-barn.webp
--- a/img/hero-mask-aid-project.jpg
+++ b/img/hero-mask-aid-project.jpg
--- a/img/hero-mask-aid-project.webp
+++ b/img/hero-mask-aid-project.webp
--- a/img/hero-mehavior.jpg
+++ b/img/hero-mehavior.jpg
--- a/img/hero-mehavior.webp
+++ b/img/hero-mehavior.webp
--- a/img/hero-one-womans-art-and-magic.jpg
+++ b/img/hero-one-womans-art-and-magic.jpg
--- a/img/hero-one-womans-art-and-magic.webp
+++ b/img/hero-one-womans-art-and-magic.webp
--- a/img/hero-sams-rules.jpg
+++ b/img/hero-sams-rules.jpg
--- a/img/hero-sams-rules.webp
+++ b/img/hero-sams-rules.webp
--- a/img/hero-silver-lining.jpg
+++ b/img/hero-silver-lining.jpg
--- a/img/hero-silver-lining.webp
+++ b/img/hero-silver-lining.webp
--- a/img/hero-teach-each-other-ai.jpg
+++ b/img/hero-teach-each-other-ai.jpg
--- a/img/hero-teach-each-other-ai.webp
+++ b/img/hero-teach-each-other-ai.webp
--- a/img/hero-upscale-food-cart.jpg
+++ b/img/hero-upscale-food-cart.jpg
--- a/img/hero-upscale-food-cart.webp
+++ b/img/hero-upscale-food-cart.webp
--- a/img/hero-urban-moto.jpg
+++ b/img/hero-urban-moto.jpg
--- a/img/hero-urban-moto.webp
+++ b/img/hero-urban-moto.webp
--- a/img/hero-victoria-fuller.jpg
+++ b/img/hero-victoria-fuller.jpg
--- a/img/hero-victoria-fuller.webp
+++ b/img/hero-victoria-fuller.webp
--- a/img/logoargent.png
+++ b/img/logoargent.png
--- a/img/logoargent.webp
+++ b/img/logoargent.webp
--- a/img/logobackass.png
+++ b/img/logobackass.png
--- a/img/logobackass.webp
+++ b/img/logobackass.webp
--- a/img/logodrinking.png
+++ b/img/logodrinking.png
--- a/img/logodrinking.webp
+++ b/img/logodrinking.webp
--- a/img/logodrive.png
+++ b/img/logodrive.png
--- a/img/logodrive.webp
+++ b/img/logodrive.webp
--- a/img/logosilverlining.png
+++ b/img/logosilverlining.png
--- a/img/logosilverlining.webp
+++ b/img/logosilverlining.webp
--- a/img/logoylem.png
+++ b/img/logoylem.png
--- a/img/logoylem.webp
+++ b/img/logoylem.webp
--- a/img/printkincaidad.jpg
+++ b/img/printkincaidad.jpg
--- a/img/printkincaidad.webp
+++ b/img/printkincaidad.webp
--- a/img/printmacchiariniad.png
+++ b/img/printmacchiariniad.png
--- a/img/printmacchiariniad.webp
+++ b/img/printmacchiariniad.webp
--- a/img/printylemcover.png
+++ b/img/printylemcover.png
--- a/img/printylemcover.webp
+++ b/img/printylemcover.webp
--- a/img/site-cool-crap-from-china.jpg
+++ b/img/site-cool-crap-from-china.jpg
--- a/img/site-cool-crap-from-china.webp
+++ b/img/site-cool-crap-from-china.webp
--- a/img/site-jensens-red-barn.jpg
+++ b/img/site-jensens-red-barn.jpg
--- a/img/site-jensens-red-barn.webp
+++ b/img/site-jensens-red-barn.webp
--- a/img/site-mask-aid-project.jpg
+++ b/img/site-mask-aid-project.jpg
--- a/img/site-mask-aid-project.webp
+++ b/img/site-mask-aid-project.webp
--- a/img/site-one-womans-art-and-magic.jpg
+++ b/img/site-one-womans-art-and-magic.jpg
--- a/img/site-one-womans-art-and-magic.webp
+++ b/img/site-one-womans-art-and-magic.webp
--- a/img/site-teach-each-other-ai.jpg
+++ b/img/site-teach-each-other-ai.jpg
--- a/img/site-teach-each-other-ai.webp
+++ b/img/site-teach-each-other-ai.webp
--- a/img/web50shadesof2048.png
+++ b/img/web50shadesof2048.png
--- a/img/web50shadesof2048.webp
+++ b/img/web50shadesof2048.webp
--- a/img/webdatavisart.jpeg
+++ b/img/webdatavisart.jpeg
--- a/img/webdatavisart.webp
+++ b/img/webdatavisart.webp
--- a/img/webmehavior.png
+++ b/img/webmehavior.png
--- a/img/webmehavior.webp
+++ b/img/webmehavior.webp
--- a/img/websinosalescopy.jpg
+++ b/img/websinosalescopy.jpg
--- a/img/websinosalescopy.webp
+++ b/img/websinosalescopy.webp
--- a/img/webvictoria.png
+++ b/img/webvictoria.png
--- a/img/webvictoria.webp
+++ b/img/webvictoria.webp
--- a/img/writtenearplugs.jpg
+++ b/img/writtenearplugs.jpg
--- a/img/writtenearplugs.webp
+++ b/img/writtenearplugs.webp
--- a/img/writtensamsrules.png
+++ b/img/writtensamsrules.png
--- a/img/writtensamsrules.webp
+++ b/img/writtensamsrules.webp
--- a/Show more
+++ b/Show more