Sieben Motive statt einem -- und Bilder, die nicht mehr hochgerechnet werden

Filipe: "die grafik soll viieeeel besser aussehen bitte. die hintergrund
bilder sollen viel hochwertiger und spezieller aussehen."

DIE URSACHE WAR NICHT DIE BILDGUETE, SONDERN DIE GROESSE.
Sein Bildschirm ist 2550 px breit, das groesste ausgelieferte Bild war
1600 -- der Browser rechnet es also um das 1,6-fache hoch. Jede Kante
wird dabei weich, gleichmaessig ueber das ganze Bild. Genau das sieht
man als "billig", ohne benennen zu koennen, warum. Eine hoehere
WebP-Guete haette daran nichts geaendert: Man kann keine Bildpunkte
zurueckholen, die nie ausgeliefert wurden.

  Anmeldeseite: jetzt 960 / 1280 / 1600 / 1920 / 2560, Guete 0,88.
  Buehnen:      jetzt 2400 (uhd) / 1600 (breit) / 900 (schmal).
Ueber srcset bzw. eine Fenstergroesse laedt trotzdem jeder nur die
Stufe, die er braucht -- ein Handy weiterhin 32 KB.

UND NEUN BUEHNEN ZEIGTEN DASSELBE BILD.
In start.css standen neun Regeln, eine je Szene -- alle zeigten auf
dieselbe Datei. Die Zuordnung war seit dem 01.09. richtig gedacht und
seit dem 03.09. wirkungslos. Aufgefallen ist es niemandem, weil jede
Seite fuer sich stimmig aussah; man merkt es erst, wenn man zwei
nebeneinander haelt. Jetzt hat jede Gruppe ihr eigenes Motiv, und die
Zuordnung folgt dem, was auf der Seite passiert:

  studio      Startseite            Chili-Wasserfall, "More Than Media"
  showbuehne  Dashboard, Reports    Spiegelkabinett -- viele auf einmal
  portal      LIVE, Content         Splash mit IDEAS / BRAND / CONTENT
  garage      Aufgaben, Technik     Kohle und Glut, Werkstatt
  arena       Dateien, Wissen       Medaillon-Sammlung, ein Archiv
  halle       Profile, Schutz       dieselbe Sammlung -- Personen, nicht
                                    Betrieb
  wald        Start-Check, Scout    roter Ahorn, etwas das waechst
  skyline     Kalender              Podest unter dem Mond
  lounge      Calls, Chat           dieselbe Nachtbuehne, ruhig

Sieben Motive auf neun Plaetze; die zwei Paare sind inhaltlich
benachbart und liegen nie nebeneinander auf einer Seite.

ABDUNKLUNG 0,42 -- gemessen, nicht uebernommen. Beim Tresorbild hatte
ich 0,62 aus den alten Szenen uebernommen, und uebrig blieb ein Schemen.
pruef-buehne rechnet den Kontrast an echten Bildpunkten nach: 4,69 bis
7,14 gegen die noetigen 4,5, an bis zu 28 Stellen je Seite.

Die Groessenpruefung in pruef-struktur bekommt eine begruendete Ausnahme
fuer GESTUFTE Bilder: Bei einer Datei, von der der Browser immer nur
eine von drei Stufen holt, misst eine feste 200-KB-Grenze das Falsche.
Sie gilt unveraendert fuer alles andere -- und die Ausnahme prueft
zusaetzlich, dass die kleineren Stufen wirklich existieren, damit sie
niemand als Schlupfloch benutzt.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
2026-09-07 01:38:02 +02:00
co-authored by Claude Opus 5
parent 44b3290bc5
commit accf01b5d6
66 changed files with 393 additions and 225 deletions
+29
View File
@@ -247,6 +247,35 @@ for (const unter of ["assets/js", "assets/css", "assets/img"]) {
const p = join(ordner, n);
if (statSync(p).isDirectory()) continue;
const kb = Math.round(statSync(p).size / 1024);
/* GESTUFTE BILDER DUERFEN GROESSER SEIN -- aber nur die (07.09.2026).
Die Grenze von 200 KB soll verhindern, dass eine Seite unnoetig
viel laedt. Bei einem Bild, das in mehreren Groessen vorliegt und
von dem der Browser IMMER NUR EINE holt, misst sie das Falsche:
Die 2400-px-Fassung einer Buehne wiegt 210 KB, wird aber nur auf
einem Schirm angefordert, der sie auch braucht -- ein Handy laedt
weiterhin 60 KB derselben Szene.
Ohne diese Ausnahme haette ich die Wahl zwischen einer Pruefung,
die bei jedem Lauf grundlos rot ist, und weichen Bildern auf
grossen Schirmen. Beides waere falsch. Die Grenze fuer alles
andere bleibt, wo sie war -- gerade weil sie fuer Skripte und
Stile weiterhin gilt.
ERKANNT AM NAMEN, nicht am Ordner: `-uhd` und `gate-2560` sagen
ausdruecklich "das ist die grosse Stufe". Wer eine Datei so nennt,
ohne dass es Stufen gibt, umgeht die Grenze -- deshalb prueft die
Zeile darunter, dass es die kleineren Stufen auch wirklich gibt. */
const gestuft = /-uhd\.webp$|^gate-(1920|2560)\.webp$|^gate-hoch-900\.webp$/.test(n);
if (gestuft) {
const kleiner = n.replace("-uhd.webp", "-breit.webp")
.replace(/^gate-(1920|2560)\.webp$/, "gate-1280.webp")
.replace("gate-hoch-900.webp", "gate-hoch-440.webp");
if (!existsSync(join(ordner, kleiner))) {
schwer.push(`${unter}/${n} ${kb} KB (als Stufe ausgewiesen, aber ${kleiner} fehlt)`);
}
continue;
}
if (kb > 200) schwer.push(`${unter}/${n} ${kb} KB`);
}
}