CSS: Nutzen aller Schriftfunktionen

Mit der browserübergreifenden Unterstützung für die @font-face-Regel in CSS3 und das Dateiformat WOFF für Schriftartpakete, hat sich die Webtypografie weit über die „websicheren Schriftarten“ hinaus entwickelt. Bekannte Zeitschriften wie der New Yorker verwenden Webschriftarten, um die typografischen Merkmale ihrer jeweiligen Überschriften umzusetzen, während im Rahmen der Wiederwahlkampagne von US-Präsident Obama der Webschriftart-Dienst Typekit verwendet wird, um eine spezifische Schriftart zu hosten.

Eine Einschränkung verhindert jedoch, dass Webdesigner Schriftarten in vollem Umfang nutzen können: Es ist nicht möglich, auf die umfangreichen optionalen OpenType®-Funktionen zuzugreifen, die in zahlreichen Schriftarten integriert sind. Diese Funktionen regeln die Glyphenersetzung und -positionierung für grundlegende typografische Funktionen wie Kerning, hoch- und tiefgestellte Zeichen, kontextabhängige Zeichenarten wie Ligaturen, Zahlenformate, Zugriff auf ostasiatische Glyphen sowie Schwungbuchstaben.

Beispielsweise ermöglicht ein in Gabriola integriertes OpenType-„Stil-Set“ den folgenden Text

...so darzustellen:

Zu den letzten Aktualisierungen am Modul „CSS3 Fonts“ zählt ein neues Set mit Eigenschaften, die den Zugriff auf diese OpenType-Funktionen in CSS ermöglichen. Die Eigenschaften lassen sich in zwei weitgefasste Kategorien einteilen:

• Eine explizite Zuordnung von allgemeinen OpenType-Funktionen zu spezifischen Eigenschaften und Werten. Beispielsweise setzen „font-kerning:normal“ die Kerning-Paaranpassungen der Schriftart und „font-variant-numeric:tabular-nums“ Tabellenziffern um.
• Die „font-feature-settings“-Eigenschaft ermöglicht den Low-level-Zugriff auf alle von der Schriftart unterstützten OpenType-Funktionen. Dies stellt eine Umgehung für den Zugriff auf erweiterte Funktionen in weniger üblichen Anwendungsszenarien dar.

CSS-Eigenschaft: font-feature-settings

Die Preview 4 von IE10 unterstützt die „font-feature-settings“-Eigenschaft. So lässt sich unser vorheriges Gabriola-Beispiel folgendermaßen umsetzen:

p#demo {

font-family: Gabriola, cursive;

font-size: 24pt;

-ms-font-feature-settings: "ss06" 1;

}

Die obige -ms-font-feature-settings-Deklaration aktiviert ein Stil-Set, das von der Schriftart unterstützt wird (ss06). Die Eigenschaft nimmt entweder den Wert „normal“ an – keine Änderung bei der Glyphenauswahl oder -positionierung – oder eine kommagetrennte Liste mit mindestens einer Funktion. In jeder Funktion werden eine OpenType-Funktionsmarkierung mit vier Zeichen und ein Wert zusammengefasst. Im vorherigen Beispiel ist „ss06“ die OpenType-Funktionsmarkierung für Stil-Set 6. Wir weisen der Funktion den Wert „1“ zu, um diese zu aktivieren.

Die OpenType-Funktionsregistrierung definiert die Liste der möglichen Markierungen (dies wird auch hier dokumentiert und in einer ISO-Norm umgesetzt). Es folgen einige der beliebtesten Markierungen:

OpenType-Markierung	Aktiviert
kern	Kerning
liga	Standardligaturen
dlig	Bedingte Ligaturen
smcp	Kapitälchen
subs	Tiefgestellte Zeichen
sups	Hochgestellte Zeichen
swsh	Schwungbuchstaben
ss01, ss02, …, ss20	Stil-Sets 1 bis 20

