HTML Webpage Template (External CSS Compatible)

<!DOCTYPE html>
<html lang="en">
 <head>
  <title>My First Web Page</title>
   <meta charset="utf-8"/>
   <link rel="stylesheet" href="mystyle.css">
 </head>
 <body>
  <h1>Welcome to My First Web Page</h1>
  <p>Hello! This ia a paragraph</p>
  <h1>And there is an image below</h1>
  <p>click the image below for my album.</p>
  <p>
   <a href="https://www.flickr.com/photos/42405591@N02" target="_blank">
    <img src="https://c2.staticflickr.com/2/1550/24373954750_9dfa49383e_b.jpg" alt="An Image" title="Marco Hazard's Flickr Gallery" style="width:304px;height:228px;">
   </a>
  </p>
  <h2>And here is a video</h2>
  <p><iframe width="560" height="315" src="https://www.youtube.com/embed/Jy9QRbQt_BU" frameborder="0" allowfullscreen></iframe></p>
  <h2>And here is a 3x3 table</h2>
  <table style="width:100%" border="1">
   <tr>
    <td>A1</td>
    <td>A2</td>
    <td>A3</td>
   </tr>
   <tr>
    <td>B1</td>
    <td>B2</td>
    <td>B3</td>
   </tr>
   <tr>
    <td>C1</td>
    <td>C2</td>
    <td>C3</td>
   </tr>
  </table>
    <h2>And here is an order list</h2>
  <ol>
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3</li>
  </ol>
    <h2>And here is an unorder list</h2>
  <ul>
   <li>Item A</li>
   <li>Item B</li>
   <li>Item C</li>
  </ul>
  <p>Contact:<a href="mailto:examplemail@gmail.com">examplemail@gmail.com</a></p>

 </body>
</html>