Web Interface - Parallel Version Display, was Re: [sword-devel] Please test
Joachim Ansorg
sword-devel@crosswire.org
Sun, 8 Jun 2003 17:24:06 +0200
Don,
thank you for your comments.
I asked for your opinion some weeks or days ago regarding the table stuff but
got no answer on this list. So I did it my way :)
First I used CSS styles with something like: display:table-cell; or
table-column; to turn <div>'s to look like a table. But since Mozilla and
Konquero can't handle this stuff in all cases (alignment failed) I switched
to tables.
I know from my own webpages that using one CSS file is very good and makes
side-wide changes easy.
I you can give me the CSS how to make
<div id="col">
<div id="verse"></div>
<div id="verse"></div>
<div id="verse"></div>
<div id="verse"></div>
</div>
look like a table plus wrapping better in available space I'd be glad to use
this.
And paralleldisplay.jsp was more an testbed for this feature than the last
revision of this. I'm open for ideas and enhancements.
Joachim
> I probably ought to apologize for my rant this morning. the scream was half
> in jest, well probably more like 90% in jest. :) I did freak out a little
> bit when I saw the align tags, width tags, and inline style smattered
> throughout the page. But after a closer look, there are only a few things
> that could be cleaned up and moved to the external CSS pretty easily.
>
> The table itself is actually a great idea. For all the things I've said
> against table based design, tables do have their place. Their place is to
> display tabular data. The parallel translations are tabular data and thus
> well suited for a table. We just need to take out any presentational
> mark-up and replace it with semantic markup.
>
> Another issue with the table is space. With the table being squished into
> the center column, things get real cramped real quick. I'm not sure what
> ought to be done about that. Removing the outer columns and just using one
> big table across the page would be one option, but you lose the cool one
> click feature that is working there now.
>
> One option might be to have a separate page, or another section on the
> preferences page, that would allow the person to select the translations
> they want displayed.
>
> by grace alone,
>
> Don A. Elbourne Jr.
> http://elbourne.org
>
> ----- Original Message -----
> From: "Don A. Elbourne Jr." <delbourne@cox.net>
> To: <sword-devel@crosswire.org>
> Sent: Saturday, June 07, 2003 7:27 AM
> Subject: Re: [sword-devel] Please test
>
> > 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
> >
> >
> >
> >
> > _______________________________________________
> > sword-devel mailing list
> > sword-devel@crosswire.org
> > http://www.crosswire.org/mailman/listinfo/sword-devel
>
> _______________________________________________
> sword-devel mailing list
> sword-devel@crosswire.org
> http://www.crosswire.org/mailman/listinfo/sword-devel
--
<>< Re: deemed!