multiple CSS stylesheets: do all download?

Hi All,

Q1. I am using multiple stylesheets. When a browser loads a page, does
it download all the stylesheets, or only as-needed? (E.g. a "print"
stylesheet is going to be rarely used, a "handheld" css even less so,
but I would like both to be available.) Does it depend on the method
of linking to the stylesheet?

Here is what I am using:

<style type="text/css" media="screen, projection, tv">@import
"layout3.css";</style>
<link rel="stylesheet" type="text/css" href="print.css" media="print"
/>
<link rel="stylesheet" type="text/css" href="handheld.css"
media="handheld" />

When I test the site on a Web Page Analyzer
http://www.websiteoptimization.com/services/analyze/
it *seems* that with the above code, the print.css is considered
"alternate" and not downloaded, whereas the main layout3.css is
downloaded, and handheld.css is downloaded.

I have tried using the @import rule for all the stylesheets, but then
IE5/WinNT takes the last downloaded stylesheet and applies only that
one, even if it isn't for "screen". This way things seem to work, but
it seems redundant to download a non-used css for every page.

Q2. Are stylesheets cached and not re-downloaded every time a new page
is loaded?

Notes:
My pages are XHTML 1.0 Strict, on a Apache/1.3.22 server.
Not sure if these things makes a difference. They are at
http://www.medphysics.leeds.ac.uk/~dmh/mri/
Thanks for any help.

Dave Higgins

Dave Higgins

Dave Higgins wrote:

> Q1. I am using multiple stylesheets. When a browser loads a page, does
> it download all the stylesheets, or only as-needed? (E.g. a "print"
> stylesheet is going to be rarely used, a "handheld" css even less so,
> but I would like both to be available.) Does it depend on the method
> of linking to the stylesheet?

Mostly it depends on the browser and on the context the stylesheet is
referred to in. It's certainly permissible behaviour for a browser to
download
<link rel="stylesheet" media="print" ...>
or
@media print {
@import "print-style.css"
}
only when actually printing. On the other hand it's just as normal for
the browser to download all of them at the same time.

> Q2. Are stylesheets cached and not re-downloaded every time a new page
> is loaded?

Depends on the headers sent with the stylesheet. With apache you can
use

ExpiresActive On
ExpiresByType text/css "access plus 1 week"

in httpd.conf or .htaccess to cache stylesheets for a week (adjust for
an appropriate interval, or read the HTTP spec if you want more details
on how expiry actually works). mod_expires docs:
<http://httpd.apache.org/docs-2.0/mod/mod_expires.html>

Cheers
Owen

Owen Jacobson

Dave Higgins wrote:

> Q1. I am using multiple stylesheets. When a browser loads a page, does
> it download all the stylesheets, or only as-needed? (E.g. a "print"
> stylesheet is going to be rarely used, a "handheld" css even less so,
> but I would like both to be available.)

I have run a quick test in Opera 7.21 and Mozilla 1.4 and found:

* Opera downloads all stylesheets for the following media:

- screen
- projection
- print
- handheld
- speech (not actually tested, but I think so)
- all (obviously)

* Opera will download these files even if it doesn't support the
specified "type" attribute value[1]. For example, it downloads style
sheets with type equal to "text/javascript" even though it doesn't
support them (only Netscape 4.x and some very early builds of
Mozilla do)

* Opera will not download stylesheets for media it can't understand,
such as "tv" or made up values like "flibble".

* Opera will not download background images linked to by style
sheets until they are needed.

Mozilla is mostly the same except:

* Mozilla refuses to download style sheets with strange MIME types
such as "text/javascript".

* It will however happily download stylesheets with media="flibble"!

Perhaps someone else can fill in the behaviour for IE?

The result of this experiment is that if you would like to irritate
Mozilla users, send a huge binary file with content type "text/css" and
link to it with media="flibble".

[1] Note: all "content types" referred to are for the "type" attribute
specified in the HTML. The Content-Type returned in the HTTP header is
irrelevent, as a browser that doesn't try to download it will never find
that out!

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?page=132

Toby A Inkster

Toby A Inkster wrote:

> - speech (not actually tested, but I think so)

Should have been "aural" obviously.

And no, Opera doesn't support it (or download it) with Opera 7.21 for
Linux. Opera did make early efforts to create a multimode browser with IBM
(ViaVoice). I don't know what's come of that project.

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?page=132

Toby A Inkster

Toby A Inkster wrote:
> ...
> Perhaps someone else can fill in the behaviour for IE?
>

Are you monitoring log entries to collate your stats?

Let me know the url you're testing with and I'll gladly point an ie6/sp1 at
it.

--
William Tasso - http://WilliamTasso.com

