Zen Garden and Netscape 4x

[jfred1979]

I'm sure you've all seen the CSS Zen Garden site, I've been checking out the code to see how they made the page disable the style sheet for NS 4 and I can't seem to figure out how it was done. It's probably something pretty obvious that I missed, but could someone point me in the right direction?

[mivox]

What I do (no idea what they do) is create a super-basic style sheet to call in with a "normal" header tag, and then put all the NN4 unfriendly rules (which ends up being about 1/2 the CSS for the whole site) in a second .css file which I call in with the @import method (which NN4 can't understand).

So NN4 gets exactly what it needs, and all the stuff that would confuse and break it is only shown to browsers smart enough to find it. :)

[tedster]

They bring in the css rules with @import. Netscape 4 does not support @import, so yuou get a completely unstyled, plain-Jane page.

[mivox]

OK, so they're doing the same thing. :)

[rogerd]

Except there's no "linked" style sheet for NN4 users - it's just plain default text.

[jfred1979]

Aha, I was wondering why they used @import......

[jfred1979]

I'm using this approach with a site I'm working on, but there is one style rule that I'm embedding in each page (rather than linking) because it's a background image that varies from page to page. Is the best way to have non compliant browsers avoid this to define a rule in the imported style sheet for each page that indicates the background image (so 10 different rules for 10 pages, for example), or is the a better way?

[mivox]

Except there's no "linked" style sheet for NN4 users - it's just plain default text.

<snotty>
Which I think is a lazy and stuck-up way of dealing with it. ;)
</snotty>

I always make sure the page at least looks something like it's supposed to, and looks reasonably nice to NN4 users. It doesn't take much extra time at all...

I spend MUCH more time making sure the @import rules work across IE & Opera on Mac & Windows than I do making sure the "basic" version looks decent for NN4.

[g1smd]

<meta http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">@import url(path/file.css);</style>

This version hides the CSS from older versions of Netscape that cannot handle CSS. This stops those versions from displaying a corrupted page with overlapping elements and so on.

The @import command must be the first thing after the <style> tag.

[richardb]

mivox you are too kind

We just redirect them to

"die browser die"

Google seems to favour the Germanic response ;)

Rich

[mivox]

You catch more flies with honey than vinegar. ;)

[SuzyUK]

You catch more flies with honey than vinegar

Agreed, but I think unstyled pages are the sweetest way of saying "UPGRADE", almost better than a hidden div message really..
and after all they're still getting the content of the site.

"A Picture Is Worth A Thousand Words!" ;)

So what picture are NN4 users seeing?

Suzy

[jfred1979]

While we're on the topic of the CSS Zen Garden site, what does this code in the body tag do?

 onload="window.defaultStatus='css Zen Garden: The Beauty in CSS Design';" 

[mivox]

what does this code in the body tag do?

If I'm not mistaken, that little message should appear at the bottom of your browser window, AKA the "status bar"

...but I think unstyled pages are the sweetest way of saying "UPGRADE"

It is clever from that angle, but since I'm not running any sites about standards compliance, CSS implementation or anything technical to do with web browsers and coding at all, that's really not the message I'm trying to communicate to my audience.

I don't want my actual messages being drowned out by a clever bit of geeky self-righteousness (and as a professional designer, I'd have no right to use a client's site as any kind of web standards bully pulpit either...). ;)

[TheDoctor]

Just to add my voice in support of mivox - and also to say that, since I gave NN4 users a minimalist format, I think the pages look better for them than the previous "compromise" version.

Of course, separating out the NN4 code has enabled me to improve the look for users of other browsers - so everyone has gained. Which version people use is entirely up to them, and I'm not going to editorialise about it.

[rogerd]

Nice use of the SNOTTY tag, mivox... but will it validate? ;)

I think zengarden can get away with their approach because the purpose of their site is a demonstration of forward-looking technology and graphic design. There's little point in trying to give NN4 users a minimal version as opposed to the unstyled version they get now.

This approach might not be right for an site selling stuff that has 5% of its visitors using NN4. It really becomes a business decision - is the incremental benefit from accommodating these users worth the additional resources needed to do it? Personally, I no longer worry much about NN4. I'll open the site in it and be sure they will see something, and usually leave it at that. NN4 users must surf a continuous stream of broken, ugly sites... mine won't be as bad as some they see, I'm sure... :)

[MWpro]

mivox you are too kind
We just redirect them to

"die browser die"

rofl... I wish my clients would let me do that :)

[jfred1979]

It would be interesting to somehow get a statistic on the percentage sites that actually render properly in old versions of Netscape, to have some idea of how often NS users do actually see a garbled mess of crap....

[DrDoc]

Sometimes I wonder if Web developers are the only ones using NN4, just to test layouts.

I never hear about anyone using it. And if they do, it's not their browser by choice...

[Ryan8720]

Nobody uses NN4. You are wasting your time if you design for them.

It is interesting to note though, that netscape.com doesn't even work correctly on NN4.

[hooloovoo22]

You catch more flies with honey than vinegar

and you can catch even more with a industrial strength bug zapper. i like the die browser die. i'm in.

[Reflection]

It is interesting to note though, that netscape.com doesn't even work correctly on NN4.

Good point to bring up if you are trying to convince someone to upgrade :).

[Ryan8720]

I told my one client that when he wanted to have his site compatible in IE3+ and NS3+.

[jfred1979]

I've actually had two situations where clients/users have had problems because of using NS 4x. I'm doing several sites right now in the mental health field, in one circumstance the doctors (who are my clients) were using it, in another it was a library, which is where a lot of patients who may access the site would go to access the internet.