I am using currently HTML table. Several times I have been remarked to use CSS. On the other side some people say CSS can be really messy. Do you agree? What is the advantages and disadvantage of both techniques? Thanks.
its all depends, if you new school its all about Div's and tableless designs if you work in the industry (private or corporate sector) its all about tables and backwards compatibility... here's what works for me...keep it simple if im doing a 3 column site i'll build it using tables and then do the rest with divs as a note you should...use tables for tabular data, plus internet explorer does not like div's
a valid/semantic website will work perfectly in all browsers (might need a few fixes), and with multiple stylesheets is always backwards compatible if the site is structured/coded correctly.
Go with CSS divs. Using divs will make it easier down the road if your design happens to change. (All you will need to update will be the CSS.) Also, by using CSS layouts, you will be decreasing the amount of code on a web page. Which will result in a faster load time. Only use tables to display data. All browsers support CSS layouts. Tweaking may be needed, for full compatibility. In conclusion, if you are comfortable using table-based layouts, and don't have the time to work on CSS layouts, then that may be the best choice. If you have the time to learn how to develop CSS layouts, it will pay off a lot down the road and save you quite a bit of maintenance time.
So you're "newschool"... yet you use tables for a simple 3 column layout which you can easily do without tables, and then you go on to say you should only use tables for tabular data? And how does IE not like division elements? Or are you just talking crap based on the problems you had when you tried to make a layout using floats, running into double margin bugs, having problems clearing floats, not knowing about faux columns, etc?
im just giving my .02 take it or leave it you could at least explain/help the original poster as what he should do... ala (a list apart) has a great read on "faux" columns http://www.alistapart.com/articles/fauxcolumns/ here's a great read on "why tables are stupid" http://www.hotdesign.com/seybold/ the biggest problem i've faced with IE is with transparent PNG's (that and that fact the fonts look better on a MAC )
I'm asking you why you'd use a table if you're against using them for anything other than tabular data and how IE doesn't like divisions
sorry, let me explain, im not against using tables, the only thing I'm against is IE, frontpage, dreamweaver and a few other web apps. I'll clearly admit I'm not the best coder and have only been hand coding my sites for about 6-8 months, and i started learning tableless design while using tables, might sound dumb...but basically I would use less and less tr's, and td's while making my sites and using div's more and more, since i learned it on my own by trial and error. and from what i've learned using divs in IE for tableless is the whole margin and padding issue, which, i know isn't really related to div's...i'll explain, remember i learned from trial and error, so yea i probably wasted alot of time if you have a some stuff in your tables like ul, ol, blockquote these all have different margin and padding based on the web browser. so when i first started i found it easier (for me) to make a 3 column table and that kinda stopped all that "jumping" around that you get when you have a fixed site in pixels and the user starts resizing the browser. i know, i know, your probably gonna say i should b using a fluid width and height with the min-css hack or what ever, im designer before coder, so I never really took the time to put that much into it, plus as a designer I'm not a fan of fluid sites
If you are building ur site for once, maybe tables will do but I suggest using CSS because its more flexible and if you are going to change it again and again, CSS will be a great option though learning to use CSS for cross browser compatibility may take a little time.
All I have to say is there's going to be alot of people wondering why their table-based-layout sites fall to the bottom of the list as Search Engines place more focus on advanced semantics.
For me CSS is the best, it makes your sites layout easier to handle and has a style that can be applied to many pages and its more flexible.
Well I'm certainly not a css expert, but I have converted most of my content to css from tables. Not everything since I'm not yet proficient enough to deal with complex layouts. But where I have made the conversions, the code is much easier to read and the data is not lost in the html.
CSS is only messy when it's inlined alongside the HTML code or when too much code is used to achieve the necessary effect (multiple stylesheets are included among the guilty parties). New school? That may have been the case back in 2002, but nowadays it's the industry standard (and by the way, CSS is backward compatible - I can even get sites rendering virtually identically cross-browser all the way back to Internet Explorer 5.01 with only a couple of hacks - the best known of them being the simplified box model hack to compensate for IE 5's broken box model). I work from home (my living room, actually) and all I code are semantic layouts using valid HTML and CSS - you'll never catch me DEAD coding a table, unless it was for an HTML email, which I don't even touch to begin with. Want a 3 column layout that uses semantic markup and CSS? Here you go: www.dan-schulz.com/temp/3columnlayout/ - RELEASED TO THE PUBLIC DOMAIN And finally, Internet Explorer handles DIV elements just fine. Not all browsers actually. Netscape 3, for example, won't understand CSS a single bit, but it will render the HTML just fine. Multiple stylesheets are also a waste of time, server requests, download packets and code, unless you're separating them by media types (not all of which are supported, like braille for instance). Not really. You should use the appropriate HTML for the job (this is called semantics). A basic understanding of block-level and inline elements (as well as those elements' meaning) is required to grasp this concept though. Oh, I wouldn't say the page (though that is certainly true). The real benefit comes from the saved weight of the entire site. Especially if it was coded properly to begin with. Pretty much, but I have seen a couple instances where layout tables were the best (and most appropriate) option - shocking, I know. As I said earlier, all modern browsers support it. Even Internet Explorer 5 can be made to behave. As much as I hate to say this, I do have to agree with this. Use what you're comfortable using, but do strive to learn how to do things properly. No kidding, especially if you separate the structure from the appearance as much as possible (you wouldn't believe how many people stick their menus inside the header area, even though they're not the same type of content - I wonder if they've ever heard of floats and negative margins). IE isn't as bad as many make it out to be. It's more like the misguided red-headed stepchild of the family. With a little TLC it too can achieve the same level of excellence as the other browsers (I mean this from a Web developer's stand point, not an engineer's standpoint). As for the rest of that comment, believe it or not, I was in the same position as you at one time. If you want my advice, forget about DIVs. Just think structurally (header, menu/s, content, sidebar/s, footer) and then apply your CSS afterword. That's easily curable. Just add this code to the very top of your stylesheet. html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul, dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object, a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span, strong, sub, sup, tt, var { margin: 0; padding: 0; } Code (markup): You can use the 3 column layout I gave away earlier in this thread if you want. I'm actually going to use it for the layout of Minimal Markup when it launches next year. I do have to change the CSS for the search form though. That, and replace the * {margin: 0; padding: 0;} rule at the top of the stylesheet with the one I told you to use at the top of your stylesheets. If the design calls for it, then feel free to. But not all designs need it. You actually have it the other way around. With the table layout, your entire design is locked into place. CSS on the other hand will give you almost unlimted possibilities, especially once you become experienced enough with it. *thwap* Search engines don't police the Web that way. They could care less if the site uses semantic markup or nested tables for layout.
As Dan said. Also note that tables have to fully downlaoded before they render, unlike CSS/semantic mark-up.
You can get around that problem with tables if you set their layout to fixed using table-layout: fixed; as a property of the table element in your stylesheet. Below is a style I use for all my tables by default. table { border-collapse: collapse; empty-cells: show; table-layout: fixed; } Code (markup):
But what if those semantics could be used to determine if the page format is one the user is likely to want returned ? For instance, a budding developer might like pages with alot of <code> & <samp> elements.
First - use semantic markup - this includes tables where the data is actually tabular. Second - improve the appearance using CSS. Third - improve interaction using javascript if desired. But there are some things that CSS is not very good at (veritcal centering for example) and there are some browser support issues that restrict what you can do (no inline-block in Firefox for example). If you find yourself spending hours and hours trying to fix CSS layour problems that could be fixed in minutes using a table then use a table. CSS - and consistant browser support - still has a way to go.
Unless you're talking about Google Code or Krugle or some other code repository engine, then I'd focus on the content that surrounds that code, not the code itself. But the proper use of CODE and SAMP just makes me feel so warm and cozy inside, regardless of whether it was "done for SEO" or because it's the right thing to do.