Is it prudent to use HTML5 elements considering older browsers?

Question

I'm thinking of things like <header>, <footer>, <article>, <section> and the HTML5 doctype.

Is there any benefit to designing pages that way now? How will older browsers see them? Can they be validated?

I'm just not sure how backwards compatible these things are.

Answer 1

A great way of ensuring backwards compatibility is to use something like modernizr, its a javascript file which tells you which html5/css3 features the user's browser supports, and this allows you to design your code in a way that it will degrade gracefully, or just use different rules for different browsers (for example, make a class which uses border-radius for browsers which support it, and a separate one with image based corner rounding for browsers which do not support that property.

Modernizr site

Answer 2

You've asked a couple questions in your post:

Is there any benefit to designing pages [using HTML5] now?

yes

Using the new semantic web, you gain semantics. You give meaning to your data, which can then be made to do wonderous things.

How will older browsers see them?

It depends on the browser

The HTML spec says that non-standard HTML elements should be ignored, as if they were never in the source to begin with (unless something tells them otherwise). For most of the conforming browsers (read: FF, Safari, Opera, Chrome) you have to give HTML5 elements a display style before they will be shown:

section, header, footer, nav, article
{
  display: block;
}

Just remember, this relies on the browser actually conforming to specification, which some older browsers *cough* IE *cough* didn't do _{(at times I wonder if the IE dev team ever read any of the HTML specs)}.

Can they be validated?

sort of...

The HTML5 spec isn't finalized yet, but there are already a number of online HTML5 validators that are available already.