Die Kopfleiste wuchs beim Laden um vier Pixel -- und schob die Seite

Beim Messen des Datenvolumens nach dem Bildumbau fiel etwas anderes
auf: Der Layout-Sprung auf der Startseite lag bei 0,99. Die Bilder waren
es nicht -- ein Hintergrundbild liegt `position: fixed` und bewegt gar
nichts.

Die Meldung sagte es selbst, man musste nur hinsehen: ALLES sprang um
denselben Betrag (295->301, 144->150, 685->692, 605->611). Wenn die
ganze Seite gleichmaessig nach unten rutscht, waechst etwas ueber ihr.

Gemessen: Leiste vor dem Skript 67 px, danach 71. Der Sicht-Umschalter
kommt erst, wenn die Personenliste geladen ist, und ist mit 42 px das
hoechste Teil in der Reihe. Vier Pixel -- man sieht sie kaum und merkt
sie doch: Wer beim Laden schon zielt, klickt daneben.

Die Loesung ist keine reservierte Hoehe auf Verdacht, sondern die Hoehe,
die die Zeile ohnehin haben muss: `min-height: 44px`. Das ist das
Mindestmass fuer ein Fingerziel (WCAG 2.5.8) und gilt hier sowieso fuer
jedes Teil. Damit ist die Zeile immer so hoch wie ihr groesstes
zulaessiges Element -- unabhaengig davon, ob dieses gerade schon da ist
oder erst kommt.

Ergebnis: 0,99 auf 0,60, und die Zahl der Seiten ueber dem Zielwert von
zwoelf auf sechs. Datenvolumen unveraendert in Ordnung trotz der
groesseren Bilder -- der Browser holt je Seite nur eine Stufe.

Und der offene Punkt von vorhin ist geklaert: pruef-browser laeuft
gruen durch, alle vier Maschinen (Chromium, Firefox, WebKit, WebKit auf
dem iPhone), 64 Seitenaufrufe, 15898 Elemente. Der eine rote Punkt im
Gesamtlauf war eine Zeitueberschreitung unter Dauerlast -- erkennbar
daran, dass ZWEI Pruefungen gar nicht gelaufen waren und die Datei die
doppelte Zeit brauchte. Eine gesunkene Anzahl ist ein eigener Befund.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
2026-09-07 01:46:29 +02:00
co-authored by Claude Opus 5
parent accf01b5d6
commit 8107b97379
20 changed files with 186 additions and 169 deletions
+9 -9
View File
@@ -9,10 +9,10 @@
<meta name="theme-color" content="#0674b9" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609070138" />
<link rel="stylesheet" href="assets/css/start.css?v=202609070138" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609070138" />
<link rel="stylesheet" href="assets/css/scouting.css?v=202609070138" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609070141" />
<link rel="stylesheet" href="assets/css/start.css?v=202609070141" />
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609070141" />
<link rel="stylesheet" href="assets/css/scouting.css?v=202609070141" />
</head>
<body class="start">
@@ -126,10 +126,10 @@
</div>
</div>
<script src="assets/js/wahl.js?v=202609070138" defer></script>
<script src="assets/js/bereiche.js?v=202609070138" defer></script>
<script src="assets/js/kopf.js?v=202609070138" defer></script>
<script src="assets/js/glocke.js?v=202609070138" defer></script>
<script src="assets/js/scouting.js?v=202609070138" defer></script>
<script src="assets/js/wahl.js?v=202609070141" defer></script>
<script src="assets/js/bereiche.js?v=202609070141" defer></script>
<script src="assets/js/kopf.js?v=202609070141" defer></script>
<script src="assets/js/glocke.js?v=202609070141" defer></script>
<script src="assets/js/scouting.js?v=202609070141" defer></script>
</body>
</html>