Zur Liste springen

notizen

Notizen aus dem Bauen

Zehn Texte über die Teile des Webs, die schwer richtig und leicht falsch zu machen sind: verbundene Schriften, Font-Metriken, Smooth Scroll, reduzierte Bewegung und der Unterschied zwischen eine Seite testen und eine Seite messen. Jede Zahl darin stammt aus dieser Seite.

Alaa Abbod
Texte
10
erschienen
15.02.2026 – 26.08.2026
Sprachen
English, Deutsch, العربية
  1. Rechtsläufig Die Rechts-nach-links-Fehler, die logische Eigenschaften nicht beheben Elf Spiegelregeln in 15.142 Zeilen CSS, und jeder der sieben Fehler, die arabische Leser erreichten, saß dort, wo logische Eigenschaften nicht hinkommen. 14 Min.
  2. Typografie Warum deine arabische Schrift deinen englischen Text setzt Zain trägt 166 lateinische Codepoints und Cairo 291, also hat die arabische Familie an erster Stelle jedes Stacks still jedes englische Wort auf den arabischen Seiten gewonnen. 9 Min.
  3. Messung Warum axe Kontrastfehler auf Text meldet, den du lesen kannst Derselbe Durchlauf, sechs Minuten später, erfand 509 Kontrastknoten auf Text, den ein Mensch einwandfrei liest, und verbarg 420 Fälle des einen Defekts, der echt war. 9 Min.
  4. Bewegung Was reduzierte Bewegung mit einem WebGL- oder Canvas-Hero machen sollte Reduzierte Bewegung hat zwei symmetrische Fehlerfälle — es bewegt sich weiter, oder es bleibt leer — und ein Canvas-Hero ist das eine Element, das beide treffen kann. 10 Min.
  5. Messung Miss das Grundrauschen, bevor du einen visuellen Diff-Schwellenwert setzt Zwei identische Läufe waren sich auf der Seite über nichts uneinig und über 81 Prozent eines Canvas — das hat den einen Schwellenwert zehnmal strenger gemacht und den anderen ganz disqualifiziert. 11 Min.
  6. Typografie Arabische line-height ist nicht 1.7: die echte Untergrenze berechnen Das Verhältnis, das jeder Guide wiederholt, hat keine belegbare Quelle. Hier steht die Rechnung, die es ersetzt, und die vier Strings, die die Zahl auf dieser Seite festlegen. 10 Min.
  7. Bewegung Smooth Scroll macht deine Ankerlinks nicht kaputt — preventDefault schon Gemessen in Chromium 151: die Library lässt einen Ankerklick unangetastet, und der übliche Fix verliert den Hash, den History-Eintrag, :target und die Position der Tastatur. 8 Min.
  8. Bewegung Smooth Scroll gemessen: der Preis ist Dauerlast, nicht Frame-Zeit Der messbare Preis eines Smooth Scrollers ist Dauerlast, nicht Frame-Zeit — und als sie hier auf null gebremst war, gehörte der letzte laufende Frame GSAP. 12 Min.
  9. Typografie Arabisch hat keine x-Höhe: size-adjust aus den Konturen messen Arabisch hat keine x-Höhe, also muss der Multiplikator, der eine arabische Schrift an eine lateinische angleicht, aus den Konturen gelesen werden — und ein Wert reicht nicht. 11 Min.
  10. Rechtsläufig GSAP SplitText zerlegt Arabisch falsch, und es ist kein Rechts-nach-links-Problem Leserichtung und Verbindungen sind verschiedene Eigenschaften einer Schrift, und weil beide verwechselt werden, behebt die übliche Lösung für kaputtes Arabisch in SplitText den falschen Fehler. 9 Min.

Steckst du gerade in so etwas?

Die meisten dieser Texte sind entstanden, weil ein Build mich gezwungen hat, die Frage sauber zu beantworten. Wenn einer davon dein Problem dieser Woche ist, ist eine kurze Nachricht der schnellste Weg.

Bitte dreh dein Gerät,
Diese Seite ist hochkant gebaut.