html 5中sideber小部件的语义正确容器是什么？

Question

我有一个完全没有文本类型内容的页面。它是一个 jquery 页眉、两个侧边栏和一个页脚。辅助边栏是动态生成的插件 Wordpress 小部件列。

我喜欢的滑块是 html5，所以我要尝试一下。这是xhtml版本：

// Area 4 home secondary
register_sidebar( 
    array (
        'name' => 'Home Secondary Widget Area',
        'id' => 'home_secondary_widget_area',
        'before_widget' => '<div id="%1$s" class="widget-container %2$s">',
        'after_widget' => "</div>",
        'before_title' => '<h3 class="widget-title">',
        'after_title' => '</h3>'
     ) 
);

然后解析为：

<div id="primary" class="widget-area">
    <ul class="xoxo">
        <li id="search-2" class="widget-container widget_search">
          <form role="search" method="get" id="searchform" action="http://localhost/wordpress_testbed/" >
            <div>
                  <label class="screen-reader-text" for="s">Search for:</label>
              <input type="text" value="" name="s" id="s" />
              <input type="submit" id="searchsubmit" value="Search" />
            </div>
       </form>
         </li>      
         <li id="recent-posts-2" class="widget-container widget_recent_entries">            
           <h3 class="widget-title">Recent Posts</h3>       
           <ul>
            <li><a href="http://localhost/wordpress_testbed/?p=1" title="Hello world!">Hello world!</a></li>
            <li><a href="http://localhost/wordpress_testbed/?p=358" title="Readability Test">Readability Test</a></li>
            <li><a href="http://localhost/wordpress_testbed/?p=188" title="Layout Test">Layout Test</a></li>
            <li><a href="http://localhost/wordpress_testbed/?p=128" title="Images Test">Images Test</a></li>
            <li><a href="http://localhost/wordpress_testbed/?p=555" title="Post Format Test: Gallery">Post Format Test: Gallery</a></li>
          </ul>
        </li>
    </ul>
</div>

应该如何标记小部件？奖金将是一种头衔机制。

Answer 1

在这种情况下使用<aside> 是完全可以接受的，如下所示：http://html5doctor.com/aside-revisited/

您的 HTML 可以正常工作并通过 HTML5 验证。我会建议一些更简单的东西，比如：

<aside>
    <section>
        <h2>Item Title</h2>
        <ul>
            <li>Some Items</li>
        </ul>
    </section>
</aside>