播放列表 Web 应用的 HTML5 语义元素

Question

对于我们正在创建的音乐网络应用程序，我希望在所有相关元素的语义结构方面得到一些帮助。

播放列表由标题、标签和歌曲组成。

我附上了一张我认为应该如何划分的图片。这是正确的吗？

播放列表标题 h1 >

播放列表标签

标题>

歌名

今天时间>
添加到播放列表等
文章 >


歌名2 h2>
今天时间>
添加到播放列表等
文章 >

部分 >
主要>

音乐播放列表应该是这样的结构吗？感谢您的帮助:)。

Answer 1

我不会为播放列表标签使用分段元素，因为我认为它们“不应该”在文档大纲中单独输入。

不仅仅是曲目列表，包括header 在内的整个播放列表应该在一个分段元素中。如果您认为播放列表是可以独立存在的内容（例如，精选播放列表），article 可能是合适的，否则section。

单个曲目的标记看起来不错，除了 menu 元素，它不再是 HTML5 的一部分（它是 still in HTML 5.1）。而且您没有正确使用time 元素，因为“今天”不是有效值。

你可能想使用一个列表，但它并不是真正需要的，所以可以省略。

<main>

   <article>

     <header>
       <h1>Playlist title</h1>
       <div>playlist tags</div>
     </header>

     <ul>
       <li><article><!-- track 1 --></article></li>
       <li><article><!-- track 2 --></article></li>
     </ul>

   </article>

</main>

如果您想使用 Microdata 和/或 RDFa 对您的内容进行语义注释，请查看 Schema.org 的 MusicPlaylist type。