How do tables affect a website?

Most amateur website designers use html tables when they’re creating a web page. In the late 1990s, when the dot-com boom led to a rapid growth in the ‘new media’ of web page creation and design, there began a trend of using HTML tables, and their rows, columns and table cells, to control the layout of whole web pages.

This was partly due to the limitations at the time of CSS support in major browsers, partly due to the new web designers’ lack of familiarity with CSS or with reasons (including HTML semantics and web accessibility) not to use any simple way quickly to achieve whatever layout they wanted, and partly due to a new breed of WYSIWYG web design tools such as Microsoft FrontPage, Adobe GoLive and Dreamweaver that encouraged this practice.

More recent times have seen an increasing understanding among web content professionals of the advantages of restricting the use of HTML tables to their intended and semantic purpose — i.e. laying out tabular data or other information. These advantages include improved accessibility of the information to a wider variety of users, using a wide variety of user agents.

There are bandwidth savings as large numbers of semantically meaningless , and tags are removed from dozens of pages leaving fewer, but more meaningful headings, paragraphs and lists. Layout instructions are transferred into site-wide CSS stylesheets, which can be downloaded once and cached for reuse while each visitor navigates the site. Sites become more maintainable as the whole site can be restyled or re-branded in a single pass merely by altering the mark-up of the specific CSS, affecting every page which relies on that stylesheet. New HTML content can be added in such a way that consistent layout rules are immediately applied to it by the existing CSS without any further effort.

There is still (as of 2009) some distance to go; some web developers have yet to remove the tables from their page layouts, while others are now afraid to introduce a simple HTML table even where it makes good sense, some erring by the overuse of span and div elements, perhaps even with table-like rules applied to them using CSS.

logo_inverse

is loading the page...