By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,853 Members | 974 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,853 IT Pros & Developers. It's quick & easy.

Out-of-date CSS person needs up-to-date CSS advice!!

P: n/a
Hello,

I shamefully admit to be an old web designer, from before the days of
CSS. In those heady days, tables were king and were used for every
possible kind of alignment. When CSS came along, it was useful for
specifying colours and fonts for a site in one central location, but
useless for any real kind of design work due to the poor browser
support. I got well in to using CSS for colours and fonts, but carried
on using tables for layout.

I recently came across www.csszengarden.com and was totally amazed that
you could do such things with CSS alone. I am completely rethinking my
approach to page layout, but need some help. I have looked at the CSS
there, and at a fair few other sites I have found since, but haven't yet
got the picture completely clear.

So, any suggestions for some background material that will bring me up
to date? I have trawled around Amazon and found three books that look
interesting, the CSS Zen Garden one, "More Eric Meyer on CSS" and
"Cascading Style Sheets the Definitive Guide" (also by Eric Meyer).

Any comments on this choice of books? Remember, I do have a good
understanding of basic CSS, so I don't need anything for a complete
beginner, but I am obviously missing quite a lot of the picture, so I
need something for, erm, a complete beginner!!

Also, are there any on-line resources that I can use? I prefer books as
it's easier to read on paper, but I would also like to see some on-line
material.

Finally, how good is modern browser support for CSS? I only looked at
those sites in IE6, I don't bother in other browsers (although I'm sure
they were fine). Is CSS still a major challenge of working your way
around browser deficiencies?

Thanks for any comments.

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 8 '05 #1
Share this Question
Share on Google+
32 Replies


P: n/a
Alan Silver <al*********@nospam.thanx> wrote:
I recently came across www.csszengarden.com and was totally amazed that
you could do such things with CSS alone. I am completely rethinking my
approach to page layout, but need some help. I have looked at the CSS
there, and at a fair few other sites I have found since, but haven't yet
got the picture completely clear.


My usual csszengarden rant:

CSS2 is rather inflexible, many stylistic and layout changes require a
change to the markup. Particularly so if IE5's poor CSS support is
considered as the benchmark as is the case with CSSZengarden. CSS
selectors is the only part of CSS that can be labeled as flexible, CSS2
selectors are not particularly powerful, and IE doesn't support many of
them anyway.

One of the stated aims of CSS is to separate content and styling. This
is a rather lowly aim. The higher aim is to separate the markup code
from the styling and the layout. CSS2 does a poor job in separating
markup code from styling, and it has no real support for creating page
layouts (floats, positioning and css tables are inappropriate and
woefully inadequate tools for creating a quality layout).

To push what can be achieved with CSS significant changes to the markup
code are needed, this introduces massive inflexibility. CSSZengarden is
an extreme example of this, it uses copious amounts of classes, id's,
divs and spans to create the illusion that CSS is flexible enough to
radically change the look of a site, it isn't.

CSSZengarden is misunderstood by most of the people who view it. It does
not demonstrate the power of CSS, instead it's a grotesque
misrepresentation of the capabilities of CSS, and definitely not
something to be emulated.

--
Spartanicus
Aug 8 '05 #2

P: n/a
>>I recently came across www.csszengarden.com and was totally amazed that
you could do such things with CSS alone. I am completely rethinking my
approach to page layout, but need some help. I have looked at the CSS
there, and at a fair few other sites I have found since, but haven't yet
got the picture completely clear.


My usual csszengarden rant:

<snip>

OK, I'm here to be educated ;-)

I hear what you are saying, but am no clearer as to the direction in
which I should proceed. I am interested in what works now, not what may
be. I do web design for a living and need to rely on what will work with
the browsers that are out there.

Where should I look for education on how to separate as much as is
practical today? At the moment, my coding still mixes a lot of
presentation with content as it uses tables. I would like to improve on
that. How do I go about it.

Thanks for the reply. Your further comments would be appreciated.

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 8 '05 #3

P: n/a
Alan Silver <al*********@nospam.thanx> wrote:
Where should I look for education on how to separate as much as is
practical today?


Taking other people's advice on that is questionable.

What worked for me was years of banging my head against the desk asking
"why doesn't this work as I want/expect?", combined with reading the
specification again and again, years of experience getting to know the
browser bugs and hacks, and hanging out here.

YMMV

--
Spartanicus
Aug 8 '05 #4

P: n/a
>>Where should I look for education on how to separate as much as is
practical today?
Taking other people's advice on that is questionable.


Yup, but it's a good place to start!!
What worked for me was years of banging my head against the desk asking
"why doesn't this work as I want/expect?", combined with reading the
specification again and again, years of experience getting to know the
browser bugs and hacks, and hanging out here.


