As many readers might be aware, the Web was created by a physicist. Tim Berners-Lee had a vision that the technology could be used as a highly efficient means of distributing and sharing research documents. So tables are an extension of that original idea: They were added to the growing language of HTML as a means to share data with other researchers and scientists.
At the time, CSS hadn't emerged, so there was no technology available to specifically address the way pages were laid out. Because tables create a grid, it quickly became convention to use tables as a means of displaying content rather than dataa de facto layout tool because nothing better existed.
To this day, tables remain the primary means of laying out web documents visually. But this approach is fraught with problems. Table-based layouts take longer to load and are often extremely detailed, making them difficult to manage effectively. Tables for layout do not follow the structural premise so important for search engine rankings, so using them can inhibit the capability to improve ranking. Finally, and perhaps most importantly, table layouts create numerous barriers to accessibility.
The use of tables for layout is the biggest hack in HTML history because it forces elements and attributes created for one specific thing: the display of tabular data, to be used for something entirely different. There is no doubt that table layouts changed the face of the Web, but now that we have CSS, there's no reason to use tables for most layouts anymore. Instead, tables are once again being looked upon in their true light: as a means of displaying data.
An approach known as transitional design incorporates the use of lightly crafted tables along with CSS to achieve layouts that are compatible in older browsers. This technique is an excellent approach if you have concerns about supporting browsers other than contemporary ones. However, the ideal is to avoid tables altogether, except for the purpose for which they were intended.