Q. Is this group geared toward non-Microsoft platforms?

T

Toby A Inkster

Whitecrest said:
As for Amaya, well the 8 of you have made a decision to use a
handicapped browser.

Amaya is a pretty good browser/editor. It supports MathML for one thing,
so I can certainly see it being popular in certain types of institution.
 
B

Barry Pearson

Neal wrote:
[snip]
I designed web pages which looked great in IE 5. When IE 6 came out,
they fell to pieces. I found I could re-design the pages to look good
in both. The key - design to the W3C standards, using modern HTML and
- you guessed it - style sheets.
[snip]

Is that a good example? I find one of the trickiest things with CSS is making
things work in both IE 5 and IE 6. (And then it will probably blow up in
IE-Mac).

Perhaps it depends on the sort of layouts you produce. I often mix phtographs
with boxes, eg for backgrounds, and need pixel-level width control. Since I
use standards-rendering mode (with 4.01 Strict, which surely counts as "modern
HTML"?), I am in for a struggle.

(I accept that I couldn't even attempt to try some of what I am doing without
CSS. But it isn't some cure-all for consistency problems).
 
W

Whitecrest

Is that a good example? I find one of the trickiest things with CSS is making
things work in both IE 5 and IE 6. (And then it will probably blow up in
IE-Mac).

Does anyone have a good list of CSS that does not work in different
browsers? Only the unsupported stuff (or things they browsers have
wrong) not both supported and unsupported.
 
B

Barry Pearson

Toby said:
Top 10 reasons for not using layout tables:

10. You don't want to upset Brucie.

Is that why the name changed from David Banner in the TV series to Bruce
Banner in the movie? "... don't make me angry... you wouldn't like me when I'm
angry..."
9. Layout is a presentation matter. HTML (and thus the <table> tag!)
is designed for marking up a document's structure -- not for
specifying how it looks.

All HTML has default layout. Block-level elements are laid out down the
screen. Inline elements go across the screen & wrap. Tables are different in
degree, but not different in kind. Just another way of laying things out on a
page/screen. Think of HTML as default layout, then CSS as (optional)
modification to the default layout.

I think some uses of simple layout tables are where you actually would rather
have separate documents, if only frames & iframes worked better. It would be
better not to download standard banner & site navigation stuff each time. The
tables is used to position stuff that would be better in (say) 4 or 5
documents. Instead the table has (say) 4 or 5 cells, each of which is the
equivalent of a document body.
8. Tables can introduce accessibility problems (although these are
often overstated!)

Indeed. And so can other techniques. Yesterday's report from the Disability
Rights Commission didn't list tables among their problems.

Disability Rights Commission news item:
http://www.drc-gb.org/newsroom/newsdetails.asp?id=633&section=1
Report at:
http://www.drc-gb.org/publicationsandreports/report.asp
7. As with all things CSS, it is useful to have all your styling in
one place so if you want to, say, move your navigation bar from the
right to the left, you don't need to edit 100 different HTML files:
just one CSS file.

There are author-side techniuqes, such as templates. There are server-side
techniques, such as includes and scripts. And there are client-side
techniques, such as script & CSS.

Here is a page that uses a simple layout table to put the navigation bar on
the right. (I wanted it to work even if CSS was disabled).
http://www.childsupportanalysis.co.uk/

Now here is the same page, except that it points to a different CSS. As you
can see, I used a simple change to the CSS to put the navigation bar on the
left. (I haven't bothered to make it pixel-perfect. It was just a bit of fun!)
http://www.childsupportanalysis.co.uk/reversed.htm

Out of 8KB of CSS, I simply changed the rules:
#maincolumn {
}
#fixedcolumn {
width: 180px;
}
to:
#maincolumn {
display: block;
padding-left: 200px;
}
#fixedcolumn {
display: block;
width: 180px;
position: absolute;
left: 5px;
top: 0;
}
6. As the HTML is simpler, it is easier to read and write.

When I use layout tables, (which I do for perhaps half of my pages), they are
very simple. I have even used a single-cell table! They are typically far
simpler than the corresponding CSS. (I now use valid 4.01 Strict, so my HTML
tends to be easier than most on the web anyway).

