[html5] Template questions...
Jukka K. Korpela
jukka.k.korpela at kolumbus.fi
Sun May 15 23:16:08 PDT 2011
15.5.2011 22:30, Micky Hulse wrote:
> Do you see anything out of the ordinary?
It lacks a !DOCTYPE and the <title> element. (It is apparently meant to
be a template, so it should surely be a complete template.)
Many people recommend the use of start and end tags for <html>, <head>,
and <body> elements. This is largely a matter of style. But I think
there is almost always a reason to use the <html> tag, so that you can
put a lang attribute there.
> I am trying to build an index
> page for blog entries.
It should have a main heading, apparently inside <header>. Almost all
pages should have a main heading, just as almost every book should have
> 1. What do you think about the usage of the H1? In this case, is it a
> problem to have multiple per page?
Using <h1> inside <article> effectively lowers its rank with respect to
the page as a whole. Though such usage is well-defined and allowed in
HTML5, its main purpose is to allow inclusing of articles into a
document without changing their heading markup. This is fine and useful
in the long run, but it's just pointlessly risky at present. Current
browsers, assistive software etc. will blindly treat <h1> as rank 1
heading, without paying attention to its appearing inside <article>. You
might make them _appear_ as lower-rank headings, if you use carefully
crafted CSS (and your stylesheet actually gets applied), but it's just
an indirect way of partially achieving something that is best achieved
So in practice, the main heading of an article is best written as <h2>.
The subheadings could be written as <h3> and <h4> when they are all
wrapped inside <hgroup>, by the current HTML5, but the <hgroup> is under
suspicision, so to say, and no particular browser support can be
expected at present, if ever.
So it would be safer to write, say,
Some people probably question the use of <br> here (is it really a line
break in the content itself - well, it's structural division if division
of poems and postal address to lines is) as well as the meaning of
<small> (does it mean "side content" relative to the enclosing element
or absolutely). But this markup should work reasonably with "outlining"
algorithms (which are a great idea though still of little practical
value at present) and should render reasonably even without CSS, and
could be styled with CSS easily, without unnecessarily complicated
> 2. Can I use<hgroup> within an<a> tag?
Yes, but should you
> 3. Thoughts on wrapping time with an H3?
In practice, it makes the time notation a 3rd-rank heading on current
browsers, implying default rendering that might even be misleading and
that would require extra measures to fix. If you could rely on <hgroup>
really working, then it would be OK to use <h3>, since the time would be
part of the heading of the article, just indicated as being lower in the
hierarchy of the heading as a whole (heading group). But as a practical
move... it means taking risks with little if anything that you could
> The only reason I am using H3
> is so I can style the<time> tag using CSS2.1 and have that styling
> work in older browsers (does that make sense?)
No, that does not make sense. Even <div> would be better. Generally, for
the sole purpose of styling something you would like to appear as a
block, <div> is best, as it has been for a long time. Since <div> has no
default rendering beyond display: block, it is ideal for the purpose.
HTML5 discourages such use, recommending that other elements be used in
favor of the semantically empty <div>. While that's OK in the long run,
well, the run _is_ going to be long...
However, you could use <p> instead of <div> here, as this seems to be
the HTML5 way in matters like this. And it only costs setting margin: 0
for the <p>, to remove the default top and bottom margin, or setting
some desired values for those margins.
On the other hand, if you use
before any CSS code or references to CSS code, then even old versions of
IE will recognize the <time> markup to the extent that you can style
your <time> elements directly. I don't think you need to be more
cross-browser than that, in such issues, as modern browsers let you
style <time> directly.
More information about the Help