Please refer to this page:
http://w3schools.com/html/html_layout.asp
We often get people who are new at web developing on the forum, and often they are using tables to lay out their site. We keep on having to tell users that tables are not good. But the tutorials on the site of our own forum tell them how to use tables for layout, I believe these techniques shouldn't even be taught.
If a user is trying to defend their use of tables they'll be pointing to the W3schools tutorial and it may be harder to show reason to them.
Full Version: Encouraging Bad Web Development Techniques
Regardless of people's opinion on tables, the tutorial is correct when it says that tables are easy to set up. They're easy, they make sense, and they display the same across browsers. For a user starting out, that might be what they're looking for.
Regardless, if you want to write up a tutorial on using divs and CSS for layout with some examples, go ahead and submit it to the authors. I'm sure they wouldn't mind having something like that online, it's just a matter of getting the time to put it together.
Regardless, if you want to write up a tutorial on using divs and CSS for layout with some examples, go ahead and submit it to the authors. I'm sure they wouldn't mind having something like that online, it's just a matter of getting the time to put it together.
I have to side with Ingolme on this one. Bad habits are easier to avoid than to break. And the 2-column example used at that link is just as easy to set up with divs and css.
To verify this, I changed the table to two divs, added a head element (which is required in any case), a style element, and one CSS definition (for the divs), and still pulled it off with only one additional line of code. There's is nothing here a nobie can't pick up.
To verify this, I changed the table to two divs, added a head element (which is required in any case), a style element, and one CSS definition (for the divs), and still pulled it off with only one additional line of code. There's is nothing here a nobie can't pick up.
CODE
<html>
<head>
<style type='text/css'>
div.column {float:left; width:50%}
</style>
</head>
<body>
<div class="column">
This is some text. This is some text. This is some text. This is some text. This is some text.
</div>
<div class="column">
Another text. Another text. Another text. Another text. Another text. Another text. Another text.
</div>
</body>
</html>
<head>
<style type='text/css'>
div.column {float:left; width:50%}
</style>
</head>
<body>
<div class="column">
This is some text. This is some text. This is some text. This is some text. This is some text.
</div>
<div class="column">
Another text. Another text. Another text. Another text. Another text. Another text. Another text.
</div>
</body>
</html>
Well yeah, a 2-column layout is pretty easy to pull off.
What if you wanted both of those columns to always be the same height?
What if you wanted 3 columns?
What if you wanted a header that stretches, then 3 columns, then a footer that stretches, where all 3 columns are always the same height?
That's easy to pull off with a table, I can even think of the structure in my head without needing to write it out or test it, it's much more difficult with divs.
I'm not trying to argue against divs, I'm just saying that tables are easy to learn and understand. That's probably why they have those in the tutorial. I'll also point out that the entire w3schools site is laid out with tables (and always has been). Your example is easy for us to understand when we look at it, but is someone who is trying to learn basic HTML going to understand the significance of float:left, or the relationship of a div with a certain class to the CSS selector?
I agree that divs and CSS are a better method to use conceptually, but it's much more difficult to write a tutorial about those that can be understood well by a beginner.
What if you wanted both of those columns to always be the same height?
What if you wanted 3 columns?
What if you wanted a header that stretches, then 3 columns, then a footer that stretches, where all 3 columns are always the same height?
That's easy to pull off with a table, I can even think of the structure in my head without needing to write it out or test it, it's much more difficult with divs.
I'm not trying to argue against divs, I'm just saying that tables are easy to learn and understand. That's probably why they have those in the tutorial. I'll also point out that the entire w3schools site is laid out with tables (and always has been). Your example is easy for us to understand when we look at it, but is someone who is trying to learn basic HTML going to understand the significance of float:left, or the relationship of a div with a certain class to the CSS selector?
I agree that divs and CSS are a better method to use conceptually, but it's much more difficult to write a tutorial about those that can be understood well by a beginner.
Well, maybe the site could offer a taste of both ways, with a brief discussion of the merits and challenges of each.
You yourself argued this week that a little more completeness would be a good thing. Not too much to ask from THE LARGEST WEB DEVELOPER SITE ON THE NET ?
You yourself argued this week that a little more completeness would be a good thing. Not too much to ask from THE LARGEST WEB DEVELOPER SITE ON THE NET ?
Yeah, you wouldn't think it would be too difficult to find the time to keep everything updated.
It worked for the banking industry.
Well, I know tables are easy. My only concern is that people keep on using techniques from 10 years ago, and the only way to prevent it is to stop teaching them to people.
They could put this example on the HTML Layout page: http://w3schools.com/css/tryit.asp?filename=trycss_float6
They could put this example on the HTML Layout page: http://w3schools.com/css/tryit.asp?filename=trycss_float6
QUOTE (Ingolme @ Feb 27 2009, 08:52 AM) 
Well, I know tables are easy. My only concern is that people keep on using techniques from 10 years ago, and the only way to prevent it is to stop teaching them to people.
They could put this example on the HTML Layout page: http://w3schools.com/css/tryit.asp?filename=trycss_float6
They could put this example on the HTML Layout page: http://w3schools.com/css/tryit.asp?filename=trycss_float6
Table are good and vital for web pages. Too bad they are used for the wrong purpose so often. And used incorrectly at that - they never seem to have accessibility tags included.
What I would do is stress the purpose of tables in the tutorial and quick link to the alternative and better use of positional placement.
Of course, if I were in charge, I'd have more moderation here. I run a forum where I always have 3-4 active people daily and another 3-4 who come in on a less frequent basis. I see a lot of you are here anyway, they should "promote" a couple of regulars who have demonstrated enough level headedness to help out.
QUOTE
My only concern is that people keep on using techniques from 10 years ago, and the only way to prevent it is to stop teaching them to people.
I understand that, but tables aren't breaking the internet. I would much rather people use tables than create another POS that only works in IE, you know?
QUOTE
They could put this example on the HTML Layout page
That's a good example. Quite frankly, they could use an entire section devoted strictly to laying out a site and all about how to structure things, with several examples of different layouts. A basic page layout is such an essential part of a site that it really deserves an entire section instead of a single page.
QUOTE
What I would do is stress the purpose of tables in the tutorial and quick link to the alternative and better use of positional placement.
I agree.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.