But CSS positioning typically requires care with the wrapping, nesting, and
sequencing of the 5 to 10 elements nearest the root. I can get a simple layout
table much easier than I can work out the wrapping, etc, needed.
5. Different style sheets can be provided for different media types
automatically. A page can look great on screen, and great on paper
without the visitor having to follow a link to another page. Then you
can have another style sheet for handhelds so narrow displays get the
benefit of a single column version of a design.

The range of different effects that can be achieved using CSS to control
simple layout tables is massive. Here are some examples, for fun. They are all
based on an identical simple layout table. They are work-in-progress, and very
crude at the moment, but the HTML (4.01 Strict) & CSS validates. exhibit05.htm
doesn't work in IE. (No script).
http://www.barry.pearson.name/articles/table_pages/exhibit04.htm
http://www.barry.pearson.name/articles/table_pages/exhibit05.htm
http://www.barry.pearson.name/articles/table_pages/exhibit07.htm
4. If tables were always used strictly for marking up tabular data, we
would now have some pretty nifty spreadsheet-like features in
browsers -- sort alphabetically by table column, automatic totals of
numeric cell ranges, click on a table cell to highlight the
appropriate row and column headers, etc. I want these features. So
everybody! only use tables for marking up tabular data!

Too late. Perhaps 99% of the pages on the web use layout tables. So what you
want will need to work in spite of them. (I want those things too. Why not
have them added to what we have? Then just avoid using them on layout tables).
3. User agents can cache style sheets, and pages using style sheets
for layout are (in my experience) always smaller then the equivalent
table abuse. This means faster loading pages, and cheaper bandwidth
bills.

I use simple layout tables, when I use them at all. They add approximately 25
bytes per item being positioned. This is typically about 100 bytes per
document.
2. Many browsers wait to download "</table>" before even beginning to
render the table. This can cause delays in rendering pages.

I agree that this is a problem. I sometimes use { table-layout: fixed }, but
that probably doesn't solve the problem in most browsers. But many of my pages
are dominated by images, and the table renders before those anyway.
1. Every time you use a table for layout a puppy dies.
[snip]

Aaaaahh! But at least not cats.

