Possibly best to delay transition from tables to div's?

Rather than redesign table-laden sites to css/div tags layouts – does it really make sense to wait on html 5 to do so given that 5 will have structure markup? Assuming 5 comes into use within the next year or two…albeit buggy at first.

I’m still on the fence, especially if current css sites will yet then need to be redone again with the introduction of html5, then there is debugging the css design for Firefox, etc, add basically having to strip the sites down to their core essentials and transform them into a much less readable fashion for an editor (human and software). There is also the new behaviors to deal with, like whether things stay put, figuring floats and absolute positioning throughout, etc, That’s one thing I can say about stalwart tables, they hold things and don’t let them out!

At the same time - wondering if css layout might be around for some appreciable amount of time, or, whether it will turn out to be a vogue session – I have hundreds of pages to convert.

Most of the sites have been around for more than 2-3 years with a couple near 10 years, although my thoughts are that the div’s s may help their search engine rankings – as far as mobile, transferring to divs could help even if they’re not fully device tested. Even though few searches currently come from mobile devices (informational based sites that are for the most part bring non-locally oriented searches)

When and with what to convert, that is the main question here.
However one major site needs restructuring/major total edit right now.

HTML5 will take years to be ready for the real world. No browsers really support it yet. Even basic elements like <nav> and <section> are not recognized by browsers yet. Besides, HTML5 won’t make the web much more meaningful that the current HTML versions. So if you wait for HTML5 to be truly ready, you will be waiting many years; and in the mean time, your users will be fighting with your old, inaccessible code, and potentially going away.

So I’d start to upgrade now. You could set things up so that upgrading to HTML5 would not be hard—either by using a CMS with just a few templates, or by using PHP includes etc.

On the otherhand, with the exception of IE, all you need to do give HTML5 elements their proper display type… and you could start converting that table site directly into html5 right now?

it’s like a something I heard about buying new computers, if you are waiting to buy because you heard there was a new development around the corner, there will be yet another new thing when that development becomes the current thing.

consider also that the leap from table - div is FAR GREATER than HTML4 -HTML5, in a sense you are doing the ground work for the later conversion, so it’s not as if that labour will be lost.

Where have you been for the last ten years - these things have been discussed to death already so it’s really time for you to make a choice :). Read through this thread for a well balanced discussion.

None of the well known designers (or major sites) are using tables wholly for layout now. There simply is no need for tables in all but a few types of structure. Tables have just as many bugs and workarounds as CSS except that you got used to the table ones.

At the same time - wondering if css layout might be around for some appreciable amount of time, or, whether it will turn out to be a vogue session – I have hundreds of pages to convert.

CSS has been around for 15 years already - it’s not going anywhere. Indeed with the new CSS3 modules it seems that more and more native applications are also being created with css and html rather than other languages.

Quote from John Allsopp:

Over the coming five to ten years, I have little doubt that the vast majority of screen-based interfaces will be developed using CSS, HTML, and JavaScript. That will affect in-flight entertainment systems, car dashboards, ATMs, you name it.

The future is css based :slight_smile: (albeit in a more advanced form using css3)

Most of the sites have been around for more than 2-3 years

It would have been prudent to have changed then at the time but I guess that’s always easier to say in hindsight.:slight_smile: The overwhelming evidence from the last 7 years shows that css far out performs table sites in every area. As I said using the odd table for a tricky structure is no big deal but the days of nested tables should be left far behind. I must have coded 2 - 300 hundred site templates in the last couple of years and the times I’ve needed a table for a certain stucture are few and far between.

as far as mobile, transferring to divs could help even if they’re not fully device tested.
Mobiles just can’t handle tables at all for the very reason that you like tables - they just don’t squash or move to the next line.

As far as html5 goes then I’m not keen on it as I am seeing a return to badly formed and bloated pages. It seems that people who never knew how to code are jumping into html5 without a care for semantics and structure - the very things that html5 is supposed to promote but in essence seems to have just muddied the waters further. I think it will eventually get resolved but it’ll be a few years yet.

On the other hand html4.01 isn’t going anywhere and things that work in html4.01 will still work forever. Html5 will make some things easier of course but its not like the shift from tables to css. I’m not prepared to use something like html5 when it will only work with javascript enabled in IE8 and under as their market share is still quite large.

