Merge pull request #22 from jerielizabeth/dev

added aria landmarks and skipnav
omeka · Feb 26, 2015 · 6cc47ef · 6cc47ef
2 parents 787468b + 7decb0f
commit 6cc47ef
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 6 deletions.
diff --git a/common/footer.php b/common/footer.php
@@ -3,7 +3,7 @@
     </div><!-- end wrap -->
 
 
-    <footer>
+    <footer role="contentinfo">
 
         <div id="footer-text">
             <?php echo get_theme_option('Footer Text'); ?>
@@ -22,6 +22,7 @@
         Omeka.showAdvancedForm();
         Omeka.moveNavOnResize();
         Omeka.mobileMenu();
+        Omeka.skipnav();
     });
     </script>
 

diff --git a/common/header.php b/common/header.php
@@ -96,25 +96,26 @@
     ?>
 </head>
 <?php echo body_tag(array('id' => @$bodyid, 'class' => @$bodyclass)); ?>
+    <a href="#content" id="skipnav"><?php echo __('Skip to main content'); ?></a>
     <?php fire_plugin_hook('public_body', array('view'=>$this)); ?>
 
-        <header>
+        <header role="banner">
             <?php fire_plugin_hook('public_header', array('view'=>$this)); ?>
             <div id="site-title"><?php echo link_to_home_page(theme_logo()); ?></div>
         </header>
 
         <div class="menu-button button">Menu</div>
 
         <div id="wrap">
-            <nav id="primary-nav">
+            <nav id="primary-nav" role="navigation">
                 <?php echo public_nav_main(array('role' => 'navigation')); ?>
-                <div id="search-wrap">
+                <div id="search-wrap" role="search">
                     <?php if (get_theme_option('use_advanced_search') === null || get_theme_option('use_advanced_search')): ?>
                     <?php echo search_form(array('show_advanced' => true)); ?>
                     <?php else: ?>
                     <?php echo search_form(); ?>
                     <?php endif; ?>
                 </div>
             </nav>
-            <div id="content">
+            <div id="content" role="main" tabindex="-1">
                 <?php fire_plugin_hook('public_content_top', array('view'=>$this)); ?>
diff --git a/css/sass/_screen.scss b/css/sass/_screen.scss
@@ -99,7 +99,26 @@ blockquote {
         right: 2.6667em;
     }
 }
+#skipnav {
+    border: 0;
+    clip: rect(0, 0, 0, 0);
+    height: 1px;
+    margin: -1px;
+    overflow: hidden;
+    padding: 0;
+    position: absolute;
+    width: 1px;
+}
 
+#skipnav:focus {
+    top:0;
+    z-index:9999;
+    clip:initial;
+    height:auto;
+    width:auto;
+    padding:.5em;
+    border:1px blue dashed;
+}
 /* @end */
 
 /* @group ----- Reusable classes ----- */
@@ -1515,4 +1534,4 @@ input[type="button"],
     height: auto;
 }
 
-/* @end */
+/* @end */
diff --git a/css/style.css b/css/style.css
@@ -469,6 +469,27 @@ table {
     margin-right: 2.6667em;
   }
 
+  #skipnav {
+    border: 0;
+    clip: rect(0, 0, 0, 0);
+    height: 1px;
+    margin: -1px;
+    overflow: hidden;
+    padding: 0;
+    position: absolute;
+    width: 1px;
+  }
+
+  #skipnav:focus {
+    top: 0;
+    z-index: 9999;
+    clip: initial;
+    height: auto;
+    width: auto;
+    padding: .5em;
+    border: 1px blue dashed;
+  }
+
   /* @end */
   /* @group ----- Reusable classes ----- */
   .active {

diff --git a/javascripts/globals.js b/javascripts/globals.js
@@ -91,4 +91,10 @@ if (!Omeka) {
         });
     };
 
+    Omeka.skipnav = function() {
+        $("#skipnav").click(function() {
+            $("#content").focus()
+        });
+    };
+
 })(jQuery);