DIV vs TABLE

[Mantorok]

Hi all

I heard recently that using DIVs instead of Tables for laying out your page
was the way forward.

Can anyone give me a good reason why I should use DIVs, I think they're are
pain in the backside personally and can never really get my head around
them.

What are the advantages? Do I HAVE to use them? If so, why? How will it
affect any new sites I develop?

Thanks all
Kev

 

[Patrice]

Just pick what fits your needs. An advantage for DIVs is that it allows to
reorder columns when using a column layout.

Try for example :
http://www.csszengarden.com/

I admit it's likely overkill for us mere mortals...

 

[Kevin Spencer]

Tables are still quite acceptable for displaying layout elements that are in
a tabular layout format, and in fact can be better than divs with such
layout. However, divs are more flexible for the same reason - they do not
restrict the layout to tabular format. Instead, a div is like a "floating
box" that can beo positioned anywhere you want. Patrice's linke to
csszengarden.com is the best example I know of regarding the power of divs
for layout. Every page is the same content with a different style sheet
applied.

This means that you can change the look of your web pages without touching
any of the content.

--
HTH,

Kevin Spencer
Microsoft MVP
Professional Numbskull

Hard work is a medication for which
there is no placebo.

 

[Mantorok]

Ok thanks.

I find divs a nightmare though - is there actually any good guides/help on
how to use them?

If I was to produce a site without using DIVs - will it bite me on the arse
later on in life?

Thanks
Kev

 

[Mantorok]

I think this famous site makes it clear. If you are more a designer than a
programmer, go for divs with css. If you are more a programmer, stick with
the tables and leave the divs for the designers.

That sounds good to me

As long as by using tables I won't be giving myself enough rope......then I
don't mind.

Kev

 

[Patrice]

Do you mind changing the HTML code in case you would update your design or
would you like to have third party (or yourself) to be able to change the
layout using only a CSS stylesheet (themes).

If yes, using DIVs and CSS will give more flexibility but is likely a bit
logner to implement depneidng on what exactly you are trying to do, else you
can keep using tables...

 

[Darrel]

I find divs a nightmare though - is there actually any good guides/help on

how to use them?

They're only a nightmare if you have to deal with IE.

Actually, DIVs/CSS aren't THAT difficult...it's just that we've all 'grown
up' using Tables, so it's different.

If I was to produce a site without using DIVs - will it bite me on the
arse later on in life?

I doubt it.

But, the sooner you learn and deal with them, the more confident you'll be
when you make decisions as to which one to use.

-Darrel

 

[Eliyahu Goldin]

I think this famous site makes it clear. If you are more a designer than a
programmer, go for divs with css. If you are more a programmer, stick with
the tables and leave the divs for the designers.

Eliyahu

 

[Erik Funkenbusch]

Hi all

I heard recently that using DIVs instead of Tables for laying out your page
was the way forward.

Yes and no.

Can anyone give me a good reason why I should use DIVs, I think they're are
pain in the backside personally and can never really get my head around
them.

What are the advantages? Do I HAVE to use them? If so, why? How will it
affect any new sites I develop?

No, you don't HAVE to do much of anything. However, good web design
specifies seperating content from presentation. That is, seperating the
actual text of your site from it's layout and style.

Tables have many problems, including being more difficult for those with
disabilities to read, as well as making it more difficult for search
engines to find relevant information.

div/css based sites tend to get better page ranks in google and other
crawlers because the site is "semantically" relevant. That is, you've
tagged parts of your page with bits of information that defines its
importance, such as using h1/h2/h3 tags, etc...

Nothing is preventing you from designing sites as you always have, and 95%
of your audience will probably never care. But if you want to be
accessible to those with disabilities (a requirement for government and
educational sites, and a growing requirement for corporations - see the
Target Companies lawsuit), then semantic design is the way to go.

Another benefit is that div/css based sites tend to use a lot less
bandwidth, which can save you real money if you pay per megabyte for your
hosting.

 

[Kevin Spencer]

The only thing you'll do is make it harder to change the layout in the
future.

--
HTH,

Kevin Spencer
Microsoft MVP
Professional Numbskull

Hard work is a medication for which
there is no placebo.

 

[Guest]

Hello Kev,

My personal favorite book on the subject is JavaScript + Css + DOM Magic by
Makiko Itoh. The book's layout is ... unique. It doesn't have the typical
programming book layout. My guess is that it is more aimed at designers.
ymmv. You can find it on amazon.

 

[razzledazzle]

Hi all

I heard recently that using DIVs instead of Tables for laying out your page
was the way forward.

Can anyone give me a good reason why I should use DIVs, I think they're are
pain in the backside personally and can never really get my head around
them.

1. Long page with DIV tags rendered much faster then TABLE.
If you can use fixed-layout table rendering speed the same.
2. Use DIV if you have big amount of data. And layout depends from
browser screen resolution (width in percent).
If you display small data amount it's usually no difference, but
TABLES preferred way for displaying regular data structure.