[Date Prev][Date Next] [Thread Prev][Thread Next] [Date Index] [Thread Index]

Re: Well done on new devel pages



On Sat, Mar 03, 2001 at 07:16:25PM +0100, Josip Rodin wrote:
> >  without forcing HTML into a presentation language. The only problem with
> >  CSS is the sorry support Netscape has for it.
> 
> Errr, what about lynx, links or w3m? Last I checked they didn't support it,
> either. So you'd have to make it look good with and without CSS, which is
> twice the work and would probably make an impact on file sizes.

You are confused. The trick is that you don't need to support CSS to be able
to look at pages using style sheets. If you do it correct, the document is
structured as the document should be. Then I can view the page correctly
with every html capable browser.

Browsers which understand style sheets can additionally layout the page,
making it "pretty". In fact file size is reduced because layout is done
once, and imported into all html files with a link. The documents only
contains the content.

A simple but effective example is my own homepage. It looks great in lynx
and mozilla. IE5 and Netscape probably fail because they think they need to
make it pretty but don't support the full standard correctly (In Netscape,
switch of style sheets entirely to make it work. In IE5 it is bearable).
Here is an example page (abbreviated):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/REC-html40/strict.dtd";>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <link rel="stylesheet" href="styles/default.css" type="text/css">
    <title>Marcus Brinkmann &mdash; Introduction</title>
  </head>
  <body>
    <div id="head">
      <h1>Marcus Brinkmann</h1>
    </div>
    <div id="toc">
      <h2>Content</h2>

<!-- Table of Content follows here -->

    </div>
    <div id="main">
      <h2>Introduction</h2>

<!-- Text of introduction follows here -->

      </div>
    </div>
  </body>
</html>

That's the document. There are absolutely no layout directives, and lynx
copes easily. The order makes sense: Page title, TOC and content come
seperately. But if you look at the page with Mozilla (please do,
http://www.marcus-brinkmann.de), you will notice a
background image, lots of colors, and more importantly, a boxed title and
two columns, the toc left and in a seperate box the content. That's CSS 2
Positioning feature exploited here and it is very great. You can move around
the boxes on the page presented to the user without changing the html file
at all. The trick is that you canapply style sheets to the different "div"
tags. div and span (block vs inline) are tags that do not control anything
in HTML, so they can be used freely to control the style of the document. I
prefer to make div tags more abstract, though, and apply styles to these
abstract entities (header, toc, content).

But I can understand the need for tables if you want position elements and
can't use CSS 2 Positioning because no browser but Mozilla supports it
decently. In about a year though, Internet Explorer will support it to (it
already does to some extent), and Netscape 4 will be uninteresting to most
people.

Thanks,
Marcus

-- 
`Rhubarb is no Egyptian god.' Debian http://www.debian.org brinkmd@debian.org
Marcus Brinkmann              GNU    http://www.gnu.org    marcus@gnu.org
Marcus.Brinkmann@ruhr-uni-bochum.de
http://www.marcus-brinkmann.de



Reply to: