Is this a good based up markup? [HTML5]

**AndreeU17** · Mar 12, 2013 16:48

Hi
I was wondering if my form of markup is the appropriate way?
I'm learning this on my spare time so it's a bit hard but i would love if anyone helped me or have me pointers on the right way for this markup, thanks.

Code:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title></title>
        <link type="text/css" rel="stylesheet" href="stylesheet.css">
    </head>
    <body>
        <header>
            <hgroup>
                <h1></h1>
                <h3></h3>
            </hgroup>
            <nav>
                <ul>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
            </nav>
        </header>
        <section>
            <article>
                <h3></h3>
                <p></p>
                <p></p>
            </article>
            <article>
                <h3></h3>
                <p></p>
                <p></p>
            </article>
        </section>
        <aside>
            <p></p>
        </aside>
        <footer>
            <p></p>
        </footer>
    </body>
</html>

Thank you

**ralph.m** · Mar 12, 2013 18:04

The first thing I'd question about that code is the use of headings. Why an H1 and then H3? There's no logic to that. And then H3s later down? What happened to H2s?

I'm not sure if <hgroup> is still a part of the plan now (it seems to go in and out faster than a ... well, I'll leave it to your imagination). But it's a silly element, IMHO. I don't think a subtitle deserves a heading tag, or even a <p> tag. I'd either put it in a div or in a span as part of the main title.

**PicnicTutorials** · Mar 12, 2013 18:17

Maybe I'll end up changing my mind, but at this point I don't ever see myself using all those fancy html5 names. I'm quite happy with my ids.

**AndreeU17** · Mar 12, 2013 19:18

Originally Posted by ralph.m

The first thing I'd question about that code is the use of headings. Why an H1 and then H3? There's no logic to that. And then H3s later down? What happened to H2s?

I'm not sure if <hgroup> is still a part of the plan now (it seems to go in and out faster than a ... well, I'll leave it to your imagination). But it's a silly element, IMHO. I don't think a subtitle deserves a heading tag, or even a <p> tag. I'd either put it in a div or in a span as part of the main title.

From my knowledge an <hgroup> is when you have more than 1 heading tag Such as h1-h6 in the <header>. What i wanted to do is have a title EX: MonkeyCoders and underneath it a small phrase usin a smaller heading size such as h3 to say Ex: "Coder-Web Dev.- Hacks- and more".

The lower H3 tag would normaly be in my opinion the title for a section or article with a minimum importance or high importance such as : "About Me", "Contact", etc. Well before i started looking into HTML5 i would of used a div tag with the id of "sub_title".
Now for the markup i used i was wondering is that a correct process? any helpful hints is appreciated. thank you very much

**AndreeU17** · Mar 12, 2013 19:21

Originally Posted by EricWatson

Maybe I'll end up changing my mind, but at this point I don't ever see myself using all those fancy html5 names. I'm quite happy with my ids.

Your right i feel using all this elements became more of a hazzle. However, i feel like my formatting and sense of coding has gotten cleaner using HTML5 and simpler. Once i started using, HTML5 i began using a bunch of class and no more div tags since that was xHTML.

**John_Betong** · Mar 12, 2013 23:12

Now that you have a working template complete your task by adding the following links preferably just before the closing body tag:

HTML Code:

<p style='display:none'>
    <a href="http://jigsaw.w3.org/css-validator/check/referer">
         <img 
               src="http://jigsaw.w3.org/css-validator/images/vcss"
               style="float:right; border:0;width:88px;height:31px; margin:2em"
               alt="Valid CSS!" 
          />
    </a>

    <a href="http://validator.w3.org/check?uri=referer">
         <img
               src="http://www.w3.org/Icons/valid-xhtml10" 
               style='float:right; width:88px; height:31px;  margin:2em' 
               alt="Valid XHTML 1.0 Strict" 
         />
    </a>
</p>

The links will no doubt come in very handy when additional scripting is added

**xhtmlcoder** · Mar 13, 2013 03:30

HTML5, mainly over complicates things for the average web author and adds bloat and many things have been redefined so don't work like HTML 4.01. The Grouping would probably be better without the skip of; Hx, anyway it's now HTML5.1 where they are moving towards though all is in flux and meant for experimental purpose only hence the mainly non-normative status.

