why shouldn’t you use tables for web layout

while i was student in my university, i used table for web site design. tables are good for development, but they should not be used. here i am telling you why,

first thing is tables are not accessible, Just like search engines, most screen readers read web pages in the
order that they are displayed in the HTML. And tables can be very hard
for screen readers to parse. This is because the content in a table
layout, while linear, doesn’t always make sense when read left-to-right
and top-to-bottom. Plus, with nested tables, and various spans on the
table cells can make the page very difficult to figure out.

tables are tricky,  Even if you create a table with a web editor, your web pages will still
be very complicated and difficult to maintain. Except for the most
simple web page designs, most layout tables require the use of a lot of colspan and rowspan attributes and of nested tables.Building the table may seem easy while you’re doing it, but then you
need to maintain it. Six months down the line it may not be as easy to
remember why you nested the tables or how many cells were in a row and
so on. Plus, if you maintain web pages as a team member, you have to
explain to every person how the tables work or expect them to take
additional time when they need to make changes.

tables are inflexible, While it is possible to create table layouts with percentage widths,
they are often slower to load and can dramatically change how your
layout looks. But if you use specified widths for your tables, you end
up with a very rigid layout that won’t look good on monitors that are
sized differently from your own.

nested tables load more slowly.The most common way to create fancy layouts with tables is to “nest”
tables. This means that one (or more) table is placed inside another.
The more tables that are nested, the longer it will take for the web
browser to render the page.

tables don’t always print well.  Many table designs don’t print well because they are simply too wide for
the printer. So, to make them fit, browsers will cut the tables off and
print sections below resulting in very disjointed pages. Sometimes you
end up with pages that look okay, but the whole right side is missing.
Other pages will print sections on various sheets.

The HTML 4 specification states:

Tables should not be used purely as a means to layout
document content as this may present problems when rendering to
non-visual media.

So if you want to write valid HTML 4.01, you can’t use tables for
layout. You should only use tables for tabular data. And tabular data
generally looks like something you might display in a spreadsheet or
possibly a database.

Well where HTML5 specification states

Tables should not be used as layout aids.

but no one will suggest you to do that.

the last one, tables for layout can affect your job prospects

As more and more new designers learn HTML and CSS, your skills at
building table layouts will be in less and less demand. Yes, it’s true
that customers don’t typically tell you the exact technology you should
use to build their web pages. But they do ask you for things like:

  • Accessible web pages—designs that can be viewed by screen readers
    are being mandated by many countries and corporations find accessibility
    more and more important everyday
  • Maintainable web pages—designs they can take with them even if you aren’t going to maintain them in the future
  • Flexible designs—designs that work across many browsers, resolutions and devices
  • Fast downloading pages—speed is becoming more and more important, even to SEO
  • Printable designs—pages that print without special scripts or extra page

so, why not you use CSS instead of tables?



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s