Which doesn't really get me anywhere. Sure I could spend years banging
my head against a wall, trying to work out what works and what doesn't,
but that's a hugely inefficient way of doing it. I'm just looking for
some pointers into advice on what can be done reliably today. That's
hardly so subjective, and plenty of people have already done it, so I'm
sure there must be some sources of reasonably reliable information.

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 8 '05 #5

P: n/a
Alan Silver wrote:
Hello,
So, any suggestions for some background material that will bring me up
to date? I have trawled around Amazon and found three books that look
interesting, the CSS Zen Garden one, "More Eric Meyer on CSS" and
"Cascading Style Sheets the Definitive Guide" (also by Eric Meyer).


I have CSS Zen Garden: I recommend it.

I have Cascading Style Sheets the Definitive Guide: it has a lot of
typos, some of which would terribly confuse beginners; also, I was not
impressed by how the information is organized.
Aug 8 '05 #6

P: n/a
>> Hello,
So, any suggestions for some background material that will bring me up
to date? I have trawled around Amazon and found three books that look
interesting, the CSS Zen Garden one, "More Eric Meyer on CSS" and
"Cascading Style Sheets the Definitive Guide" (also by Eric Meyer).


I have CSS Zen Garden: I recommend it.

I have Cascading Style Sheets the Definitive Guide: it has a lot of
typos, some of which would terribly confuse beginners; also, I was not
impressed by how the information is organized.


Thanks for that. Any on-line resources that you recommend?

Thanks again.

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 8 '05 #7

P: n/a
On Mon, 8 Aug 2005, Alan Silver wrote:
I shamefully admit to be an old web designer, from before the days
of CSS.
You know, web use of stylesheets as a principle far outdates the
rubbish of pseudo-presentational quasi-HTML that was foisted on the
web by the Mosaic/early-Netscape folks - and soon aped by MS; and a
stylesheet language called Cascading Style Sheets itself somewhat
pre-dated that rubbish too - a prototype of it was implemented in a
W3C testbed browser which, at that time, was called Arena. So my way
of interpreting what's happening now is that we've finally found our
way back to the original path, after years of wasted nonsense with
what became [HTML/3.2 plus various proprietary rubbish]. And a good
thing too. Pity about the wasted half-decade and the bushels of
cluttered quasi HTML which they produced - and are still producing,
sadly.
In those heady days, tables were king and were used for every
possible kind of alignment.
[No, in the "heady" days, the Viola browser was king (1991-1994-ish).
Those who refused to learn from history, however, were doomed to
repeat it.]

Seems to me that you're muddling up one particular aspect of
stylesheets (various ways of positioning content) with one particular
aspect of tables (visual presentation of relationships between cells
of tabular data). The chronologies of those two separate technologies
aren't really so relevant, so let's move on...
When CSS came along, it was useful for specifying colours and fonts
for a site in one central location, but useless for any real kind of
design work due to the poor browser support.
Eh? You seem to have a very narrow interpretation of the term
"design". Might one suspect that your bridges would look good but
would collapse if the wind was just a few km/h higher than the
designer intended? That's what most "designer" web pages do in
practice, after all!

