对于小部件的侧边栏，哪个更具语义？ [英] Which is more semantic for a sidebar of widgets?
问题描述
在下面的示例 html5页面结构中，以下哪个对于小部件的侧边栏更具语义性（侧边栏中显示的元素是出现在多个页面上的元素，并不一定，直接，也不特别涉及此内容页面）：
In the following example html5 page structure, which of the following is more semantic in respect to the sidebar of widgets (elements which appear in the sidebar are elements which appear on multiple pages and do not necessarily, directly, nor particularly relate to this page of content):
<body>
<header id="site-header">
...
</header>
<section id="page-body">
<main>
<header></header>
<article></article>
<footer></footer>
</main>
<aside class="sidebar" id="sidebar-a">
<section id="search-widget">
...search field, etc...
</section>
<section id="recent-articles-widget">
...articles list...
</section>
</aside>
<aside class="sidebar" id="sidebar-b">
<section id="cloud-tag-widget">
...search field, etc...
</section>
<section id="recent-articles-widget">
...articles list...
</section>
</aside>
</section>
<footer id="site-footer"> ... </footer>
</body>
或...
<body>
<header id="site-header">
...
</header>
<section id="page-body">
<main>
<header></header>
<article></article>
<footer></footer>
</main>
<section class="sidebar" id="sidebar-a">
<aside id="search-widget">
...search field, etc...
</aside>
<aside id="recent-articles-widget">
...articles list...
</aside>
</section>
<section class="sidebar" id="sidebar-b">
<aside id="cloud-tag-widget">
...tag list...
</aside>
<aside id="popular-articles-widget">
...articles list...
</aside>
</section>
</section>
<footer id="site-footer"> ... </footer>
</body>
AKA - 在一个部分中放置多个旁边是更加语义还是更合适，或者在旁边包含多个部分以创建小部件的侧边栏？它们应该是div中的简单div吗？或者一节内的div？在一旁划分？ 为什么？
对于屏幕阅读器或搜索引擎来说哪个更容易？ 为什么？
AKA - Is it more semantic or in any way more appropriate to put multiple asides within a section, or include multiple sections within an aside to create a sidebar of widgets? Should they instead be simple divs within a div? Or divs within a section? Divs within an aside? Why? Which is easier for screen readers or search engines? Why?
推荐答案
一边 与它周围的内容切线相关。
The aside is "tangentially related to the content around" it.
目前，似乎没有定义around的含义。 假设它（至少）是父母的内容分段内容元素，那么这对你的例子意味着：
Currently, it doesn’t seem to be defined what "around" means exactly. Assuming that it’s (at least) the content of the parent sectioning content element, then this would mean for your examples:
-
< body> <节> <一旁>< /预留> < /节> < / body>
搁置与部分的内容相关。 -
< body> <一旁> <节>< /节> < /预留> < / body>
搁置与正文的内容相关（即整个文件）。
<body> <section> <aside></aside> </section> </body>
Theasideis related to the content of thesection.<body> <aside> <section></section> </aside> </body>
Theasideis related to the content of thebody(i.e., of the whole document).
因此，在您的情况下，您可能希望将放在之外 body 的后代（以及没有其他分区内容元素）。
So in your case, you’ll probably want to have aside as descendant of body (and of no other sectioning content element).
接下来要决定的是： 一边有几个小节，而不是一边。我会为每个侧边栏块单独搁置 ，除非您可以逻辑分组（*）这些块。
The next thing to decide would be: one aside with several sub-sections vs. several aside. I’d go with a separate aside for each "sidebar block", unless you can logically group (*) these blocks.
*即如果有一个可以使用的自然标题（如果你实际使用它并不重要）将几个侧边栏块分组，请使用一个一边，部分这些孩子。
* I.e., if there is a natural heading that could be used (it doesn’t matter if you actually use it) to group several sidebar blocks, use one aside with section childs for these.
这篇关于对于小部件的侧边栏，哪个更具语义？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
