[sword-devel] Please test

Don A. Elbourne Jr. sword-devel@crosswire.org
Sat, 7 Jun 2003 07:27:06 -0500


AAAAAAAGGGGHHHHHH!!!!!
http://www.crosswire.org/sword/biblenew/parallelstudy.jsp

ok ok I'm calm. I just had to get it out of my system.

Let me get another cup of coffee and I'll be right back.

OK. A good bit of presentational markup has crept in there. One of the goals
of the design was to separate content and structure from presentation. Allow
me to cross-post something I sent out yesterday to a church-webmaster list I
am on.

----------------------------------------------

We have been talking about the advantages of valid XHTML and CSS. One of the
real advantages is that you can separate your content from presentation. In
other words your HTML file will have just your content with tags that define
the content instead of bloating the page with presentational information.
See my previous message to Paul, where I showed how to replace a big block
of presentational markup with a simple <h2> tag. Instead of defining the
size, color, justification, and margin of the text, we defined it by what it
is, a heading. You can use the same thing with divs by using either an id or
a class, like this <div id="navigation"> or <div class="content">

Once the structure of your page is in place you can style all of the
elements with one external style sheet. Lets suppose you have 50 pages on
your site. If all your navigation lists are marked with presentational code
like  <font> tags then to make a change you will have to go to each of those
50 pages and make your changes. But if you code them with non-presentational
markup like <div id="navigation"> you can then make changes to your one CSS
file and it will effect every page of your site at one go. Cool huh?

This is what I tried to do with my church web site. Here is what it looks
like without the CSS:
http://lakeshorebaptist.net/nocss.shtml
And here is what it looks like with the CSS:
http://lakeshorebaptist.net/

I know my site is sort of plain-Jane looking, but if I wanted to change the
complete look of the site, all I would have to do is change the CSS, not
every page of the site.

My site is not the best example. If you want to see something really cool,
check out the CSS Zen Garden. The page is marked up in pure
non-presentational XHTML.  The challenge went out to designers to transform
the page with nothing but the magic of CSS. I could not find an unstyled
version of the page on the site so I mirrored it here:
http://elbourne.org/temp/zengarden.htm Now check out the styled version:
http://www.csszengarden.com/ Follow the links in the navigation to view
other designs. I think my favorites so far are Michael Pick's "Dead or
Alive" and  Golden Mean by Douglas Bowman. The amazing thing is that all of
these pages are the same exact page. No changes were made to the HTML
itself. the only difference is that different style sheets are being
imported. Remarkable.

I know that is just one page, but let's suppose it was a site with thousands
of pages. Can you imagine trying to make drastic changes like that to the
entire site, page by page? Big names like ESPN.com are starting to see how
much time can be saved with this method and they recently switched over to
semantic XHTML. Probably none of us have church web sites with thousands of
pages, but the same principles work well no matter what the content.
-----------------------------------------------

I use the CSS Zen Garden as an example of the remarkable stuff that can be
done using CSS when it is applied to pure semantic XHTML. When I started
designing the Sword web interface, I intended for the CSS to be a working
demo of one possible design. If we keep the XHTML pure and without
presentational markup we can then come back and do whatever with the CSS and
not have to re-code the source. Perhaps we could even get a real designer to
come in and provide an outstanding CSS, in opposition to my feeble attempts.
Or we could provide more than one CSS and the user could choose their
preference. These things are only possible if we stick to non-presentational
well-formed valid XHTML in the page itself.

 Tristan Nitot can say it better than I can. Check out the great article "
The Business Benefits of Web Standards."
http://devedge.netscape.com/viewsource/2003/why-web-standards/

Alright enough of that.
</rant>

by grace alone,

Don A. Elbourne Jr.
http://elbourne.org