Boilerplate HTML5 markup for a landing/explainer page.

landing_page.html

<header class='stage'>

  <nav class='top-of-page-links'>
  </nav>

  <div class='brand'>
  </div>

  <div class='primary call-to-action'>
  </div>

  <div class='product-imagery'>
  </div>

</header>

<article class='explanation'>

  <header class='value-prop'>
  </header>

  <div class='how-it-works'>

    <section class='step one'>
      <figure>
      </figure>
      <div>
        <h2></h2>
        <p></p>
      </div>
    </section>

    <section class='step two'>
      <figure>
      </figure>
      <div>
        <h2></h2>
        <p></p>
      </div>
    </section>

    <section class='step three'>
      <figure>
      </figure>
      <div>
        <h2></h2>
        <p></p>
      </div>
    </section>

  </div>

  <div class='secondary call-to-action'>
  </div>

</article>

<footer>

  <nav>
    <ul>
      <li><a href="#">privacy policy</a></li>
      <li><a href="#">terms of use</a></li>
      <li><a href="#">contact us</a></li>
    </ul>
  </nav>

  <div class='copyright'>
  </div>

</footer>