Advantages of the "div" tag???

HTML, CSS and anything else that deals with client side capabilities.

Moderator: General Moderators

Post Reply
FrenchyMatt
Forum Newbie
Posts: 2
Joined: Wed Sep 17, 2008 1:52 am

Advantages of the "div" tag???

Post by FrenchyMatt »

Hi all!!!

I'm a (french) beginner in php and html programming and i've been told about the incredibles advantages of "div" tag, comparated to a <table>...
Can someone help me with to understand how to use those tags??
Thanks for any help!!!
alex.barylski
DevNet Evangelist
Posts: 6267
Joined: Tue Dec 21, 2004 5:00 pm
Location: Winnipeg

Re: Advantages of the "div" tag???

Post by alex.barylski »

div I blieve stands for division's

You use divisions to logically separate your layout and HTML instead of tables because "semantically" tables are not intended to be used to dictate the design or layout of your web site. They are intended for "data".

How to use DIV's exactly is a way to complex subject to disscuss in a forum thread. Start looking at examples of CSS/XHTML designs and tinkering with CSS.

Trivial Example:

This is a three level layout using tables...it's yucky hard to follow and semnatically doesn't make sense to search engines or screen readers, etc...

Code: Select all

<table width="100%">  <tr>    <td>Header Section</td>  </tr>  <tr>    <td>Body Section</td>  </tr>  <tr>    <td>Footer Section</td>  </tr></table>
This is the same layout using DIV's

Code: Select all

<div>  <div>    Header Section  </div>  <div>    Body Section  </div>  <div>    Footer Section  </div></div>
DIV's make the code more readable to a programmer and to machines like search engines, etc...

Plus CSS designs usually result in smaller bandwidth footprints and therefore download faster and render faster due to the recursive nature of nested tables...
FrenchyMatt
Forum Newbie
Posts: 2
Joined: Wed Sep 17, 2008 1:52 am

Re: Advantages of the "div" tag???

Post by FrenchyMatt »

OK ty very much for your (both) quick answers, that will give me meditation subject for next hours 8)

See you.
User avatar
JAB Creations
DevNet Resident
Posts: 2341
Joined: Thu Jan 13, 2005 6:44 pm
Location: Sarasota Florida
Contact:

Re: Advantages of the "div" tag???

Post by JAB Creations »

There is no such thing as a "tag" in (X)HTML, they are called elements. :roll:

Part of good SEO is minimizing syntax to content.

There are tons of other benefits. I recommend making sure your CSS validates as CSS1. Your basic column layouts will work just fine even in IE if you do this.
User avatar
Mds
Forum Contributor
Posts: 110
Joined: Tue Apr 22, 2008 8:56 pm
Contact:

Re: Advantages of the "div" tag???

Post by Mds »

FrenchyMatt wrote:Hi all!!!

I'm a (french) beginner in php and html programming and i've been told about the incredibles advantages of "div" tag, comparated to a <table>...
Can someone help me with to understand how to use those tags??
Thanks for any help!!!
Hi and Image
Well, IE6 has an issue with Table :
IE6 doesn't show content of a (Table base) website till it loads all element of it.
But in FF or Opera there isn't this issue .
Post Reply