SitePoint Sponsor |
|
User Tag List
Results 1 to 25 of 25
Thread: The benefits of going tableless?
-
Dec 13, 2002, 07:02 #1
- Join Date
- Oct 2002
- Location
- Still Thulcandra
- Posts
- 997
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
The benefits of going tableless?
Hi, I did ask this question carefully in another thread, but it wasn't the topic, so I decided to start a thread with this question...
I've seen people say that they want to go from tables to using css for positioning...
My experience is that tables are easy to use when positioning site elements and that they work very well...
So my question is: What are the benefits of going tableless, and using CSS instead?
Someone mentioned that nested tables can make the rendering of the page go slowly, but don't we have more to save in optimizing the graphics?
-
Dec 13, 2002, 12:59 #2
Re: The benefits of going tableless?
Originally posted by X Q mano
Hi, I did ask this question carefully in another thread, but it wasn't the topic, so I decided to start a thread with this question...
I've seen people say that they want to go from tables to using css for positioning...
My experience is that tables are easy to use when positioning site elements and that they work very well...
So my question is: What are the benefits of going tableless, and using CSS instead?
Someone mentioned that nested tables can make the rendering of the page go slowly, but don't we have more to save in optimizing the graphics?
1. Pages load quicker. What do you think would load faster, this:
Code:<table border="0" cellpadding="0" cellspacing="0" width="500"> <tr> <td>First Cell</td> </tr> </table>
Code:<div class="layout"> First div </div>
3. If all of your layout declarations are in the stylesheet you can modify everything in ONE place and have it propogate thru the site. Changing fonts on your site from arial to geneva? Now you just change a few lines in your stylesheet instead of trying to find all of the <font> tags on your site.
4. No more stupid browser hacks to worry about (assuming your audience uses a browser that is from the last 2-3 years).
5. Easier for other devices to parse thru such as handhelds, screen readers for the blind, Internet appliances, cellphones, and other devices we have yet to think of.
6. You won't have to change your design for years and it will still work if the correct <!DOCTYPE> is applied.
I'm sure there are more but those are what I can think of off the top of my head.
--Vinnie
-
Dec 16, 2002, 02:23 #3
- Join Date
- Oct 2002
- Location
- Still Thulcandra
- Posts
- 997
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Ok, for your first point, I can see the benefit. Though I didn't think that the actual code was what took so long to load. Aren't the graphics a little more important to optimize when you want the page to load quicker?
No. 2, is probably right...
No. 3, hasn't exactly anything to do with tables has it? I use css so I won't have to write those annoying <font> tags... But I also use tables... (now, it might change)
No. 4, Well, my experience is that NS 4, (So many people still use NS 4, it scares me) really has a problem with CSS...
5, I don't know very much about this, so I can't argue with that
6, That is, if you actually want your design to be the same for YEARS...
-
Dec 16, 2002, 03:41 #4
- Join Date
- Oct 2001
- Location
- Beyond yonder
- Posts
- 2,384
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally posted by X Q mano
6, That is, if you actually want your design to be the same for YEARS...
top-left-corner the number reason seven why: and the top-right-corner this is most important hard to reason, is because you're not understand discombobulating bottom-left-corner the source bottom-right-corner. Comprenda? ;-)
~~Ian
-
Dec 16, 2002, 03:53 #5
- Join Date
- Mar 2001
- Location
- Philadelphia, US
- Posts
- 2,205
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Re: Re: The benefits of going tableless?
Originally posted by vgarcia
1. Pages load quicker. What do you think would load faster, this:
Code:<table border="0" cellpadding="0" cellspacing="0" width="500"> <tr> <td>First Cell</td> </tr> </table>
Code:<div class="layout"> First div </div>
-
Dec 16, 2002, 05:33 #6
Re: Re: The benefits of going tableless?
Originally posted by vgarcia
Benefits:
1. Pages load quicker. What do you think would load faster, this:
Code:<table border="0" cellpadding="0" cellspacing="0" width="500"> <tr> <td>First Cell</td> </tr> </table>
Code:<div class="layout"> First div </div>
Don't forget that the class info itself as well as the link to the css file (or the style tags) all add to the read/load time of a site.
Code:<style type="text/css"> @import url(styles.css); </style> + layout { border: 0; width: 500px; padding: 0; } + <div class="layout"> First div </div>
It's just unfortunate that the example you gave was being a bit economical with the truth.
Arguments in favour of css can win the day without resorting to innaccurate comparisons.Last edited by Bill Posters; Dec 16, 2002 at 05:42.
New Plastic Arts: Visual Communication | DesignateOnline
Mate went to NY and all he got me was this lousy signature
-
Dec 16, 2002, 05:57 #7
- Join Date
- Oct 2002
- Location
- Still Thulcandra
- Posts
- 997
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally posted by Ian Glass
top-left-corner the number reason seven why: and the top-right-corner this is most important hard to reason, is because you're not understand discombobulating bottom-left-corner the source bottom-right-corner. Comprenda? ;-)
Don't laugh at me if I'm wrong please...
-
Dec 16, 2002, 10:05 #8
- Join Date
- Nov 2001
- Location
- Atlanta, GA, USA
- Posts
- 5,011
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally posted by X Q mano
I'm afraid I didn't understand that one... Has it something to do with visually impaired users getting the information read out?
As far as viewers go, this might make viewing more difficult for visually impaired users but it will also make viewing of the source more diffcult for the coder.Using your unpaid time to add free content to SitePoint Pty Ltd's portfolio?
-
Dec 16, 2002, 11:52 #9
- Join Date
- Dec 2002
- Location
- Wichita, KS
- Posts
- 11
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
about #5
5. Easier for other devices to parse thru such as handhelds, screen readers for the blind, Internet appliances, cellphones, and other devices we have yet to think of.:: halo labs - internet junkies
:: bzzztboy.com - learning and discussion center :: sign-up here
:: knowledge is power and information is a commodity - less than zero
-
Dec 17, 2002, 02:47 #10
- Join Date
- Sep 1999
- Location
- Singapore
- Posts
- 854
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Re: Re: Re: The benefits of going tableless?
Originally posted by Bill Posters
Aww, come on. That's cheating.
Don't forget that the class info itself as well as the link to the css file (or the style tags) all add to the read/load time of a site.
Of course you need code to @import or link to the CSS files, but that is insignificant compared to all the presentational HTML cruft you can get rid of.
-
Dec 17, 2002, 03:12 #11
Re: Re: Re: Re: The benefits of going tableless?
Originally posted by duckie
If external CSS files are used, then the CSS only needs to be downloaded once for the entire site.
Of course you need code to @import or link to the CSS files, but that is insignificant compared to all the presentational HTML cruft you can get rid of.New Plastic Arts: Visual Communication | DesignateOnline
Mate went to NY and all he got me was this lousy signature
-
Dec 17, 2002, 03:21 #12
- Join Date
- Oct 2002
- Location
- Still Thulcandra
- Posts
- 997
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Of course... I understood that too. But we ARE talking real life here...
-
Dec 17, 2002, 03:34 #13
Then perhaps vgarcia should have used a little more real-life in the original sales-pitch.
If I take examples at face value it's because I feel that newcomers might also be inclined to do so (esp. in cases where css is still brand new to them). I just wanted to push someone to make it clearer when the benefits of css really kick in.
Anyway, it's all goodNew Plastic Arts: Visual Communication | DesignateOnline
Mate went to NY and all he got me was this lousy signature
-
Dec 17, 2002, 03:50 #14
- Join Date
- Sep 1999
- Location
- Singapore
- Posts
- 854
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally posted by Bill Posters
Then perhaps vgarcia should have used a little more real-life in the original sales-pitch.
If I take examples at face value it's because I feel that newcomers might also be inclined to do so (esp. in cases where css is still brand new to them). I just wanted to push someone to make it clearer when the benefits of css really kick in.
-
Dec 17, 2002, 03:55 #15
- Join Date
- Oct 2001
- Location
- Beyond yonder
- Posts
- 2,384
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally posted by X Q mano
I'm afraid I didn't understand that one...
Like Sam pointed out, tabled designs can be a bear to edit and wade through for the developer. However, as a viewer, when the browser linerizes the tables (meaning that the browser just ignores <table>, <tr>, etc.) for some reason (i.e. in text-browsers, screen-readers, pocket pcs, old browsers, etc.) you get a very disorderly page--and that just escalates with complexity. Of course, your viewers don't get the advantage of color-coding, either. ;-)
~~Ian
-
Dec 17, 2002, 04:13 #16
- Join Date
- Oct 2002
- Location
- Still Thulcandra
- Posts
- 997
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
But is it very common for browsers to ignore <table> tags... How many percent actually use devices that do?
Now I'm not saying that because they are few, they should be ignored... I'm just wondering...
-
Dec 17, 2002, 09:03 #17
- Join Date
- Aug 1999
- Location
- Lancaster, Ca. USA
- Posts
- 12,305
- Mentioned
- 1 Post(s)
- Tagged
- 0 Thread(s)
Originally posted by X Q mano
But is it very common for browsers to ignore <table> tags... How many percent actually use devices that do?
Now I'm not saying that because they are few, they should be ignored... I'm just wondering...
This doesn't just include screen readers but it also includes Netscape 4.XX which can't display a page properly if it uses tables, CSS and javascript. It also includes MSNTV (formerly WebTV) and AOLTV. Throw in Cell Phones and PDA's and you have a very sizeable audience.
It is estimated that by 2007, 1 Billion Cell Phones and PDA's will be connecting to the Internet in some form on a daily basis. The chances are they are going to be able to handle 800 X 600 fixed width table designs in the near future are between nil and zero. So if all you are really worried about it audience and marketshare then this is a sizable market to look at.
-
Dec 17, 2002, 11:13 #18
- Join Date
- Nov 2002
- Location
- Up the back of the bus
- Posts
- 47
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally posted by W. Luke
I would hazard a guess that 10-15% of all Internet users today have a problem with tables in one way or another.
This doesn't just include screen readers but it also includes Netscape 4.XX which can't display a page properly if it uses tables, CSS and javascript. It also includes MSNTV (formerly WebTV) and AOLTV. Throw in Cell Phones and PDA's and you have a very sizeable audience.
It is estimated that by 2007, 1 Billion Cell Phones and PDA's will be connecting to the Internet in some form on a daily basis. The chances are they are going to be able to handle 800 X 600 fixed width table designs in the near future are between nil and zero. So if all you are really worried about it audience and marketshare then this is a sizable market to look at.
NS 4.xx's display of CSS is problematic at best. I know there is a tableless (and hence CSS-based) design around that DOES work with NS 4.xx, but I've never seen a table not work with NS 4.xx either. Surely, where NS 4.xx will break will be with the additional CSS to make it look "oh so pretty, oh so pretty..."? That's something that's going to break in NS 4 irrespective of whether it's tables or tableless.
Personally, I've already consigned NS 4.xx to the glue factory of history (unless some pita/difficult client insists on living in the past).
NeilLast edited by Option1; Dec 17, 2002 at 11:19.
-
Dec 17, 2002, 11:17 #19
- Join Date
- Aug 1999
- Location
- Lancaster, Ca. USA
- Posts
- 12,305
- Mentioned
- 1 Post(s)
- Tagged
- 0 Thread(s)
Actually, Netscape 4.XX will show properly written CSS pages linearly since it doesn't recognize the DIV tag as will any other previous browser. The pages aren't the best designed things in the world but they are usable.
And I have seen thousands of tabled pages choke Netscape 4.XX. Any site with more than 3 nested tables is pushing it and the rendering times are unbelievable. It partially because of Netscape 4.XX's handling of tables that they abandoned the Netscape 5.0 project and started writing the Gecko engine which is now licensed under the Mozilla License.
I don't know why you would disregard a browser that still has more market share than any of its successors or any other browser on the market except for Internet Explorer.
http://www.w3schools.com/browsers/browsers_stats.asp
http://www.theregister.co.uk/content/6/28601.html
-
Dec 17, 2002, 11:26 #20
- Join Date
- Nov 2002
- Location
- Up the back of the bus
- Posts
- 47
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Hmmm, I'm not sure if you're saying I'm right or wrong.
I know that http://www.realworldstyle.com/nn4_3col_header.html works in NS 4, but then again so will a table. My point was that NS 4.xx will not display much of the other CSS enhancements such as when that design is used or when a table is used. For example, http://staging.noao.edu/newnso/nso_kp/nso-kp.html
My point still remains that it was a bit disingenuous to include NS 4.xx in your post because it displays tables just fine, it's the CSS it has trouble with.
Neil
-
Dec 17, 2002, 11:31 #21
- Join Date
- Nov 2002
- Location
- Up the back of the bus
- Posts
- 47
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Seeing we're both here at the same time, I won't edit my previous post, I'll just make a new one.
I missed the second half of your post above, but for me, I drew the line on NS 4 when it went to 2%. My choice.
I take your point about nested tables, but then again nesting numerous tables anytime isn't something I'd consider great design. I still think it'll work a lot better than with CSS.
Having said that, I'll make the same remark that Bill Posters made about an earlier attempt in this thread to push the benefits of tableless design, "Arguments in favour of css can win the day without resorting to innaccurate comparisons." To my mind, including NS 4.xx didn't help given the terrible reputation it has concerning CSS.
Neil
-
Dec 17, 2002, 11:45 #22
-
Dec 17, 2002, 12:07 #23
I apologize for starting the ongoing war in this thread. It was not my intention to "lie" about anything regarding going table-less. Perhaps I should have been a little clearer with my code example. My points to be made from that post were:
1. The style sheet need only be downloaded once for use throughout the site. All layout descriptions, etc. are in that one sheet ready for use by any other page in the domain. Thus you only have to do a <div class="layout"></div> to achieve your desired effect once you have gotten the stylesheet. Yes there is code to add to each page (an @import or <link> tag) but it is very small compared to the many table tags needed all over a table-based site.
2. Style sheets keep you from having to resort to <font> tags littered all over your tables. Currently, all of the sites I maintain at work are table-based so I see both sides of the argument. Depending on when the site was created there are some with font tags littered all over the place that make an otherwise quick-loading site move VERY slowly, and there are other sites using stylesheets to format text, etc. that load much quicker.
Again, I am sorry for all of the confusion. It was not my intention to give anyone a false impression of the benefits of CSS over tables, so please accept my apology.
--Vinnie
-
Dec 17, 2002, 13:27 #24
- Join Date
- Nov 2002
- Location
- Up the back of the bus
- Posts
- 47
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Vinnie, my reading of this thread isn't so much that you started a war, more that people are quibbling over the actual reasons.
Maybe I didn't make myself clear, but certainly I support tableless over tables and for the reasons you've stated so very well. I think some of us just want the reasons to be clear, accurate and beyond reproach. To my mind using that philosophy convinces more people to switch than using possibly spurious or suspect reasoning - not that I'm alleging anyone here has done that (he says, using both hands and a large piece of board to cover his butt).
Neil
-
Dec 17, 2002, 14:06 #25Originally posted by Option1
Vinnie, my reading of this thread isn't so much that you started a war, more that people are quibbling over the actual reasons.
Maybe I didn't make myself clear, but certainly I support tableless over tables and for the reasons you've stated so very well. I think some of us just want the reasons to be clear, accurate and beyond reproach. To my mind using that philosophy convinces more people to switch than using possibly spurious or suspect reasoning - not that I'm alleging anyone here has done that (he says, using both hands and a large piece of board to cover his butt).
Neil
--Vinnie
Bookmarks