HTML5语义：类似的文章，在文章标签内

当您阅读博客文章时，几乎所有博客上都有一个带有类似文章，最新评论等内容的“边栏”。在我要实现的布局中，我有一个巨大的文章标题（带有照片，以及拖车），宽度为100％。在那之后，我得到了文章的正文，并带有侧边栏，然后，我得到了作者信息（再次是100％的宽度）和评论。

在这种情况下，我无法使用主要文章标签中的“侧边栏”进行转义。最小示例：

<article>

    <!-- ARTICLE HEADER -->
    <header style="width: 100vw; height: 100vh">
        <h1>title</h1>
        <p>trailer</p>
        <time>...</time>
    </header>

    <!-- ARTICLE BODY -->
    <h2>...</h2><p>...</p><ul>...</ul> x few

    <!-- SIDEBAR - PROBLEM -->
    <div id="sidebar">
        <h2>Similar articles</h2><ul>...</ul>
        <h2>Latest comments</h2><ul>...</ul>
    </div>

    <!-- ARTICLE FOOTER -->
    <footer id="author" style="width: 100vw; height: 100vh">
        <h1>Details</h1>
        <section>
            <h1>Author</h1>
            <address>...</address>
        </section>
        <section>
            <h1>Comments</h1>
            <ul>...</ul>
        </section>
    </footer>

</article>

问题在于div＃sidebar及其应包含的元素类型。

• 这当然不是文章的一部分（因此不能是div）
• 这可能不会放在一边（文章内部与文章高度相关，但是在阅读时可以忽略，并且此侧边栏是自动生成的，与文章完全无关）
• 这可能是一个小节，但当然不应该在article标签内
• 由于全屏页脚和页眉的缘故，定位（绝对或flex）将很难管理，因此没有机会使该元素脱离本文，而使之成为简单的部分。

有什么帮助吗？

我有一个使用jquery的解决方案，可以将元素从“流”中删除，然后将其粘贴到其他位置，但是也许有一个仅使用HTML5的语义解决方案？