CSS/Media Queries/Medientypen

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Text-Info

Lesedauer
10min
Schwierigkeitsgrad
leicht
Vorausgesetztes Wissen
CSS


Ein Medientyp ist ein Schlüsselwort, dem verschiedene gleichartige Ausgabegeräte zugeordnet werden können. Es ist die einfachste Form einer Medienabfrage und gleichzeitig Grundlage für spezialisierte Abfragen.

Leider haben sich die Medientypen als unzureichend erwiesen, um zwischen Geräten mit unterschiedlichen Gestaltungsanforderungen zu unterscheiden. Einige Kategorien, die ursprünglich recht eindeutig waren, wie screen und handheld, haben sich in den Jahren seit ihrer Erfindung stark vermischt. Andere, wie z. B. tty oder tv, zeigen zwar Unterschiede zur Norm eines voll ausgestatteten Computermonitors auf und sind daher potenziell nützlich, um Geräte mit unterschiedlichem Styling anzusprechen, aber nur schwierig sinnvoll zu verwenden; da sich Medientypen gegenseitig ausschließen.

In den Media Queries Level 4 gibt es nur noch 3 Medientypen:

Übersicht der Medientypen in CSS
Medientyp Beschreibung Browserunterstützung
all alle Ausgabemedien (Standardwert)
  • Chrome
  • Firefox
  • IE
  • Opera
  • Safari
print für Drucker, die Inhalte sichtbar auf Papier drucken.
für Browser, die eine Druckvorschau anbieten
screen (Computer-)Bildschirme
alle Geräte, die nicht auf @print ansprechen

 


Beachten Sie: Eine Unterscheidung der einzelnen Geräteklassen mit Medientypen wie @handheld, @tv und @projection scheiterte sowohl an mangelnder Browserunterstützung im letzten Fall, sowie der Tatsache, dass Smartphones @handheld ignorierten, um zu verhindern, dass nur eine abgespeckte mobile Version anstelle der Standardseite mit allen Informationen geladen wurde. In Media Queries level 4 wurden diese Medientypen als missbilligt eingestuft.


Medientyp Richtbeschreibung Standard und Unterstützung
aural Ausgabemedien, die sich synthetischer Sprachausgabe bedienen.
  • Achtung
braille Geräte, auf denen die Braille-Schrift (umgangssprachlich „Blindenschrift“) tastbar wiedergegeben werden kann.
  • Achtung
embossed Drucker, die Braille-Schrift tastbar auf Papier einprägen.
  • Achtung
handheld Geräte, die üblicherweise in der Hand gehalten werden, einen kleinen Bildschirm besitzen und über wenig Bandbreite verfügen.
  • Achtung
projection Geräte, die Inhalte projizieren
  • Achtung
speech für Sprachsynthesizer gedacht.
Die Angabe war für ein zukünftiges CSS-Modul reserviert, sollte den Medientyp @aural ersetzen.
  • Achtung
tty Geräte, deren Darstellung über ein Raster definiert wird (z. B. durch nicht-proportionale Schriftarten).
  • Achtung
tv gedacht für Geräte, die Informationen eingeschränkt visuell und akustisch wiedergeben können.
  • Achtung