|
Web Contractors Web Developer Jobs Join Us / Log in Discussion |
Poor tables. They are being persecuted?
Why do so many people hate tables?
One common misconception is that tables and css are mutually exclusive. "I hate tables so I am going to do it in css". Infact, you can manipulate the style of your tables with css as you would for most other page elements. Tables and CSS are the product of two different markup languages.
I think that tables got their bad name when people started becoming concerned about Search Engine Optimisation. You see, there is another misconception that Google doesn't read information stored in tables. This just doesn't make sense. Why would Google penalise someone for this? Would it be ethical? I have even seen people push software that claims to measure what information Google can see in your tables. That's a big call.
There is a problem with tables and that is because WYSIWYG editors use them. And this is a problem because many designers code while they design or auto slice their pages with some fandangled software. The problem is that as you fiddle around with content in your WYSIWYG editor you can be adding tables on tables like an apple strudel. This is one reason tables are getting a bad name. Really, it's not the table's fault in this case.
Ok, so it is a good idea to keep tables to a minimum. It's a good idea to keep the ratio of content to markup in your document favouring the content side. If you're loading 16k of html to render 5K of text then you should probably rethink your approach to your HTML. So it's a good idea to keep everything in check. It also a quite a challenge to markup complex pages without tables. This is one of the positives about this issue. I practice tableless design where it's practical and some good things came out of it for me.
It's a bad idea to avoid tables altogether. For a start it's harder! Some of these workarounds are way more difficult and many don't work properly. Secondly tables are really good for some stuff. You wouldn't write a book without using the letter "e" would you?
New forum topics
- Freelance Web developer wanted
- Ringtone fatigue
- web developer looking for more project
- PHP website maintenance
- Desk available for hire - Rushcutters Bay location
- ZAMP?
- Don't hack the Drupal Core. Make a patch!
- What to charge for site updates
- Start New Website or CMS business. Business Partner / designer
- Code snippets in Google Search Results
- [syd] Freelance developer - .NET/ PHP/ Actionsctipt / DHTML
- Tester needed
- Freelance SharePoint 2003 / 2007 Consultant
- Joomla and Community Builder Module
- PHP export to CSV


my girlfriend thought I meant chairs and tables when she read this...
OMG
Telly Savalas uses tables!
http://www.tellysavalas.com/
You don't actually need to use
<table>s. You can have a simple layout in your HTML and have CSS display it as if it were a table. It's really handy, all though IE6 doesn't like it much.I love tables :) And blank.gifs :P
I have to admit to still using the occasional table.... I don't quite understand the blanket persecution either.. There are some things which tables *just work* for, and while I know the same effects can be achieved using CSS, the table option takes five seconds whereas the table option can take a day to lock down. But that will all change with CSS2, right?
Yo..
I had to google this but CSS 2 was is way old. It says the recommendation was in 1998 on W3C.
http://www.w3.org/TR/REC-CSS2/
The blanket persecution is counter productive, yes (with anything). I don't hear many valid reasons why they should be avoided. The problem with avoiding them altogether is you miss out on the a whole array of tools and tricks.
People say when using CSS columns you should label each one clearly so they are easy to understand. Tables do this already. When you use tables you also inherit the rules that come with it.
<table>is a defining box that nothing with fall outside of. You can shift the cells apart or place a border around them all.<tr>will vertically align a whole row and changing the width of a<td>tag will push the other columns over if you want to. If you want to break the column format, half way down the page for something like a banner advert you just start a row with colspan then jump back into columns after that. There is more...If you emulate tables with
<div>tags you have to make up all those rules yourself and hope the next programmer will understand what you've done. It's a lot of work and you may not get it right the first time! bbPress and wordPress templates don't render well at all on my Linux Machine. The Virtuemart component (for Joomla) is a real mess.It is good to try page layouts with out tables from time to time. Someone paid me money to remove them from someone's HTML the other day! The benefit of not using tables is that it does get your hands dirty in the code.
In someways the removal of tables allow's you more freedom with your layout with using css instead. There are great examples of tableless layouts here: http://www.csszengarden.com/
yeah that layout is one of the benefits of divs and css.
I have to confess to loving tables and the blank gif. It makes me feel in control and the sites work in any browser so I'm not scared to check the site on my grandma's computer - there's something to be said for that from a desiners point of view!
I was reading one post on some forum where two guys argued about which was the better way to do something and then one challenged the other to a code off. True!
I just got caught out using div tags for columns again.
There are some serious problems with using
<div>andfloattags to align columns.Columns shouldn't float. Columns often change their width but it is not their purpose to float next to each other. Float is best for text wrapping and is best used to dynamically position an element on a page. Float is great for text wrapping because your browser always knows how much room your typeface requires and will render your page the best way it can.
Joomla templates do use columns that float reasonably well but they are designed for users (who may not know any HTML) to move columns about. This is an exception and it is not without its problems.
Different browsers add the padding, margin and width of div tags differently. IE6 and IE7 are quite different. This makes padding and spacing your columns difficult and unreliable.
When you use
floatto position a div tag you are telling the browser to push the columns underneath each other if they cannot fit side-by-side. You are also using float to override the div tag's default behavior to position the next element on the page beneath it.Tables are designed to position their cells in a grid like fashion. If you specify columns as table cells then the browser will never push them under. Tables will stretch if you make a mistake and you will make them. Remember the HTML language is designed to be forgiving and robust.
Tables are generally rendered the same across all the browsers. If you build a site with table columns you can save time testing and writing work-arounds. You aquire less risk and you will spend less time maintaining your sites when new browsers are released.
Post new comment