Semantic HTML markup for links to sections of current page in headers

I've written markup for a header with links to different pages and also sections of the current pages and I wanted to know the following:

Are the tag names I used semantically appropriate? Is the structure/hierarchy correct? Does my markup need to be optimized/changed for easy CSS styling?

<header>
    <nav>
        <ul>
            <li><a href="#">Home</a></li>
            <li><a href="#">Setting</a></li>
            <li><a href="#">Progress</a></li>
            <li><a href="#">Learn</a></li>
        </ul>
    </nav>
    <ul>
        <li><a href="#">Section 1</a></li>
        <li><a href="#">Section 2</a></li>
        <li><a href="#">Section 3</a></li>
        <li><a href="#">Section 4</a></li>
        <li><a href="#">Section 5</a></li>
    </ul>
</header>

I want this markup to be as standardized as possible and also being ready to be styled in any possible way without the need to go back to the markup and change it.

Solution

The nav element represents the navigation for the section it’s in:

For the site-wide navigation, the nav should be in the body sectioning root element (because this represents the whole page).
For a table of contents (like in an Wikipedia article), the nav should be in the section/article sectioning content element which represents the content the ToC is for.

(Example 9 in the nav spec shows exactly this case.)

So, you would ideally use something like this (assuming it’s some kind of article):

<body>

<h1>Site title</h1>

<nav>
  <!-- the nav for the site-wide navigation -->
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Setting</a></li>
    <li><a href="#">Progress</a></li>
    <li><a href="#">Learn</a></li>
  </ul>
</nav>

<article>
  <h2>Article title</h2>

  <nav>
    <!-- the nav for the article -->
    <ul>
      <li><a href="#">Section 1</a></li>
      <li><a href="#">Section 2</a></li>
      <li><a href="#">Section 3</a></li>
      <li><a href="#">Section 4</a></li>
      <li><a href="#">Section 5</a></li>
    </ul>
  </nav>

</article>

</body>

(Each section can have its own header, so you could place the first nav in the body-header and the second nav in the article-header, if you want.)