greggnakamura · April 18, 2017 17:10
diff --git a/web-accessibility-base-template.html b/web-accessibility-base-template.html
 <!doctype html> <!-- Level A 4.1.1 Parsing -->
 <html lang="en"> <!-- Level A 3.1.1 Language of Page -->

 <head>
  <meta charset="utf-8" />
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <title>Add a unique page title</title> <!-- Level A 2.4.2 Page Titled -->
  <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no"> <!-- Level AA 1.4.4 Resize Text -->

  <link href="css/main.css" rel="stylesheet" />
 </head>

 <body>
  <header> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
    <a class="skip-link" href="#main">Skip to main</a> <!-- Level A 2.4.1 Bypass Blocks -->

    <nav class="navigation" aria-label="primary"> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks, Level AA 3.2.3 Consistent Navigation -->
      <ul>  <!-- Level A 1.3.1 Info and Relationships -->
        <li><a href="index.html">Home</a></li> <!-- Level A 2.4.4 Link Purpose -->
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
      </ul>
    </nav>
  </header>

  <main id="main" tabindex="-1"> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
    <h1>Main title for content. Should match page title</h1> <!-- Level A 1.3.1 Info and Relationships, Level AA 2.4.6 Headings and Labels -->

    <!--
      Page content. Continue to use semantic elements like <section>, <ol>, <ul>,
      <dl>, <table>, and <form>. Create a logical document outline/ structure
      using header tags, <h2>-<h6>.

      Ensure forms elements have labels, either explicit or implicit, and provide
      clear instructions on usage including error identification and suggestion.

    -->
  </main>

  <!-- aside is optional, but if you have a sidebar, then aside is perfect -->
  <aside class="sidebar"> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
    <nav class="navigation" aria-label="page"> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
      <ul>  <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
        <li><a href="link1.html">Sub Link 1</a></li> <!-- Level A 2.4.4 Link Purpose -->
        <li><a href="link2.html">Sub Link 2</a></li>
        <li><a href="link3.html">Sub Link 3</a></li>
        <li><a href="link4.html">Sub Link 4</a></li>
      </ul>
    </nav>
  </aside>

  <footer> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
    <nav aria-label="footer"> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
      <ul>
        <li><a href="index.html">Home</a></li> <!-- Level A 2.4.4 Link Purpose -->
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
        <li><a href="#">Link</a></li>
      </ul>
    </nav>

    <a href="sitemap.html">Site Map</a> <!-- Level AA 2.4.5 Multiple Ways -->
  </footer>
 </body>

 </html>
	<!doctype html> <!-- Level A 4.1.1 Parsing -->
	<html lang="en"> <!-- Level A 3.1.1 Language of Page -->

	<head>
	<meta charset="utf-8" />
	<meta http-equiv="x-ua-compatible" content="ie=edge">
	<title>Add a unique page title</title> <!-- Level A 2.4.2 Page Titled -->
	<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no"> <!-- Level AA 1.4.4 Resize Text -->

	<link href="css/main.css" rel="stylesheet" />
	</head>

	<body>
	<header> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
	<a class="skip-link" href="#main">Skip to main</a> <!-- Level A 2.4.1 Bypass Blocks -->

	<nav class="navigation" aria-label="primary"> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks, Level AA 3.2.3 Consistent Navigation -->
	<ul> <!-- Level A 1.3.1 Info and Relationships -->
	<li><a href="index.html">Home</a></li> <!-- Level A 2.4.4 Link Purpose -->
	<li><a href="#">Link</a></li>
	<li><a href="#">Link</a></li>
	<li><a href="#">Link</a></li>
	</ul>
	</nav>
	</header>

	<main id="main" tabindex="-1"> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
	<h1>Main title for content. Should match page title</h1> <!-- Level A 1.3.1 Info and Relationships, Level AA 2.4.6 Headings and Labels -->

	<!--
	Page content. Continue to use semantic elements like <section>, <ol>, <ul>,
	<dl>, <table>, and <form>. Create a logical document outline/ structure
	using header tags, <h2>-<h6>.

	Ensure forms elements have labels, either explicit or implicit, and provide
	clear instructions on usage including error identification and suggestion.

	-->
	</main>

	<!-- aside is optional, but if you have a sidebar, then aside is perfect -->
	<aside class="sidebar"> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
	<nav class="navigation" aria-label="page"> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
	<ul> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
	<li><a href="link1.html">Sub Link 1</a></li> <!-- Level A 2.4.4 Link Purpose -->
	<li><a href="link2.html">Sub Link 2</a></li>
	<li><a href="link3.html">Sub Link 3</a></li>
	<li><a href="link4.html">Sub Link 4</a></li>
	</ul>
	</nav>
	</aside>

	<footer> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
	<nav aria-label="footer"> <!-- Level A 1.3.1 Info and Relationships, Level A 2.4.1 Bypass Blocks -->
	<ul>
	<li><a href="index.html">Home</a></li> <!-- Level A 2.4.4 Link Purpose -->
	<li><a href="#">Link</a></li>
	<li><a href="#">Link</a></li>
	<li><a href="#">Link</a></li>
	</ul>
	</nav>

	<a href="sitemap.html">Site Map</a> <!-- Level AA 2.4.5 Multiple Ways -->
	</footer>
	</body>

	</html>