Search Engine Optimization and CSS - Tables and Positioning
(Page 4 of 6 )
4. Tables Cause Problems
When a search engine spider scans a webpage with tables, it sees a lot of <tr> and <td> tags, as well as cell sizes, row widths, border colors and other information that is purely irrelevant to your spiderable content. Most spiders strip out these tags or simply ignore them, but it takes longer to get to the actual content, forcing the search engine spider to sort through the code.
It takes longer for a browser to parse a document filled with tables, also. Browsers operate in an “inside out” fashion. When HTML is rendered in a web browser, it has to find the inner-most table and work outwards. If there are many nested tables, parsing the page, then rendering it to the visitor could take a long time.
Nested tables are especially heinous to accessibility readers, and it is in these cases where content does not follow the code flow of the document, and could make absolutely no sense when being read by accessibility tools.
From a search engine standpoint, having to wade through all the code that comprises tables before it gets to the real content, reduces the page’s ability of being matched with search engine queries, or even indexed. This adversely affects the site’s probability of ranking well during the course of a search engine query.
5. Code Positioning
With CSS, your important content can easily be placed at the top of the HTML code, right under the <body> tag, if the CSS is done correctly. In a web page that uses tables, content is shown in the order the tables are shown, and always below a bunch of meaningless tags to a search engine spider. If you have many cells, rows or columns, your important content may end up way down in the bottom of the HTML code, while unimportant items, like navigation menus and banners could end up at the top of the page.
With CSS, you can format your divisions in such a way that it doesn’t matter where in the XHTML code the divisions are listed. The content will still display in the same way. Therefore, you can move the items such as navigation, banners, and even images, to the bottom of your code without losing your visual styling.
An <h1> tag placed directly after the <body> tag will be weighted heavily by many search engines, especially if it contains one or two of your keywords. So like we showed in the example above, instead of the just altering your font tags to show large text so that it looks like a headline, the second example would be far more search engine friendly.
You can also place images in your CSS as division backgrounds to free up page size, as well as eliminate the need for image tags in your HTML.
Next: Easy Updates and Resource Management >>
More Search Optimization Articles
More By Jennifer Sullivan Cassidy
|
| · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | · | | | | |
|
/ 23 