Eine hilfreich illustrierte Anweisung zu dieser und vielen anderen Funktionen finden Sie im Abschnitt „Layout Features“ im FontFont OpenType User Guide.

Zu den am häufigsten verwendeten Funktionen zählen Schalter zum Aktivieren bzw. Deaktivieren. Mit dem Wert „off“ oder „0“ (NULL) wird die Funktion deaktiviert, mit dem Wert „on“ oder einer beliebigen positiven ganzen Zahl wird die Funktion aktiviert. Bei einigen Funktionen können mit einer ganzen Zahl unterschiedliche Optionen festgelegt werden. Dies ist beispielsweise bei Schwungbuchstaben („swsh“) der Fall. Wenn für die Funktion kein Wert angegeben wird, nimmt diese den Wert „1“ an. Daher sind alle folgenden Deklarationen für unser Gabriola-Beispiel gleichwertig:

-ms-font-feature-settings: "ss06" 1;

-ms-font-feature-settings: "ss06" on;

-ms-font-feature-settings: "ss06";

Ermitteln der unterstützten Funktionen für eine Schriftart

Entwurfstools wie Adobe InDesign oder Illustrator ermöglichen den Zugriff auf OpenType-Funktionen mithilfe benutzerfreundlicher Menüs und Dialogfelder, Textverarbeitungsprogramme wie Word unterstützen dies durch das Dialogfeld für die Auswahl von Schriftarten, und Schriftarthersteller dokumentieren häufig die unterstützten Funktionen ihrer Produkte. Das Ermitteln der Schriftartfunktionen mithilfe des Browsers wird in einem kommenden Beitrag erörtert. Da immer mehr Browser OpenType-Funktionen unterstützen, erwarten wir, das Hosting-Dienste für Schriftarten stärker beworben werden und auch Dokumentation zur Nutzung bereitstellen.

Browserunterstützung

Die „font-feature-settings“-Eigenschaft wird derzeit von Firefox 4+ und Internet Explorer 10 (ab Preview 4) unterstützt. Beachten Sie, dass sich die Wertsyntax in Firefox und IE unterscheidet, da unterschiedliche Versionen des Entwurfs implementiert werden. Beispielsweise wird das Kerning in beiden Browsern folgendermaßen aktiviert:

-ms-font-feature-settings: "kern" 1;

-moz-font-feature-setting: "kern=1";

Weitere Informationen zu „-moz-font-feature-settings“ finden Sie unter -moz-font-feature-settings.

Wir gehen davon aus, dass im Zuge der Standardisierung von CSS3 Fonts mehr Browser „font-feature-settings“ und weitere benutzerfreundliche „font-variant“-Eigenschaften und -Werte unterstützen, die im Modul definiert sind.

Beachten Sie außerdem, dass sich die Eigenschaft auf alle Schriftfamilien auswirkt – ganz gleich, ob es sich um Webschriftarten handelt, die über „@font-face“-Regeln heruntergeladen werden, oder lokale Schriftarten, auf die durch Angabe des Namens verwiesen wird.

Demos

Die IE Test Drive-Website bietet Demos für erweiterte OpenType-Funktionen von Monotype Imaging, FontFont und The Font Bureau. In diesen Demos wird eine Reihe typografischer Designs moderner Schriftarten veranschaulicht.

Sie benötigen keine speziellen Schriftarten, um dies zu testen. Windows 7 enthält eine Reihe OpenType-Schriftarten, einschließlich Calibri, Cambria, Consolas, Gabriola und Palatino Linotype. In der Windows 8 Developer Preview wurden OpenType-Funktionen zu Segoe UI und den webfreundlichen Schriftarten Arial, Verdana, Georgia, Times New Roman, Comic Sans und Trebuchet hinzugefügt.

Wir freuen uns, Webdesignern die Arbeit mit sämtlichen OpenType-Funktionen von Webschriftarten zu ermöglichen, und darauf, in Zukunft eine noch vielfältigere Typografie im Internet zu erleben.

– Sylvain Galineau, Program Manager, Internet Explorer