Many people who learned how to edit web pages with tools like Dreamweaver and Homesite became used to using tables to lay out their pages. Tables allowed us to create columns and grids of information. One thing we didn't realize as we were using tables to lay out our pages was that, by so doing, we were making our pages more difficult for some people to use. "More difficult?" you might ask, "but they make the pages more appealing to the eye." But the issues with using tables go deeper than just how the page looks.

Why does using tables cause problems?

1. Tables make it hard to ensure accessibility. Visually impaired people often browse the Web with a program called a "screen reader." This program reads the page top to bottom and left to right, including any tables. So pieces of information that you intend to go together, if they are in different rows of the table, is not presented together to the visually impaired visitor. This can be confusing — and sometimes unintentionally misleading.
2. Tables don't play well with new technologies. Many people are now using cell phones and PDAs (like Palm Pilots) to browse the Web. Some of these devices ignore tables entirely, causing the same sorts of problems for sighted visitors as those that visually impaired visitors suffer. Other devices attempt to display the tables, but because their screens are so small, the tables cannot fit — forcing visitors to scroll around on a page that's many times wider than their screen.
3. Tables make your site slow. At your office, you have a very fast connection to the Web. However, many of the visitors to your site have slow dial-up connections — particularly visitors from other countries, who are often also hampered by a slow connection to the US network. Tables make your pages a lot bigger (often 4-5 times the size), and therefore make your site a lot slower for these visitors.
4. Tables can be difficult to maintain. Who among us havn't tried to troubleshoot a tricky table, only to throw our hands up in the air and start again? Tables can become incredibly complex, particularly when you start using column spans, row spans, and tables inside tables. And if you want to have someone else start maintaining your site, they will have to learn how all of your tables work. So maintaining your site is harder if you use a lot of tables.

Aren't there some good reasons to use tables?

Yes, there are. Tables work well when you are trying to communicate genuinely tablular data, such as what you might enter into a spreadsheet. A chart showing the ISBN, title, author, price, and publication date for several books would be a good use of a table:

Sometimes a table isn't the best solution

Even many genuinely tablular displays of information aren't the best available. For example, which of these two methods would you find easiest if you need to know when your final exams are? Pretend you have a 2a(9:50-11), a 4a(12:30-1:40), and a 1/2c class(8:15-10:00):

1: Using a table

2: Using a list

• Monday/Wednesday/Friday (a) Classes

  • 1a (8:30-9:40): Monday, March 15, 7:00-9:30 pm
  • 2a (9:50-11:00): Saturday, March 13, 3:30-6:00 pm
  • 3a (11:10-12:20): Monday, March 15, 8:30-11:00 am
  • 4a (12:30-1:40): Monday, March 15, 3:30-6:00 pm
  • 5a (1:50-3:00): Saturday, March 13, 8:30-11:00 am
  • 6a (3:10-4:20): Saturday, March 13, 12:00-2:30 pm

• Tuesday/Thursday (c) Classes

  • 1/2c (8:15-10:00): Sunday, March 14, 3:30-6:00 pm
  • 2/3c (10:10-11:55): Sunday, March 14, 3:30-6:00 pm
  • 4/5c (1:15-3:00): Monday, March 15, 12:00-2:30 pm
  • 5/6c (3:10-4:55): Saturday, March 13, 7:00-9:30 pm

The second example is not only clearer for the person who is looking to see when a particular classes' exam is, it also takes half the time to load (because it does not use so much code) and can use English for the days of the week instead of the cryptic "MWF" and "T,Th", since each line does not have to fit in a table cell.

So, if I shouldn't use tables unless they are really necessary, how do I make my pages look special?

If you want to make a page stand out, or give your site a flavor that's different from other sites, Web Development can help you do that. Here are some examples of sites that we have helped to stand out:

• Alumni Annual Fund
• Campus Activities
• Japanese Garden
• Convocations
• Lord of the Rings
• Multicultural Affairs
• New Student Week Guide
• Virtual Reunion

To see how we can help you customize the look of your site, please contact us.