True "web design" must be a lot more than just the visual result on
one browser in one browsing situation (and a glance ahead shows that
you don't even consider any web-compatible browsers!).

One really must wrap oneself around the *design aim* of CSS that it's
optional. It's a proposal (or several) by the author, which will
probably enhance the presentation of the content in particular
range(s) of presentation situation, but which is intended to be
cascaded with any proposals by the end user (i.e the reader) or, if
push comes to shove, disabled entirely.

Whether you like this or not, it's not merely a fact, it's an actual
design aim of CSS. Some authors learn to make a virtue of this, and
get flexible web pages which do their job in a wide range of
presentation situations without fuss. Oh, and they also happen to
look how the author intended in the display situation which the author
had in mind - but that's only part of the design process.

Some authors spend (or should I say "waste") vast amounts of time
trying to factor OUT this flexibility, in favour of getting what they
suppose to be pixel-perfect designs. My verdict on that is: not only
are they unsuccessful, but their readers find their pages pointlessly
hostile: for example, refusing to fit in the reader's browser window,
forcing left-right scrolling; or displaying text at a miniscule size
with a low colour contrast so that it can't be read comfortably - or
indeed at all - at the reader's configured default size, and needs to
be zoomed (if the reader can be bothered) before it's usable. And so
on. In other words, the design is an ego trip for the author and
their sponsor, but of little benefit to their readers.
I recently came across www.csszengarden.com and was totally amazed
that you could do such things with CSS alone.
Yes, it's a spectacular demonstration of what can be achieved, indeed;
but under no circumstances to be used as an actual model of how to
design normal web pages.
So, any suggestions for some background material that will bring me
up to date? I have trawled around Amazon and found three books that
look interesting, the CSS Zen Garden one, "More Eric Meyer on CSS"
and "Cascading Style Sheets the Definitive Guide" (also by Eric
Meyer).
I'm going to shy away from commenting directly on those, but what it
seems to me that one needs for a rounded understanding are three major
areas:

1. web design philosophy

2. CSS language specification

3. An understanding of how well that language is implemented
in browsers currently in use.

You'd also want to know what software tools are available e.g
syntax checkers and so on.

I wouldn't expect to find all of these things in the same place:
indeed some of (3), if published in a book, would likely be out of
date before the book was on the shelves.

The place to find (2) would currently be the W3C so-called "CSS2.1"
draft/specification, since it has modified CSS2 (dumbed it down, if
you want to be honest) to line it up with what currently-written
browsers (at least in their standards conforming mode) are supporting
out of CSS2.
Any comments on this choice of books? Remember, I do have a good
understanding of basic CSS, so I don't need anything for a complete
beginner,
....but your initial comments give cause to worry that you're more
interested in getting a perfect layout, than in facilitating the user
getting access to the content whatever their browsing situation. If
there's any truth in that impression, then you'd be trying to factor
OUT some of the benefits which the separation of content and markup
(HTML) from the presentational proposals (CSS) was intended to
achieve!

I'm hampered by having had the web as a hobby almost as long as it has
existed (thanks to my association at the time with CERN where TimBL
was working at its start), and I've sort-of soaked up the ideas as I
went along. The result is that I find every book I've ever seen on
web topics to be deeply unsatisfactory in various ways; but I've
learned a lot about current tactics from these usenet groups and the
web pages of the more reliable respondents here (i.e tactics in the
face of defective implementations of web browsers, as well as of that
misbegotten proprietary operating system component which thinks it's a
web browser).
Also, are there any on-line resources that I can use?
W3C CSS syntax checker...
I only looked at those sites in IE6, I don't bother in other
browsers


WHAT?

good luck. (If you suppose that thing to be a web browser, you're
going to need it...)
Aug 8 '05 #8

P: n/a
<quick history snipped>
Seems to me that you're muddling up one particular aspect of
stylesheets (various ways of positioning content) with one particular
aspect of tables (visual presentation of relationships between cells
of tabular data).
Well, maybe, but I thought I was discussing the use of css purely for
making the content look pretty (colour, font, etc) and using tables to
ensure that the content appeared where on the page you wanted it.
However, as you rightly comment...
The chronologies of those two separate technologies
aren't really so relevant, so let's move on...
When CSS came along, it was useful for specifying colours and fonts
for a site in one central location, but useless for any real kind of
design work due to the poor browser support.
Eh? You seem to have a very narrow interpretation of the term
"design". Might one suspect that your bridges would look good but
would collapse if the wind was just a few km/h higher than the
designer intended? That's what most "designer" web pages do in
practice, after all!


Not sure what you mean by this, but reading on (mostly sniped for
brevity) shows that you got the wrong end of the stick as to my aim in
web design. Not necessarily your fault, but you assessed me 100% wrongly
;-)

<snip>Some authors spend (or should I say "waste") vast amounts of time
trying to factor OUT this flexibility, in favour of getting what they
suppose to be pixel-perfect designs. <snip>

I couldn't agree with you more!! I have never attempted pixel-perfect
design, nor do I ever expect to. I have argue this point many times,
mostly with print designers who have turned to the web and expect the
same level of control.

I pride myself on designing pages that will look good regardless of the
browser window size, screen resolution, etc. I don't say I'm a great
designer, but I certainly hold this aspect of design as very important.
I recently came across www.csszengarden.com and was totally amazed
that you could do such things with CSS alone.


Yes, it's a spectacular demonstration of what can be achieved, indeed;
but under no circumstances to be used as an actual model of how to
design normal web pages.


Why not? It looked like a fine example to me. The content was completely
unfettered by any presentational markup, leaving it available to be
presented in many different ways, according to the stylesheet chosen. I
thought that was an excellent way to design web pages. What do you have
against it?

<snip>The place to find (2) would currently be the W3C so-called "CSS2.1"
draft/specification, since it has modified CSS2 (dumbed it down, if
you want to be honest) to line it up with what currently-written
browsers (at least in their standards conforming mode) are supporting
out of CSS2.
But the W3C specs are, like all specs, very dry technical documents that
explain the syntax. They don't describe the ideas, nor discuss methods
of implementation. I can read specs, but they are only really any use
when you have an idea what you are doing and need to check a bit of
syntax. When you want to learn the background behind an approach to
doing something, they are basically useless.
Any comments on this choice of books? Remember, I do have a good
understanding of basic CSS, so I don't need anything for a complete
beginner,


...but your initial comments give cause to worry that you're more
interested in getting a perfect layout, than in facilitating the user
getting access to the content whatever their browsing situation. If
there's any truth in that impression, then you'd be trying to factor
OUT some of the benefits which the separation of content and markup
(HTML) from the presentational proposals (CSS) was intended to
achieve!


As I've already explained, there isn't even a shred of truth in that
idea. I'm not actually sure where in my post you got that impression,
but it doesn't really matter. Now you know the truth, maybe you will be
able to reply in a different vein.

