[thelist] how does XHTML/CSS separate content from design mor e than using nested tables and the like?

[Martin]

On Thursday, May 9, 2002, at 10:29  pm, Chris W. Parker wrote:

> -- fancy XHTML/CSS --
>
> <h1>hi there</h1><br />
> <h2>i am teh computar hax0r</h2>
>
> ---------------------
>
> anymore seperating content from design than this is...
>
> -- regular HTML --
>
> <font size="7" face="verdana">hi there</font><br>
> <font size="5" face="verdana">i am teh computar hax0r</font>
>
> ------------------

hmmm my trollometer has just hit 11, but just in case...

How much design is there in
<h1>hi there</h1>
?

None, except the default display which the UA puts on it.

*all* <h1> tells you is that it's a heading of the most important level,
which the UA will render as it chooses to unless you add the
presentation layer of CSS.

<h#> tells you what the enclosed text *means* - which is what
content *should* do.
<font size="7" face="verdana">hi there</font> tells you nothing
about what it means, but something about what it looks like. The
content is intermingled with the presentation.

However,
<h1>hi there</h1> in the HTML
and
h1 {
	font-size: 1.2em;
	font-face: verdana;
	font-color: #669900;
}
in the CSS
will tell you
a) what it means (in the HTML)
b) what it looks like (in the CSS)

The 2 are separate and non-interdependent.

The HTML controls the semantic information
The CSS controls the presentation information.

You can change either layer without touching the other.

You can change the entire look and feel of a site just
by changing the CSS file. How are you going to do that
otherwise without editing every single page of your site?
How can you serve different versions to different users on
different platforms with different default fonts and different
colour abilities without hacking all the HTML?

Take a look at any pure CSS site (mine for example) with
stylesheets off. The content is all there, and is semantically
intact. You can apply your own stylesheet to it and it will adapt
easily to your needs. How on earth would you do that if all the
presentational control were embedded in the HTML?

It's separate because it's separate... I don't know how I can put
it with any greater clarity.

Intermingled, separate - do you see the difference?

Cheers
Martin

_______________________________________________
email: martin at easyweb.co.uk             PGP ID:	0xA835CCCB
	martin at members.evolt.org      snailmail:	30 Shandon Place
   tel:	+44 (0)774 063 9985				Edinburgh,
   url:	http://www.easyweb.co.uk			Scotland