Build New York city blog with semantic html

Demo

Navigation

Create "ul>li*3>a" for nav element

    <nav>
      <ul>
        <li><a href="">Blog</a></li>
        <li><a href="">Media</a></li>
        <li><a href="">About</a></li>
      </ul>
    </nav>

Section vs Article vs Aside

<section> is for separating contents. <article> may stand alone.
<aside> complements supports article tag.

media elements: <video>, <audio> are not self closing. <embed> is self closing, just like <img>!

<video>, <audio> tags remember to add controls attribute.

Adding a img to enhance my blog site, add it after the section of the article.

      <figure>
        <img
          src="https://codecademy-content.s3.amazonaws.com/courses/Semantic+HTML/statue-of-liberty.jpeg"
          alt="statue of ny liberty"
        />
        <figcaption>
          This is the Statue of Liberty, a popular tourist attraction located on
          Ellis Island.
        </figcaption>
      </figure>

For media, create its own section. For audio media, there are two approaches. Adding src or <source>.

<audio controls src="example.mp3">
</audio>


<audio controls>
  <source src="example.mp3">
</audio>