Everyone should be able to use your school website – especially those with disabilities. Not only is it the right thing to do, your school could face lawsuits if your site is not accessible.
Web Content Accessibility Guidelines (WCAG) are the international standards put in place by the World Wide Web Consortium (W3C) to help ensure best practices. Utilize this checklist to help your school consider whether you’ve created a website that serves everyone.
1. Navigate via keyboard.
Some website users are not able to use a mouse and instead need to navigate using the keyboard. Be sure users can navigate the available links with the tab and enter keys. Skip navigation is also a necessity, as it allows keyboard users to bypass the entire navigation of the website when they visit a new page.
2. Contrast between colors.
Color contrast between the website’s background and text is important for users with deteriorating vision and color blindness. Avoid using a color like yellow for areas of the website (especially text) and instead use it as an accent color in the design features of your website. If you have good vision, it can be hard for you to gauge which color combinations are accessible and which aren’t, so use an online color contrast checker to see if your color combinations will pass.
3. Alt tags on each image.
When you upload a photo, there’s always a spot to write a description for an alt tag. The alt tags are what screen readers use to describe an image to someone who is blind.
How would you want an image described if you couldn’t see it? Instead of writing “kids,” try “students raise their hands in the classroom,” for example. Simply having an alt tag isn’t enough. Use your words to paint a picture.
4. Closed captioning and transcripts.
All users should be able to experience a video and to gain additional understanding from its content. Closed captioning and transcripts help the deaf or hard of hearing be able to read what is being said in a video.
5. Descriptive link and button text.
Generally, website links are underlined and use a different color so they can be quickly picked out from surrounding text. Color blind people may not be able to use color alone to identify important actions they should take. Make sure the written context makes it easy to find a link or button.
6. Descriptive and logical headings.
Screen readers need to understand the architecture and structure of the page to communicate effectively to their blind user. Headings should be summaries and give a bird’s eye view of the page’s content so users can easily see how topics relate to each other. That means also using font sizes in an organized and logical order (e.g., H1, H2, H3, etc.).
7. Simple forms.
Give instructions so users understand how to fill out the form. Provide notification of a successfully completed form or specify an error so users know how to correct any mistakes. Longer forms should be divided into smaller sections so they are more manageable.
8. Sitemap and site search.
Users need multiple ways to find your website’s information. A sitemap (the architecture of your website – a list of all pages) can help users find what they need and makes it easier for Google to show answers from your website. A site search (the magnifying glass or search bar for your website) helps users find a topic quickly without browsing all of the pages in a sitemap.
Embedding a Google custom search is a great option to consider for your site search. The easier you can make it for users to find content, the less time they’ll spend looking for information and the more value they’ll find in your site’s content.
9. Audit your site.
The WAVE tool is a great first step in identifying the issues your school may need to address. Keep in mind that an automated audit should not completely replace human eyes. For example, a tool cannot make the decision of if an alt tag is descriptive enough — it will only tell you if there is one present.
10. Accessibility policy and feedback.
Creating an accessibility policy or stating that you are working on accessibility issues is a good transparency practice and may help prevent a lawsuit.
Find an accessibility policy template like this one to get started. Then enlist the help of your target demographic to test changes to your website or create a survey to gather user feedback to guide future site improvements.