Bilder mit Versionsparameter (Cache)

index.html

@@ -72,9 +72,9 @@
       <p class="note reveal d3"><span class="when-soon">Equilo ist gerade bei Apple in der Prüfung. <a href="mailto:equilo@tillheidrich.de?subject=Equilo%3A%20Bitte%20zum%20Start%20benachrichtigen">Schreib mir</a>, dann sage ich Bescheid, sobald es losgeht. </span>Für iPhone, iPad und Apple Watch. Kostenlos, Plus ist optional. Für Deutschland, Österreich, die Schweiz und Luxemburg.</p>
     </div>
     <div class="stage" aria-hidden="true">
-      <figure class="phone p2 reveal d1"><img src="assets/img/heute-440.webp" width="440" height="956" alt=""></figure>
+      <figure class="phone p2 reveal d1"><img src="assets/img/heute-440.webp?v=b" width="440" height="956" alt=""></figure>
-      <figure class="phone p1 reveal"><img src="assets/img/live-sperrbildschirm-720.webp" srcset="assets/img/live-sperrbildschirm-440.webp 440w, assets/img/live-sperrbildschirm-720.webp 720w" sizes="(max-width:960px) 58vw, 300px" width="720" height="1564" alt=""></figure>
+      <figure class="phone p1 reveal"><img src="assets/img/live-sperrbildschirm-720.webp?v=b" srcset="assets/img/live-sperrbildschirm-440.webp?v=b 440w, assets/img/live-sperrbildschirm-720.webp?v=b 720w" sizes="(max-width:960px) 58vw, 300px" width="720" height="1564" alt=""></figure>
-      <figure class="watch reveal d2"><img src="assets/img/watch-laeuft.webp" width="422" height="514" alt=""></figure>
+      <figure class="watch reveal d2"><img src="assets/img/watch-laeuft.webp?v=b" width="422" height="514" alt=""></figure>
       <div class="chip c1 reveal d3"><span class="dot"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="8"/><path d="M12 8v4l2.5 2"/></svg></span><span><b>Timer läuft</b>Auf dem Sperrbildschirm, ein Tipp öffnet die Akut-Hilfe</span></div>
       <div class="chip c2 reveal d3"><span class="dot"><svg viewBox="0 0 24 24"><path d="M5 12.5 9.5 17 19 7.5"/></svg></span><span><b>Danach nur zwei Fragen</b>Art und Stärke</span></div>
     </div>
@@ -109,8 +109,8 @@
       </ul>
     </div>
     <div class="media phones-duo">
-      <figure class="phone reveal"><img src="assets/img/anfall-laeuft-440.webp" srcset="assets/img/anfall-laeuft-440.webp 440w, assets/img/anfall-laeuft-720.webp 720w" sizes="260px" width="440" height="956" alt="Laufender Anfall mit Timer und großem Knopf „Akut-Hilfe öffnen“" loading="lazy"></figure>
+      <figure class="phone reveal"><img src="assets/img/anfall-laeuft-440.webp?v=b" srcset="assets/img/anfall-laeuft-440.webp?v=b 440w, assets/img/anfall-laeuft-720.webp?v=b 720w" sizes="260px" width="440" height="956" alt="Laufender Anfall mit Timer und großem Knopf „Akut-Hilfe öffnen“" loading="lazy"></figure>
-      <figure class="phone reveal d2"><img src="assets/img/akut-440.webp" srcset="assets/img/akut-440.webp 440w, assets/img/akut-720.webp 720w" sizes="260px" width="440" height="956" alt="Akut-Modus mit Atemkreis, Anleitung und Notruf-Knopf" loading="lazy"></figure>
+      <figure class="phone reveal d2"><img src="assets/img/akut-440.webp?v=b" srcset="assets/img/akut-440.webp?v=b 440w, assets/img/akut-720.webp?v=b 720w" sizes="260px" width="440" height="956" alt="Akut-Modus mit Atemkreis, Anleitung und Notruf-Knopf" loading="lazy"></figure>
     </div>
   </div>
 </section>
@@ -128,13 +128,13 @@
         <span class="tag">Arztbericht als PDF</span>
         <h3>Die Kurzfassung für die ersten Minuten</h3>
         <p>Attacken unter 20 Minuten werden getrennt gezählt, Sturzanfälle und Warnzeichen hervorgehoben. Nachgetragene Einträge sind markiert. So weiß die Ärztin, worauf sie sich verlassen kann.</p>
-        <div class="shot"><img src="assets/img/ipad-arztbericht-1100.webp" width="1100" height="858" alt="Arztbericht auf dem iPad mit Kennzahlen, Dauerklassen und Fragen für den Termin" loading="lazy"></div>
+        <div class="shot"><img src="assets/img/ipad-arztbericht-1100.webp?v=b" width="1100" height="858" alt="Arztbericht auf dem iPad mit Kennzahlen, Dauerklassen und Fragen für den Termin" loading="lazy"></div>
       </div></article>
       <article class="shell b-hear reveal d1"><div class="core tile">
         <span class="tag">Hörverlauf</span>
         <h3>Dein Hören im Verlauf</h3>
         <p>Trag Praxis-Audiogramme ein. Hörtests aus Apple Health, etwa den AirPods-Hörtest, zeigt Equilo daneben an. Der Tiefton-Bereich erscheint als Verlauf, ehrlich als Trend und nicht als Befund.</p>
