I am an novice web developer. I usually use multiple hierarchical tables to get the design I want. I have been looking over a lot of web 2.0 websites and most of them seem to use the div / float combination.
Which is a better practice to use? Also since I'm well versed with the table approach, what advantages does the div/float approach give?
As the HTML standard says, tables should only be used for their designed aim: beeing tables. Instead of using tables for layouting, css provides huge functionality to position and layout html entites. The huge advantage is (or should be) that the single exchange of a stylesheet result in a comnplete other design (most table layouts must be restructured from scratch to provide a new design). Thus the use of css should result in more flexibility.
One realy good start into this task should be the zengarden, displaying very much css designs based on one html page.
This is a great debate and requires a couple of points that seem to get lost in the wishwash of the internet.
Before when the internet was new and browsers chugged through html like a drunk chick at a kegger people thought it was a good idea to use tables for design... I mean why not it places your elements in a table.
Well then CSS came along with a cup of coffee and a cold shower and told those browsers to slow down. CSS denotes all the style of a page. This allows your DOM to be separate for styling and your layout to be dynamic. I don't really need to go into all the reasons CSS is a good thing but as for tables it was really important.
If you like a browser treat HTML as a mark up then the markup should actually denote it's content. Having a bunch of images in a table isn't a table at all its just a lazy way to show a buch of images.
With CSS you can now use a table for good things like DataSheets, User Lists, and anything else you would see yourself putting into and Excel Spread sheet. This way all the styling can be done in your stylesheet.
It's not that that tables are bad, now they can be used for what they intended for... tables.
CSS also offers the display: table there is a lot of debate around it but I personally think this is the way to go if you want to style like a table and don't feel like floats. It allows for you to Style like a table in your Style Sheet so you are not actually using a table element.
Here is a good article about this issue
http://www.smashingmagazine.com/2009/04/08/from-table-hell-to-div-hell/
btw, this issue has been discussed so many times in so many topics :-<
Divs have the advantage of being more flexible. You have greater control and they are easier to update or modify.
When you create the whole layout with tables, and let's you need to use 2 columns, if you later decide to add a third column, you wi have to make very radical changes to make it happen.
Css on the other hand is powerful enough to be 1: a complete language to define the layout of your page. 2: it doesn't clutter your html, you can have 1 person design the html and another to do the css.
check out css tricks and you will never use tables again... unless for a table.
ps: You can create 2 completely different layout from 1 html and 2 different css.
Using div you can change all the design only changing your css.
You can give to the browser the most important content first. It doesn't matter where you are going to show it in the browser, so the robots (google) can see what is most important in your content.
Tables are thought to represent tabular data, not to format pages.
The css can make your web accesible to blind people navigators.
