Zum Inhaltsverzeichnis

Inhaltsverzeichnis

7 Medientypen
7.1 Einführung in Medientypen
7.2 Angabe medienabhängiger Stylesheets
7.2.1 Die @media-Regel
7.3 Erkannte Medientypen
7.3.1 Mediengruppen

Medientypen

7.1 Einführung in Medientypen

Eines der wichtigsten Funktionsmerkmale von Stylesheets ist, dass sie angeben, wie ein Dokument auf unterschiedlichen Medien ausgegeben wird: auf dem Bildschirm, auf Papier, mit einem Sprachsynthesizer, mit einem Braille-Gerät usw.

Bestimmte CSS-Eigenschaften sind nur für bestimmte Medien vorgesehen (z.B. die 'cue-before'-Eigenschaft für akustische Benutzerprogramme). Manchmal können Stylesheets für unterschiedliche Medientypen dieselbe Eigenschaft einsetzen, allerdings unterschiedliche Werte dafür fordern. Beispielsweise ist die Eigenschaft 'font-size' sowohl für Bildschirm- als auch für Druckmedien sinnvoll. Die beiden Medien sind jedoch unterschiedlich genug, um unterschiedliche Werte für die gemeinsame Eigenschaft zu fordern; ein Dokument benötigt auf einem Computerbildschirm normalerweise eine größere Schrift als auf Papier. Die Erfahrung hat außerdem gezeigt, dass serifenlose Schriften auf dem Bildschirm einfacher zu lesen sind, während Serifenschriften auf Papier besser lesbar sind. Aus diesen Gründen ist es notwendig, auszudrücken, dass sich ein Stylesheet – oder ein Teil eines Stylesheets – auf bestimmte Medientypen bezieht.

7.2 Angabe medienabhängiger Stylesheets

Momentan gibt es zwei Möglichkeiten, Medienabhängigkeiten für Stylesheets anzugeben:

@import url("lautestimme.css") aural;
@media print {
/* Stylesheet für den Druck steht hier */
}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>Link zu einem Zielmedium</TITLE>
<LINK rel="stylesheet" type="text/css"
media="print, handheld" href="foo.css">
</HEAD>
<BODY>
<P>Der Rumpf...
</BODY>
</HTML>

Die @import-Regel ist im Kapitel 6 über die Kaskadierung beschrieben.

7.2.1 Die @media-Regel

Eine @media-Regel gibt durch Kommas voneinander getrennt die Ziel-Medientypen einer Menge von Regeln (in geschweifte Klammern eingeschlossen) an. Das @media-Konstrukt gestattet den Gebrauch von Stylesheet-Regeln für verschiedene Medien in ein und demselben Stylesheet:

@media print {
BODY { font-size: 10pt }
}
@media screen {
BODY { font-size: 12pt }
}
@media screen, print {
BODY { line-height: 1.2 }
}

7.3 Erkannte Medientypen

Ein CSS-Medientyp gibt eine Menge von CSS-Eigenschaften an. Ein Benutzerprogramm, das angibt, einen Medientyp dem Namen nach zu unterstützen, muss alle Eigenschaften implementieren, die sich auf diesen Medientyp beziehen.

Die für CSS-Medientypen gewählten Namen reflektieren Zielgeräte, für die die betreffenden Eigenschaften Sinn machen. In der folgenden Liste der CSS-Medientypen sind die Beschreibungen in Klammern nicht normativ. Sie sollen ihnen nur einen Hinweis darauf geben, auf welches Gerät sich der Medientyp beziehen soll.

all
Für alle Geräte geeignet.
aural
Für Sprachsynthesizer vorgesehen. Weitere Informationen finden Sie im Abschnitt über akustische Stylesheets.
braille
Für Braille-Geräte mit taktilem Feedback vorgesehen.
embossed
Für Braille-Seitendrucker vorgesehen.
handheld
Für Handheld-Geräte vorgesehen (normalerweise mit kleinem Schwarzweißbildschirm und begrenzter Bandbreite).
print
Für ausgedrucktes, undurchsichtiges Material vorgesehen, ebenso wie für Dokumente, die im Druckvorschaumodus auf dem Bildschirm angezeigt werden. Weitere Informationen über Formatierungsaspekte, die spezifisch für Druckmedien sind, finden Sie im Abschnitt über Seitenmedien.
projection
Für projizierte Präsentationen vorgesehen, wie zum Beispiel Projektoren oder den Ausdruck auf Folien. Weitere Informationen über Formatierungsaspekte, die spezifisch für Druckmedien sind, finden Sie im Abschnitt über Seitenmedien.
screen
Hauptsächliche für Computer-Farbbildschirme vorgesehen.
tty
Für Medien vorgesehen, die ein festes Zeichenraster verwenden, wie beispielsweise Fernschreiber, Terminals oder portable Geräte mit begrenzten Anzeigemöglichkeiten. Autoren sollten keine Pixeleinheiten verwenden, wenn sie den Medientyp „tty“ einsetzen.
tv
Für fernsehartige Geräte vorgesehen (geringe Auflösung, Farbe, begrenzt rollbare Bildschirme, mit Sound).

Bei der Angabe der Medientypnamen wird die Groß-/Kleinschreibung nicht berücksichtigt.

Weil sich die Technologien so schnell ändern, gibt CSS2 keine definitive Liste der Medientypen an, die als Werte für @media verwendet werden könnten.

Hinweis. Zukünftige Versionen von CSS werden diese Liste möglicherweise erweitern. Die Autoren sollten sich nicht auf Medientypnamen verlassen, die noch nicht von einer CSS-Spezifikation definiert sind.

7.3.1 Mediengruppen

Jede CSS-Eigenschaftsdefinition gibt die Medientypen an, für die die Eigenschaft durch ein konformes Benutzerprogramm implementiert werden muss. Weil sich die Eigenschaften im Allgemeinen auf mehrere Medien beziehen, gibt der Abschnitt „Anwendung auf Medien“ Mediengruppen statt einzelner Medientypen an. Jede Eigenschaft gilt für alle Medientypen in den in ihrer Definition aufgelisteten Mediengruppen.

CSS2 definiert die folgenden Mediengruppen:

Die folgende Tabelle zeigt die Beziehungen zwischen Mediengruppen und Medientypen:

Beziehung zwischen Mediengruppen und Medientypen
Medientypen Mediengruppen
  continuous/paged visual/aural/tactile grid/bitmap interactive/static
Aural continuous aural N/A both
braille continuous tactile grid both
emboss paged tactile grid both
handheld both visual both both
Print paged visual bitmap static
projection paged visual bitmap static
screen continuous visual bitmap both
tty continuous visual grid both
tv both visual, aural bitmap both