-        <div class="shot"><figure class="phone"><img src="assets/img/hoerverlauf-440.webp" width="440" height="956" alt="Hörverlauf mit Tiefton-Mittelwerten für linkes und rechtes Ohr" loading="lazy"></figure></div>
+        <div class="shot"><figure class="phone"><img src="assets/img/hoerverlauf-440.webp?v=b" width="440" height="956" alt="Hörverlauf mit Tiefton-Mittelwerten für linkes und rechtes Ohr" loading="lazy"></figure></div>
       </div></article>
       <article class="shell b-small reveal"><div class="core tile">
         <span class="ti"><svg viewBox="0 0 24 24"><path d="M4 19h16M7 16V9M12 16V5M17 16v-4"/></svg></span>
@@ -158,7 +158,7 @@
 <!-- Ehrlich -->
 <section id="ehrlich" class="honest">
   <div class="wrap split rev">
-    <div class="media"><figure class="phone reveal" style="width:min(300px,80%);margin-inline:auto"><img src="assets/img/muster-440.webp" srcset="assets/img/muster-440.webp 440w, assets/img/muster-720.webp 720w" sizes="300px" width="440" height="956" alt="Musteranalyse: Faktoren wie Stress und Stimmung mit ihrer Spannweite" loading="lazy"></figure></div>
+    <div class="media"><figure class="phone reveal" style="width:min(300px,80%);margin-inline:auto"><img src="assets/img/muster-440.webp?v=b" srcset="assets/img/muster-440.webp?v=b 440w, assets/img/muster-720.webp?v=b 720w" sizes="300px" width="440" height="956" alt="Musteranalyse: Faktoren wie Stress und Stimmung mit ihrer Spannweite" loading="lazy"></figure></div>
     <div>
       <span class="eyebrow reveal"><i></i>Ehrlich statt Prognose</span>
       <h2 class="reveal d1">Equilo sagt dir auch, <em>was es nicht weiß.</em></h2>
@@ -187,7 +187,7 @@
         <li class="reveal d3"><span class="pi"><svg viewBox="0 0 24 24"><rect x="4" y="10" width="16" height="10" rx="2"/><path d="M8 10V7a4 4 0 0 1 8 0v3"/></svg></span><div><b>Geteilt wird nur, was du schickst</b><span>Das Bild entsteht auf deinem iPhone. Keine Diagnose, keine Medikamente, kein Name, wenn du nicht willst.</span></div></li>
       </ul>
     </div>
-    <div class="media"><figure class="phone reveal d1"><img src="assets/img/so-gehts-mir-440.webp" srcset="assets/img/so-gehts-mir-440.webp 440w, assets/img/so-gehts-mir-720.webp 720w" sizes="290px" width="440" height="956" alt="Bildvorschau „Meine Woche“ mit Punkten für ruhige Tage und Anfälle, Symptomen und Vorzeichen" loading="lazy"></figure></div>
+    <div class="media"><figure class="phone reveal d1"><img src="assets/img/so-gehts-mir-440.webp?v=b" srcset="assets/img/so-gehts-mir-440.webp?v=b 440w, assets/img/so-gehts-mir-720.webp?v=b 720w" sizes="290px" width="440" height="956" alt="Bildvorschau „Meine Woche“ mit Punkten für ruhige Tage und Anfälle, Symptomen und Vorzeichen" loading="lazy"></figure></div>
   </div>
 </section>
 
@@ -195,8 +195,8 @@
 <section id="alltag">
   <div class="wrap split rev">
     <div class="media duo">
-      <figure class="phone reveal"><img src="assets/img/medikamente-440.webp" srcset="assets/img/medikamente-440.webp 440w, assets/img/medikamente-720.webp 720w" sizes="290px" width="440" height="956" alt="Medikamente mit Vorrat: Betahistin 46 Tabletten, reicht noch gut drei Wochen" loading="lazy"></figure>
+      <figure class="phone reveal"><img src="assets/img/medikamente-440.webp?v=b" srcset="assets/img/medikamente-440.webp?v=b 440w, assets/img/medikamente-720.webp?v=b 720w" sizes="290px" width="440" height="956" alt="Medikamente mit Vorrat: Betahistin 46 Tabletten, reicht noch gut drei Wochen" loading="lazy"></figure>
-      <figure class="watchmini reveal d2"><img src="assets/img/watch-symptome.webp" width="422" height="514" alt="Apple Watch: Symptome nach dem Anfall antippen, eigene Symptome oben" loading="lazy"></figure>
+      <figure class="watchmini reveal d2"><img src="assets/img/watch-symptome.webp?v=b" width="422" height="514" alt="Apple Watch: Symptome nach dem Anfall antippen, eigene Symptome oben" loading="lazy"></figure>
     </div>
     <div>
       <span class="eyebrow reveal"><i></i>Alltag</span>
@@ -215,7 +215,7 @@
 <!-- Wissen -->
 <section class="band-doc">
   <div class="wrap split rev">
-    <div class="media"><figure class="phone reveal" style="width:min(290px,80%);margin-inline:auto"><img src="assets/img/wissen-440.webp" srcset="assets/img/wissen-440.webp 440w, assets/img/wissen-720.webp 720w" sizes="290px" width="440" height="956" alt="Wissensbereich mit Fakt des Tages und Mythen-Check" loading="lazy"></figure></div>
+    <div class="media"><figure class="phone reveal" style="width:min(290px,80%);margin-inline:auto"><img src="assets/img/wissen-440.webp?v=b" srcset="assets/img/wissen-440.webp?v=b 440w, assets/img/wissen-720.webp?v=b 720w" sizes="290px" width="440" height="956" alt="Wissensbereich mit Fakt des Tages und Mythen-Check" loading="lazy"></figure></div>
     <div>
       <span class="eyebrow reveal"><i></i>Wissen mit Quellen</span>
       <h2 class="reveal d1">Jeden Tag ein Fakt. <em>Mit Beleg.</em></h2>