text.html

 
   <p>Mickey Spillane's second novel featuring private
investigator Mike Hammer.</p> 
</aside></code></pre> 
<h3 class="sigil_not_in_toc" id="nav_point_155">contentinfo特性</h3> 
<p class="zw">WAI-ARIA将<code>contentinfo</code>特性定义为“包含有关父文档信息的可感知区域”，是不是听起来很像HTML的<code>footer</code>元素？ 我也这么认为。让我们为主页面的<code>footer</code>元素添加<code>contentinfo</code>特性，继续构建Get Hardboiled网站的存档页。</p> 
<pre class="代码无行号"><code><footer role="contentinfo"> 
   <h3>It's Hardboiled</h3> 
   <p>Hardboiled Web Design, designed by Andy Clarke.</p> 
</footer></code></pre> 
<p class="zw">正如<code>banner</code>特性一样，与HTML中的普通<code>footer</code>元素不同，我们只能在页面中使用一次带有<code>contentinfo</code>属性的<code>footer</code>元素。</p> 
<h3 class="sigil_not_in_toc" id="nav_point_156">main特性</h3> 
<p class="zw">跳转到内容的链接是最常用的网络无障碍技术之一，旨在帮助依靠辅助技术的人跳过啰嗦的导航区域。WAI-ARIA的<code>main</code>特性的主要作用是消除对跳转链接的需求，因为它可以帮助依赖辅助技术的用户直接导航至某个页面的主要内容区域。</p> 
<p class="zw">在哪里添加<code>main</code>特性完全取决于内容，在我们正在构建的Get Hardboiled网站存档页上，我们可以选择将它添加到包含最新、最重要的新闻的<code>section</code>元素上。</p> 
<pre class="代码无行号"><code><section id="content__uk"> […] </section> 
<section id="content__usa" role="main"> […] </section> 
<section id="content__world"> […] </section></code></pre> 
<p class="zw">如果开发一个只包含单一主题的页面，我们应该把<code>main</code>属性添加<code>article</code>元素上。</p> 
<pre class="代码无行号"><code><article role="main"> 
   <header> 
      <h1>Mickey Spillane</h1> 
   </header> 
   <p>Frank Morrison Spillane, better known as Mickey Spillane,
was an author of crime novels, many featuring his detective character
Mike Hammer. More than 225 million copies of his books have
been sold internationally, including my personal favourite, 'My
Gun Is Quick'.</p> 
</article></code></pre> 
<h3 class="sigil_not_in_toc" id="nav_point_157">navigation特性</h3> 
<p class="zw">WAI-ARIA的<code>navigation</code>特性在功能上类似HTML中的<code>nav</code>元素，它的作用是用来描述页面或Web应用程序中的主要导航模块。尽管<code>navigation</code>和<code>nav</code>元素的目的都是提供尽可能广泛的支持，但我们还是要使用<code>navigation</code>特性。</p> 
<pre class="代码无行号"><code><nav role="navigation"> 
   <ul> 
      <li><a href="about.html">What's Hardboiled?</a></li> 
      <li><a href="archives.html">Archives</a></li> 
      <li><a href="authors.html">Authors</a></li> 
      <li><a href="Classics.html">Classics</a></li> 
   </ul> 
</nav></code></pre> 
<h3 class="sigil_not_in_toc" id="nav_point_158">search特性</h3> 
<p class="zw">在许多网站上，搜索是人们定位内容的主要方式。因此在HTML中，在<code>nav</code>元素中嵌入搜索框是完全可以接受的做法，但对于添加了<code>navigation</code>属性的<code>nav</code>元素就不是这样了。</p> 
<p class="zw">WAI-ARIA的<code>search</code>特性描述了一个完整的搜索界面——包括标签、输入框、按钮和其他HTML元素。过去，当我们想给搜索表单元素设置样式的时候，我们会给它一个唯一的<code>id</code>或者一个<code>class</code>属性。现在，我们可以不再添加表现型的属性，而是使用WAI-ARIA的<code>search</code>特性和CSS属性选择器来代替。</p> 
<pre class="代码无行号"><code><form method="post" action="search.html" role="search"> 
   <fieldset> 
      <input type="search" title="Search this site"> 
      <button type="submit">Go</button> 
   </fieldset> 
</form></code></pre>