Buttons korrekt ausrichten

[Gunnar Bittersmann]

@@Rolf B

Nachtrag: Unicode-Subscripte, also log₁₀ statt log₁₀, retten den Tag nicht.

Sie retten aber die Darstellung. (Abb. 1) (Die Rettung des Tages hat Matthias ja schon gezeigt.)

s.a. Codepen

Allerdings werden bei etlichen Browser/Screenreader-Kombinationen die Subscript-Zeichen ₁₀ nicht als „zehn“ vorgelesen.^[1]

<sub> verkleinert die Schrift – aber nicht genug. (Abb. 2)

Wenn man die Schrift noch weiter verkleinert, wird das Dilemma noch deutlicher sichtbar: Es passt nicht zusammen; die Strichstärke der Subscripts ist viel zu gering, da ja mit der Größe verkleinert. (Abb. 3)

Mit bold wird’s dann aber zu fett. (Abb. 4)

Die Darstellung rettet ein OpenType-Feature: subs. Schriftgröße und vertikale Ausrichtung werden zurückgesetzt und OpenType sorgt dafür, dass die Subscript-Zeichen gesetzt werden. (Abb. 5)

Das geht für Ziffern, auch für + und − (Minus, nicht Bindestrich!), nicht aber für beliebige Zeichen. Und natürlich muss man Fonts verwenden, die dieses OpenType-Feature unterstützen.

🖖 Живіть довго і процвітайте

---

1. VoiceOver mit Safari oder Chrome auf Mac: wie erwartet log₁₀ – „log“; log<sub>10</sub> – „log zehn“;
   VoiceOver mit Firefox auf Mac: log₁₀ – „log zehn“ (ui!); log<sub>10</sub> – „log“, Inhalt von sub-Elementen wird nicht angesagt (WTF‽) Da VoiceOver aber sowieso mit Safari am besten zusammenspielt, würde ich der VoiceOver/Firefox-Kombination keine besondere Relevanz zukommen lassen. ↩︎