**ralph.m** · Mar 13, 2013 07:12

Originally Posted by AndreeU17

From my knowledge an <hgroup> is when you have more than 1 heading tag Such as h1-h6 in the <header>.

Yes, but they haven't decided for sure if they'll keep it. And it's kind of a silly element, as it encourages this unnecessary use of headings.

What i wanted to do is have a title EX: MonkeyCoders and underneath it a small phrase usin a smaller heading size such as h3 to say Ex: "Coder-Web Dev.- Hacks- and more".

You seem to be confusing the meaning of Hx with the browser's default styles for heading elements. You don't use an H3 because it "looks right". You choose it because it's meaningful. You can style these elements any way you want. But to have one heading under another is kind of pointless.

The lower H3 tag would normaly be in my opinion the title for a section or article with a minimum importance or high importance such as : "About Me", "Contact", etc.

To have an h3 on a page without at least one H2 and H1 above it is wrong. These heading numbers have a meaning—each being a subset of the other. A subtitle is not a subset of a heading.

Well before i started looking into HTML5 i would of used a div tag with the id of "sub_title".

Maybe you should stop reading about HTML5 then.

Well, of course use a heading element for an actual heading, but it's not the right element for a subtitle.

**PicnicTutorials** · Mar 13, 2013 09:28

Another school of thought here on the headings is... However one that I do not follow. Each heading has a different default size. Some no doubt simply use whichever heading displays the desired font size. Before css this was most likely it's possible intention. That said, I would venture to say that as long as you were not doing weird and crazy things with your headings google would probably pay no mind. Aside from your h1 that is. That is important. But the others are so abused like metas were in the past google must give a blind eye to most of it. Hence content (aka P's and such) are given such stronger weight now.

**Stomme poes** · Mar 13, 2013 14:40

Originally Posted by ralph

I'm not sure if <hgroup> is still a part of the plan now (it seems to go in and out faster than a ... well, I'll leave it to your imagination).

It's being discussed right now. Steve Faulkner proposes it either gets fixed, or removed. There have been other ideas, like a whole new tag like <subtitle> (unlikely) or some kind of new attribute that would go on a p after a heading (somewhat more likely).

You still wouldn't have an h1 and an h3... they'd remain in order. The old purpose of <hgroup> was to show that two headings together were not really two separate headings, but were related.

Regarding headings... someone (I think it was Haydon Pickering) wrote an interesting email to the group talking about how there seemed to be two jobs for headings: sometimes they are meant for page structure (like when you web page is like a university paper, starting with h1 and branching its way down to h2's, 3's, etc) and other times are chosen based on the importance of the information they're heading (like when we have a page starting with navigation and a heading, and that heading is an h2, not an h1 even though it may be the first heading on the page).

**PicnicTutorials** · Mar 13, 2013 15:11

Originally Posted by Stomme poes

Regarding headings... someone (I think it was Haydon Pickering) wrote an interesting email to the group talking about how there seemed to be two jobs for headings: sometimes they are meant for page structure (like when you web page is like a university paper, starting with h1 and branching its way down to h2's, 3's, etc) and other times are chosen based on the importance of the information they're heading (like when we have a page starting with navigation and a heading, and that heading is an h2, not an h1 even though it may be the first heading on the page).

Good point. That's another way to do it. Usually a moot point though. As usually the most important go at the top and so on down.

**Stomme poes** · Mar 13, 2013 15:23

Only if your web page and your web content are the same thing, usually. When you are starting with auxilliary headings first, it's because you have "web site" content around (also on top) the "page" content (which has the page structure we all know and love, starting with h1).

www.paciellogroup.com was actually an example brought up by Pickering. It's not all that uncommon, and if you (as author) feel there should be a heading before the navigation, and the navigation comes before the main page content, you've got a dilemma... but generally you'd still not use an h1 there.

User Tag List

Thread: Is this a good based up markup? [HTML5]

Thread Tools

Display

Is this a good based up markup? [HTML5]

Bookmarks

Bookmarks

Posting Permissions