William Tasso

William Tasso wrote:

> Let me know the url you're testing with and I'll gladly point an ie6/sp1 at
> it.

You are welcome to test it here:
http://www.goddamn.co.uk/tobyink/scratch/csstest.html

But a glace through my logs seems to indicate that IE downloads any
stylesheets (including alternate stylesheets, and stylesheets without
text/css content type) with media screen, print or all.

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?page=132

Toby A Inkster

Toby A Inkster wrote:
> William Tasso wrote:
>
>> Let me know the url you're testing with and I'll gladly point an
>> ie6/sp1 at it.
>
> You are welcome to test it here:
> http://www.goddamn.co.uk/tobyink/scratch/csstest.html
>
> But a glace through my logs seems to indicate that IE downloads any
> stylesheets (including alternate stylesheets, and stylesheets without
> text/css content type) with media screen, print or all.

Done at 00:39

ip [82.43.146.37] - (probably)

--
William Tasso

William Tasso

"Toby A Inkster" <> wrote in message
news. ..
> William Tasso wrote:
>
> > Let me know the url you're testing with and I'll gladly point an ie6/sp1
at
> > it.
>
> You are welcome to test it here:
> http://www.goddamn.co.uk/tobyink/scratch/csstest.html

> But a glace through my logs seems to indicate that IE downloads any
> stylesheets (including alternate stylesheets, and stylesheets without
> text/css content type) with media screen, print or all.

Looked at the above. Only the HTML file landed in my cache. The CSS files
were conspicuously absent. Perhaps IE didn't load them because there was no
content on the page so nothing to style

Cheers
Richard.

rf

rf wrote:

> Looked at the above. Only the HTML file landed in my cache.

The CSS files are 404. They don't need to actually exist for me to see you
request them in my logs.

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?page=132

Toby A Inkster

William Tasso wrote:

> Toby A Inkster wrote:
>> William Tasso wrote:
>>
>>> Let me know the url you're testing with and I'll gladly point an
>>> ie6/sp1 at it.
>>
>> You are welcome to test it here:
>> http://www.goddamn.co.uk/tobyink/scratch/csstest.html
>>
>> But a glace through my logs seems to indicate that IE downloads any
>> stylesheets (including alternate stylesheets, and stylesheets without
>> text/css content type) with media screen, print or all.
>
> Done at 00:39
>
> ip [82.43.146.37] - (probably)

Logs say:

82.43.146.37 - - [21/Nov/2003:00:36:21 +0000] "GET /tobyink/scratch/csstest.html HTTP/1.0" 200 646 "-" "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; Q312461)"
82.43.146.37 - - [21/Nov/2003:00:36:21 +0000] "GET /tobyink/scratch/testscreen.css HTTP/1.0" 404 370 "http://www.goddamn.co.uk/tobyink/scratch/csstest.html" "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; Q312461)"
82.43.146.37 - - [21/Nov/2003:00:36:21 +0000] "GET /tobyink/scratch/testprint.css HTTP/1.0" 404 369 "http://www.goddamn.co.uk/tobyink/scratch/csstest.html" "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; Q312461)"
82.43.146.37 - - [21/Nov/2003:00:36:21 +0000] "GET /tobyink/scratch/testprojection.css HTTP/1.0" 404 374 "http://www.goddamn.co.uk/tobyink/scratch/csstest.html" "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; Q312461)"
82.43.146.37 - - [21/Nov/2003:00:36:21 +0000] "GET /tobyink/scratch/testhandheld.css HTTP/1.0" 404 372 "http://www.goddamn.co.uk/tobyink/scratch/csstest.html" "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; Q312461)"
82.43.146.37 - - [21/Nov/2003:00:36:21 +0000] "GET /tobyink/scratch/testaural.css HTTP/1.0" 404 369 "http://www.goddamn.co.uk/tobyink/scratch/csstest.html" "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; Q312461)"
82.43.146.37 - - [21/Nov/2003:00:36:21 +0000] "GET /tobyink/scratch/testalt.css HTTP/1.0" 404 367 "http://www.goddamn.co.uk/tobyink/scratch/csstest.html" "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; Q312461)"
82.43.146.37 - - [21/Nov/2003:00:36:21 +0000] "GET /tobyink/scratch/testweirdmedia.css HTTP/1.0" 404 374 "http://www.goddamn.co.uk/tobyink/scratch/csstest.html" "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; Q312461)"

That is, IE seems to download style sheets for any media (including ones
it doesn't understand or are made up) and downloads alt style sheets (even
though it can't use them), but doesn't download stylesheets with
non-text/css content types -- so, slightly different from my earlier
supposition.

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?page=132

Toby A Inkster