Merge pull request #626 from carmacleod/issue625

A few typos on the landmarks pages #625

examples/landmarks/HTML5.html

@@ -44,7 +44,7 @@ <h1>ARIA Landmarks Example</h1>
         <div class="col-xs-12 col-sm-9 col-md-6 col-lg-7">
           <main>
             <h1 id="id1">HTML5 Sectioning Elements</h1>
-            <p>It is important to understand that many HTML5 sectioning (e.g. <code>main</code>,<code>nav</code>, <code>aside</code> ...) elements by default define ARIA landmarks. 
+            <p>It is important to understand that many HTML5 sectioning (e.g. <code>main</code>, <code>nav</code>, <code>aside</code> ...) elements by default define ARIA landmarks. 
               If HTML5 sectioning elements are used without understanding the associated landmark structure, assistive technology users will most likely be confused and less efficient in accessing content and interacting with web pages.
             </p>
             <table class="table table-striped table-hover" aria-label="Default landmark roles for HTML5 sectioning elements">
@@ -108,7 +108,7 @@ <h1 id="id1">HTML5 Sectioning Elements</h1>
         <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
           <aside aria-labelledby="id4">
             <h2 id="id4">Landmarks</h2>
-            <p>The following are landmarks defined on the page:</p>
+            <p>The following landmarks are defined on this page:</p>
             <ul>
               <li>Banner</li>
               <li>Complementary</li>

examples/landmarks/at.html

@@ -177,7 +177,7 @@ <h2 id="vo">Voice Over Screen Reader for OS X (Mac OS)</h2>
                     <td>Go to previous landmark</td>
                   </tr>
                   <tr>
-                    <td>Control+Option+ U, then left or right arrow key to landmark list</td>
+                    <td>Control+Option+U, then left or right arrow key to landmark list</td>
                     <td>List of landmarks</td>
                   </tr>
                 </tbody>
@@ -188,7 +188,7 @@ <h2 id="vo">Voice Over Screen Reader for OS X (Mac OS)</h2>
             </section>
 
             <section aria-labelledby="orca">
-            <h2 id="orca">ORCA Sreen Reader for Linux/GNOME</h2>
+            <h2 id="orca">ORCA Screen Reader for Linux/GNOME</h2>
               <p>The following commands are available in ORCA Screen reader for navigating landmarks:</p>
 
               <table class="table table-striped table-hover" aria-labelledby="orca">
@@ -205,7 +205,7 @@ <h2 id="orca">ORCA Sreen Reader for Linux/GNOME</h2>
                     <td>Next landmark</td>
                   </tr>
                   <tr>
-                    <td>shift+M</td>
+                    <td>Shift+M</td>
                     <td>Previous landmark</td>
                   </tr>
                   <tr>
@@ -223,7 +223,7 @@ <h2 id="orca">ORCA Sreen Reader for Linux/GNOME</h2>
         <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
           <aside aria-labelledby="id4">
             <h2 id="id4">Landmarks</h2>
-            <p>The following are landmarks defined on the page:</p>
+            <p>The following landmarks are defined on this page:</p>
             <ul>
               <li>Banner</li>
               <li>Complementary</li>

examples/landmarks/banner.html

@@ -102,7 +102,7 @@ <h3>HTML5 Example</h3>
         <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
           <aside aria-labelledby="id4">
             <h2 id="id4">Landmarks</h2>
-            <p>The following are landmarks defined on the page:</p>
+            <p>The following landmarks are defined on this page:</p>
             <ul>
               <li>Banner</li>
               <li>Complementary</li>

examples/landmarks/complementary.html

@@ -163,7 +163,7 @@ <h3>HTML5 Example: Multiple Complementary Landmarks</h3>
         <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
           <aside aria-labelledby="id4">
             <h2 id="id4">Landmarks</h2>
-            <p>The following are landmarks defined on the page:</p>
+            <p>The following landmarks are defined on this page:</p>
             <ul>
               <li>Banner</li>
               <li>Complementary</li>

examples/landmarks/contentinfo.html

@@ -107,7 +107,7 @@ <h3>HTML5 Example</h3>
         <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
           <aside aria-labelledby="id4">
             <h2 id="id4">Landmarks</h2>
-            <p>The following are landmarks defined on the page:</p>
+            <p>The following landmarks are defined on this page:</p>
             <ul>
               <li>Banner</li>
               <li>Complementary</li>

examples/landmarks/form.html

@@ -263,7 +263,7 @@ <h3>Source Code</h3>
         <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
           <aside aria-labelledby="id4">
             <h2 id="id4">Landmarks</h2>
-            <p>The following are landmarks defined on the page:</p>
+            <p>The following landmarks are defined on this page:</p>
             <ul>
               <li>Banner</li>
               <li>Complementary</li>

examples/landmarks/index.html

