隐藏属性（HTML5）和display：none规则（CSS）之间有什么区别？
HTML5有一个新的全局属性， hidden ，可以用来隐藏内容。
<article hidden> <h2>Article #1</h2> <p>Lorem ipsum ...</p> </article>
CSS有display:none规则，也可以用来隐藏内容。
article { display:none; }
在视觉上，它们是相同的。 语义上的区别是什么？ 计算？
我应该考虑什么时候使用其中一个？
TIA。
编辑 ：基于@ newtron的回应（下），我做了更多的search。 这个hidden属性在去年激烈竞争，并且（显然）几乎没有进入HTML5规范。 有人认为这是多余的，没有目的。 从我所知道的来看，最终的评价是这样的：如果我仅仅针对网页浏览器，那么没有什么区别。 （其中一页甚至声称，Web浏览器使用display:none来实现隐藏属性）。但是，如果我正在考虑可访问性（例如，也许我期望我的内容被屏幕阅读器读取），那么是有区别的。 CSS规则display:none可能会将我的内容隐藏在网页浏览器中，但相应的aria规则（例如， aria-hidden="false" ）可能会尝试读取它。 因此，我现在同意@ newtron的答案是正确的，虽然也许（可以说）不是我想要的那么清楚。 谢谢@newtron的帮助。
关键的区别似乎是hidden元素总是被隐藏，无论performance如何：
隐藏的属性不得用于隐藏可能在其他演示文稿中合法显示的内容。 例如，使用隐藏来在选项卡式对话框中隐藏面板是不正确的，因为选项卡式的接口只是一种溢出式的呈现方式 – 人们也可以用一个滚动条在一个大页面中显示所有的表单控件。 使用这个属性隐藏内容只是从一个演示文稿中隐藏起来也是类似的 – 如果某些内容被标记为隐藏的，则隐藏所有演示文稿，包括屏幕阅读器等。
http://dev.w3.org/html5/spec/Overview.html#the-hidden-attribute
由于CSS可以针对不同的媒体/演示文稿types，所以display: none将依赖于给定的演示文稿。 例如，在桌面浏览器中查看某些元素时可能会display: none ，而不是移动浏览器。 或者，在视觉上隐藏，但仍然可供屏幕阅读器使用。
