Kerning und Ligaturen unter Safari

Gestern stieß ich auf die Internet-Testseite Cross-browser kerning-pairs & liga­tures, deren Überschrift sich über­setzen lässt mit »brow­se­r­ü­ber­grei­fendes Kerning plus Ligaturen«. Dort heißt es, dass schon einige Browser die metri­schen Daten von Fonts unter­stützen, zum Beispiel Firefox, Safari 5 und Chrome. Einzige Voraussetzung: die Option optimizeLegibility muss einge­schaltet sein, was nur bei Firefox von Hause aus der Fall ist (für Textgrößen über 20 Pixel).

Auch der Webdesigner Chris Morrell aus Philadelphia stol­perte gestern über die Demosite und dachte sich: Für diesen Zweck muss es doch eine Safari-Extension geben. Er suchte, fand keine und schrieb sich selbst die Extension Optimize Legibility (4,64 KB), die er seit heute zum kosten­losen Download auf seiner Seite anbietet.

Ich habe es eben auspro­biert und bin teils begeis­tert, teils unschlüssig. Mann muss schon eine mit Webfonts gebaute Internet-Seite besu­chen, um die Verbesserung der Lesbarkeit zu erleben … denn die Standard-Schriften Verdana, Arial, Georgia und Co enthalten größ­ten­teils weder Kerning, noch Ligaturen.

Den oben gezeigte Vergleich habe ich auf simple​bits​.com erzeugt, indem ich die Safari-Erweiterung ein- und ausge­schaltet habe (geht wunderbar in Echtzeit mit geöff­netem Voreinstallungsfenster). Weitere Webseiten, auf denen man die Verbesserung der Lesbarkeit gut nach­voll­ziehen kann sind:


4 Kommentare

  1. Steffen

    Genauso einfach geht’s mit einem benut­zer­de­fi­nierten Stylesheet. Einfach eine Textdatei mit folgendem Inhalt erstellen und die Datei in den Safari-Einstellungen unter Erweitert als Style-Sheet auswählen:
    body { text-rende­ring: optimizeLegibility; }

  2. Sven

    So richtig toll ist das Ergebnis bei Webfonts manchmal jedoch nicht. Zum Test das Plugin mal akti­vieren und sich dann die Überschrift des Suhrkamp-Posts auf dem Fontblog anschauen. Vor allem auf „Buchdesign“ achten.

  3. Jürgen Siebert

    Das stimmt, Sven. Darum habe ich auch geschrieben: »… ich bin teils begeis­tert, teils unschlüssig.« In der obigen Abbildung habe ich das von Dir beschrieben Phänomen darge­stellt. Ganz oben: Safari ohne Kerning, darunter Safari mit Kerning und ganz unten Firefox – die beste Darstellung. Meine Vermutung geht dahin, dass Typekit sein Safari-Rendering nach­jus­tieren muss: Die Pixelsprünge und das Kerning zusammen liefern Löcher und Buchstabenberührungen. Firefox dagegen greift auf den selbst gehos­teten Webfont zu (im Fall von Fontblog FF Yoga Sans), und das Ergebnis sieht ziem­lich gut aus.

  4. Alexander Rutz

    Bei mir zerhaut es mit optimizeLegibility in Safari die Umbrüche. Da werden plötz­lich Zeilen länger als Sie eigent­lich dürfen, und brechen in die nächste Spalte ein :/ (Firefox scheint auch ohne diese Zeile Ligaturen zu benutzen)

Kommentarfunktion ist deaktiviert.

<em>kursiv</em>   <strong>fett</strong>   <blockquote>Zitat</blockquote>
<a href="http://www…">Link</a>   <img src="http://bildadresse.jpg">