@@ -51,7 +51,7 @@ <h1>General Principles</h1>
             <p>This section is intended to assist designers, developers and quality assurance staff in defining and understanding the importance of logical, usable, and accessible layout for assistive technologies 
               using HTML5 sectioning elements and ARIA landmark roles.
             </p>
-            <p>Due to the complexity of todays web content, if using landmarks, <strong>all content</strong> should reside in a semantically meaningful landmark in order that content is not missed by the user.</p>
+            <p>Due to the complexity of today's web content, if using landmarks, <strong>all content</strong> should reside in a semantically meaningful landmark in order that content is not missed by the user.</p>
 
             <p style="font-weight: bold">Step 1: Identify the logical structure</p>
             <ul>
@@ -88,10 +88,10 @@ <h1>General Principles</h1>
                 If a specific landmark role is used more than once on a web page, it should have a unique label.
               </li>
               <li>
-                If a area begins with a heading element (e.g. <code>h1-h6</code>), it can be used as the label for the area using <code>aria-labelledby</code> attribute.
+                If an area begins with a heading element (e.g. <code>h1-h6</code>), it can be used as the label for the area using <code>aria-labelledby</code> attribute.
               </li>
               <li>
-                If a area does not have a heading element, provide a label using the <code>aria-label</code> attribute.
+                If an area does not have a heading element, provide a label using the <code>aria-label</code> attribute.
               </li>
               <li>
                 Avoid using the landmark role as part of the label.  
@@ -104,7 +104,7 @@ <h1>General Principles</h1>
         <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
           <aside aria-labelledby="id4">
             <h2 id="id4">Landmarks</h2>
-            <p>The following are landmarks defined on the page:</p>
+            <p>The following landmarks are defined on this page:</p>
             <ul>
               <li>Banner</li>
               <li>Complementary</li>

examples/landmarks/main.html

@@ -165,7 +165,7 @@ <h3>HTML5 Example: Multiple Main Landmarks</h3>
         <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
           <aside aria-labelledby="id4">
             <h2 id="id4">Landmarks</h2>
-            <p>The following are landmarks defined on the page:</p>
+            <p>The following landmarks are defined on this page:</p>
             <ul>
               <li>Banner</li>
               <li>Complementary</li>

examples/landmarks/navigation.html

@@ -177,7 +177,7 @@ <h3>HTML5 Example: More Than One Navigation Landmark Example</h3>
         <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
           <aside aria-labelledby="id4">
             <h2 id="id4">Landmarks</h2>
-            <p>The following are landmarks defined on the page:</p>
+            <p>The following landmarks are defined on this page:</p>
             <ul>
               <li>Banner</li>
               <li>Complementary</li>

examples/landmarks/region.html

@@ -103,7 +103,7 @@ <h3>ARIA Example: Using <code>section[aria-labelledby]</code> attribute</h3>
                   <p>Use the HTML5 <code>section</code> element to define a <code>region</code> landmark.</p>
 
                   <h3>HTML5 Example: Using <code>section[aria-labelledby]</code> attribute</h3>
-                  <p>Defines a label for each region using exsiting content on the page.</p>
+                  <p>Defines a label for each region using existing content on the page.</p>
                   <div class="code">
                     &lt;main&gt;
                     <br>
@@ -215,7 +215,7 @@ <h3>HTML5 Example: Using <code>section[title]</code> attribute</h3>
         <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
           <aside aria-labelledby="id4">
             <h2 id="id4">Landmarks</h2>
-            <p>The following are landmarks defined on the page:</p>
+            <p>The following landmarks are defined on this page:</p>
             <ul>
               <li>Banner</li>
               <li>Complementary</li>

examples/landmarks/resources.html

@@ -81,7 +81,7 @@ <h2>Tools</h2>
 
                     <aside aria-labelledby="id4">
                       <h2 id="id4">Landmarks</h2>
-                      <p>The following are landmarks defined on the page:</p>
+                      <p>The following landmarks are defined on this page:</p>
                       <ul>
                         <li>Banner</li>
                         <li>Complementary</li>

examples/landmarks/search.html

@@ -77,7 +77,7 @@ <h3>ARIA Example</h3>
                     &nbsp;&nbsp;&lt;input type="search" aria-label="search text" size="20"&gt;
                     <br>
                     <br>
-                    &nbsp;&nbsp;&lt;input type="submit" value="Search""&gt;
+                    &nbsp;&nbsp;&lt;input type="submit" value="Search"&gt;
                     <br>
                     <br>
                     &lt;/form&gt;
@@ -94,7 +94,7 @@ <h3>ARIA Example</h3>
         <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
           <aside aria-labelledby="id4">
             <h2 id="id4">Landmarks</h2>
-            <p>The following are landmarks defined on the page:</p>
+            <p>The following landmarks are defined on this page:</p>
             <ul>
               <li>Banner</li>
               <li>Complementary</li>