CSS

Zum Schluss kümmern wir uns noch um den CSS-Teil von sIFR. Öffnen Sie „sIFR-screen.css“ (in unserem Beispiel) und ergänzen sie den Inhalt um die folgenden Zeilen:

.sIFR-active h1,
.sIFR-active h2,
.sIFR-active h3, {
		visibility: hidden;
		font-family:Verdana;
		line-height:1em;
}

Die Klasse .sIFR-active wird nur gesetzt, wenn sIFR aktiviert wurde – also nur wenn JavaScript aktiviert und das Flash-Plugin vorhanden ist. Das erlaubt uns, spezielle CSS-Anweisungen nur für sIFR zu spezifizieren. Wir setzen also „visibility:hidden;“, um sicherzugehen, dass der normale Text nicht im Browser dargestellt wird. Als Schriftart wird die Verdana gewählt, da sie auf fast jedem System der Welt vorhanden ist und sich somit die Texttransformationen verlässlich voraussagen lassen.

Die wichtigste Anweisung ist hier „line-height:1em;“: sie sorgt dafür, dass die Zeilen genauso hoch sind wie der Text, das ist von Bedeutung für die Textgrößenberechnungen im Java- und ActionScript. Nach diesen Vorbereitungen können gewünschte Textgrößenänderungen im Flashfilm einfach über das font-size-Attribut gesteuert werden.

Fazit

Dieser Artikel kann nur einen Bruchteil der Möglichkeiten von sIFR aufzeigen, die offizielle Liste umfasst Features wie:

• FlashCSS: Verwendung mehrerer Farben und unterschiedlicher Textstile. Auch Linkstile sind möglich.
• Kontrolle über Kerning, Leading und Zeilenhöhe.
• Dynamische Schriftgrößenveränderung.
• Besserer FlashBlock-Support.
• Ausschluss einzelner Elemente von der Ersetzung.
• Verwendung von Flash8-Filtern.
• Hintergrundbilder im Flashfilm.

sIFR, in seiner aktuellen Version, ist eine der brauchbarsten Methoden, um ansprechende Typografie standardkonform in Webseiten zu integrieren. Es ist umfangreich konfigurierbar, schlank und skaliert Schriften dynamisch.

Der Autor

Benjamin Niediek ist Mediengestalter für Digital- und Printmedien und studiert Medieninformatik & Gestaltung an der Universität Bielefeld. Er arbeitet seit 5 Jahren bei der Firma HDNET GmbH & Co. KG als Creative Director und ist dort vornehmlich für das Screendesign und die Frontendprogrammierung umfangreicher TYPO3-Projekte verantwortlich.

Alexander Heinze ist ebenfalls Mediengestalter für Digital- und Printmedien und strebt ein berufsbegleitendes Studium im Bereich Informatik an. In der Firma HDNET GmbH & Co. KG ist er seit vier Jahren als Mediengestalter angestellt und widmet sich dort hauptsächlich der Frontend-Programmierung umfangreicher TYPO3- und Social-Network-Projekte.