<snip>
Also, are there any on-line resources that I can use?


W3C CSS syntax checker...


Again, fine for its purpose, but no use for learning the background.
I only looked at those sites in IE6, I don't bother in other
browsers


WHAT?


<g>
I know what you're thinking and you're wrong. I use IE6 'cos it's quick
and easy, and more sites work in it than the others. That's NOT 'cos
it's good, just that MS has domineered the browser market and more
people waste time optimising their sites for IE than anything else. I
used to use other browsers for general browsing, but got fed up of
looking at sites that didn't work 'cos the dee-ziner didn't know that
other browsers existed.
good luck. (If you suppose that thing to be a web browser, you're
going to need it...)


It does its job, maybe badly, but it does it!!

Anyway, thanks for the reply, but you haven't really helped me further
my understanding of how to use CSS the right way. I'm still looking for
some background in practical separation of presentation from content, as
much as can reasonably be done today. Any further comments would be
welcome.

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 8 '05 #9

P: n/a
On Mon, 8 Aug 2005 16:40:11 +0100, Alan Silver wrote:

Don't get too down on CSS based on the responses you've received. Yes,
it's an imperfect solution that could use a lot of help, but we're stuck
with what we have and have to make the best of it.
So, any suggestions for some background material that will bring me up
to date? I have trawled around Amazon and found three books that look
interesting, the CSS Zen Garden one, "More Eric Meyer on CSS" and
"Cascading Style Sheets the Definitive Guide" (also by Eric Meyer).
I highly recommend Erik Meye on CSS as well as the followup book More Eric
Meye on CSS. They're both good, but you should read the first one first.

I'd probably stay away from the zen garden book until you've had a little
more exposure (though reading the two Eric Meyer books would do that for
you), while the "Definitive guide" is more reference than anything else.
Make sure you get the second edition though, the first is primarily just
CSS1.

Other books:

Jeffery Zalman: Designing with Web Standards
Molly E. Holzschlag: Cascading Style Sheets
Also, are there any on-line resources that I can use? I prefer books as
it's easier to read on paper, but I would also like to see some on-line
material.
Plenty.

Try:

A list apart
The Web Standards Project
BlueRobot
Position is Everything

Google is your friend.
Finally, how good is modern browser support for CSS? I only looked at
those sites in IE6, I don't bother in other browsers (although I'm sure
they were fine). Is CSS still a major challenge of working your way
around browser deficiencies?


Yes.
Aug 9 '05 #10

P: n/a
At last - someone who has answered my question!!
Don't get too down on CSS based on the responses you've received. Yes,
it's an imperfect solution that could use a lot of help, but we're stuck
with what we have and have to make the best of it.
So, any suggestions for some background material that will bring me up
to date? I have trawled around Amazon and found three books that look
interesting, the CSS Zen Garden one, "More Eric Meyer on CSS" and
"Cascading Style Sheets the Definitive Guide" (also by Eric Meyer).
I highly recommend Erik Meye on CSS as well as the followup book More Eric
Meye on CSS. They're both good, but you should read the first one first.


Thanks. I was wondering about whether or not I needed to read the first
one, or if I could just go straight to the second (which got better
reviews in Amazon). Maybe I should read both.

<snip>
Also, are there any on-line resources that I can use? I prefer books as
it's easier to read on paper, but I would also like to see some on-line
material.


Plenty.

Try:

A list apart
The Web Standards Project
BlueRobot
Position is Everything


Thanks for those.
Google is your friend.


Yeah, but it's also your enemy sometimes. If you are looking for sites
on Mongolian Weaver Bashing, then it's great (I imagine!!) as it's a
specialist subject and Google helps you find stuff quickly. Type "css"
in Google and you get 91 million pages!! Hard to know what's worth
reading out of that lot.
Finally, how good is modern browser support for CSS? I only looked at
those sites in IE6, I don't bother in other browsers (although I'm sure
they were fine). Is CSS still a major challenge of working your way
around browser deficiencies?


Yes.


Thought so. Oh well.

Thanks very much for the helpful reply.

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 9 '05 #11

P: n/a
On Tue, 9 Aug 2005 09:53:42 +0100, Alan Silver <al*********@nospam.thanx> wrote:
At last - someone who has answered my question!!


[ Please attribute the quotes, so one is to know who has answered your question ]
Google is your friend.


Yeah, but it's also your enemy sometimes. If you are looking for sites on
Mongolian Weaver Bashing, then it's great (I imagine!!) as it's a specialist
subject and Google helps you find stuff quickly. Type "css" in Google and you
get 91 million pages!! Hard to know what's worth reading out of that lot.


