Skip to content

Commit

Permalink
Accessibility Features
Browse files Browse the repository at this point in the history 
added skip links, a simple alt tag scanner, also wrote anti-layout
table styles.
  • Loading branch information
andrewmbacon committed Jun 24, 2014
1 parent dfcc2a0 commit 97d124e
Show file tree
Hide file tree
Showing 5 changed files with 194 additions and 2 deletions.
8 changes: 7 additions & 1 deletion header.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,13 @@
<?php wp_head(); ?>
</head>

<body <?php body_class(); ?>>
<body <?php body_class(); ?> >
<nav id="skiplinks">
<a href="#site-navigation">Skip to Navigation</a>
<a href="#uc-search">Skip to UConn Search</a>
<a href="#content">Skip to Content</a>

</nav>
<?php if(function_exists('uconn_banner_hook')){uconn_banner_hook();}?>
<div id="page" class="hfeed site">
<?php
Expand Down
48 changes: 48 additions & 0 deletions js/cs.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -119,6 +119,54 @@ jQuery(document).ready(function($) {
*/



/*
SIMPLE ACCESSIBILITY TESTER
by Andrew Bacon
This plugin runs simple tests on a site, and adds distinct visual styles to flawed content when they fail.
*/
function imageWarning(e){
var block = $('<div>')
block.addClass('alert alert-danger accessibility-fail-msg')
//console.log(e.width())
block.width(e.width+'px')

var icon = $('<span>')
icon.addClass('glyphicon glyphicon-ban-circle')

var msg = $('<span>')
msg.append(' This image needs a <a href="http://aurora.uconn.edu/accessibility">valid Alt tag.</a> ')


block.append(icon).append(msg)
$(e).after(block)
}
$('#page img').each(function(){
alt = $(this).attr('alt')
if (alt){
alt = alt.toLowerCase()
//console.log('alt='+alt)
if (alt.indexOf('.jpg') >= 0 || alt.indexOf('.png') >= 0 || alt.indexOf('.gif') >= 0 ){
$(this).addClass('accessibility-fail')
imageWarning(this)
}
} else {
$(this).addClass('accessibility-fail')
imageWarning(this)
}
})
// adds default bootstrap styles to all tables.
$('#page table').each(function(){
$(this).addClass('table')
})

/**/





})
2 changes: 1 addition & 1 deletion js/min/cs.min.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

67 changes: 67 additions & 0 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -318,3 +318,70 @@ object {
.gallery-columns-9 .gallery-item {
max-width: 11.11%;
}

/* Accessibility Tests */
.accessibility-fail {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
opacity: .3;
}

.accessibility-fail-msg {
border-top-right-radius: 0;
border-top-left-radius: 0;
}

.accessibility-fail-msg .glyphicon {
color: red;
margin-right: 1em;
}

.accessibility-fail-msg a {
text-decoration: underline;
}

/* Table stripper - removes all styles from elements within tables. */
html, table body, table div, table span, table applet, table object, table iframe, table
h1, table h2, table h3, table h4, table h5, table h6, table p, table blockquote, table pre, table
a, table abbr, table acronym, table address, table big, table cite, table code, table
del, table dfn, table em, table img, table ins, table kbd, table q, table s, table samp, table
small, table strike, table strong, table sub, table sup, table tt, table var, table
b, table u, table i, table center, table
dl, table dt, table dd, table ol, table ul, table li, table
fieldset, table form, table label, table legend, table
article, table aside, table canvas, table details, table embed, table
figure, table figcaption, table footer, table header, table hgroup, table
menu, table nav, table output, table ruby, table section, table summary, table
time, table mark, table audio, table video {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
font-size: 100% !important;
font: inherit !important;
vertical-align: baseline !important;
}

/* HTML5 display-role reset for older browsers */
table article, table aside, table details, table figcaption, table figure, table
footer, table header, table hgroup, table menu, table nav, table section {
display: block !important;
}

table body {
line-height: 1 !important;
}

table ol, table ul {
list-style: none !important;
}

table blockquote, table q {
quotes: none !important;
}

table blockquote:before, table blockquote:after, table
q:before, table q:after {
content: "" !important;
content: none !important;
}
71 changes: 71 additions & 0 deletions style.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -346,3 +346,74 @@ object {
}
.gallery-caption {}


/* Accessibility Tests */
@mixin grayscale_element($value) {
-webkit-filter: grayscale($value);
-moz-filter: grayscale($value);
filter: grayscale($value);
}




.accessibility-fail {
@include grayscale_element(100%);
opacity: .3;
}

.accessibility-fail-msg {
border-top-right-radius: 0;
border-top-left-radius: 0;
}
.accessibility-fail-msg .glyphicon {
color:red;
margin-right: 1em;
}
.accessibility-fail-msg a {
text-decoration: underline;
}



/* Table stripper - removes all styles from elements within tables. */

html, table body, table div, table span, table applet, table object, table iframe, table
h1, table h2, table h3, table h4, table h5, table h6, table p, table blockquote, table pre, table
a, table abbr, table acronym, table address, table big, table cite, table code, table
del, table dfn, table em, table img, table ins, table kbd, table q, table s, table samp, table
small, table strike, table strong, table sub, table sup, table tt, table var, table
b, table u, table i, table center, table
dl, table dt, table dd, table ol, table ul, table li, table
fieldset, table form, table label, table legend, table
article, table aside, table canvas, table details, table embed, table
figure, table figcaption, table footer, table header, table hgroup, table
menu, table nav, table output, table ruby, table section, table summary, table
time, table mark, table audio, table video {
margin: 0!important;
padding: 0!important;
border: 0!important;
font-size: 100%!important;
font: inherit!important;
vertical-align: baseline!important;
}
/* HTML5 display-role reset for older browsers */
table article, table aside, table details, table figcaption, table figure, table
footer, table header, table hgroup, table menu, table nav, table section {
display: block!important;
}
table body {
line-height: 1!important;
}
table ol, table ul {
list-style: none!important;
}
table blockquote, table q {
quotes: none!important;
}
table blockquote:before, table blockquote:after, table
q:before, table q:after {
content: ''!important;
content: none!important;
}

0 comments on commit 97d124e

Please sign in to comment.