Forum Moderators: open
Used to let FrontPage build my pages for me with TABLEs, but when I learned how to write HTML myself, DIVs seemed the natural way to go.
1. Page size
2. Management of layout for entire site in one CSS file
3. Placement of content within page source-code (SEO)
I still use tables for tabular data display.
There are some layout types which are simply not possible using DIV's in which case you should just use tables and not worry about it too much. All else being equal, and if it's possible to do a particular layout with DIV's, you should use DIV's.
TJ
<div> and <table> are different, and have different appropriate uses.
Matt
I usually try to get it done with divs first, then tables if I'm spending way too much time getting it to sit right.
Charley
Been coding in wordpad for 3 years now, and love it!
I am new to web design, I love using div's, the only problem I have with them is when the text size on the monitor is changed, it will skew everything on the page. I under that there is a way to control this with CSS, but I haven't figured it out yet.
Been coding in wordpad for 3 years now, and love it!
Don't forget to read the comments for every article.
Here's my opinion: I stick with tables.
Why?
- It is easier than CSS-P.
Some pro-CSS will say this is not true.. Well, try it for yourself and see. Be sure to test your code on, at least, Firefox, Opera and IE.
- It is easier to achieve cross-browser compatibility using tables. Do a search for "css hacks".
- In my opinion it is NOT true that changing the design of a CSS-P based website is way faster than a table based one. Anyway, I don't change my design every week and I don't care if it takes me 6 more hours because it's table based.
But, the main reason:
- It you are not a web programmer yourself, you really don't care if a website you visite is CSS-P based or table based. In fact, you won't even know what is a "table".
So I stick with the easier and most cross-browser solution.
Just something to consider. Sort of the opposite of the "I use tables because it works in every browser" argument.
Regards.
Another reason to avoid using tables for layout is that they can be less accessible to people with disabilities.
I'd like to know more about that.
Are you talking about font resizing? Like using em instead of px?
What else?
Providing a RSS feed?
Let the user use its own stylesheet easily?
I fail to see why you couln't do that with a table layout.
If you'd like to learn more about accessibility, here are some useful links:
[section508.gov...]
[w3.org...]
[access-board.gov...]
Those sites will probably explain it much better than I could.
I remember having this conversation along time ago on this very forum, I thought standards would have been a bit more widespread by now.
I haven't created a table based layout in almost 5 years, so i'm still unsure as to why there are those who still use them. A lot of people still seem to use tables because they can't grasp or don't understand how to do the equivalent effect with divs and css, or they don't understand the (good) side effects of using divs and css.
I'm very big on semantics and accessibility, so justifiying the use of a table based layout to me is nonsensical.
Also, "div" and "table" are not synonymous. I don't believe you can use one in place of the other. Tables are for tabular data and divs help with layout.
It you are not a web programmer yourself, you really don't care if a website you visite is CSS-P based or table based. In fact, you won't even know what is a "table".
If that is your main reason, then you should probably stop using tables for layout now. 1) That's a ridiculous concept 2) Of course they care and 3) Tell all the people who use screenreaders that.
The problematic thing is that some style properties can be used to alter the way blocks of <div> interact with each other (think of position, width, height, float, clear etc) but these styles can also be assigned to tables or other HTML elements. The <div> is not special in that way. Actually <div> is one of the dumbest HTML tag because it has no other effect than grouping content in a block with an optional style.
People with religious believe in the "styles only approach" have in my vision turned the world around and used the harmless and not so functional <div> to fill it with style attributes even for purposes where the HTML spec provided a specialized alternative with <table>.
My approach: I use tables wherever appropriate for layouts because it was where they were defined for in the first place. They have the widest browser acceptance and least problems with cross-browser compatibility. Most of the styling within my tables is done with CSS. Divs are only used when I find it useful to mark a block of text with specific styles, which in practice means almost never.
"Tables should not be used purely as a means to layout document content as this may present problems when rendering to non-visual media. Additionally, when used with graphics, these tables may force users to scroll horizontally to view a table designed on a system with a larger display. To minimize these problems, authors should use style sheets to control layout rather than tables."
Also, in 1999 semantics didn't mean as much as they do and of course the web was still young. It's been 7 years and things have changed, we now understand things better.
To say that "tables are meant to be used for layout" and "they're better supported" shows an incredible lack of knowledge of the web and why tables were used during that period of time. If CSS hadn't been put off for as long as it had after HTML came out, we wouldn't be having this conversation right now. I'm still shocked that i'm having to have this conversation in 2006.
I can have my web pages look decent in different browsers until a user changes the default text size in their browser, then the divs will sometimes overlap. I am still in a web design class where I was told to use tables to stop this problem, which it does......but I have read somewhere that this problem can be controlled in CSS.
You shouldn't prevent the user from resizing text.
---------------------------------------------------
Another point is that you really shouldn't use "div" for everything. You can easily style up normal elements the way you would style up a div, and it's preferable to do that if and where possible.
Also, in 1999 semantics didn't mean as much as they do and of course the web was still young. It's been 7 years and things have changed, we now understand things better.
And browsers still have lots of issues.
It sounds like you're trying to make people feel bad about using tables by always saying "we're not in 1999 anymore". Well if today, April 2006, div-css was working well in every browser without so many hacks, we wouldn't have this discussion.
I'm not a table freak, I only want to use something that work.. Practically, not just on paper.
<div> is a container to group a piece of content without relation to other content. In my opinion it has been misused by people and advocated as the only proper carrier of CSS styles. Look at the auto generated content from CMS software like Mambo and you know what I mean. Almost every word and html element has been embedded in a seperate <div> in order to make it possible to assign styles to it. Use of CSS can go much broader than only with divs and when designing a site you shouldn't have too narrow focus on the "styles with div" approach only.
Also, using divs instead of tables does not automatically increase the usability of a site for people with disabilities. The order of elements, links within the document to jump to the start of the content and the use of media types in styles are what helps people with disabilities.
To be honest, I haven't used the media types aural, braille and embossed in the styles of my table based sites yet, but I have used media="print" on the style of table columns to alter the appearance of interactive parts like menus and ads from hardcopies and I intend to use the same technique for textreaders.
My point is, that tables are not bad for layout per se, and that you can assign CSS in the same way to it as to divs, getting comparable results only with less CSS hacks needed to prevent all kinds of weird problems in cross-browser compatibilty.
You also highlighted I point I had already made, that div has in fact been overused. Which is why I said to use it "as and when appropriate". Obviously it's possible to do this:
<h2 class="title">Blah</h2>
where others would do this:
<div class="title"><h2>Blah</h2></div>
It just depends on the effect you want.
I am also aware that you can style a table with css, just as you can with any element. The whole issue is semantics, and that CSS in conjunction with semantic mark up is generally favoured instead of considering everything a "cell" and caging layout elements.
I absolutely love using tables for what they're designed for: tabular data.
There is plenty support for CSS and semantic markup these days, I really don't understand the issue. If I can code numerous complex corporate websites with standards based markup, I don't see why others can't.
Trust me, i'm not blaming anyone for the slowness of the W3C or UA designers to implement all the necessary features. I just find it slightly weird that the same question is being asked 6 years on.
I would not use a div to code a table, so why would I use a table to section content.
In my situation the number of people making printouts of pages is much higher than the number of people using screen-readers. Tables give me better control of layout in those cases because the basic structure of the page remains, even with weird paper sizes. Remember that paper-sizes in Europe are smaller than in the US for example. Printouts of many other websites are really ugly, basically because web designers use fixed width in their CSS to keep their <div> blocks well arranged in browsers.
When you are designing a governmental website, access to disabled users is of mucher high priority where the use of <div> can be beneficial. It depends on the type of visitors and the way your site is used.
I have to code up annual reports for corporate websites as well, and one of the main requirements is that they are able to print out a nice version of the information on the site, without all the extra layout elements (and without it looking messed up). I can't really say i've had any problems, and as I said before I use semantic markup with CSS. Tables only for tabular data.
It wouldn't make sense to feed all the fixed width stuff on your page to a printer, so i'm not sure what you mean by that. All the users needs is the info and some of the formatting, which is fairly easy to deal with in css using the media attribute.
So what is better? A website with tables, but forgivable with layout changes in situations like printing, or websites coded according to "the latest standards and insights" but really horrible on paper?
Both site types render well in browsers with the table driven sites having slightly better backward compatibility.
I know, your answer will probably be that if webmasters implement their CSS properly there is no problem at all--and you are right--but we are facing a real world where many webmasters do not do that all the time, and many don't even know how to do it properly. When it looks good at their own computer in IE6 with 1024x768 screensize, the website is finished.
We live in a world where webmasters have a learning curve to follow and not all webmasters have the will, need or knowledge to get to the end of the learning curve. This is the world where table layout designs are more forgivable in case of layout anomalities than CSS ones.
charley713:
I love using div's, ... when the text size on the monitor is changed, it will skew everything on the page. ... there is a way to control this with CSS, but I haven't figured it out yet.
Have a look at the CSS on my site. The file includes comments and links for this very topic. And yes, it is possible, in a way that works well IMHO.
PS
FWIW, this site uses 1999 techniques (<table>s). I do not hear any complaints.
It's a shame that there isn't a decent page creator application out there that people can use to have their websites generated for them.
When it looks good at their own computer in IE6 with 1024x768 screensize, the website is finished.
That's the kind of "web developer" that I dislike, and trust me i'm well aware that there are lots of them.
FWIW, this site uses 1999 techniques (<table>s). I do not hear any complaints.
I have quite a number of complaints, but I doubt it will ever change. For now, i'm happy to educate people about web development, if I have to do it like this then fair enough. It doesn't mean I agree with the code behind it, or necessarily like the system.
Besides, there is a huge need for an accessible forum at the moment and much debate over whether a forum is mostly tabular data or not.