That's true (althoug I 'only' get 80 million). Try Ixquick. Sometimes that
engine gives very good results. <http://eu.ixquick.com/>
--
,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------.
| weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html |
| webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html |
|zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html |
`-------------------------------------------------- --<--@ ------------'

Aug 9 '05 #12

P: n/a
>>> Google is your friend.

Yeah, but it's also your enemy sometimes. If you are looking for
sites on Mongolian Weaver Bashing, then it's great (I imagine!!) as
it's a specialist subject and Google helps you find stuff quickly.
Type "css" in Google and you get 91 million pages!! Hard to know
what's worth reading out of that lot.


That's true (althoug I 'only' get 80 million). Try Ixquick. Sometimes
that engine gives very good results. <http://eu.ixquick.com/>


That's better, I only got 21 million results using that search engine. I
should have read through those by bedtime!!

Ta ra

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 9 '05 #13

P: n/a
Alan Silver wrote:
Google is your friend.

Yeah, but it's also your enemy sometimes. If you are looking for sites
on Mongolian Weaver Bashing, then it's great (I imagine!!) as it's a
specialist subject and Google helps you find stuff quickly. Type "css"
in Google and you get 91 million pages!! Hard to know what's worth
reading out of that lot.


My favourite magic word in google is "tutorial".

searching on
css tutorial
still gives lots of pages, but google's ranking is
quite helpful.

Still not perfect, obviously, but ya' take what
ya' can get.

If you like more formal treatments, add the word
"specification" to your search :-)

BugBear
Aug 9 '05 #14

P: n/a
On Tue, 9 Aug 2005 11:58:58 +0100, Alan Silver <al*********@nospam.thanx> wrote:
Google and you get 91 million pages!! Hard to know what's worth reading out
of that lot.


That's true (althoug I 'only' get 80 million). Try Ixquick. Sometimes that
engine gives very good results. <http://eu.ixquick.com/>


That's better, I only got 21 million results using that search engine.


Really? For 'css' as the search word, I got only 50 listed sites
<http://eu.ixquick.com/do/metasearch.pl?cat=web&cmd=process_search&language= english&utf_query=&query=css>

Did you actually try this at all? Did you take a look? The 21 million you refer
to are possible results, from which 50 are selected being 'top ten pages' from
various search engines. I'm sure you'll find something useful in those 50 pages.

--
,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------.
| weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html |
| webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html |
|zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html |
`-------------------------------------------------- --<--@ ------------'

Aug 10 '05 #15

P: n/a
>>>> Google and you get 91 million pages!! Hard to know what's worth
reading out of that lot.

That's true (althoug I 'only' get 80 million). Try Ixquick.
Sometimes that engine gives very good results.
<http://eu.ixquick.com/>


That's better, I only got 21 million results using that search engine.


Really? For 'css' as the search word, I got only 50 listed sites
<http://eu.ixquick.com/do/metasearch....s_search&langu
age=english&utf_query=&query=css>

Did you actually try this at all? Did you take a look? The 21 million
you refer to are possible results, from which 50 are selected being
'top ten pages' from various search engines. I'm sure you'll find
something useful in those 50 pages.


I did try it, but I misread the line that reported the numbers. I am so
used to seeing Google's line that says it's showing you the first 20 (or
whatever) out of 21 million that I assumed this was doing the same.
Rereading it, it seems it's showing me 44 pages that it thinks are
useful, out of 21 million that might have been useful.

Thanks for the clarification. Obviously the usefulness depends on how
good the choice of 44 is, but I'll have to have a look and see for
that!!

Ta ra

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 10 '05 #16

P: n/a
On Mon, 8 Aug 2005 16:40:11 +0100, Alan Silver
<al*********@nospam.thanx> wrote or quoted :

Any comments on this choice of books?


see http://mindprod.com/jgloss/css.html
Aug 12 '05 #17

P: n/a
On Mon, 8 Aug 2005 16:40:11 +0100, Alan Silver
<al*********@nospam.thanx> wrote or quoted :
Finally, how good is modern browser support for CSS?


see Topstyle. It will tell you which features you use will work on
which browsers.

http://mindprod.com/jgloss/topstyle.html
Aug 12 '05 #18

P: n/a
Alan Silver <no@spam.thanx> wrote:
I recently came across www.csszengarden.com and was totally amazed
that you could do such things with CSS alone.

Alan J. Flavell <fl*****@ph.gla.ac.uk> wrote: Yes, it's a spectacular demonstration of what can be achieved, indeed;
but under no circumstances to be used as an actual model of how to
design normal web pages.

Alan Silver <no@spam.thanx> wrote: Why not?


For one thing, many of the designs are brittle, and fail in browsing
environments that differ from what the CSS author expected. For example,
try enforcing a minimum font size, using a narrow browser window, enforcing
a narrow browser window, or turning off image-loading when CSS is enabled.

For another, many of the techniques common to the CSS Zen Garden designs
(e.g., replacing text with images of text) are used not because they are
good techniques for real-world projects, but because the CSS Zen Garden
imposes artificial constraints.
--
Darin McGrew, mc****@stanfordalumni.org, http://www.rahul.net/mcgrew/
Web Design Group, da***@htmlhelp.com, http://www.HTMLHelp.com/

