Proposed Web site redesign (beta)

[Jason Clinton]

Gerald Combs wrote:
> OK, let me rephrase the question.  What tenet of semantic design
> precludes the use of tables for general layout?
> 
> Sorry if I'm being obtuse, but I really want to know.  Googling has only
> turned up pages that tell you _not_ to use tables, without really
> explaining _why_.

Tables are designed for use in displaying _tabular_ data -- such as one 
might use a spreadsheet or a chart for. For instance, a two-axis value 
chart. The existence of tags such as the <th> gives one an insight in to 
the designer's intent here.

In semantic design, the desire is to maintain the /meaning/ of the page 
even when viewed without style. That is, when it is serialized. When a 
table that doesn't have tabular data in it is serialized it _may_ happen 
to be serialized in such a way that it is meaningful, but the vast 
majority of times it will be serialized in a manner which is neither 
structured nor meaningful.

For instance, consider ethereal.com as it is now:

-------8<--------------------------------------------------------------
Ethereal

The world's most popular network protocol analyzer

    Search:
    ____________
    [go-button.gif]-Submit
    Mirrors:
    [Choose Wisely] Go

    Home | Introduction | Download | Documentation | Lists | FAQ |
    Development | Wiki

    Latest Release: 0.10.7

Resources

    Introduction
    Download
    Documentation
    Mailing Lists
    FAQs
    Development
    News
    Advisories
    Publications
    Search
    Wiki

    Main site hosted by

    Network Integration Services, Inc.

Powerful Multi-Platform Analysis

    Ethereal is used by network professionals around the world for
    troubleshooting, analysis, software and protocol development, and
    education. It has all of the standard features you would expect in a
-------8<--------------------------------------------------------------

Now, a couple of thoughts. You've placed the things you see before your 
content "Powerful Multi-Platform Analysis" there because they make sense 
in your visual layout; rendered above, though, not so much. For 
instance, if I were looking at this on an 16-line cell phone, I'd see 
three pages of data before I got to the main content area every time I 
opened a page in the site.

If you were concerned with the cell phone user's experience on your site 
(I know it probably doesn't really matter all that much for 
ethereal.com) then you might consider moving the auxiliary things like 
the mirrors list and the 'hosted by' message to the end of the page. You 
would also move the expanded resources list to the end rather than 
repeating it immediately after the short version.

These are things that you don't think about if you do table layout 
because you only see the significance of the data as it relates to its 
visual position on the page. The mirrors list, the hosted by message, 
the repeated link information are all well-placed visually because they 
are off-center. The main content area draws the focus in the visual 
layout and the other stuff 'surrounds' it providing for context and 
additional information. The same ideas you used for the visual version 
can be applied to the serialized version.

In short, the design goal is: short header (with skip links) followed by 
the content (in a meaningful outline form) followed by supporting links 
and resources (in outline form).

-------------- next part --------------
A non-text attachment was scrubbed...
Name: signature.asc
Type: application/pgp-signature
Size: 256 bytes
Desc: OpenPGP digital signature
Url : http://kclug.org/pipermail/kclug/attachments/20041113/15066574/signature-0002.pgp