Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Page 1 of 2 1 2 LastLast
Results 1 to 10 of 15
  1. #1
    Member franklindeleon's Avatar
    Join Date
    Dec 2006
    Location
    Lynn, MA
    Posts
    71
    Member #
    14592
    I've been into web designing for almost a year, as you all know I stil have quite a bunch of things to learn but what is it with the whole table vs css thing. What exactly makes one better then the other. I've seen lots of websites using tables and they look great.
    Franklin de Leon
    www.fdvisions.com

  2.  

  3. #2
    Senior Member karinne's Avatar
    Join Date
    Dec 2003
    Location
    Aylmer QC Canada
    Posts
    1,607
    Member #
    4335
    Liked
    8 times
    You might wanna read this thread - Resources for learning how to use CSS for layout

    There's a bunch of links in there to articles that will tell you that the table was created by the W3C to display data ... not to help you with your layout.
    [a web design portfolio - Currently NOT AVAILABLE for work | web design | Re-coding | PSD-to-HTML]
    I'm also on: virb - facebook - twitter - flickr - del.icio.us

  4. #3
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    Moved to Starting Out, since this isn't a request for reviwing a site but rather a general question.

  5. #4
    Member franklindeleon's Avatar
    Join Date
    Dec 2006
    Location
    Lynn, MA
    Posts
    71
    Member #
    14592
    thank you that's very useful info
    Franklin de Leon
    www.fdvisions.com

  6. #5
    Senior Member leprechaun13's Avatar
    Join Date
    May 2005
    Location
    Northampton
    Posts
    487
    Member #
    10058
    Urm simple answer YES, CSS is much more flexible requires a hell of a lot of a lot less coding for styling tables. I recently made the trasition and I'm amazed at the difference in times for designing a site
    Regards Phil,


  7. #6
    Senior Member Karloff's Avatar
    Join Date
    Oct 2005
    Posts
    744
    Member #
    11702
    u wouldn't sit on a table and eat your dinner off a chair would you? tables should contain tabular data. css for styling.

  8. #7
    ljm
    ljm is offline
    Senior Member ljm's Avatar
    Join Date
    Aug 2006
    Location
    Manchester, England
    Posts
    284
    Member #
    13684
    Liked
    1 times
    This problem wouldn't arise if the CSS spec, and its implementation in browers, wasn't so arbitrary. It's advisable to use div elements and CSS to style them as opposed to tables. You'll get cleaner code that's easier to understand, if anything. I still won't manually code a table, it's too awkward when I can just shove a few floated divs in instead.

  9. #8
    Senior Member Steax's Avatar
    Join Date
    Dec 2006
    Location
    Bandung, Indonesia
    Posts
    1,207
    Member #
    14572
    I'll give 6 reasons why to use CSS. 3 Of these are on the developers' end.

    1. Separate content and display control.
    There is content, which you write for your users' knowledge, and there is display control, which you make for your users' comfort and aesthetic enjoyment. Mixing the two of them in one object only makes things difficult.

    2. Consistency.
    If you have 10 nearly identical boxes in your sidebar, is it anywhere close to logical if you must layout each and everyone of them? I think not. If you're organizing a task force, for example, there is no need to speak to each team and tell them exactly what to do, even though it's only different to 20 other teams in terms of time and location. You should gather them up, tell them what to do, and give each team details on their specifics.

    3. Sustainability.
    You can have ten thousand web pages, all linked to a single CSS file. If you used tables, a single, tiny change to, for example, the background color, you'd have to sort through all of those pages and edit them. For CSS, change one file, and all is done. Say you are developing a software for the general public. Three months after release, you find a horrible bug in it. At this point, it's nonsense to approach each vendor and user, and fix it on his computer/product. You would like it easier to provide an update on your website, and people can just download it, right? Same goes here.

    Next are the advantages on the users' end.

    1. Preserving file size.
    CSS, both on layouts and other uses, can greatly reduce filesize. Lets take a very quick and simple example. A table with 3 columns and 3 rows (the standard header, footer and 3 column layout), eats up only a small amount of filesize, but who's happy with that? They want smaller tables for the news section, yet smaller ones for each news item, then tables for a poll, then tables for the menu... It's common to see up to 10 tables in one page, and often nested in each other. How many rows and columns in all? On average, around 20 rows & columns, many used for special effects and image layouts. This, even without the valigns, borders, backgrounds, font tags, colspans, and so on, consume: 4 characters ("<td>") x 2 tags (open&close) x 20 rows x 20 columns = 3200 bytes, or about 3 kilobytes. This is at even a very, very simple state. Can you actually tolerate this? 20x20 may seems few, but remember that even a very simple news box may have buttons, corner images, etc, so even a news item can have over 50 cells.

    2. Loading order.
    First, most browsers go through tables twice. First to get the layout, second to get the content. This means processing time. Second, CSS files are saved in cache, which means people don't load your layout multiple times. Third, browsers load a table only when its fully loaded. Now tell me how many times the browser actually goes through your layout. Do you actually want users to see only a blank screen before your super-cool layout appears? Nowadays internet users are growing impatient - if someone is new to a site, he'll wait for only up to 20 seconds before its closed. If you have tables, its easy to pass this limit. On CSS, text is displayed even before your layout is complete.

    3. Accessibility.
    This connects deeply into the separation of content and layout. Having them separate means a logical coding structure highly possible, instead of setting structure by position in the table, we can have them in a clear heading-paragraph system. This means even without the stylesheets, the page looks absolutely fine, readability-wise. This also helps in search engines, who use structure to determine priority. Not to mention screen readers and text-only browsers. The ability to create fluid layouts, create style-switchers, and enable enlargeable text allows designers to design for everyone, independent on screen resolution, disabilities, or preferences.

    Do I really have to mention more?
    Note on code: If I give code, please note that it is simply sample code to demonstrate an effect. It is not meant to be used as-is; that is the programmer's job. I am not responsible to give you support or be held liable for anything that happens when using my code.

  10. #9
    Senior Member straight_up's Avatar
    Join Date
    Dec 2003
    Location
    Pennsylvania/Arizona
    Posts
    601
    Member #
    4309
    Very good, thank you Steax! What do you have to say about using tables for limited layout and styling everything with CSS? If done properly -- say, with a dynamically generated theme/skin-based table for layout, and CSS for everything else including styling the table -- you can avoid most of the problems with tables: the file size, permanence, and etc -- and improve on CSS in two ways:

    1) acheive complex layouts by combining CSS & tables -- have you seen the hacks required to do three-column layouts in CSS only? It's incredible.

    2) Save on filesize -- with one table sometimes you can eliminate a lot of confusing, hack-ridden CSS.

    Of course, in a world without Internet Explorer, there would be no issue and it would be "all CSS, all the time" as far as I'm concerned.
    I am Alan Hogan (@alanhogan on Twitter). I like PHP, UI/UX design, and OS X.

  11. #10
    Senior Member Steax's Avatar
    Join Date
    Dec 2006
    Location
    Bandung, Indonesia
    Posts
    1,207
    Member #
    14572
    Yeah, most of those hacks are just attempts to whack IE hard enough on the head to make it work properly.

    I'm far, far more concerned of table misuse at high levels. I think that a perfect designer can replicate any table in CSS, but nobody's perfect, right? If table use is very, very limited and forced, I think it's tolerable. I mean, don't make it too complex, maybe just 5 rows or columns. And only when its absolutely necessary.

    It's still worth learning how to replace all tables for layout into css. It's not really that hard. http://www.maxdesign.com.au/presentation/tree-table/
    Note on code: If I give code, please note that it is simply sample code to demonstrate an effect. It is not meant to be used as-is; that is the programmer's job. I am not responsible to give you support or be held liable for anything that happens when using my code.


Page 1 of 2 1 2 LastLast

Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 10:17 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com