Web Accessibility Standards as presented by SUNY Electronic & Information Technology (EIT) Accessibility, annotated by SLS:
Page Structure:
- Heading structure is logical = don't use headings for formatting but instead use them for organization of information.
- Heading structure includes an H1 tag and does not skip levels = your H1 should be the name of the page, and you shouldn't have more than one on a page. You shouldn't have an H5 after an H3 with no H4 in between.
- Reading order is logical and intuitive = verify reading order using tab key.
- Information and relationships that are implied by visual or auditory formatting are conveyed in accessible ways = don't use color to organize your information because a visually impaired person wouldn't see those connections.
Navigation:
- Provide a method to skip repetitive navigation = create a link to where your content starts on the page so that users can click a link to skip over header links, navigation bar, etc. If you're using LibGuides, this functionality is part of their header code and you can test it by opening a page and hitting tab. The skip link should be the first thing that you see.
- The option to skip links is the first option when tabbing = make sure that your skip link is at the top of the page, otherwise it's not very useful.
- All links are available using the keyboard = don't make people have to use the mouse to get to a link to click on it. You can test this by tabbing through the page and making sure that you can get to all of the content only using your keyboard.
- There are no "keyboard traps" = make sure that you don't have content like a Twitter feed where you can't get out of it except for by clicking somewhere else on the page.
- The tabbing order is logical = you want to make sure that when you tab through the page, it goes in an order that makes sense. For example, if you've set up two columns of information, make sure that it's organized so that the tab goes through it in the order that you want.
- Keyboard focus is visible = you control this in CSS styling. Make sure that when you tab through your page you should be able to see a box around each element that you find. This helps visually impaired people track where they are on the page.
- Presentation, layout, and navigation are consistent for repeated content = keep your organization consistent so that it doesn't confuse people using assistive technology, i.e. don't redesign navigation tabs on different pages on your site.
- Make sure that you have something in your header that links to your home page and explicitly mark it as "home" = you might have to use CSS to make a hidden class and then use that class in a span next to your logo if you logo isn't explicitly marked as going to your homepage. Eg: <a href="your homepage url"><img src="your logo image"><span class="hidden">Library Home Page</span></a>
Links:
- Link text describes the destination of the link = avoid using "click here" or "learn more," e.g. if you're linking to another library, make that library name the link to help users know that that's where they're going when linking.
- All links are distinguishable = don't style links the same way you style other content on the page. If you use blue underlined text for links, don't use that style on anything that's not a link, and avoid underlining anything else just for emphasis.
- Try to avoid making links open in a new window = There's usually no warning to let people know that this is going to happen and it can be challenging to close the new window and go back to the content if you're using assistive technology.
Miscellaneous:
- Every page contains a link to an accessibility statement that provides contact information to get help if needed = this can go in the footer of the page.
- The page is readable and functional when text size is doubled = make sure when enlarging the page that your formatting is responsive.
- Use readable fonts and sizes, color contrast, and keep number of fonts used to a minimum
- The page has a descriptive page title = try to be specific whenever possible so that people can tell your pages apart when using assistive technology.
- The language of the page is identified using the HTML lang attribute = this can be done with your metadata tags. If you're using LibGuides it should already be done for you.
- Instructions do not rely solely on size, shape, color, or visual location = make sure that someone using assistive technology is able to follow your instructions.
- No content flashes more than 3 times per second
- If a page has a timing, the user is given options to turn off, adjust or extend the timing
- Multiple ways are available to find other web pages on the site = examples would be breadcrumbs, search box, etc.
- When appropriate, the language of sections of content that are in different languages are identified, for example, by using the lang attribute
Documentation:
