Texte können dank CSS vielfältig gestaltet werden. Auch die Art und Weise, wie der Browser einen Text rendert, lässt sich mit der Eigenschaft „text-rendering“ festlegen. Dabei kann die Rendering-Methode auf Geschwindigkeit oder auf Lesbarkeit optimiert werden.
Rendering-Methoden mit sichtbaren Unterschieden
Die CSS-Eigenschaft „text-rendering“ kennt neben dem Wert „auto“ noch drei weitere Werte, mit denen die Rendering-Methode näher konfiguriert werden kann. „optimizeSpeed“ optimiert einen Text so, dass er möglichst schnell dargestellt wird. Buchstaben werden dabei nicht geometrisch präzise angezeigt. Das Kerning wird ausgeschaltet und Ligaturen werden nicht dargestellt.
Der Wert „optimizeLegibility“ sorgt für eine optimale Lesbarkeit von Texten. Es findet ein Kerning zwischen den Buchstaben statt. Außerdem werden Ligaturen dargestellt, sofern die verwendete Schriftart sie zur Verfügung stellt. Der Wert „geometricPrecision“ sorgt für eine geometrisch präzise Anzeige des Textes.
oben: weder Kerning noch Ligaturen mit „optimizeSpeed“, unten: Kerning und Ligaturen mit „optimizeLegibility“
Standardmäßig wählt der Browser eine geeignete Rendering-Methode aus. Da derzeit nur Gecko- und Webkit-Browser die CSS-Eigenschaft kennen, können andere Browser nicht berücksichtigt werden. Gecko-Browser wählen bei Schriften, die kleiner als 20 Pixel sind, automatisch die Methode „optimizeSpeed“, für größere Fonts „optimizeLegibility“. Webkit-Browser wählen standardmäßig die Methode „optimizeSpeed“ und zwar unabhängig von der Schriftgröße.
Der Wert „geometricPrecision“ wird nur vom Chrome unterstützt. Die Einstellung sorgt im Chrome dafür, dass Schriften exakt in der angegebenen Größe dargestellt werden, auch wenn es sich um „krumme“ Schriftgrößen wie 12,9 Pixel handelt. Normalerweise werden Schriften immer auf die nächsthöhere oder niedrigere Schriftgröße skaliert. Gecko unterpretiert „geometricPrecision“ wie „optimizeLegibility“.
[Bildquellenangabe für das Foto auf der Magazinübersicht: Written language via Fotopedia]
(dpe)
