Summary: Whilst Google doesn’t say it has a preference for either sites created using tables or CSS, Google’s other guidelines make CSS the obvious choice.
Tables or CSS – how should you design your website? It always amazes the Angel team when a client sends us a website that’s been built for them recently, and the designer’s used tables. But are tables really all that evil?
First things first, you can build just about any site to look exactly the same using tables or CSS. Secondly, Google doesn’t really care. On the whole (caveat below!) Google’s spiders can read your page, whether you make it in tables or CSS.
So why would you pick one or the other? The reasons for using CSS over tables can be better understood if you delve into the benefits of CSS.
CSS enables you to separate the document content from its presentation, such as colours, fonts and layout. The benefits of this separation are:
- Your content is more accessible (for example, to visually impaired people)
- You have more control and flexibility over presentation
- You can share the formatting you’ve specified in your style sheet over the whole website
- Complexity is reduced, as is repetition
- Your code is more maintainable
- There’s usually less code and therefore your pages load faster
The biggest benefit is perhaps that you can change the look of the site simply by changing a single file – your style sheet – without touching a single page. Further, CSS allows the same page of content to be presented in different styles, so you can have your page, a printable version, a vocal version (i.e. read out by a screen reader) and even versions for the visually impaired. Your user can even opt to display your content in their own selected format.
By contrast, when you use tables, there’s a lot of code, a lot of code repetition and changes to styles take a lot more effort. It’s not just making your site unmaintainable and clunky to use. From an SEO point of view, tables are a problem.
Tables create a lot of code as I’ve mentioned, and the overall page size is therefore naturally going to be greater. Google likes faster loading sites and so, you stand to lose out on ranking better with a slower page.
Another problem is that most table-designed sites use a big table for the whole of the content with loads of little ones inside, so as to control the page width. Consequently, everything in that table has to load before the table is displayed. From a user’s point of view, they’ll be sitting staring at a blank screen for a few seconds while this happens, unless they have a really good internet connection.
Another problem with tables having all that code, is that search engine spiders have to go through it before they get to your content. It’s widely accepted that there are three consequences of this:
- Sites with a decent code to content ratio rank better. Sites with loads of code won’t rank as well, and conversely, simple, cleanly coded sites appear high in Google’s results.
- Google places more emphasis on content early on in the page. It’s possible it may not index the whole page because of your excessive table coding tendancies!
- Code heavy sites are likely to be error prone and errors may cause a blip for a spider indexing your page.
But aren’t there downsides to using CSS? Indeed there are. Not all browsers treat CSS exactly the same way, so it’s necessary to create different CSS for different browsers and implement filtering to ensure the right browser gets the right version. As a result, when you design in CSS, it means you have to go through the painful process of testing and tweaking your work in each browser until you’re confident that your site renders correctly for everyone. CSS has its quirks. And by contast, tables are universally supported.
That’s just one of the problems with CSS. There are a good many more, including poor layout controls (although the additions to CSS3 have addressed this to some extent).
So is it worth the effort? In my view, absolutely. The potential benefits from having a fast, cleanly coded website far outweigh the learning curve and extra effort of getting it right. And with the potential SEO detriments you’ll see from a site created using tables, I’d recommend CSS over tables every time.
Enjoyed this article?
Subscribe to our RSS feed, follow us on Twitter or just simply recommend it.
Further Discussion
Leave a Response
Make sure you enter the * required information where indicated. Responses are moderated so please no link dropping, no keywords or domains as names; do not spam, and do not advertise!