Top 30 popular websites that still are using tables as main layout structure
As we move in a world of XHTML, CSS, AJAX, Microformats, Semantic Web, etc. You may think that tables are only used to display… well… tabular data, no you are wrong! Take a look at this list of top sites from Alexa and see who are still in the middle age of web design. Here I am looking only at the home page of every site, may be worst when you click your way inside the site.
Tables are bad? Since when?
Well I am not going to tell the “The History of Tobacco”, you can read some over here. But I want to bring a few things for you: light, understandable, accessible and quasi-more SEO friendly code.
The list
- Yahoo.com - Clean
- Google.com - Tables inside
- YouTube.com - You don´t believe how many they have
- Live.com - Only one… Hmm… not bad at all
- MSN.com - Only one… Amazing!
- MySpace.com - A place for tables… and friends?
- FaceBook.com - Here hang out the tables too.
- Wikipedia.com - Tables, tables, tablepedia over here
- Hi5.com - Only two
- Orkut.com - OK, you too
- RapidShare.com - One
- Blogger.com - None, Zero, Niente, No tables around
- MegaUpload.com - What you think?, yes you are right, there are countless tables inside
- Baidu.com - Two on the home page, one table every 20 visible characters
- Friendster.com - Not as much as you think
- Yahoo.jp - Okay here we come again, back to 1995, Y! on the basics
- Microsoft.com - None, can you believed?
- QQ.com - table is their second CSS declaration, after body of course
- Fotolog.com - Yes this one too
- Ebay.com - Everybody knows
- Google.fr - Tableu à´la carte.
- Mail.ru - Yes in the old Russia, the websites layout the tables
- Google.com.br - Ou Brasil tableleirou (here too)
- Skyrock.com - None, Nicht, Null, 0 tables here
- Sina.com.cn - Hele ale table too
- Google.de - Of course, they have too
- Google.cl - * (for now on I will write only an “*” when Google comes)
- Google.co.uk - *
- Google.es - *
- Flickr.com - You don´t noticed but they are, they are
Finally
From the 30 more popular sites on the world and only 4 are using tableless layouts. Who cares anyway, the users? Nah! XHT hu ha hu who? a user have just said near you.
Stop hunting those IE CSS tricks and bring back your Frontpage 98 my friend designer, we are still in web 0.8889… not really but… think about it.
Keep flowing.
Update: And now… Top 30 popular websites are NOT using tables as main design structure. What is the real problem out there?
I would have been a tough job for you.
In fairness to the site with a low number of table elements, they’re using them correctly: to show tabular data. There’s nothing wrong with that.
Anyone who’s ever had to do a truly complicated layout on a website, knows that tables are a necessary evil. There’s a very good reason why some of the biggest websites on the internet still use tables. So while this list is interesting, it’s ultimately pointless.
No one has said that tables should not be used at all, what is being recommended is that you use tables for what they are supposed to be used for. Printing tabular data.
Obviously you haven’t done much demanding web design.
Often the code to tables is much cleaner than achieving the same look in pure CSS. Often times it is preferred or even required that tables be used for displaying content.
Just because it has become ‘cool’ to go table-less and all the ‘web 2.0′ (god I hate that definitionless term) blogs you read tell you that tables=bad, a real designer realizes when they are needed and doesn’t put down sites that use them with exactly ZERO justification on why they are ‘bad’.
Nice list, weird fact but good to know the sticks and stones of the web haven’t been completely abolished.
Sadly, a lot of sites we use these days were built in the nineties, they are largely functional and popular enough not to really care about SEO.
As they were built with tables and often without a dynamic CMS (rather some hierarchical structure of .htm files) working that data into a modern system is going to be years of work.
Interesting… it isn’t really that bad to have tables on your site.
Tables aren’t ment to be gone, basically, it is all about semantics, using the elements for the purpose they exist for.
What was bad was that the layouts in years ago were built upon tables, and that is wrong, what is right is to use tables to display tabular data.
Tables will never be gone, they have its uses, just use things right.
What we need is a semantic web with microformats & co ^.^
@ Stan:
“Obviously you haven’t done much demanding web design. Often the code to tables is much cleaner than achieving the same look in pure CSS.”
I would say obviously you haven’t really gotten your hands dirty with CSS. Show me what you want to do with tables and I or any other CSS guru who knows his shit will do the same job with XHTML and CSS with only 1/4 the code base.
I am sick and tired of these table jockeys spreading propaganda like “tables use less code” or “you need tables for complicated layouts”. It’s a tired lie for people who are too lazy or too stupid to use CSS properly.
xhmtl? or xhtml?
Tables are fine, leave my table friends alone…
Tables are fine - and as some others have said sometimes you just have to quit with the DIVitis and use a table instead. Somethings you just don’t want flowing all over the place
The autor of this articles is a real noob.
Table is really good for structuring your information and it’s better for search engine because it allows to make a difference between the structure and the graphism.
You suck noob
What’s the big deal. I learned a long time ago I ain’t going to do it right for everyone. So relax…flow with the river
Who cares! If it works, who cares! Your CSS fanboi’s really need to spend more time making your sites look less cookie cutter web 2.0 and actually start making them useful.
safe and reliable…always.
why go with new conventions or at least the more common convention if good old faithful puts out?
Way go fit an “In Soviet Russia” joke in there about yahoo.ru
You scorn their bad web design, I scorn your bad English. And more people will notice the latter than the former.
@Michael
“I am sick and tired of these table jockeys spreading propaganda like “tables use less code” or “you need tables for complicated layouts”. It’s a tired lie for people who are too lazy or too stupid to use CSS properly.”
Well, I am sick and tired of evangelical “experts” who push CSS like it’s the end-all-be-all solution for every situation and get all condescending when people don’t agree. Look at your tone: it’s more an emotional than practical.
There ARE situations where CSS is superior and there are situations where it’s a headache:
1. CSS is notoriously bad for elastic layouts. Notice how in most “CSS is superior!” tutorials almost all dimensions are hard-coded. This is VERY bad design!
2. Alignment of different page areas is a headache, especially if you need some parts to expand while others remain the same size.
2. If you have a number of elements in a flow, then it’s not possible to let one or more elements (e.g. a footer) be of a constant size while others set their size to a percentage of the *remaining* space.
3. It’s much easier getting a table to act the same across the different browsers than CSS. Notice how most tutorials need MSIE-specific checks. OK, browser issue, but… (see next point)
4. Design flaws: when using DIVs as layouting elements, there’s no way to set internal padding. You’re stuck with functionally overlapping margin and padding. Also have fun trying to set a DIV to be the same width/height as its parent but with e.g. a 20px margin. This is partially possible, thanks to… (see point 5)
5. Inconsistency: not setting width results in the same as “width: 100%”, except that padding IS internal. This trick can’t be used for height of course.
6. Difficult to easily get shrink-wrapping behaviour working across browsers.
These are just some of the trouble areas. I do try to use CSS where appropriate, but when tables give me what I need with no troubles, then tables it is! This is hybrid-optimal.
As youtube, a site that started in 2005, demonstrates: the users simply don’t care.
Ok, so nothing to do with CSS, tables and all that. Pretty fun post, but… Well, I’m Brazilian, and I could NOT understand what the heck “ou Brasil tableleirou” means.
Care to explain?
Cheers!
Customers don’t care if it’s CSS or tables.
I designed websites from 95 to 05 and I’m appalled at the lack of skilled design these days. New CSS tools may be cool, but they lead to lousy web design. My biggest gripe is that I like to enlarge the text hugely as I view my computer from about 4 feet away. But most of the time when you try to do that, you can’t as the font is fixed by CSS and those times you can, it throws everything off as elements are positioned with absolute values as opposed to relative ones. Then you have text overlapping other page elements and it becomes unreadable. I’m all for tables, they are by default relative.
@ Marcelo
Oh, great to see you over here, “ou Brasil tableleirou” means nothing, just paraphrasing, phonetically, I guess, “Acuarela do Brazil” song here (fan of Brazilian music, a lot).
If you came up with a better, authentic phrase, I will change it
^^^ is not the same michael as 4 or 5 posts above.
wow…
so much talk, i can’t help but join in.
people are very picky about how their data is delivered…
is it really different, maybe with a slow connection, or a bad browser. I can’t tell the difference with rendering times from tables to divs. I guess I agree with everybody and then really nobody, couldn’t we be using our time wasted on arguing about tables or grammar and start fighting the real enemy.
there are concentration camps full of helpless animals, rainforests being cut down, ozones being depleted, are those issues too scary for you, maybe you feel like you can’t change them but you can use CSS instead of tables, or you too stuck in human 0.8889 to want to really make the changes to become human 2.0 or better, so why not concentrate on stupid as semantics.
my 2¢
I’ve been webdesigning for about 7 years now, and I don’t what is the problem with tables. Easier to manipulate, faster to put out. When I’m choppin a design done in Photoshop, I print my design on paper, and I cut here and there with my pen how I would structure the website using tables.. not divs.
If I want my menu on the left, and my content on the right, I then have one table, 2 TD and that is it. Simple, effective, no hacks. I really do not see what is the big problem.
I guess you dont have to have good grammar to be a Web 2.0 developer though. At least the table layout sites use good grammar.
Obviously you havent done this, done that, well what the fuck did you retards do with your life? Besides whining.
And by the way… while I was posting my above comment, the website broken down and CSS wasn’t rendered… you shoud see what it looks like with no CSS to control your DIVs… comments were full width of page, tag cloud was at the bottom.
If you were using Tables, your structure wouldn’t have suffered from this… ’nuff said.
“Google.fr - Tableu à´la carte.”
Hum, this is not French, that doesn’t mean anything
“Google.com.br - Ou Brasil tableleirou (here too)”
Not Brazilian Portuguese either!
as long as they use it for displaying tabular data and not layout of the site.. I don’t see anything wrong with that…
Having worked with many different web designers (and partially as) I can completely understand the stigma towards CSS by a lot of slice-and-dice designers; especially given that CSS feels a lot more like coding sometimes. However:
CSS does have some very important purposes beyond elite semantics - it makes large sites infinitely more maintainable (adjustments to a live design take minutes rather than having to adjust and reslice from scratch), makes it easier for people *other* than the original ‘designer’ to pick up and continue with, reduces download sizes (one css file cached rather than loading a separate copy of layout information for each and every request - which despite broadband is still important esp for hosting costs and server load), and so long as the designer actually knows how to use css - can significantly improve accessibility. Smumdax refers to this site breaking into individual sections when the css does not render - this is perfect for screen readers and mobile devices. Tabled layouts do NOT degrade to small-scale devices well. As for absolutely positioned objects overlapping when font size is increased - this is due to inexperience designers rather than an issue with css (absolutely positioning is generally what designers who are more proficient with print design rely on to make things sit where they want without using margins and floats correctly).
In any event, try applying for a non-freelance web design job these days without at least basic css under your belt; as whilst relying on tables might make it easier for you, it has no benefit for the companies using it beyond your unqualified salaries. Even if major sites such as those listed do rely on tables in ways they “text-book” shouldn’t those decisions were most likely made on a case by case basis rather than the personal feelings pro or anti tabled layouts.
As long as it gets the job done… Google breaks a lot of other standards, but hey, as long as it gets rendered in the browser properly. For the same reason I still prefer HTML 4.0 than XHTML, it is still a standard right? You can be all advanced and only use the latest, newest thing, but it’s like owning a video-phone, if the phone you’re calling only supports audio and not video, why use the video phone?
If the boss doesn’t care how it gets done, as long as it gets done, and you have a deadline, and tables work consistenyl across browsers with no hard tweaks, so you use tables, get your work done before 5 PM so you can go home and enjoy the life outside of work…
without all of the bitching about clean code..
using pure CSS is a really handy tool for webdesign.
having a seperate style.css page makes sure that the stuff that is in the html is really only the information that is on the page. just the words and the pictures.
why you would want this?
well, now you can redesign your whole website by just altering the style.css page in stead of ALL the pages on your site.
pretty nifty huh?
also with css, if you would use a small text based browser, like on an inferior mobile device, the content of the site would still be readable, so all the information you want to get across still does.
I could definitely see the use in that..
who likes scrambled websites anyway?
tables suck. and the given examples are rubbish coz some of the named sites use tables just to display tabular data.
i think the author just cant code and has customers that use IE.
most shocking comment i read here:
“I print my design on paper, and I cut here and there with my pen how I would structure the website using tables.”
Then keep on using M$Frontpage or “HotDog” and dont ever think about accessibility and webstandards. Not using tables is good for you if you do not have the skill to think projects through. None of the named sites actually has a brilliant design based on tables. Ebay needs to display its products but surely isnt a beauty…then tables is OK with me since you need less professionals to run the business.
What about Dell.com!?
I always attempt to do tableless layouts these days — but the problem is, CSS display is horribly broken, particularly between browsers. Some of the most basic things require complex hacks — hacks which have the potential to break anytime a new browser version comes out. Just the simple act of centering a div on the page can become an ordeal. I don’t know how many times I’ve coded a completely straightforward CSS style which tested perfectly as expected on one browser, but horribly disfigured on another… leaving me staring at the code and saying, “What the heck? Why on earth is it doing that?”
Tables always work as advertised, no messing around. They are definitely a huge temptation.
Whatever language “tablereirou” is, Portuguese it’s not. “Can you believed it?”
People who thinks changing a .css file can redesign a whole site obviously has never actually worked on a redesign before.
And CSS being more accessible? If that’s the case why can’t I make fonts larger in my browser on CSS sites without text overlapping all over themselves? Show me a site where this is done correctly…
I was reading this site, and it looks like it was written without any style at all…. I was left wondering why the author was praising the glories of css when he/she was too lazy to actually apply css to this site… Then it hit me… try the site in windows…. And yes, now it does look much better… Just another reason why css is evil…. when I visit youtube… I see the same layout in windows and Linux… this site layout sucks in linux but does look ok in windows… People have spoken about how “lazy” the html designers are for not investing countless hours in css to do a simple column layout… I would rather see people invest time in making cross browser sites, such as yahoo, youtube, etc, than fighting the virtues of css. If you are too lazy to make your site work cross browser, then don’t tell others that they are lazy for not learning css…
@dp
http://www.education.eastmanhouse.org/discover/kits/
the front page and at least some of the sub pages do (don’t take time to check them all)
Just an update…. after I posted this comment, then my browser did in fact pick up the css layout, and it does look the same in windows and linux… must have been some css+browser glitch… happens all the time.
I’ve done cross-browser development for years. One of my specialties is JavaScript where the getElmentById is MUCH better than the document.all used by Windows. I give this background to say I’m that I’m conversant in most current web design techniques. Having said that the CSS good Tables evil people have probably never had to do real cross-browser development. Tables work much better across the modern browsers (IE6+, NS6+ or most recent Mozilla variants, and Opera) than CSS. I find people who go out and find sites using tables vs. CSS as someone deperately trying to validate their own imagined technical prowess. They are acedemicians not developers. If you want to see you is using crappy design look for sites using documnent.all in their JS, not who is using tables. I work with someone who advocated CSS over tables and he quickly realized how much more work it was to do this across browsers and abandoned his evangelism.
Sean,
The css file probably did not get loaded due to a network/server anamoly. Yet another reason to go with tables vs. CSS.
In most of the sites, tables are not required for layout. Take yahoo for example, a cleaner job can be done with CSS.
Same goes for google.
Tables imo are only needed for showing a spreadsheet data.
@dp
People who say things like “People who thinks changing a .css file can redesign a whole site obviously has never actually worked on a redesign before.” have obviously never seen csszengarden.com, douche.
Regardless I personally prefer tables, as I’m a programmer not a designer, they’re easier to work with for us than CSS.
Many many major websites are still made in tables. At my work, there are many major brands that don’t give shit, like someone else mentioned, as long as the job gets done. However, I have only been there for a couple months and have been pushing to change these things in the next few redesigns we do.
Someone else mentioned browser inconsistencies. Yes, there are many depending on which OS and browser you choose. However, with experience, yo have the foresight to know how which browsers will behave how, when, and where. Therefore, you can target those specific problems before you even check in a different browser and will most likely need to do minor tweaks when the time comes.
I am all about content v. presentation (and to take it further the mvc concept) so that redesigning a site can go over smoother than having things in page and not separate from each other.
Who says that you can’t use tables… for presenting tabular data. There is an appropriate place for tables, but laying out your website with it is not it. Of course users don’t care about if you are using tables or CSS, but as designer/developers we should because clean semantic layouts are easier to create and maintain. I will admit that complex 4 -5 column grid layouts are easier to create with tables, but they are not necessarily cleaner. Anyone who thinks that tables are easier then CSS should try coding a few HTML emails, its disgusting.
Lets see, maybe no one cares but you.
Tai
Honestly. Who. Gives. A. Shit.
Submitter is an idiot.
If the website works well, like google.com, who cares how it works underneath?
I think someone needs to step outside, the average net user doesn’t even know what CSS is and they don’t need to, it doesn’t matter.
this is retarded.
You are a web noob, using only div tags to replace tables Is not only retarded, but less efficient in a lot of cases. Why do you think google still does it? Its not more SEO friendly to put EVERYTHING in div tags, not at all. Don’t bullshit people by saying so. There is a right and a wrong way to use tables, just like there is a right and a wrong way to use div tags.
[…] ¿Cuantas de las 30 páginas más visitadas todavía utilizan tablas como layout?web2.0flow.com/top-30-popular-websites-that-still-are-using-… por SirDrake hace pocos segundos […]
Interesting… it isn’t really that bad to have tables on your site
Are tables supposed to be bad?
Because whatever website this is has shitty design. All you need are some gifs and a Jennifer Lopez MIDI and we can be right back in 1997.
Are you trying to hurt your argument in favor of table-less design? Because that’s all that saying 26 of the top 30 websites on earth use tables does for you.
I like tables. They have been very good to me.
There are a number of good reasons that W3C (http://www.w3.org/) recommend not using tables for layout purposes. Tables are, as others have pointed out fine for tabular data.
These reasons are:
1. Accessibility - using tables for layout screws things up for text-to-speech software.
2. Keeping content and style separate using CSS allows users to control how they see the page, again important for accessibility.
3. Updating a sites layout can be done by modifying the CSS file
I think this issue stems from conventional designers being control freaks. However, a good “web” designer needs to be a lot less hung up about control every aspect of page layout. That does not mean bad design. On the contrary, good designers should understand the limitations of the media in which they work and exploit them. http://www.csszengarden.com shows countless examples of designs that have embraced CSS. Tableless layout is not about being “cool” it is about consideration for the people that visit your site (all of them!) - it has absolutely nothing to do with Web 2.0.
I agree that using CSS is not as easy as tables but that does not mean you should not take the trouble to learn it. Once you have you will find there is nothing that tables can do that can’t be done better using CSS.
Oh by the way I used to be an idiot too.
@ Sean:
There is no reason why you can’t make a site both cross-browser compatible and use CSS for layout. I would advocate both. I predominately use a Mac and therefore I am very conscious of cross-browser issues.
There are two major things to know about tables and SEO. First, they typically aren’t parsed well beyond a depth of 3, so using complex layouts is right out. Whether you care depends on what crawlers and engines you intend to support.
Secondly, even 456 Berea Street managed to reduce Google’s home page from 4944 bytes to 3902 bytes (http://www.456bereastreet.com/archive/200608/google_valid_and_strict/), achieving a simpler and strictly compliant page in the process. 21% savings on bandwidth would probably be a good thing, no? Not to mention that all the major search engines will (to my knowledge) only read the first X lines of your page. If you can therefore keep your cruft to a minimum I’d say that’s an advantage.
The real question therefore becomes: why are these sites still using tables? The most logical and likely senario is simply that too many 3rd-party tools rely on their broken and buggy pages now for them to effectively change to a properly standards-compliant page, and they would rather not have a mirrored and deprecated service page for these older tools (or have their userbase change to a new URL/service, which is usually far too costly to be worthwhile unless it’s a drop-in replacement the users see right away).
Now, as for the rest of us, who cares? Unless you are a new startup or a large firm going through a huge change, you might as well use what you are comfortable with. If you aren’t worried about costs (which are often not a concern) then keep using what you are happy with. Layout tables are one solution to the problem, and while they betray a lack of skill they are in complete agreement with the philosophy of the web: we’re too busy making a lot of terrible pages to make one good page.
[…] dowód tego, że tabelki nadal są w użyciu i to w topowych serwisach internetu zapraszam do przejrzenia listy serwisów, które nadal w swoich konstrukcjach zawierają tabele, a lista ta zawiera min, takie stron jak: […]
“quasi-” not “cuasi-”
For those who think Tables are required check out the CSS Zen Garden.
http://www.csszengarden.com/
Using tables is for the lazy and newbies.
Well guess what, I have 150+ clients and I use tables on ALL their websites, CSS is NOT stable, think of how many times you get a fucked up picture on CSS sites, it you want to make a website that work you stay away from tables, it is that simple.
When we redesigned a non-profit’s website last year we wrote very nice css layout code, unfortunately the cms they were using wanted to rewrite much of it’s code in tables. So while we tried to write beautiful html and css we were ultimately working against a poorly written application. I think that might be why many of these sites haven’t made the change over.
I read every comment here and no one seams to know the most important reason to use CSS as replacement for Table. It’s the accessibility for user with handicap.
I main idea is to divide the page in two component : the content and the design. The purpose of table is to present content and CSS purpose is to design this content. If you use Table for any other purpose, it’s more complicated for blind people to surf on your web site.
So, If you want to design a web page that are accessible, don’t use table otherwise do what you want !
CSS is too broken to use for complex layouting that is trivial with tables. See my earlier post here for the reasons.
If using only tables is for the lazy, then using only CSS is for the fanatics.
For those of us that wish to do the job properly and in time, tables + CSS is the best.
Do not judge the table-users UNTIL CSS isn’t broken anymore. Right now, it’s broken and lacking for layouting.
[…] spotted this post and here is the list […]
blogger uses tables…
Tell me when you saw a porn site that was in semantic, tableless CSS? How could you leave them off the top 30 popular sites?
[…] read more | digg story « Apple Posts Leopard 10.5.1 Update - The First Update, Epic […]
@Thomas
Blind people need porn too!
Tables aren’t much of an issue if they’re used correctly, which in this case they are for the ones I know
[…] Top 30 websites that still are using tables as layout structure […]
Let’s dispell some of the myths here:
Firstly, your standard for “a site with tables” is probably biased, because you didn’t take into consideration three things:
1. Using one or two table tags in a page full of divs, stylesheets and xhtml markup does not make it a “tabular layout”. To really be a tabular layout the site has to use tables for *main* layout elements, not a tiny copyright box at the bottom of the page. “One” or “Two” should count as “Zero” if there is clear intent to avoid tabular layouts.
2. User generated content should always be ignored from a discussion like this, because user content is not (supposed to be) “layout”, but more importantly because a user using tabular layouts does not reflect the sites overall attempt to have a tableless layout.
3. Tables *do* have valid usage, specifically, for *tabular data*, hopefully you know enough to never even consider this as tabular layout.
So let’s look at your sites once again, using the much less biased criteria from above:
1. You mention Google’s websites 7 different times, only in different languages. That’s highly misleading, as decisions to redesign the layout would essentially come from one source and would be implemented (eventually) across all those websites. If google.com uses tables, its quite obvious the others will too. 30 - 6 = 24 total *unique* sites to judge from.
2. To recount your initial score, I’m counting all “One” and “Two”’s as “None” as described above. I counted 9.. that’s 9 out of 24.
3. Facebook uses no tables for their main layout. In fact, 90% of the page is stylesheets and divs, and you’d know this if you ever used FBML or looked at the Facebook developer docs, which puts web standards *high* up on their priority list. The places in which they do use tables are *not* layout elements but rather tabular data (”Network Info” in the Networks section shows tabular count of the number of members in a network, your friends, etc.. This is tabular data). No matter how you look at it, there’s *no* way you can say Facebook uses tables as their “main layout structure”. That’s 10/24
2. Wikipedia actually uses an XHTML1.0 strict doctype with plenty of stylesheets and div tags around. In fact, Wikipedias *main table layout* has *no* tables. All of the tables that you saw were generated by the Wiki markup engine. That’s right– user generated content. On a sidenote, it’s important to note two things for this specific site. One: the wiki markup engine was developed years ago and has generated content for too many pages to even imagine; converting these all to proper tableless layout would be ridiculous and unreasonable. You don’t fix something that isn’t broken, regardless of “standards”. Two: the wiki markup engine actually describes its data in tabular layout– this is not the fault of wikipedia’s website or the strength of tableless layouts, but the fault of the wiki engine itself, which again, is probably too old to undergo changes. Regardless of why tables are used on this site, they do not contribute to the *main layout structure* of the page, which is what you claim to be considering, and therefore, Wikipedia is 11/24 of websites to use tableless layouts.
I would love to keep going, but I feel I’ve made my point. I’m sure if I poked my nose into some of those other sites I could bump that number up to 14 or 15, which is really not too bad at all.
Okay, I will use tables for *SOME* design decisions.. if there are more than two items that need to be side by side, I will use tables… I will not nest another element other than header, and anchor tags inside a table data element.
Why? Because CSS works best for an outer layout… the main portions of a site can be worked out well with CSS… At this point, I usually only need a main CSS sheet and one for IE < 6… IE lower than 6 is not important… Also, mixing stylesheet rules in nested tables in IE6 outside of XP will blow up, and not render if the page gets *too* big, where that is depends on the complexity of nesting and the content.. using CSS for the outer/main layout works best, sometimes based on information, tables work best for inner content…
If you are incapable of realizing why tables are a bad idea for the majority of a layout/site, you are simply more of an artist than a true designer… The design and development of web applications, and complex sites is best left to those with some basic understanding of an engineering, or architectural approach, which is to blend style with technique.. not all one or the other.
First of all, I am glad to see some fire going here and in Digg that´s good for the community. Thanks for all comments, good ones and pointless.
@ Jon
Let´s follow your poems here.
1. Clear intent to not use tabular layout is what Y! and M$ have done in their home pages, for example. If you need to use a table to place correctly your footer, after *intent* a non tabular layout, well, something is really wrong. Check!
2. UGC must ALWAYS take in count when designing a website layout, take Digg for example, they filter the user comments to preserve the layout, and still is UGC. Check!
3. Tabular content should be, of course, inside a table, otherwise, is just a waste of time and a form of rediscover the “warm water”. Check!
Recounting
1. I count websites here, following the Alexa rankings, so, Google.com and Google.co.kr count as 2 websites, cause they are 2 websites, one company but still 2 websites. As you can see the Google.co.kr website have a very different layout and functionality (pretty cool if you ask me) than the rest of Google home pages, but still they are using tables for the layout, maybe not the main layout but, are unjustified here, there is no tabular data to display on Google start pages. Check!
2. Pointless now, after my first and second points 1. Check!
3. Let´s continue, Facebook, my friend, even in the home page (not logged in) have one table and, again, no tabular data here. Go to your profile page on FB and you will find as many tables as you want, and again, few tabular data to show. If you are still don´t know what tabular data is, let me show you:
http://spreadsheets.google.com/pub?key=p5IcOF6sirgc0kFj3uowmGw
That´s tabular data, a bunch of Photos is not tabular data, and when they are inside a table is called laziness and poor practices.
4 (or should I write 2). Wikipedia in their home page have no tabular data and still tables are there. Again UGC is not a justification for bad practices.
And If you take out the 4 non tabular layouts in the first 30, then, the next 4 websites: Google.pl, Amazon.com, IMDB.com and Seznam.cz, have the same issue.
You have not point at all here. Also, for the way you say things and your *name* I guess your work for one of the tabular websites, don´t you?. Go back to your cubicle, you have not fault at this.
This list is silly. Most of these sites use tables, yes, but they use it in the proper way: to display tabular data. They use CSS and semantic layout for the most part.
yes. with web 2.0, tables have been realised to serve their true purpose, which is to organise information in a tabular form. Not for layout design purposes. These websites do use tables correctly, and for design-wise, they turn to tags n CSS.
Design layouts solely based on tables are outdated and bad. Still.
I try to stick to divs and css, but occasionally a desired result arises where I have to use a table for the layout. I save ‘have to’, because the css way of doing it doesn’t work in IE6.
Probably worth mentioning that the desired ‘layout’ was achievable with css, but not the round corners and sides with tiled graphical elements.
Not that I couldn’t beat the code into submission for IE6 whilst avoiding tables, but that to get it to work requires way too many divs
My boss and I go round and round about this. I don’t like to use tables; he doesn’t see what the big deal is. I work for a very small web development company where we develop sites for our clients using the DotNetNuke CMS. I’m the one who has to deal with the atrocious code we get back from skin developers in China (yes, we outsource a lot, and I’m not thrilled with that, but I usually don’t have time to develop the skins myself, as much as I would like to), where tables are nested in ridiculous ways that make the code very difficult to read and, in turn, make changes more difficult than they need to be. I very recently created a CSS skin for a client we’re working with (mostly to prove to myself that DNN could play nice with a skin that doesn’t use tables, since I hadn’t seen one up to that point). He ended up needing two additional skins, but creating them was really more a matter of changing CSS code than changing the structure files (mostly just changing div ids so as not to cause confusion) and was pretty simple. I think if I had done the layouts in tables it would’ve been more work to make the changes.
Granted, I understand that tables are more stable across browsers and don’t have the rendering inconsistency issues that CSS does. I’ve spent a lot of time pulling my hair out over rendering oddities between Firefox and IE 6 with CSS and have had to occasionally and against my will had to break down and use a table when I just could not get something to work the way I wanted (in DNN). And using a CMS with a skinning engine like DNN makes the content vs. presentation argument (somewhat) irrelevant because the skin file with all its tables or no tables contains no content, and content is managed elsewhere. However, those arguments aside, I still firmly believe that one should avoid using tables (for anything other than tabular data) for accessibility purposes.
I agree - sometimes there are just times we need to use tables.. necessary evil!
Tables 4 life.
OK let summarise what we have learnt:
1. Tables are fine for tabular data but not for page layout on professional sites.
2. The primary reason professionals do not use tables for layout is that it is bad for accessibility. Potentially owners of inaccessible sites can be sued for discrimination depending on local legislation (in Britain this is covered by Disability Discrimination Act 2005) thus professional website designers tend to be mindful of accessibility issues.
3. CSS is difficult for amateurs to master and thus they tend to defend the use of tables for layout in spite of it being a deprecated technique.
4. There are rare occasions where using a table to layout an element within a page may be justified - the W3C even recognise this.
5. Unfortunately it is expensive to replace poorly designed legacy CMS systems and fix the problems that they caused. Though it does highlight another good reason for separating layout from content.
@ David:
“OK let summarise what we have learnt:”
Well, that’s pretty biased as you’ve included none of the counterarguments against using CSS only. I would also advise you to not imply that others are idiots or amateurs while using weak logic yourself.
The crux of your argument is that using tables hurts accessibility. My question is why accessibility *has* to be arranged in the browser layer and not on the server end.
A browser for blind people is a different target, just like a browser for mobile phones and printers. Not surprisingly, we already see .mobi versions of sites as well as the popular “printer-friendly” links.
For a well-designed backend, it’s trivial to output content with different “skins”. Accessibility does NOT demand the use of ANY CSS whatsoever.
If you’re worried about being sued, just make a blind-friendly skin. Heck, you can even add features that will be useful for blind people as well. That’s the major advantage of server-side accessibility features.
We can also wonder about accessibility issues for video sites like youtube, but I believe the crux of your argument has already been refuted enough.
honestly guys, stop defending table layouts. This isn’t 1998 anymore, there are bigger and better things out there now.
I work with developers who defend tables all day long and it’s great. It’s rare that I get a chance to prove someone wrong on every point they bring up.
It all comes down to the fact that CSS can be intimidating if you have been using tables all your life, but it isn’t like the internet is static. It is evolving and you need to evolve with it in order to keep up.
Think about it. If you go into a job interview and say “i think css is crap, i am all for tables” you are going to get spit on by the other designers.
@serhat
your work arounds are logical but it sounds like a TON of extra work to make several versions of a website instead of just using css.
——
I think it just comes down to people are either lazy or intimidated. CSS is much more flexible then tables. Like it was stated earlier, being able to change every single aspect of a website besides the actual content all from one page. A great example posted is csszengarden.com go to it and learn please.
What it comes down to is that you people that are devoted to table layouts are going to be out of a job very soon if you don’t learn new technologies that can make a smaller, cleaner website. At this point it isn’t about what the user thinks, it’s about what the rest of the informed community thinks.
I couldn’t understand some parts of this article nnial 2007 - salvatore iaconesi - del.icio.us poetry, but I guess I just need to check some more resources regarding this, because it sounds interesting.
@Drew I not sure you get the point or design for that matter… I just really tired of standards that are placed before design functionality, remember when flash was not aceptable then up comes AJAX with the very same problems as Flash but a acceptable because of it’s programming nature.
CSS will not and does not fulfill every design need…. ahhhh don’t bother its not worth my time the Stats are clear. CSS does not work all the time!!!
[…] (great name) has come up with a list of 30 major sites that are still using tables (presumably, for layout structure). # Yahoo.com - Clean # Google.com - […]
@ Drew
“your work arounds are logical but it sounds like a TON of extra work to make several versions of a website instead of just using css.”
Not really, it’s just a matter of being able to separate content and presentation at the backend level. Most modern CMS and forum systems can already do this. It will only be a burden for those who mix their code directly with HTML, which is VERY bad design practice to begin with.
It’s of course rather ironic that you’re complaining about another solution as being “like a TON of extra work” and then directly go on to call *other* people lazy for not doing a “TON” of extra work themselves — and that’s a TON of extra work that will NOT be able to solve the accessibility issue to the same degree.
CSS does simply NOT have a monopoly on accessibility. In fact, it could be argued that optimal accessibility cannot be achieved by CSS alone.
Then you go on to say the following…
“At this point it isn’t about what the user thinks, it’s about what the rest of the informed community thinks.”
Laughable. Trust me, I’m MUCH more interested in what the ad-dollar-generating users think than what the view-page-source obsessed geeks think. (and yes, I count myself among those geeks)
I’m not at all worried about being able to qualify for a job, because my table-based websites are already earning me more figures than a comparable job would. But hey, who cares about users, right?
Every pro-CSS argument is laced with insults and name-calling to those who don’t agree. It’s typical for a “I’m right even if I can’t back it up” point of view.
CSS has serious flaws and is NOT as accommodating to elastic layouts as tables. Elastic layouts are *typically* useful for accessibility purposes. Why CSS is so flawed in this regard is a complete mystery to me.
Don’t get me wrong, I do use CSS for layouts myself where appropriate. I also use tables where appropriate. I consider that hybrid-optimal: if the users get a good user experience, I’m going to have a good life.
Back to the point of getting a job: I would definitely not hire someone who would rather spend hours trying to hack CSS into doing something that is trivial to do with tables. I want someone who can use the best of both worlds.
Interesting article, however zero mention of accessibility…
For those who think that you can’t redesign an entire site simply by editing the css file, I have one comment: csszengarden.com. One source file, that is, one file containing all the mark up and literally hundreds of user submitted css files to radically alter the appearance of the site.
Actually, the only area of ebay’s home page that still uses a table-based layout is the header, and there were some logical development reasons for doing so. The home page also does accept dynamic data from a variety of sources that may also be table-based, since the home page infrastructure doesn’t, and won’t for business reasons, enforce CSS-only design patterns.
Although I typically advocate the use of CSS, there are times, especially given a RAD environment on a site where a small mistake can cost millions of dollars, when you have to tell a Java developer who understands the DOM structure much better than the page layout paradigm, to just use a damn table, if only to stop him/her from asking why IE keeps bumping a bad float down.
You can harp on all you want about CSS, but until/if all browsers support CSS in as consistent a way as tables are currently supported, the list above will remain, if for no other reason than the simple fact that most huge sites need to deal with tons of active content, much of it not from that sites domain. This argument does not even consider the millions of lines of legacy code most huge sites need to support.
I suspect that most lead presentation engineers at all of the sites listed are fully aware of the capabilities of CSS, and would be happy to require all browser to support them in a consistent way.
Switching entirely to CSS/XHTML code is a daunting task for these massively large websites. This is tantamount to driving a big-ass oil tanker; one bad move and the oil spills!
@ Derek Miranda
csszengarden is *highly* misleading. The level of flexibility that one *appears* to have is not one that one actually has with CSS. A lot of hacking around is needed to make adjustments that are easy in HTML.
I’m pretty sure you’re admiring the eye candy as much as I am. Are you curious how they made the pretty alpha-blended box? Well, not in CSS, but in photoshop or the like. Just check this out:
http://www.csszengarden.com/001/zen-bg.jpg
So you’re thinking “ohhh, pretty! CSS is beautiful!”, but you’re just admiring photoshop. Unfortunately, they have tricked this association in your mind and you’re now evangelizing CSS-only methods, while they themselves are actually using the very same deprecated hacks!
Arguments for CSS-only layouting rely on emotion more than on practical merit. It’s certainly not an emotion widely shared by the developers of sites that are actually getting traffic.
@ everyone attempting to champion table-based layouts:
Several people have listed reasons why tables are better than CSS for layout but it’s obvious to me that these people don’t have an in-depth understanding of CSS. None of the so-called problems are an issue once you understand how to deal with them and ultimately the CSS solution is cleaner, much more semantic and valid. The ONLY thing that tables do better than CSS in terms of layout is vertical centering. Vertical centering is a pain to accomplish with DIVs and is extremely simple with tables.
Just because you don’t know how to use CSS properly doesn’t make it inferior to tables. That being said, it’s true that the visitors don’t care as long as it works. But CSS was primarily designed to make things easier on the developer and if you know how to use it you can write code that’s much more readable and maintainable in half the time it would take to accomplish the same goal with tables.
@ Dave
“everyone attempting to champion table-based layouts:”
You will notice that I advocate a best-of-both-worlds approach in each of my posts. CSS-only is only for the masochistic. Why would you pain yourself by rejecting functionality that you cannot find in CSS? Did you get bullied by someone who loves tables in school?
@ Dave
“Vertical centering is a pain to accomplish with DIVs and is extremely simple with tables.”
Exactly: now please explain WHY we should reject tables again? Please don’t deny that CSS utterly sucks for elastic layout rendering, especially in the vertical direction. We do NOT get the same functionality and definitely not orthogonally. That’s one of the many gaps that tables fill beautifully. Go ahead and try filling a vertical space with multiple DIVs where one has fixed size. The table method will be more intuitive and elegant AND stable than the CSS one.
Apparently you also never have to deal with alignment of different page areas where you don’t know the dimensions in advance. You also don’t have to deal with shrink-wrapped containers. Yeah, the CSS standard supports that part, but CSS reality doesn’t.
If CSS sucks for a task and tables are, as you say, extremely simple, then only a fool would reject tables.
Of course you have addressed none of my previous objections. Simply dismissing objections does not constitute a valid argument.
@ Dave
“Just because you don’t know how to…”
… and an arrogant attitude doesn’t constitute an argument either. It just makes you look more like a fool who is pushing an inferior solution. It’s not about not knowing how to do a certain hack, it’s about us not being able to justify throwing out a working and stable solution in favour of a hacked-together and unstable one.
There is no technical argument for throwing out tables entirely: CSS has serious limitations. As long as you can compensate the various trouble areas with tables, there’s no problem.
@Serhat
“Why would you pain yourself by rejecting functionality that you cannot find in CSS?”
I’m not the one pushing an inferior solution and looking like a fool–there is nothing tables can do that CSS can’t. You just obviously don’t know CSS well enough to do it. That’s like saying Spanish is an inferior language to English just because you don’t know how to speak it. The fact that you felt it necessary to attack me personally is clear evidence that your opinion is based on emotion and not knowledge. You continue to use antiquated and deprecated coding practices and become hostile when someone challenges your ideas. I designed with tables for many years and have a lot of experience with both and can’t tell you with absolute certainty that CSS is a superior solution.
I’m going to go out on a limb here and say that you have little to no background in true programming, OOP or otherwise. Any good programmer knows that readability and maintainability are paramount and efficiency takes a back seat to those. CSS is clearly light-years ahead of table based layouts in terms of those things but the great thing about it is that you don’t have to sacrifice efficiency to gain the readability because it’s also more efficient than tables. It’s true that there are one or two things that can be accomplished with tables a little easier than with CSS but that’s no reason to be writing all that code soup.
I haven’t read all the posts because there are too many, but I’ll address some of the things you’ve said:
“Every pro-CSS argument is laced with insults and name-calling to those who don’t agree. It’s typical for a “I’m right even if I can’t back it up” point of view.”
I find that humorous since I in no way insulted you yet you turned around and insulted me, doing the very thing for which you lambasted someone else.
“CSS has serious flaws and is NOT as accommodating to elastic layouts as tables. Elastic layouts are *typically* useful for accessibility purposes. Why CSS is so flawed in this regard is a complete mystery to me.”
Another clear indication of your lack of knowledge about CSS. CSS is very accommodating of elastic layouts. I have made one myself: http://dave.ravenflight.net I challenge you do the same and have markup even half as lightweight and readable as mine.
“So you’re thinking “ohhh, pretty! CSS is beautiful!”, but you’re just admiring photoshop. Unfortunately, they have tricked this association in your mind and you’re now evangelizing CSS-only methods, while they themselves are actually using the very same deprecated hacks!”
Apparently you’re the one looking at the site and thinking “Ohhh, pretty!” because you completely missed the point of the site. If you’ll notice, those layouts are very different from one another but they all use the exact same markup. And just because you’re calling something a deprecated hack doesn’t make it so. There are no deprecated hacks on that site. I invite you to be more specific and actually point one out. And before you say it, no, using an alpha-blended background image is neither deprecated nor a hack.
You have repeatedly referred to CSS as being hacky which is yet another indication of your lack of knowledge about CSS. You’ve been very vague about what you think is so hacky because you can’t actually point to anything specific. Again it comes back to you not having an in-depth understanding of CSS. That said, you DO have to use some “hacks” occasionally for things to work in IE6 because IE6 is an antiquated browser, but throwing in the occasional * html before a line of code is way easier, cleaner and maintains readability much more than using a table based layout instead.
So call that fact-less, emotional, ““I’m right even if I can’t back it up” point of view if you want, but you’re only hurting yourself by not learning more about CSS. The end user doesn’t care but you will when you have to update your code.
@Serhat
“Why would you pain yourself by rejecting functionality that you cannot find in CSS?”
I’m not the one pushing an inferior solution and looking like a fool–there is nothing tables can do that CSS can’t. You just obviously don’t know CSS well enough to do it. That’s like saying Spanish is an inferior language to English just because you don’t know how to speak it. The fact that you felt it necessary to attack me personally is clear evidence that your opinion is based on emotion and not knowledge. You continue to use antiquated and deprecated coding practices and become hostile when someone challenges your ideas. I designed with tables for many years and have a lot of experience with both and can’t tell you with absolute certainty that CSS is a superior solution.
I’m going to go out on a limb here and say that you have little to no background in true programming, OOP or otherwise. Any good programmer knows that readability and maintainability are paramount and efficiency takes a back seat to those. CSS is clearly light-years ahead of table based layouts in terms of those things but the great thing about it is that you don’t have to sacrifice efficiency to gain the readability because it’s also more efficient than tables. It’s true that there are one or two things that can be accomplished with tables a little easier than with CSS but that’s no reason to be writing all that code soup.
I haven’t read all the posts because there are too many, but I’ll address some of the things you’ve said:
“Every pro-CSS argument is laced with insults and name-calling to those who don’t agree. It’s typical for a “I’m right even if I can’t back it up” point of view.”
I find that humorous since I in no way insulted you yet you turned around and insulted me, doing the very thing for which you lambasted someone else.
“CSS has serious flaws and is NOT as accommodating to elastic layouts as tables. Elastic layouts are *typically* useful for accessibility purposes. Why CSS is so flawed in this regard is a complete mystery to me.”
Another clear indication of your lack of knowledge about CSS. CSS is very accommodating of elastic layouts. I have made one myself: http://dave.ravenflight.net I challenge you do the same and have markup even half as lightweight and readable as mine.
“So you’re thinking “ohhh, pretty! CSS is beautiful!”, but you’re just admiring photoshop. Unfortunately, they have tricked this association in your mind and you’re now evangelizing CSS-only methods, while they themselves are actually using the very same deprecated hacks!”
Apparently you’re the one looking at the site and thinking “Ohhh, pretty!” because you completely missed the point of the site. If you’ll notice, those layouts are very different from one another but they all use the exact same markup. And just because you’re calling something a deprecated hack doesn’t make it so. There are no deprecated hacks on that site. I invite you to be more specific and actually point one out. And before you say it, no, using an alpha-blended background image is neither deprecated nor a hack.
You have repeatedly referred to CSS as being hacky which is yet another indication of your lack of knowledge about CSS. You’ve been very vague about what you think is so hacky because you can’t actually point to anything specific. Again it comes back to you not having an in-depth understanding of CSS. That said, you DO have to use some “hacks” occasionally for things to work in IE6 because IE6 is an antiquated browser, but throwing in the occasional * html before a line of code is way easier, cleaner and maintains readability much more than using a table based layout instead.
“There is no technical argument for throwing out tables entirely: CSS has serious limitations. As long as you can compensate the various trouble areas with tables, there’s no problem.”
No one said tables should be thrown out entirely. They’re great for tabular data. Just not layouts. And the trouble areas you refer to are with your knowledge of CSS, not any CSS limitation.
So call that a fact-less, emotional, ““I’m right even if I can’t back it up” point of view if you want, but you’re only hurting yourself by not learning more about CSS. The end user doesn’t care but you will when you have to update your code.
Sorry for the double post. It errored out the first time and I thought it hadn’t posted. I also added a paragraph before posting again, so the second one is the complete one.
@ Dave
To be perfectly clear: I do not advocate using tables where CSS works realibly. I do advocate using the best tool for the job, which in some cases is tables. With other words, my sites would fall in the category “uses mostly CSS and also 2-3 tables”.
To attack those sites on the basis of using *some* tables is ridiculous and borders on the fanatical. Can we expect “you’ll go to Hell if you use tables” next?
You can attack my expertise and try to paint me as an uninformed newbie as much as you like, but realize that this condescending behaviour is very consistent with MY assessment of CSS-only folks.
If you want to win me over or want me to just go away, how about instead showing how the 7 problem areas can be solved using CSS alone in a way that’s elegant and intuitive?
Please also explain why CSS flexibility is NEEDED for ALL situations. For example, a sticky footer that works with different browser and content sizes is a breeze using tables but a nightmare with CSS. I just need it to work reliably and always be at the bottom. Seriously, I don’t need CSS gizmos to place it at the top or at the side. Tables it is, sir.
I don’t know how much you’ve dealt with IE7 CSS support, but here’s a clue: it’s broken too. Tables of course work flawlessly, while CSS requires ifs and hacks.
So, yeah, being in denial about weaknesses in CSS or assuming that people don’t need to do the things CSS can’t do is not going to be very convincing indeed.
@Serhat
I haven’t attacked any site for using tables and no, you won’t go to hell for doing so. I’m merely saying that these problems you keep talking about are not problems at all when you know how to deal with them. CSS is the superior solution not because it’s easier to use in every single situation but because it makes your code much more readable, maintainable and flexible. It is easier to use in most situations but even when it’s not, adhering to standards and producing quality code is more important than throwing in tables just because their easier. That’s the lazy way out.
IE7’s CSS support isn’t broken, either. There a few things that it handles differently but it’s no big deal when you have an in-depth understanding of how it works. I produce layouts on a daily basis that are consistent across IE7, FF, and Safari and I rarely use any conditional comments or write any code that’s tailored to a specific browser. There are situations where you just have to tailor your code for one browser or another but if you know what you’re doing those situations are rare. After I’m done I then go back and check out the site in IE6 and throw in a few * html hacks to make it consistent there too. Super easy.
If by a sticky footer you mean a footer that resides at the bottom of the viewport regardless of page length or scrolling, then check this out:
Markup:
CSS:
#footer{position:fixed; bottom:0;}
Not sure how it gets any easier than that. Granted, that doesn’t work in IE6 and the only way to make it work in IE6 is with some JavaScript, which isn’t hard, but that’s not a problem with CSS and it works perfectly in all other browsers.
One more thing.
“…this condescending behaviour is very consistent with MY assessment of CSS-only folks.”
Again, just because you say it doesn’t make it so. I haven’t been condescending in any way and it’s your own behavior that is consistent with your assessment.
Oops. It striped my markup. There was supposed to be a div there with an id of footer.
Everythink I read is like:
Mercedes is better than Porsche
Pure C and C++
high level prog vs. low level.
DB2 or Oracle?
Rugby or football?
ad so on…
Go work ..
@ Dave
CSS and tables are not mutually exclusive. It’s not a package deal where you can only have the good if you take the bad. You can have it both ways.
As for the footer situation: let me try to explain it more clearly. Let’s say the vertical flow of the page consists of the following:
[header - fixed height, at top of page]
[content - flexible height, fills remaining space]
[footer - fixed height, always below content]
The effect I need is that [content] will stretch so that the sum of the heights will be at least the page height. So, if [content]’s height is small, the footer will be at the bottom. If [content]’s height is large, the footer will be just be part of the vertical flow and you have to scroll down to see it.
I couldn’t find any elegant CSS solution for that problem, except for an ugly hack. With tables the solution is trivial and much cleaner, even if the header and footer heights aren’t known in advance.
Now, your solution to a *simpler* version of the footer problem requires javascript to get to work reliably on all browsers. No thanks.
It’s not possible with CSS to tell a DIV which percentage of remaining vertical space to take when there are multiple DIVs in the flow, some of which have fixed width. I *have* studied this in-depth and have not found it. Care to point me to the solution so I can hop on your bandwagon?
You go on and on about readability and maintainability. What the hell, man? We’re talking about a *few* lines of code out of tens of thousands… and this is code that is in *1* place for me, namely the centrally defined and well-documented page object.
As for being condescending: perhaps you’re used to being called lazy and unqualified, but I’m not. Do I really have to explain this?
Now I have looked at the link you gave earlier. I do believe I can make that same page my way (i.e. 2-3 tables max, rest CSS) AND have smaller code. To clean up your code, I’d start by stripping out the useless \r’s that constitute 2% of your HTML code.
Then I’d wonder why the HTML code needs all the pretty indents and HTML comments — it’s the browser that has to read the file, not a human being. Heck, it would be trivial to add a HTML compression layer to strip out unneeded information; you’d take off 8% of your already compact file.
But hey, it makes the view-page-source geeks happy, right?
[…] Top 30 Popular Websites That Still Are Using Tables as Main Layout Structure: There are more than I thought. Some sites, like Google, use tables for compatibility reasons. You can load Google in pretty much any browser. […]
[…] prólogo es para explicar que me llamó bastante la atención este post de web2.0flow donde listan 30 sitios muy famosos que aún utilizan tablas (en realidad algunos no, aunque ese sea el título del post) para su diseño. Desde el mismo Google […]
Once you break the top 100 list, then talk down to table users
Without tables i’d keep kicking my coffee over…
Tables are used for presenting data in a tabular form, whether that is used with layouts or with pure data. CSS on the other hand is used to control how things look on the screen. So if anyone like to reinvent the wheel by using CSS to design tabular layouts, then that is great. Though the source readability of information in CSS is bad compared to that in tables. So use whatever you like, just make the site readable, easy to navigate through, good looking, and compatible with FireFox, Safari, and IE. If you can also provide compatibility to Lynx, then you are a good webpage designer
[…] stumbled an interesting write-up about top websites that still use tables. No, the commentaries are not that interesting (using tables doesn’t mean that these websites […]
I try to stick to divs and css, but occasionally a desired result arises where I have to use a table for the layout. I save ‘have to’, because the css way of doing it doesn’t work in IE6.
Probably worth mentioning that the desired ‘layout’ was achievable with css, but not the round corners and sides with tiled graphical elements.
Not that I couldn’t beat the code into submission for IE6 whilst avoiding tables, but that to get it to work requires way too many divs
In my CSS frustration I typed “CSS sucks” in google like the rest of you
I’m a noob in webdesign. I have only made 2 simple sites (title bar, left menu, content are) using table.
I decided to try CSS. I have used CSS for “normal” styling. I now have to create a site from scratch and wanted to try CSS for main layout.
I want a fluid top title/header (100% width) using graphics (currently a left.png, spacer.png, and right png).
After 5 hours or more I managed to get this. But already I’ve used a hack or two.
1. hack:
There was a 3pixel gap in IE6 between left.png and spacer.png, but not in FF. Ok found a relatively simple hack for this using google (margin -3px or something like that).
2. hack:
The left.png is static size. The spacer.png is 1 pixel and is set to 100%. This leaves no space for the “end” grafik to the left. It is positioned under the header to the left. I thought it would be able to see that the div to the right takes up fixed space at that the middle 100% would just fill the reamining space. Noooo. apparent CSS does not think ahead.
I then used Float right and offset the top position by the height of the header. This actually seems to work….In Firefox. In IE6 the header is now double the height because is still regards the end grafik i pushed up to be there.
I don’t know how to solve this cross-browser and I’m getting pissed.
To be honest, I’m not even sure if/how to do this with tables but I’m dissapointed with CSS.
I still want to learn CSS even though it sucks, so I’ve decided to make a fixed size centered site instead. Apparently, from my own limited experience and what I read on the net CSS does no do fluid designs well.
For those of you claiming that CSS is superior for layout in all circumstances: Try creating a CSS-only form with fields in multiple ‘columns’. Without javascript. And I’m not talking about a simple contact form, I’d like you to reproduce something more complex, like an HR suite of forms.
I will guarantee you that you will revert back to tables in an instant.