"I've cut this board three times, and it's still too short!"
Aug 14 '05 #19

P: n/a
>>Finally, how good is modern browser support for CSS?

see Topstyle. It will tell you which features you use will work on
which browsers.

http://mindprod.com/jgloss/topstyle.html


Ta

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 15 '05 #20

P: n/a
>>Any comments on this choice of books?

see http://mindprod.com/jgloss/css.html


Thanks, that's an interesting page, although why it's under Java is
beyond me!! I never knew that CSS was a part of Java - shows how little
I know<g>

Ta ra

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 15 '05 #21

P: n/a
>>>> I recently came across www.csszengarden.com and was totally amazed
that you could do such things with CSS alone.
Alan J. Flavell <fl*****@ph.gla.ac.uk> wrote: Yes, it's a spectacular demonstration of what can be achieved, indeed;
but under no circumstances to be used as an actual model of how to
design normal web pages.

Alan Silver <no@spam.thanx> wrote:
Why not?


For one thing, many of the designs are brittle, and fail in browsing
environments that differ from what the CSS author expected. For example,
try enforcing a minimum font size, using a narrow browser window, enforcing
a narrow browser window, or turning off image-loading when CSS is enabled.


Ah, I didn't check any of those, I was so busy "wow"ing the design and
the fact that it was all done in CSS.
For another, many of the techniques common to the CSS Zen Garden designs
(e.g., replacing text with images of text) are used not because they are
good techniques for real-world projects, but because the CSS Zen Garden
imposes artificial constraints.


Not sure what you mean by that. From what I could see, he (and others)
used techniques like that because they provided a good answer to a
common problem, namely how to balance having pure text in the HTML, but
using a visually rich replacement when rendered. Why is this not a good
technique for real-world projects? Also, what artificial constraints
does ZG apply that require this?

Thanks for the reply, any further elucidation would be appreciated.

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 15 '05 #22

P: n/a
Alan Silver wrote:
I never knew that CSS was a part of Java


A gazillion years ago, a long-forgotten browser named Netscape invented
some stylesheet technology based on setting lots of JavaScript
properties. As it's traditional for tutorials to confuse Java and
JavaScript on all possible occasions, so the confusion begins.

Aug 15 '05 #23

P: n/a
>> I never knew that CSS was a part of Java

A gazillion years ago, a long-forgotten browser named Netscape invented
some stylesheet technology based on setting lots of JavaScript
properties. As it's traditional for tutorials to confuse Java and
JavaScript on all possible occasions, so the confusion begins.


I actually remember that. It was in the days when Netscape was
considered a decent browser. They lost the plot quite seriously since
then...

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 15 '05 #24

P: n/a
On Mon, 15 Aug 2005, Alan Silver wrote:
I actually remember that. It was in the days when Netscape was
considered a decent browser. They lost the plot quite seriously
since then...


IMHO your criticism is ill-founded: after NN4.* "they" handed over the
"plot" to a new organisation which has proved eminently capable of
producing web-compatible browsers. I think "they" deserve to be
congratulated for that.
Aug 15 '05 #25

P: n/a
>> I actually remember that. It was in the days when Netscape was
considered a decent browser. They lost the plot quite seriously
since then...


IMHO your criticism is ill-founded: after NN4.* "they" handed over the
"plot" to a new organisation which has proved eminently capable of
producing web-compatible browsers. I think "they" deserve to be
congratulated for that.


I was referring to a stage in between. At the stage of NN3 and IE3, the
former was a superior browser (according to popular opinion at the
time). MS, for better or for worse, went to on to develop IE
aggressively, releasing new versions regularly. Netscape appeared to do
very little to improve their browser after the first version of NN4 came
out. There were minor releases, but none seemed significantly different
from previous ones. That's what I mean by "they lost the plot", they
just didn't appear to be making any attempt to keep up with MS.

At some point later, when the browser war was effectively lost, Netscape
handed over the browser to open source and they did with it what
Netscape themselves should have done years before. It was only then that
we saw any advances in the browser. As long as Netscape had it, nothing
worthwhile was done.

I'm commenting here from a clear memory of what I saw as a web designer
and browser user at the time. You may have a different view.

It's also worth noting that the end user judges a piece of software by
its overall features, and good CSS support (for example) is unlikely to
be an issue. IE was judged favourably by the general public as it
offered them useful features, like being able to see cached pages
offline in their entirety, instead of the plain HTML option that NN
offered. Technically IE may not be such a great browser, but as with
many MS offerings, it gave people what they wanted. NN didn't (then, I'm
not commenting on the more recent morphs).

Ta ra

--
Alan Silver
(anything added below this line is nothing to do with me)
Aug 15 '05 #26

P: n/a
Alan J. Flavell wrote:
I think "they" deserve to be congratulated for that.


