Why CSS is better than HTML tables?

Ever since the growth of the world wide web, professionals of the industry have sought ways on how to make their websites visually appealing and to increase the efficiency and effectiveness. Style sheet languages such as CSS have perfected this need and became the universal language for designers and developers alike.
So what are the reasons why CSS is much more useful than the tables in the HTML?
Several advantages has been cited on the use of CSS in web design. Let’s have a quick analysis on some of them.

1) Faster loading of the webpages.

Loading time for tabular structures is much greater than css based templates. This is usually caused by using too much markup tags in one HTML file such as "td align", "td width", "bgcolor", "width", "height", "br", etc along with the content of the HTML. CSS separates the content of the web page which is text and images into the HTML file and the visual presentation such as the web design, positioning, and text sizes into a CSS file. In a CSS-based layout, table tags or markups are replaced by using its own language such as "div".

Using tables make your page bulky with presentational data scattered here and there. Every time your visitor has to view a new page, he/she has to download the data for your page afresh.

Less code means faster download times.

2) Efficient and easy redesign, and consistency

CSS is much easy to use when you have to redesign your webpage. As the CSS file separates the content from layout, redesign is much quicker, easier and efficient. Suppose you have to change the design of a table-designed website, what you will have to do is rebuild all your pages again. But with a css powered design, you will only need to modify your style sheet and the job is done.

3) SEO friendliness

CSS based layouts are more search engine friendly than table-based ones. This is because the pages loads faster and having very less mark up tags will make the search engines to crawl through the website content very easily.

4) Accessibility

A website should be accessible to anyone and everyone. Tabular structures reduce accessibility for viewers with disabilities even if the designs may look fine on screen.

You must take into account that your website is not viewed only on computers, but also on mobile phones and PDAs. These devices will have a very easy to use website if you use a well written CSS. As a result of the separation of design (CSS) and structure (HTML), it is also possible to provide different layouts for different devices, e.g. handhelds, mobile phones, etc.

5) Usability

By combining CSS with the functionality of a Content Management System, a considerable amount of flexibility can be programmed into content submission forms. This allows a contributor, who may not be familiar or able to understand or edit CSS or HTML code to select the layout of an article or other page they are submitting on-the-fly, in the same form.

6) Maintainability

By use of CSS, virtually all of the layout information resides in one place. Because the layout information is centralized, these changes can be made quickly and globally by default.

7) Sophisticated Layouts and Designs

SS offers absolute positioning of elements paired with the z-index property allows CSS-based designs to position elements on top of one another, allowing for more unique, complex, and beautiful layouts.

8) Bandwidth Efficiency

CSS file is downloaded just once by your visitor's browser and re-used for different pages on a web site. This optimizes your websites download for your visitor and also the bandwidth used.