HTML5 section/article/aside

Confused with semantic mark-up

[shug]

Hello, hope to get some advice from you all.

I have a site of 48 pages coded to xhtml strict served as text/html.
I would like to move this across to html5 just to keep current and to get my hand back in. I don't have a blog or anything to sell in fact it is a plain old tribute history type site but the more I read about how to use Section/Article/Aside the more it puts me off doing it because everyone appears to have their own idea of what constitutes a section or an article or aside etc. I really want to keep it simple and don't want to go adding extra mark up if it is really not required but at the same time if it is the correct thing to do then fine. Would it be acceptable to have my main content i.e. Div id="maincontent"> changed into Article or Section? Basically what I have is a series of factual stories which include some photographs. Would the photos have to be changed from simple Divs to Aside?

I also have a main navigation bar (horizontal dropdown menu) but also a vertical menu, should they both be marked as Nav or should the vertical menu be an Aside, they both pertain to site navigation?

I hope that makes some kind of sense and look forward to your advice. Many thanks.

[mattur]

You don't have to use the new structural elements. Just change your doctype and you're good to go. You can then add these new elements over time, where you find it useful to use them.

As a start you could just change your <div id="maincontent"> to <main>.

You could then change your story container divs into <article>s and put your images into <aside> or <figure> if useful - to you, the author - to do so.

If it's complicated to you, the author, it's unlikely your readers will find it particularly comprehensible or useful either. You're not doing this to impress the semanticists, the purpose of all this is to serve users, and improve the maintainability of your markup.

These new structural elements are just lightly-flavoured divs. If you're spending more than 5 minutes on figuring out how to use them you're doing it wrong. Keep it simple :)

[graeme_p]

Do it over time, and make sure you understand the rather unintuitive and sometimes vague definitions of some things. I would do <nav> and <main> first as they help search engines, and leave the rest.

Its better not to add semantic markup than to get it wrong.

[shug]

Thank you both for your advice. What do you think about the vertical navigation which is in a left sidebar. Should that me marked up as Nav due to it being primary navigation? I presume that just because there is content in a sidebar that does not mean it should be marked up as an aside?

Thanks again for your help.

[penders]

I presume that just because there is content in a sidebar that does not mean it should be marked up as an aside?

Yes I agree. Although, maybe it could, when it is used outside of an <article>?

I think the most common use of an <aside> is for secondary content inside an "article", as in the English definition, "a temporary departure from a main theme or topic". Ref: [dictionary.reference.com...]

[tangor]

Your actual content will determine in any of these available semantic markups are required. If you don't need them, then don't use them.

Your most specific question is what label your two navigational systems. As both are NAV then you can mark them as such. Correct me if I am wrong, but there is no limit to the number of NAVs that might appear on any page, as equal to the number of H1's on a page (there is only one of those per page, article, section or aside).

[shug]

Many thanks for that, helps a lot.