Next | Main Index | Previous
Table vs. Divs for Web Page Layout
The options that Web designers have to set up layout for a Web page are somewhat limited. For long time the only option for Web designers was the Table tag and for many Web designers that is the primary tag to make pixel perfect layout. The Div tag is newer and is more suited to set up layout on a Web page than the Table tag, but it is trickier and requires more thinking and pixel calculating.
A common view is to use the Table and associated tags for tabular data and to use Div for everything else. This use, for example, makes it easier for Web users with accessibility limitations to read and interpret content.
The new Html standard, Html 5, has additional options for Web designers to describe layout and content and differentiate between data and text, but until the new standard becomes a mainstream, Web designers have to live with Tables and Divs.
The data below shows comparison on the usage of the Table tag and Div obtained from two large samples: general and Web sites having favorable search engine positions.
| Table and Div: General Web Sites | |||||||
|---|---|---|---|---|---|---|---|
| Observed Element | % Found | Average | Min | Max | Median | 80 Percentile Range | |
| table | 67.30 | 14.30 | 1.00 | 301.00 | 33.67 | 1.33 - 38.97 | |
| td | 67.16 | 65.79 | 1.00 | 1,263.00 | 279.83 | 4.52 - 156.83 | |
| tr | 67.30 | 36.12 | 1.00 | 557.00 | 103.67 | 2.20 - 89.15 | |
| thead | 1.29 | 1.17 | .00 | 4.00 | 1.17 | .83 - 1.50 | |
| tfoot | .83 | 1.17 | .00 | 4.00 | 1.17 | 1.17 - 1.17 | |
| tbody | 12.01 | 4.47 | 1.00 | 76.00 | 2.83 | 1.00 - 11.83 | |
| div | 93.88 | 65.17 | 1.00 | 870.00 | 58.50 | 13.03 - 144.52 | |
| Table and Div: Web Sites in Favorable SE Positions | |||||||
|---|---|---|---|---|---|---|---|
| Observed Element | % Found | Average | Min | Max | Median | 80 Percentile Range | |
| table | 79.90 | 12.82 | 1.00 | 211.00 | 14.71 | 1.54 - 28.41 | |
| td | 80.16 | 57.60 | 1.00 | 828.00 | 57.29 | 5.54 - 131.26 | |
| tr | 80.04 | 32.02 | 1.00 | 331.00 | 36.00 | 3.14 - 75.84 | |
| thead | 1.36 | 1.18 | .00 | 4.00 | 1.00 | 1.00 - 1.57 | |
| tfoot | .14 | .14 | .00 | 1.00 | .14 | .14 - .14 | |
| tbody | 14.72 | 4.10 | 1.00 | 48.00 | 6.43 | 1.00 - 10.66 | |
| div | 89.74 | 50.17 | 1.00 | 847.00 | 46.43 | 2.59 - 130.49 | |
The data shows that the Div tag is much more frequent than the Table tag and probably most Web sites use both tags. What is interesting with these results is very few Web sites use the option of describing the Table structure by using Thead and Tfoot tags while slightly more use the Tbody tag.
Related links:
Filed under: Html Tag Analysis , User Interface Design
Posted by: Webmaster on : August 2009
Ad2GO Today
- Content and Link Analysis
- General Observations and Views
- Html Tag Analysis
- Instant Search
- Internet Marketing Perspectives
- Meta Tags
- Optimizing Web Sites
- Preparing Web Sites
- Publishing Web Sites
- Search Engine Marketing
- Smartphone Development
- Social Media Marketing
- User Interface Design
- Trends and Sentiment