我正在尝试确定标记我正在研究的这个设计的最佳方式。它的快速大纲在这里:
这是一篇新闻文章.. 所以我想使用文章标签,然后使用一些旁白信息。我的问题是它的设计布局..文章的 h1 跨越 2 列..我想为 h1 使用文章标签,发布信息和主体..但为了做到这一点并适合设计我'必须在文章中包含右列,这在语义上不是很好。右栏中的信息对许多页面都是通用的,因此不应作为旁白的一部分。
所以目前我在想
<h1>News article title</h1>
<div class="leftcol">
<article>
<p>publish information</p>
<p>Main body in general markup</p>
</article>
<aside>
Related content here
</aside>
</div> <!-- end left col -->
<div class="rightcolumn">
Contact form code, followed by customer quote stuff
</div> <!-- end right column -->
我担心将 H1 留在文章标签之外 - 似乎有点违背了目的,但我不确定还有什么其他方法可以工作。文章中的 h1 标签也可能重复,但这绝对不理想..
标记此设计的最语义正确的方法是什么?
*ED
不能做基于意见的问题..但如果其他人正在考虑同样的事情(并且不允许问它),我会选择以下内容:
<div class="page-heading">News article title</div>
<div class="leftcol">
<article>
<h1>News article title</h1>
<p>publish information</p>
<p>Main body in general markup</p>
</article>
<aside>
Related content here
</aside>
</div> <!-- end left col -->
<div class="rightcolumn">
Contact form code, followed by customer quote stuff
</div> <!-- end right column -->
决定将 h1 保留在文章中(并用 css 隐藏它),然后在具有相同内容的列之外使用 div 来保持设计的真实性。