www.webdeveloper.com
Results 1 to 6 of 6

Thread: css instead of tables

  1. #1
    Join Date
    Jan 2003
    Posts
    44

    Question css instead of tables

    im obviously very new to CSS and apparently there is a way to use CSS in the place of tables. how would i go about doing so? what are the advantages and disadvantages of doing so?
    thanks.

  2. #2
    Join Date
    Jan 2003
    Location
    Atlanta, GA
    Posts
    571
    Yes, W3C recommends using CSS for page layout instead of tables. Advantage of CSS include cleaner codes, smaller html pages and separation of content from layout. Making site-wide layout changes is simpler than tables method.

    Disadvantage is that older browsers may not support it well (eg. NS 4.7x is really bad), whereas even the most recent browsers are not yet 100% compliant - very close but still not one-hundred-percent.

    You can find good layout tutorials at (among other places)
    http://www.glish.com/css/
    http://www.thenoodleincident.com/tut...son/boxes.html

  3. #3
    Join Date
    Nov 2002
    Location
    Baltimore, Maryland
    Posts
    12,270
    You'll find a lot of good information on how to use CSS for layout at http://glish.com/css/.

    But you also asked why. There are, and always will be, browsers in use that do not understand CSS. But there are also browsers that do not understand tables. And to make matters worse, there are browsers that understand tables but that present them to the user in alternative ways. If you are using a screen reader on a table of data you need some way to keep track of where you are in the columns and rows. And an increasing number of screen readers are presenting what the reader takes to be the headings with each cell. And this really makes a mess out of things when you use tables for layout.

    We still have to deal with the non-CSS browsers but that's an easy one. The proper way to make a web page is to start with an HTML 4.01 Strict (http://www.w3.org/TR/html4/) page that works. Use your mark up properly and put the menu at the bottom of the page. People listening to your web site do not want to have to hear the same menu every time they hit one of your pages. Only once you've done that do you add CSS for fonts and colours and layout. And behold, you have a page that will work on every browser that there is.
    “The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.”
    —Tim Berners-Lee, W3C Director and inventor of the World Wide Web

  4. #4
    Join Date
    Nov 2002
    Location
    XYZZY - UK
    Posts
    1,760
    Having a navigation menu at the bottom of the page is an interesting idea; I would have thought using a "skip navigation" link with the # fragment identifier would have covered some of the navigation menu issues.

    The only reason I'd say that is because what happens if user X wants to navigate through a site upon page entry and ends up receiving the main content first.

  5. #5
    Join Date
    Nov 2002
    Location
    Baltimore, Maryland
    Posts
    12,270
    Originally posted by Robert Wellock
    [W]hat happens if user X wants to navigate through a site upon page entry and ends up receiving the main content first.
    User X "tabs" through the links on the page, quickly arriving at the navigation. User Y simply asks the browser for a list of all of the links on the page. But the "skip navigation" link method isn't so bad except for the problems it causes search engines.
    “The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.”
    —Tim Berners-Lee, W3C Director and inventor of the World Wide Web

  6. #6
    Join Date
    Nov 2002
    Location
    XYZZY - UK
    Posts
    1,760
    Thanks for the insight on that; it was probably so obvious that I didn't consider the tab navigation like that. I had also thought the search engines might have hiccups.
    Last edited by Robert Wellock; 02-24-2003 at 10:19 AM.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles