accessibility fixes.

Add label to search box and navigation arrows.
HoWol76 · Sep 23, 2016 · 94ef967 · 94ef967
1 parent f0a9475
commit 94ef967
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 6 deletions.
diff --git a/_includes/episode_navbar.html b/_includes/episode_navbar.html
@@ -1,6 +1,5 @@
 {% comment %}
   Find previous and next episodes (if any).
-  Including file must pass episode_navbar_title=true or ...=false to display episode title.
 {% endcomment %}
 {% for episode in site.episodes  %}
   {% if episode.url == page.url %}
@@ -21,9 +20,9 @@
   <div class="col-md-1">
     <h3>
       {% if prev_episode %}
-      <a href="{{ page.root }}{{ prev_episode.url }}"><span class="glyphicon glyphicon-menu-left"></span></a>
+      <a href="{{ page.root }}{{ prev_episode.url }}"><span class="glyphicon glyphicon-menu-left" aria-hidden="true"></span><span class="sr-only">previous episode</span></a>
       {% else %}
-      <a href="{{ page.root }}/"><span class="glyphicon glyphicon-menu-up"></span></a>
+      <a href="{{ page.root }}/"><span class="glyphicon glyphicon-menu-up" aria-hidden="true"></span><span class="sr-only">lesson home</span></a>
       {% endif %}
     </h3>
   </div>
@@ -36,9 +35,9 @@ <h1 class="maintitle">{{ page.title }}</h1>
   <div class="col-md-1">
     <h3>
       {% if next_episode %}
-      <a href="{{ page.root }}{{ next_episode.url }}"><span class="glyphicon glyphicon-menu-right"></span></a>
+      <a href="{{ page.root }}{{ next_episode.url }}"><span class="glyphicon glyphicon-menu-right" aria-hidden="true"></span><span class="sr-only">next episode</span></a>
       {% else %}
-      <a href="{{ page.root }}/"><span class="glyphicon glyphicon-menu-up"></span></a>
+      <a href="{{ page.root }}/"><span class="glyphicon glyphicon-menu-up" aria-hidden="true"></span><span class="sr-only">lesson home</span></a>
       {% endif %}
     </h3>
   </div>

diff --git a/_includes/navbar.html b/_includes/navbar.html
@@ -68,7 +68,7 @@
       </ul>
       <form class="navbar-form navbar-right" role="search" id="search" onsubmit="google_search(); return false;">
         <div class="form-group">
-          <input type="text" id="google-search" placeholder="Search...">
+          <input type="text" id="google-search" placeholder="Search..." aria-label="Google site search">
         </div>
       </form>
     </div>