什么是创建手风琴小部件的语义正确方法?

rkm*_*max 5 html5 semantics

考虑到语义Web和HTML5,创建手风琴小部件的语义正确方法是什么?

例:

jQueryUI提出以下示例:

<div id="accordion">
    <h3><a href="#">First header</a></h3>
    <div>First content</div>
    <h3><a href="#">Second header</a></h3>
    <div>Second content</div>
</div>
Run Code Online (Sandbox Code Playgroud)

现在如果很明显我们需要一个具有标题和内容的列表,那么现在我们需要的是:

一系列定义?

<dl>
    <dt>
       Title
    </dt>
    <dd>
       Content
    </dd>
</dl>
Run Code Online (Sandbox Code Playgroud)

zzz*_*Bov 7

语义基于内容.

不是风格,
不是互动.

因此,在语义上标记手风琴小部件不会只有一种方法.手风琴小部件是一种互动.

dl应该用于名称 - 值组,因此如果您有"术语和定义,元数据主题和值,问题和答案,或任何其他名称组 - 使用带有手风琴小部件的dl将是语义的 -价值数据.":

<dl id="definitions">
  <dt>...</dt>
  <dd>...</dd>
  <dt>...</dt>
  <dd>...</dd>
  ...
</dl>
Run Code Online (Sandbox Code Playgroud)

如果你在一个档案中有一堆文章,它可能是语义使用:

<h1>Archive</h1>
<div id="articles">
  <h2>...</h2>
  <article>...</article>
  <h2>...</h2>
  <article>...</article>
  ...
</div>
Run Code Online (Sandbox Code Playgroud)

在担心内容应该做什么之前,先弄清楚你的内容什么.