I just heard about a great website. It came highly recommended. I was told that it was packed with tons of web design tips, techniques, and resources. I visit the site and it’s sure pretty and, indeed, packed with great web design tips, techniques, resources, and even a lot of references to web standards and accessibility. But when I peek under the hood of the site, I find that the thing was designed using the old, non-web standard, and horrid ugly tables.
I will say this again and again and again and again:
Tables are for data not design.
Do you get it yet? Web pages are to now be designed using a combination of HTML for structure and CSS for visual presentation instructions. NO TABLES.
If you think that CSS is only for boring website design, spend some time with the totally NO TABLES original layouts and designs at CSS Zen Garden, the award-winning, experimental design showcase site.
Table-based Design? Why Should I Trust What You Have to Say About Web Design?
If you are blogging about website design, development, standards, or techniques, and are using a table-based design, why should I trust what you have to say? You aren’t meeting web standards, your site isn’t browser friendly, and it certainly isn’t valid for accessibility standards.
I hate visiting sites by web page designers, web hosts, or other web services and finding them designed with tables. It just proves they don’t practice what they preach or they are taking shortcuts by having their site designed by old versions of Front Page or some other do-it-for-you web design software. These are the experts, so maybe I have high expectations, but I expect experts to show us their best expertise.
If you own or manage a website, practice what you preach and make sure your site meets web standards and validation. Live by your own examples.
As for the rest of us, look under the hood to see if the “expert” site you are visiting is a Mercedes with a Mercedes engine under the hood, or a Mercedes with a Datsun engine under the hood. Boycott links and references to table-based designs.
Site Search Tags: css, html, web, design, webdev, designer, standards, tables, accessibility, experts
Lorelle on WordPress 
16 Comments
Hi,
there are a couple of extremely good reasons to still use tables. One of which is, oh yes indeed, accessibility!
Believe it or not, but this planet does not completely consist of the USA or the few other nations which enjoy a level of wealth in their common population which ensures broadband access, the latest hardware and the latest software. There are areas, and not too small either, where the most modern computer available for miles on end is an old 386 or 486 chugging along on Win95 or Win98 – at best. Try installing a modern browser on a harddisk hardly larger than 40MB, not to speak of a current version of Windows! And now testdrive your oh-so-accessible CSS site with a pre IE4 browser. Hel-LO?! It’s great fun reading across a vast unordered expanse of plain text, links misplaced where one can’t reach them without major scrolling and functions not functioning because the browser doesn’t know what to think of them. A simple tabular design will set those people right in a jiffy!
Webmasters with a close look at their statistics and still finding lots of old browsers and systems accessing it, just may be smart enough to decide to downscale and cater to their “lowliest” customers. That’s btw what CSS-Nazis forget, always, in their rants, that it’s the customers/visitors of a site which decide the level of technology you can throw at them. And – still – for many sites and areas on this world this means tables at most.
Living overseas, I am very familiar with this issue. Still, webmaster statistics prove, nationally and internationally (for whatever country you are in), that there are very few users using anything before IE4.
Even if you have a demographics using pre-IE4 browsers, a well designed web page should still look good and be readable without any problems with misaligned bits and pieces. If they are misaligned, the designer didn’t do a good job or doesn’t know what they are doing. A well-designed web page looks “good” with or without CSS or design elements.
And anyone still using a pre-IE4 browser is connecting at very slow speeds, so a table designed or over graphically designed website would be a nightmare LONG load to wait for. Tables take longer to load than non-tabled sites, so by designing a table-free website, you make it fast for everyone.
All anyone really wants is the content, not the graphics, so a CSS site still is a winner for everyone, pre and post IE4 browsers.
quote:
Table-based Design? Why Should I Trust What You Have to Say About Web Design?
unquote.
It’s not just those dastardly table-based designers who make mistakes though, Lorelle. I just put lorelle.wordpress.com through the W3C Validator and it announced that your page has 70 errors. The page still looks fine though (at least in my Firefox browser).
And I know that those errors are not necessarily particularly major problems. I’ve done enough of my own pages to know that much.
So, this is not meant as criticism. Your blog is always an excellent read. But if I were an ugly tables designer (or should that be ‘a designer of ugly tables’?) I might have had a bit of a laugh about those errors. And you wouldn’t have held it against me, would you?
Well, you wouldn’t have to. Because your own errors could be fixed probably in less than 10 minutes.
Whereas that ugly tables designer (yeah, him again) is gonna be spending the rest of the week fixing his tag soup.
Result: A win for CSS and standards design.
Hard life those tables guys have, ain’t it?
70 errors? So I did a random page test and found only 10 errors, of which the majority are ones I can’t change since I have no access to template files or core programming in WordPress.com blogs. I can only change the CSS and nothing else.
But you did lead me to test the CSS and I found that there is a slip in the core programming code that halts the CSS validation test. I will check on that.
Even so, table based designs suck. They hurt the user and especially the user who had their pages designed by someone using over 10 year old technology who can’t figure out why their pages aren’t getting coverage by search engines.
Thanks for pointing out the core programming design errors. I’ll bring them to the attention of the WordPress.com developers.
I am finding that one part of the web is degrading — my dialup service (Earthlink.net). Since last fall connection rates have dropped to 16.8 or 19.2 kbs. (Yes, I did have the phone company check my line).
Occasionally CSS sites will fail to load cleanly. Yes, much of the material still shows, in strict single-column fashion. But my ‘modern’ browser (Seamonkey 1.5a and IE 7.0) will also blip ‘page not found’ error pages instead of partial displays. Both behaviors are more useful, when they happen, with table based designs.
The world is going to CSS, and tables are denigrated. True, you aren’t the only one enamored of CSS. But there are still considerations that favor table-based layouts. And the table layouts I do use CSS for the design, except the part about setting page columns. And, my last two sites were CSS layout as well. I just don’t like how dropped-packet failures (in this age of online 3D games and video and radio streaming) garble the layout of a pure CSS page.
Geesh, who really cares. If you have to peek under the hood to notice anything is amiss then what’s the big deal? If it works, it works… and most table-designed sites still display fine. This all goes back to the obsessive-compulsive web designer complex that seems to suggest spending a lot of time and effort on satisfying the 0.01% of your audience. Well, it sure matters if you’re Yahoo or Google but let’s face it, ultra-nit-picky web design standards do not need to be forced on absolutely everyone absolutely all of the time. What next, a sermon on the use of alt tags?
Sorry your knowledge is so lacking in this area. Did you know that a business can be sued for not providing a table-less, open access blog or website? Ask the Olympics Committee about their lawsuit on this very issue.
Do you want your site to be viewed by cell phone, web-TV, PDA, or via many other forms people are now using to surf the web? Then a table-less design is critical.
Want to not have Google and other search engines penalize your site because of poor design standards? They didn’t used to. They do now.
There are a lot of statistics out there that rate the number of disabled on the web at 15-25%. You probably don’t even know that you have readers who are accessing your site via special equipment or accessibility settings. And the age of web users is getting older, thus small fonts are harder to read, increasing the number of people who require well-designed websites.
If the vehicle you drive didn’t have some form of standardization, rules and regulations to make it safe and consistent in form and function, driving would be a mess. Same with your computer. You can sit down at any computer and easily access it due to familiarity. Web page design code is no different. To function across the web for everyone in every way it is standardized. And table-designed websites are outdated and ill-suited for meeting that standard.
And if you aren’t using ALT or TITLE tags on your images and links, you are just hurting yourself and losing page rank and potential readers.
It’s not about the pretty that makes a website a successful design. It’s about form, function, and usability within set standards. Be creative on the design end but keep the code standard and appropriate under the hood.
Lorelle, I’ve also run into the situation where people seem to think Internet or digital visual communication is just another type of paper and pencil. (Remember the old joke about telling the computers used by scientists because of the white-out on the screen?)
Young users are evidently unaware of what it takes to display human readable information and what is meta-information. Even teachers who are supposed to train youngsters don’t understand this, expecting “social networking” to mimic the old paper and pencil routine or that “someone else” is supposed to set up these evolving, collaborative networks for instant use by the teacher.
How can one have “social networks” if no one wants to contribute to collective knowledge?
Sorry; not a good day for admiring collective wisdom or altruism.
Lorelle,
we have been using Frontpage to create our website. We started out using CSS, but found that our pictures and text randomly moved around the web page, especially on the older browsers. We now use small tables instead of CSS, and have found better stability for the majority of browsers. (We hope to learn enough about WP to eventually make it our combination website/blog, until then its Frontpage.)
Your comments are appreciated.
Thanks for all the great info you have on your site!
@cprfordogs:
Wow. Thank you for the kind words and all I can say is that I’m very sorry. Using Frontpage, and tables, is going back into the dark ages. If CSS couldn’t hold your images in place, then you weren’t doing it right.
I do hope you will bag Frontpage immediately and switch to WordPress. You are only hurting yourself until then. It’s SO much more work with Frontpage.
Good luck with that.
I m new in this field. I have recently designed my first website using tables, but after reading ur article i feel like having done some sort of crime. I want to know why the use of tables discouraged.???
Hi Lorelle. It’s ironic that I found this post while searching for a way to create a table based WordPress Theme (I’m sure “table based WordPress theme” makes you cringe lol!)
I totally understand the benefits of standards based design using css, but I’m just a guy with minimal graphic/web design knowledge and a personal website where if my friends and family can view it, I’m happy.
It’s frustrating because I can design using tables without a problem and everything looks great, but when I try to modify even the default WordPress theme it just looks like a bunch of code with no structure, I can’t see visually how it looks & can’t make any sense of all the divs….
Anyway I was wondering if anyone knows of a table based wordpress theme? Blasphemy I know, but it’s all I need for my little personal website. Thanks!
George
Alas, the entire WordPress admin is *STILL* (as of 2.9) using table based form layout.
I know this is annoying, but in the truest sense of the word, much of what WordPress displays in the Administration Panels is data. Lists of your posts, categories, tags, authors, etc.
@Lorelle
Absolutely, for the information displays that are tabular in nature, yes, using tables is fine, but I was really talking more about the data-entry forms. Forms should definitely not be in tables, no never, ever. Especially for a thing such as forms putting them (and the form field elements) in tables breaks every usability standard and makes the WP admin a bear to use for anyone using any type of non-standard device. I specifically ran into these issues when doing several WP as CMS type projects where I wrangled the WP admin to task by adding several custom meta_boxes and extra fields all of post, page, profile and category admin pages, and the table based structure on these forms really left a lot to be desired.
Interesting and informative.
14 Trackbacks/Pingbacks
[…] Before I begin, let me again bring up one of my soap box peeves. If you have a website that promotes, educates, or offers tips and techniques for web page design and layout or even web hosting, MAKE YOUR DAMN WEBSITE MEET WEB STANDARDS!!! Is this too much to ask? Practice what you preach. Webmaster 911 is a table-based design and the article I’m highlighting has 46 HTML/XHTML errors including an unclosed link which makes none of the links on their post show up as the whole thing is one big open link going to nowhere. Do you think I want to recommend these folks? No. But I will use them as an example of what NOT to do. Got it? Good. End of lecture. Exit soap box. […]
[…] Boycott Ugly Table Designed Blogs and Websites […]
[…] Boycott Ugly Table Designed Blogs and Websites […]
[…] Boycott Ugly Table Designed Blogs and Websites […]
[…] As you can imagine, I had a lot to say about the old, over-coded, error-filled, and table structured site. […]
[…] from table-based layout to WordPress Theme CSS-based layout with three columns – two sidebars to maximize visibility of […]
[…] As you can imagine, I had a lot to say about the old, over-coded, error-filled, and table structured site. […]
[…] can spot an “old website” or blog design in a second. Can’t you? One that screams pre-1999 table-based design or the Kubrick Default WordPress Theme. If they don’t care enough to update their blog design […]
[…] Boycott Ugly Table Designed Blogs and Websites […]
[…] Boycott Ugly Table Designed Blogs and Websites […]
[…] Boycott Ugly Table Designed Blogs and Websites […]
[…] the pre-1999 web design days where we were locked into grid patterns with table-based web designs, many designers put their energy into font colors when there wasn’t much else we can do. […]
[…] Cascading Style Sheets that design the architecture of a site. For years we would preach “tables are for data not design” in training […]
[…] The above features HTML tags and attributes in a table, something that should not be done today as tables are for data not designs. […]