Html 5 + css3两个带有三个选择器的侧边栏:角色与类？

Question

我决定完全摆脱我的CSS中的所有id,除此之外,我想开始过渡到HTML 5.

旧标记,其中.sidebar是两个侧边栏的选择器,ID用于单独设置侧边栏的样式

<div id="sidebar" class="sidebar widget-area"></div>
<div id="sidebar-alt" class="sidebar widget-area"></div>

现在这就是我在html 4中所做的事情,我并不认为ID在HTML5中是过时的,请不要赞成这个评论我会在html 4中做同样的事情

<div class="sidebar sidebar-primary widget-area"></div>
<div class="sidebar sidebar-secondary widget-area"></div>

我现在的问题是关于角色属性.这基本上是一个弥补价值？它或将来可能有一些真正的意义吗？

解决方案1 其中.sidebar保留两个侧边栏的选择器,我会使用[role ="..."]来单独设置侧边栏的样式

<aside role="sidebar-primary" class="sidebar widget-area"></aside>
<aside role="sidebar-secondary" class="sidebar widget-area"></aside>

解决方案2 或者我应该更好地为两个侧边栏提供相同的角色并使用角色选择器来处理常见样式？

<aside role="sidebar" class="sidebar-primary widget-area"></aside>
<aside role="sidebar" class="sidebar-secondary widget-area"></aside>

我还没有进入HTML 5,我希望得到一些意见,如果可能的话,深入解释可能会更好.

在查看WTC角色列表之后,似乎没有定义"侧边栏"角色,在关于它的事情之后,两个解决方案(1 + 2)可能都不好

解决方案3 W3C将"补充"角色定义为角色,这可能是更好的方法吗？我仍然很好奇为什么人们提出了角色="侧边栏"然后它对"发明"角色有什么意义呢？如果是因为CSS他们应该使用类来设计风格吗？

<aside role="complementary" class="sidebar-primary widget-area"></aside>
<aside role="complementary" class="sidebar-secondary widget-area"></aside>

Answer 1

role 没有弥补