It also improved the LA club scene no end.

Aug 15 '05 #27

P: n/a
Alan Silver wrote:
I actually remember that. It was in the days when Netscape was
considered a decent browser. They lost the plot quite seriously
since then...

IMHO your criticism is ill-founded: after NN4.* "they" handed over the
"plot" to a new organisation which has proved eminently capable of
producing web-compatible browsers. I think "they" deserve to be
congratulated for that.

I was referring to a stage in between. At the stage of NN3 and IE3, the
former was a superior browser (according to popular opinion at the
time). MS, for better or for worse, went to on to develop IE
aggressively, releasing new versions regularly. Netscape appeared to do
very little to improve their browser after the first version of NN4 came
out. There were minor releases, but none seemed significantly different
from previous ones. That's what I mean by "they lost the plot", they
just didn't appear to be making any attempt to keep up with MS.

At some point later, when the browser war was effectively lost, Netscape
handed over the browser to open source and they did with it what
Netscape themselves should have done years before. It was only then that
we saw any advances in the browser. As long as Netscape had it, nothing
worthwhile was done.

I'm commenting here from a clear memory of what I saw as a web designer
and browser user at the time. You may have a different view.

It's also worth noting that the end user judges a piece of software by
its overall features, and good CSS support (for example) is unlikely to
be an issue. IE was judged favourably by the general public as it
offered them useful features, like being able to see cached pages
offline in their entirety, instead of the plain HTML option that NN
offered. Technically IE may not be such a great browser, but as with
many MS offerings, it gave people what they wanted. NN didn't (then, I'm
not commenting on the more recent morphs).


Your memory is certainly different from mine. Mine is just the reverse.

Netscape was superior to IE and IE was trying to keep up to Netscape.
Netscape realised after a while that they had taken a wrong turn with
their Javascript based CSS (JCSS) and decided to forget about the NS 4
series, to not spend resources to correct bugs (after an attempt with a
NS 5 which was never released), but to start a complete re-write for the
NS 6 series; Mozilla Open Source (started by Netscape!), fully standards
compliant. They never "lost the plot" but lost to MS's monopoly game,
resulting in $700 million or so in restitution, but irreversable damage
was done - Netscape had already been aquired by AOL. Under the AOL
umbrella they released NS 6, continued on to the NS 7 series and were
finally set free on their own as Mozilla Foundation of today under which
umbrella they have continued on with the Mozilla 1 series and onward to
the (Phoenix/Firebird/) Firefox 1 series.

What MS did was to present the IE 5 series to be 'compatible' with NS 4.
IE 5.5 was the first decent thing released and superior to NS 4 only
because Netscape no longer supported the NS 4 series by then. Later on,
IE 6 was released, which really should have only been a full point IE 5
release, nothing more. With all of MS's resources, nothing was done for
years to improve IE since they had the mass market wrapped up already
and concentrated on wrapping up other markets. If anyone "lost the plot"
regarding browser improvement, it was MS with its IE, but then it was
never on their radar. Their radar was directed differently, had a
different "plot" which succeeded and is still succeeding, by placing IE
only in front of Windows users. It's not providing, as you say, 'what
people wanted', but provides 'something good enough' - the masses don't
really know what they want or need; IE is put in front of them, it does
basically what they want, they get used to it and stick to it just
because they don't know any better.

My memory is that Netscape, and as the Mozilla successor, continued
unhaltingly to improve whereas IE did not, but came to a stand still.

--
Gus
Aug 15 '05 #28

P: n/a
Re: CSS Zen Garden
I wrote:
For another, many of the techniques common to the CSS Zen Garden designs
(e.g., replacing text with images of text) are used not because they are
good techniques for real-world projects, but because the CSS Zen Garden
imposes artificial constraints.

Alan Silver <no@spam.thanx> wrote: Not sure what you mean by that. From what I could see, he (and others)
used techniques like that because they provided a good answer to a
common problem, namely how to balance having pure text in the HTML, but
using a visually rich replacement when rendered. Why is this not a good
technique for real-world projects?
The common pictures-of-text techniques embed the content within the style
sheet, or at least, within the images the style sheet uses to replace the
text content.

