开发者

Proper semantic representation for addendum to, or description of a header

Say I have content in the form

<h2>George Epworth</h2>
<h3>Director</h3>
<p>Content Content Conte开发者_如何学编程nt</p>

There I've represented the descriptive part of the h2 as an h3, but it's really more part of the h2 isn't it? the h3 here doesn't exist on its own and is dependant on the h2. Just trying to think of the most flexible way to define this element...


With HTML 5, you would use the hgroup element:

<hgroup>
  <h2>George Epworth</h2>
  <h3>Director</h3>
</hgroup>
<p>Content Content Content</p>

Optionally wrap the whole thing in a <section> element.


When semantics are concerned, the overall page should be studied, without it, it's hard to recommend an approach. This is how I see it:

You can look at H1-H6 as hierarchy of headers importance, ask yourself if the importance changes from 'name' to 'job title' - if so, then separating them to h2 and h3 is the semantic way to go.

In my opinion, a more accurate representation is the definition list approach:

<dl>
  <dt>[Name]</dt>
  <dd>[Job Title]</dd>
</dl>

You could still add the <h2> and <h3> elements - but I believe that those are enough to represent the data, can be styled accordingly, and contain more information through <dd>.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