As I browse through higher ed sites, virtually none of them provide the ability to skip repetitive navigation links as required by Section 508. Have you noticed this as well? What method do you use to meet this standard?
First, let me confess that I am crashing this group as I am former university webmaster and not current. For a while we hid it. I think at one stage we had it as a visible link. This was after some good advice for a usability guru -- the ability to skip to the content is helpful for all users -- especially with the proliferation of mobile browsers.
We hide it with CSS in the top of a page. Web page real estate is getting more and more 'valuable'. Well designed navigation methods do not have to overwhelm a page to require skipping for non-508 users.
In addition to skipping the navigation and going straight to the main content, we provide quick links to other areas of a web page for 508 users (search, nav, sub-nav, footer, etc.)
CSS and sniffing can be used to give the short cut links to limited mobile browsers (those other than an iPhone).
Our forthcoming Web site will have the skip navigation links on every page, but they'll be hidden with CSS.
I'm curious, though. How do you guys hide your skip links? In my case, after some research, I decided to use the "height: 0; width: 0; overflow: hidden;" method instead of the "display: none" method.
Apparently, keeping them displayed with a zero width and height still allows users to tab through the links, while hiding them with the display property takes away that ability. At least, that's the way I understand it.
We have the skip nav links too, but hide them with CSS.
display:none; is bad because some screen readers ignore that content.
No need for the height:0; width:0;
Use display:block; position:absolute; to remove it from the flow, just make sure all parent elements of your skip nav are position:static; (the default). Then use left:-999px; and/or top:-999px; (big number, exact value irrelevant). Keep the overflow:hidden; to avoid any focus outlines in Firefox.
Since we are usually hiding links, it's important to add one more style to avoid the dreaded line across the screen in some browsers, where they position the link underline where the image would start in the normal flow, then run it through to where it is currently residing off screen: text-decoration: none;
"Join us for our next webcast with OmniUpdate CEO Lance Merker, who will delve into key insights about Generation Z’s online search behaviors to help you refine your school's web marketing strategy. http://bit.ly/2zhdcIt"
"Our newest guide will help you learn what it means to be accessible, how to implement accessibility best practices, quick fixes to try as well as a long-term plan, plus tools to help you in your website accessibility efforts. Download it now!"
"Are online forms more efficient? Learn how El Camino College used Formstack to create online forms that expedited processing, improved communications, increased transparency, and promoted accountability across campus. http://bit.ly/2zhdcIt"
"If you’re struggling with web challenges such as accessibility, SEO, design consistency, workflow, content governance, or how to start a website redesign, you’re not alone. Join our next webcast to learn how other higher ed institutions…"
"Here’s an outline of everything you need to know about OCR compliance, including what it is, what your college or university can do to stay compliant, and resources for OCR compliance. #accessibility http://bit.ly/2rcPDgG"
"Join us for our next webcast with April Buscher from Montana State University Billings to learn how blind readers and people with hearing impairment view and read your website and how you can make it accessible to them. http://bit.ly/2zhdcIt"
"High schoolers spend more time on their digital devices than they do sleeping, doing homework, or participating in extracurricular activities. So how do you make your message stand out to them? #eexpect http://bit.ly/2MOIIWC"
"Want to increase digital engagement with high school juniors and seniors? Join our next webcast with Stephanie Geyer from Ruffalo Noel Levitz as she shares new data from the 2019 E-Expectations Trend Report on email, paid media, and social media…"
"It is always important to make a good first impression! Join Aaron Blau from Converge Consulting as he covers ways to make your web content attractive to your target audience and create an authentic brand message. http://bit.ly/2zhdcIt"