IMHO, the style sheet (and its associated resources) should be unaffected
if someone makes a small change to the text content (e.g., changing the
first H3 element from "The Road to Enlightenment" to "The Path to
Enlightenment").
Also, what artificial constraints does ZG apply that require this?


"Thou shalt not change the HTML for any reason whatsoever."

In the real world, content images should use the IMG element. Content
images that are pictures of text should provide the text in the ALT
attribute.
--
Darin McGrew, mc****@stanfordalumni.org, http://www.rahul.net/mcgrew/
Web Design Group, da***@htmlhelp.com, http://www.HTMLHelp.com/

"If at first you don't succeed, then plug it in and try again."
Aug 15 '05 #29

P: n/a
On Mon, 15 Aug 2005, Darin McGrew wrote (along with much that
didn't seem contentious):
In the real world, content images should use the IMG element.
Content images that are pictures of text should provide the text in
the ALT attribute.


Well, yes; but, on the other hand, there's a body of informed advice
which says that making images that are nothing more than images of
text is poor practice. Better would be to include the text itself in
the HTML with appropriate markup (and if you don't like the visual
result, to propose something via the stylesheet to modify the visual
result in appropriate presentation situation/s).

best regards
Aug 15 '05 #30

P: n/a
I wrote:
In the real world, content images should use the IMG element.
Content images that are pictures of text should provide the text in
the ALT attribute.

Alan J. Flavell <fl*****@ph.gla.ac.uk> wrote: Well, yes; but, on the other hand, there's a body of informed advice
which says that making images that are nothing more than images of
text is poor practice. Better would be to include the text itself in
the HTML with appropriate markup (and if you don't like the visual
result, to propose something via the stylesheet to modify the visual
result in appropriate presentation situation/s).


Yes, the ideal is to use real text, and to style it with CSS.

But image-replacement hacks aren't styling real text with CSS; they're
hiding the real text and replacing it with an image of text.

If these hacks were styling the real text, then users could select the
styled text and copy-paste it somewhere. Or I could add another H3 element
to the CSS Zen Garden boilerplate HTML, without having the new H3 element
look different from all the original H3 elements that are otherwise similar
to my new one. Or I could edit the text of an H3 element without mucking
with the style sheet or its images.

IMHO, if you're going to replace the real text with an image, then you
should be honest about it and use an inline image with appropriate ALT
text. But the artificial requirements of the CSS Zen Garden project
prohibit that.
--
Darin McGrew, mc****@stanfordalumni.org, http://www.rahul.net/mcgrew/
Web Design Group, da***@htmlhelp.com, http://www.HTMLHelp.com/

"The early bird gets the worm, but the second mouse gets the cheese."
Aug 15 '05 #31

P: n/a
Alan J. Flavell:
On Mon, 15 Aug 2005, Darin McGrew wrote (...):
In the real world, content images should use the IMG element.
Sure.
Content images that are pictures of text should provide the text in
the ALT attribute.

Sure.
Well, yes; but, on the other hand, there's a body of informed advice
which says that making images that are nothing more than images of
text is poor practice.
Sure, but 'img' + 'alt' is still a much better, i.e. accessible,
practice than any of the CSS IR techniques. If the alternative text is
displayed it is just as stylable as all the other, normal text, which is
element content instead of attribute content. At least it should
be---some browsers might disagree.
Better would be to include the text itself in
the HTML with appropriate markup (and if you don't like the visual
result, to propose something via the stylesheet to modify the visual
result in appropriate presentation situation/s).


Exactly. Most people (ab)use CSS this IRy way, because of lacking CSS
features or, more commonly, suboptimal CSS support in browsers. The
latter includes downloadable fonts, which currently only IE supports,
but only in a proprietary format (EOT), in which site-specific files
have to be generated by a Windows-only tool (WEFT) out of TTF files
which allow embedding (or more).
Aug 16 '05 #32

P: n/a
On Sun, 14 Aug 2005 14:55:16 +0000 (UTC), in
comp.infosystems.www.authoring.stylesheets , Darin McGrew
<mc****@stanfordalumni.org> in <dd**********@blue.rahul.net> wrote:
Alan Silver <no@spam.thanx> wrote:
I recently came across www.csszengarden.com and was totally amazed
that you could do such things with CSS alone.
Alan J. Flavell <fl*****@ph.gla.ac.uk> wrote: Yes, it's a spectacular demonstration of what can be achieved, indeed;
but under no circumstances to be used as an actual model of how to
design normal web pages.


Alan Silver <no@spam.thanx> wrote:
Why not?


For one thing, many of the designs are brittle, and fail in browsing
environments that differ from what the CSS author expected. For example,
try enforcing a minimum font size, using a narrow browser window, enforcing
a narrow browser window, or turning off image-loading when CSS is enabled.

For another, many of the techniques common to the CSS Zen Garden designs
(e.g., replacing text with images of text) are used not because they are
good techniques for real-world projects, but because the CSS Zen Garden
imposes artificial constraints.


Of course it does. It is not a "real world" problem, but a opportunity
to show off clever solutions to a variety of problems. I would not
code from Zen Garden, but I do look to it for a variety of interesting
solutions and results. Obviously if you can change both the HTML and
the CSS you can get more elegant results.
--
Matt Silberstein
And now our bodies are oh so close and tight
It never felt so good, it never felt so right
And we're glowing like the metal on the edge of a knife
C'mon! Hold on tight!
C'mon! Hold on tight!

Though it's cold and lonley in the deep dark night
I can see paradise by the dashboard light
Paradise by the dashboard light

Jim Steinman
Aug 16 '05 #33

This discussion thread is closed

Replies have been disabled for this discussion.