Should a heading "Navigation" be above a following <nav> element, or inside it?

What is better:

<h1>Navigation</h1>
<nav>
  <ul>
    <li>...</li>
  </ul>
</nav>

Or:

<nav>
  <h1>Navigation</h1>
  <ul>
    <li>...</li>
  </ul>
</nav>

Is there any significant difference?

Solution

nav is a sectioning element and as such, if you have a heading that describes the navigation it should be inside:

<nav>
  <h1>Navigation</h1>
  <ul>
    <li>...</li>
  </ul>
</nav>

Otherwise, the heading will be incorrectly associated with a different section altogether, rather than the nav element.

The W3C HTML5 spec provides a near-identical example:

Code Example:

In the following example, the page has several places where links are present, but only one of those places is considered a navigation section.

<body itemscope itemtype="http://schema.org/Blog">
 <header>
  <h1>Wake up sheeple!</h1>
  <p><a href="news.html">News</a> -
     <a href="blog.html">Blog</a> -
     <a href="forums.html">Forums</a></p>
  <p>Last Modified: <span itemprop="dateModified">2009-04-01</span></p>
  <nav>
   <h1>Navigation</h1>
   <ul>
    <li><a href="articles.html">Index of all articles</a></li>
    <li><a href="today.html">Things sheeple need to wake up for today</a></li>
    <li><a href="successes.html">Sheeple we have managed to wake</a></li>
   </ul>
  </nav>
 </header>
 ...
</body>