Gunnar Bittersmann: ein oder getrennte Stylesheets für unterschiedliche Ausgabemedien?

Beitrag lesen

Hi,
Wie macht Ihr Stylesheets für unterschiedliche Ausgabemedien?

(1) eine Datei
    all.css:
        ~~~css @media screen {
            foo {bar:baz}
        }
        @media print {
            foo {bar:quz}
        }

  
    einbinden mit  
        `<link rel="stylesheet" type="text/css" href="http://example.net/all.css" media="all" />`{:.language-html}  
  
  
(2) getrennte Dateien  
    screen.css:  
        `foo {bar:baz}`{:.language-css}  
    und  
    print.css:  
        `foo {bar:quz}`{:.language-css}  
  
    einbinden mit  
        ~~~html
<link rel="stylesheet" type="text/css" href="http://example.net/screen.css" media="screen" />  
        <link rel="stylesheet" type="text/css" href="http://example.net/print.css" media="print" />

IMHO krankt Variante (2) an der einfachen Erweiterung, z.B. für Screenreader. aural.css ist schnell geschrieben, aber
    <link rel="stylesheet" type="text/css" href="http://example.net/aural.css" media="aural" />
muss ja in jede einzelne HTML-Datei eingefügt werden. (Sämtliche Links zu Stylesheets könnten natürlich auch mit SSI o.ä. aus einer Datei eingefügt werden.)

Was seht Ihr als Vor- und Nachteile beider Varianten?

Gunnar

--
I never intended HTML source code (the stuff with the angle brackets) to be seen by users. […] To my surprise, people quickly became familiar with the tags and started writing their own HTML documents directly. (Tim Berners-Lee in Weaving the Web)