However, a lot of well known designers are promoting html5 for use right now so you need to make your own mind up. (Sitepoint has a new book out promoting html5 and css3 also.)

As far as html5 goes then I’m not keen on it as I am seeing a return to badly formed and bloated pages.

Also we’re seeing the new CSS3 stuff going through the same old 1990’s stuff: “Best Viewed in Browser X” badges, too much animation with transitions, people using retarded (but “awesome!”) fonts with @font-face, more animation, text-shadow on tiny body text (I’m seeing this even on sites of Those Web Guys Who Should Know Better), m0aR animations, and way too much Javascript (especially that already-tired canvas trick of drawing something wherever the mouse goes… see a cute version of this at cornify.com).

It’s like Marquee and Blink all over again.

…You could set things up so that upgrading to HTML5 would not be hard—either by using a CMS with just a few templates, or by using PHP includes etc.
php includes idea I like – if I had enough of a working understanding of how the things operate, would consider.

Beginning layout, as a starting point – what would be most browser friendly then, trying to come up with the main building blocks for converting:

a) css2 vs css3 - is there such a thing as an itemized list that covers what markup has been tested/works in the different browser versions?

b) xhtml vs html - and should xhtml be strict? is xhtml really preferred for mobile devices these days?

c) figuring that tabular data will go in tables

Looking back, I think one of the reasons I originally turned away from css was the way in which absolute positioning placed things – all the different screen sizes, etc.

On the HTML vs. XHTML question, this sticky thread is old, but all still absolutely true:

The bottom line is that you should probably code to HTML 4.01 Strict. There’s almost no reason for XHTML, and several persuasive arguments against using it (including lack of IE support, inability to tolerate even minor faults, etc.).

(I’m in the process of abandoning XHTML for my own stuff - that sticky thread made a convert out of me.)

The Sitepoint Css reference documents all the css2.1 properties and the browser support.

For CSS3 you can check at caniuse.com.

Looking back, I think one of the reasons I originally turned away from css was the way in which absolute positioning placed things – all the different screen sizes, etc.

Unfortunately that’s because beginners to css latch on to absolute positioning and use it in the wrong way without understanding the basic concepts of layout. That may not be their fault originally but before you start using something you have to learn how to use it effectively.

Absolute positioning is fine in small doses but not meant for structural layouts unless they are incredibly simple. Most layouts are a mixture of static positioning, floats and small doses of absolute positioining. There is no problem with different screen sizes as long as you use the right tools for the job.

Beginners to css tend to quickly grasp the basic concept of absolute positioning but don’t realise how limiting it is and why it is wrong to use it in certain situations.

The same concept applies to tables and a beginner can’t just grab a table and lay it out properly without learning all the tricks. There is a learning curve in whatever you do.

Well, like was said above HTML5 is mainly non normative and because it bases some philosophy on resurrecting tags. That were previously deprecated for a good reason - solely because they are used a lot - doesn’t really help the author in any shape or form.

It seems to require hacks or JavaScript in most cases for either for backwards compatibly or wow factor for current modern mainstream browser use so is pretty much an experiential nightmare in flux. Even the authors of the SP book don’t really recommend a lot of the HTML5 practices and when questioned mentioned HTML 4.01 was a solid foundation to begin with unlike HTML5.

It seems to require hacks or JavaScript in most cases for either for backwards compatibly or wow factor for current modern mainstream browser use
That alone rules it out for me.

^ what xhtmlcoder means is, HTML5’s new elements (such as <header>, <footer> etc) are not recognised by IE under 9 at all. The (only) way around this for IE6-8 is the Javascript document.CreateElement(‘thenewelement’); otherwise those IE browsers assume no tag at all (will show the content inside them though… some people get around this by wrapping divs either around the outside of their header/footer/nav tags, or around the content inside… which is kind of doubling up the code and bloating everything in my opinion).

Meanwhile all the other browsers who don’t support HTML5 do still recognise that there’s a tag there, but do not know what it is. For accessibility software, this usually means “some default tag” (which isnt bad, but not the semantics we are hoping for). For CSS, this usually means setting these elements to “display: block” and styling them from there.

The non-IE browsers would style <foo bar=“baz”> if you wrote it.