HTML5 semantic transformation

Question

Is this correction correct semantically talking? I've written my doubts inside the HTML comments to explain my thoughts.

<article>
    <h2>Movies</h2>
    <h4>Genres</h4>
    <p>Below you can see the <b>available genres</b>:</p>
    <p>1. Action</p>
    <p>2. War</p>
    <p>3. Comedy</p>
    <p>4. Horror</p>
</article>

VS

<section> <!-- Section instead of article? -->
    <header>
         <h2>Movies</h2> 
         <h4>Genres</h4><!-- Should i use to h tags inside the same header? http://www.w3.org/TR/html5/sections.html#headings-and-sections. There sais: "h1–h6 elements must not be used to markup subheadings, subtitles, alternative titles and taglines unless intended to be the heading for a new section or subsection. Instead use the markup patterns in the Common idioms without dedicated elements section of the specification."-->
         <p>Below you can see the <b>available genres</b>:</p> <!-- <b> or <strong>?-->
    </header>
    <ol><!-- ol or ul and place the numbers? -->
        <li>Action</li>
        <li>War</li>
        <li>Comedy</li>
        <li>Horror</li>
    </ol>
</section>

In HTML5, you can write comments wherever you want. – alessandrio Sep 23 '14 at 17:41 — alessandrio, Sep 23 '14 at 17:41
You should close that `
` BTW...
– T J Sep 23 '14 at 17:43 — T J, Sep 23 '14 at 17:43
Please note that this question is not about comments! – Rich Bradshaw Sep 23 '14 at 17:46 — Rich Bradshaw, Sep 23 '14 at 17:46

score 0 · Answer 1 · answered Sep 23 '14 at 17:43

0

Section and header are fine. What is the function/interaction of the genres? If they will be menu options I would wrap in , otherwise I would use UL since they are not in a specific sequence which needs to be maintained.

answered Sep 23 '14 at 17:43

jdunham

439
3
6

score 0 · Answer 2 · answered Sep 23 '14 at 17:49

0

<b> - "Represents a span of text to be stylistically offset from the normal prose without conveying any extra importance".

<strong> - "Represents strong importance for its contents." source

Other tags are dependent on their context.

answered Sep 23 '14 at 17:49

Wojciech Mleczek

1,574
15
18

score 0 · Answer 3 · answered Sep 23 '14 at 17:49

0

Article is wrong - this doesn't make sense to be in a RSS feed for instance. section would be OK, div might be better.

The Bold is just for formatting, not for emphasis so b would be OK.

If you stick with section, header it should have an H1 and H2, not H3 and 4.

If the order matters, ol, if not ul.

answered Sep 23 '14 at 17:49

Rich Bradshaw

71,795
44
182
241

About h1 and h2, can you explain a bit more this point? I've been reading through this: http://www.w3.org/TR/html5/sections.html#headings-and-sections – Mimetix Sep 23 '14 at 17:59

score -1 · Answer 4 · answered Sep 23 '14 at 17:43

-1

In HTML5, you can write comments wherever you want.

    <section>
        <p> <!--new P tag -->
            <span>new <!--this new paragraph-->paragraph</span>
        </p>
    </section>

answered Sep 23 '14 at 17:43

alessandrio

4,282
2
29
40

HTML5 semantic transformation

4 Answers4