(Have you ever eaten roast guinee pig? Tasty! I've been to several Asian
countries. I wonder if I've ever eaten dog or cat?)
 
B

Barry Pearson

Whitecrest said:
(e-mail address removed) says... [snip]
One you forget. It is just plain easier to use css for layout. (yea,
number 6 was leaning that way)

I believe it is (almost by definition) easier to have all the techniques in
your toolkit, then use whichever is best suits your purpose, or use a
combination if desired.

I think it is sad that so much of this discussion becomes polarised - either /
or. I've just built a page (still under development) where I used a
single-cell table within an otherwise tableless-layout. I wanted the effect of
max-width, even in IE. Here it is:
http://www.barry.pearson.name/papers/value_chain/

That page didn't kill any puppies!
 
B

Barry Pearson

Whitecrest said:
Does anyone have a good list of CSS that does not work in different
browsers? Only the unsupported stuff (or things they browsers have
wrong) not both supported and unsupported.

One of the pages I use is:
http://www.richinstyle.com/

I've used this too:
http://www.blooberry.com/indexdot/css/

(And I have several others).

But, mostly, I keep IE 5, IE 6, Firefox 0.8, Netscape 7.1 & Opera 7.23 open
and pointing at the template or page I'm developing on my PC, and keep
checking. Dreamweaver has the O'Reilly CSS reference readily available in a
panel, and I use that *a lot*.
 
B

Barry Pearson

kayodeok said:
Why tables for layout is stupid
http://www.hotdesign.com/seybold/

I've seen it. It is one of the extended arguments that doesn't stand up to
scrutiny. You need to be aware that I have read widely on this topic, and
published a lot too. I am not someone who doesn't know how to do CSS
positioning. About half my pages are tableless layout. I am an engineer, who
runs tests and experiments and pushes arguments to their limit.

"Layout tables considered valuable" (5 pages)
http://www.barry.pearson.name/articles/layout_tables/

"Separation of concerns" (4 pages)
http://www.barry.pearson.name/articles/content_presentation/

"Variations on the 5-box 3-column layout" (15 pages)
http://www.barry.pearson.name/articles/layout_5_3/
 
J

jake

kayodeok said:
Why tables for layout is stupid
http://www.hotdesign.com/seybold/

Unfortunately, it tends to loose credibility when it makes patently
untrue statements like:

" ... Table-based pages are also much less accessible to users with
disabilities and viewers using cell phones and PDAs to access the Web.
...."

regards.
 
K

Kris

Why tables for layout is stupid
http://www.hotdesign.com/seybold/

Unfortunately, it tends to loose credibility when it makes patently
untrue statements like:

" ... Table-based pages are also much less accessible to users with
disabilities and viewers using cell phones and PDAs to access the Web.
..."[/QUOTE]

Well, current use of tables for layout is. You can use them in ways that
make them less hard to access serially, but that is rarely practiced yet.
 
W

Whitecrest

I believe it is (almost by definition) easier to have all the techniques in
your toolkit, then use whichever is best suits your purpose, or use a
combination if desired.

I totally agree, and to take it further, You should always use the tool
the best suits the needs of the project. Basically never say never...
 
J

jake

Kris said:
Unfortunately, it tends to loose credibility when it makes patently
untrue statements like:

" ... Table-based pages are also much less accessible to users with
disabilities and viewers using cell phones and PDAs to access the Web.
..."

Well, current use of tables for layout is. You can use them in ways that
make them less hard to access serially, but that is rarely practiced yet.
[/QUOTE]
They're only a problem if they fail to *linearize* properly -- and this,
in practice, rarely seems to happen.

Opera's 'small screen' mode is a pretty good way of seeing if a
table-based layout is going to give linearization problems. Most
table-based layouts don't exhibit a problem of this nature. Give it a
try.

regards.
 
C

Chris Morris

jake said:
They're only a problem if they fail to *linearize* properly -- and
this, in practice, rarely seems to happen.

*Or* where the user-agent doesn't linearise them but really
should. w3m, links and at least one mobile-phone-based browser [1]
don't linearise tables, which means on w3m you get a lot of horizontal
scrolling (which is even worse than normal in text mode) and on the
other two you get ridiculously narrow columns.

[1] Not Opera or Openwave. I can't now remember which one it was and I
appear to have uninstalled the emulator at some point. It made a real
mess of table layouts, anyway. Column widths down to 2-3 characters on
layouts that weren't particularly unusual.
 
B

Barry Pearson

Spartanicus said:
What planet do you live on? Table layouts hardly ever linearize.

I think they normally linearise.

http://joeclark.org/book/sashay/serialization/Chapter10.html

http://www.utoronto.ca/atrc/tutorials/actable/
Utter nonsense, Opera's SSR disables tables.

It then linearises them! That is what it does. After being disabled, they are
revealed in all their linearised glory.

Try this for yourself. Run with this CSS:

table, tr, th, td {
display: block;
}

In effect, this turns all the elements of a table into the equivalent of
<div>s. Hence they linearise. Which is part of what Opera does.
 
S

Spartanicus

jake said:
They're only a problem if they fail to *linearize* properly -- and this,
in practice, rarely seems to happen.

What planet do you live on? Table layouts hardly ever linearize.
Opera's 'small screen' mode is a pretty good way of seeing if a
table-based layout is going to give linearization problems.

Utter nonsense, Opera's SSR disables tables.
 
C

Charles Banas

Barry said:
Spartanicus wrote:
It then linearises them! That is what it does. After being disabled, they are
revealed in all their linearised glory.

Try this for yourself. Run with this CSS:

table, tr, th, td {
display: block;
}

In effect, this turns all the elements of a table into the equivalent of
<div>s. Hence they linearise. Which is part of what Opera does.

and that, unfortunately, _is something most pages don't do._

Slashdot is a good example of a major site that uses table-based layouts
and virtually no CSS. in fact, the layout hasn't changed in years. and
if you've ever tried to look at it on a PDA or cell phone, you quickly
realized it's impossible to navigate.

i'm personally not against using table layouts (i've done it myself),
but i don't like it when sites use tables and then try to justify their
decision when it doesn't work the way it needs to.

i use tables only as a last-ditch option in layouts. if i can't do it
properly with CSS (a common occurence in IE), then i'll fall back to
tables. but i don't want my sites to have the same usability problems
that Slashdot does.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,743
Messages
2,569,478
Members
44,899
Latest member
RodneyMcAu

Latest Threads

Top