I have been doing extensive research on the net regarding people’s opinions on building websites using CSS div based format over HTML table-based format and have found that there is a lot more improvement in terms of page size, load time and search engine positioning after switching to CSS div based format.
CSS is syntactic, it’s fast and lightweight. Compared to HTML, developing a site in CSS tableless format is more systematic. The clarity of the code in CSS makes you feel much in control whereas in HTML table-based format we just go on pumping the tables into the design leading to more complex and cluttered HTML code. CSS is more of an efficient way to code, as the style sheet is loaded once and cached, versus loading the table code with every page.
It depends on how complicated website design is I would recommend CSS over HTML. In CSS the basic principle is to use div tags as containers to hold different elements instead of table cells. Assigning an id or class to those div allows you to add styles and to position them using an external style sheet instead of over and over again in each Ltd. Many times instead of going for 100 percent CSS table fewer development people use partial CSS div based and partial HTML table-based procedure. E.g. They use a table for holding things in place and assign ids or classes to the TDS for styling, which is still better than a purely table based design with inline styles.
As far as code goes, we all know now that CSS generates less code and it is search engine friendly but it has certain limitations and problems, often it is because of browser incompatibility. I’ve seen lots of website layouts done with CSS, where the content breaks the layout and boxes overlap each other, making certain parts of the content unreadable. Such things are easily manageable using tables whereas CSS would require multiple “hacks” to produce the desired outcome.
Redesigning a CSS div based site is much easier and less time consuming than the HTML table-based site. This is because CSS designs have separate files for content and visual data including web page structure whereas table-based designs mix layout information with content in the same file. Table based HTML sites heavily rely on spacers (transparent gifs) to control blank spaces within the sites, whereas this can be easily achieved using margins and padding in CSS layout.
Although CSS based design appears to be simpler, neat and tidy you need to spend a significant amount of time learning the rules of the CSS. This comes through practice only. If you want to make pure CSS div based designs, be prepared to invest time in learning. No matter how seasoned developer or designer you are, be prepared to hunt down the bugs relentlessly for endless hours.
Web developers must consider their client’s preferences before finalizing the format. If the client is more concerned about standards and wants to be sure not to use any deprecated strings in their webpage then CSS div based design is the best option.
Finally, we can say let the war continues between CSS div based and HTML table-based design to our benefit. In the meantime, designers and developers can add more knowledge and practice with both tables and CSS and become more versatile to handle any situation.