在语义上标记页面以适应视觉设计

Question

我正在努力决定标记此设计的最佳方式。它的快速概述在这里：

这是一篇新闻文章..所以我想使用文章标签，然后是一些信息。我的问题是它的设计布局..文章的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来保持设计。