Semantic HTML

A page built only from div elements tells a browser nothing. Semantic tags name each area, which helps screen readers, search engines and the next developer.

<body>
  <header>Logo and site title</header>
  <nav>Main links</nav>
  <main>
    <article>
      <h1>Lesson title</h1>
      <section>First part</section>
    </article>
    <aside>Related links</aside>
  </main>
  <footer>Contact details</footer>
</body>

• Use a button for an action and a link for going somewhere.
• Use one main per page.
• Check that every feature works with the keyboard alone.