Jul 12, 2021

Start the School Year with an Accessible School Website

Summer is flying by fast, and the new school year will be here before we know it. But there is still time to take steps to make your school website more accessible for visitors with disabilities. Here are a few steps you can take right now. 

1. Evaluate Your Current Website Accessibility 

There are a number of free web tools and plug-ins you can use to evaluate the overall accessibility of your website. Check out our Website Accessibility Challenge for instructions on how to access two of the most popular tools.

The reports generated by these accessibility checkers can be difficult for non-experts to understand, but they can give you a general idea of how accessible your current school website is right now. Look at the overall number of issues identified by the checker. This will provide a baseline for your site that you can use to evaluate progress. 

2. Determine What Is and Isn't Fixable With Your Current Platform

The issues identified will fall into two general categories.

  • Platform issues are inherent to your current school website platform. These include the ability to zoom to enlarge text and visuals and the use of ARIA landmarking, keyboard focus and navigation, and other elements that help people using screen readers or keyboard navigation understand the structure of the page and navigate the site efficiently. It may also include design elements such as the way headers are used and contrast ratios between text and background elements, which are often set by the chosen design theme. These issues generally can't be fixed without changing your platform or recoding elements of your site. 

  • Content issues are under the direct control of the person adding content to the website. These include problems such as missing alt text for images, videos without captions or transcripts, and content hidden in inaccessible PDFs. Most of these are fairly quick and simple fixes, if you can identify where the problems are. 

3. Address Basic Content Accessibility Issues  

Once you've identified the problems that are in your power to fix, set aside a few hours to correct as many of them as possible. Here are some of the easiest places to start: 

  • Make sure all images have alt-tags to identify what is in the image for people with visual difficulties. 

  • Add captions to videos for people with hearing differences. You can do this using YouTube's captioning tools or other free web tools. If your site has audio files (such as a podcast link), be sure to include a transcript. 

  • Replace inaccessible PDFs with accessible PDFs, or put the information into an HTML format that can be read by screen readers. 

  • Use descriptive link languages (not "click here") so people using screen readers know what to expect when they click on each link (e.g., "enrollment forms"). 

Too much to do before the school year starts? Prioritize the information families and staff will need most, including anything on your home page, back-to-school and enrollment information, and important announcements and schedules. 

4.  Look at Site Design and Structure

Once the content issues are addressed, see if there are any easy fixes you can make to your site design and structure. For example: 

  • Contrast problems: High contrast between the text and background makes it easier for visitors with low visual acuity to read text. Many website have problems with text that appears over banners or photos, or with text in footers, sidebars or menus. If you have direct control over the colors, make sure your text and background colors have enough contrast between them for easy reading of text. If you don't have the ability to change these colors, you may be able to switch to a different design theme with higher contrast. 

  • Header issues: Header tags (H1, H2, etc.) help people using screen readers understand how your page is structured. They should be used not just to apply a design effect but to indicate how information on the page is ordered and help people navigate between sections. Each page should have one Header 1 (H1) that identifies the title or purpose of the page. Major sections of the page should be marked with H2 tags. Further subdivisions within the sections use the H3 tags, and so on. Make sure you only have one H1, and you are not skipping header levels (e.g., skipping from H1 down to H4 with no H2 and H3 headers). 

5. Reevaluate Your Website Accessibility

After making the easy changes, run your accessibility check again. See improvements? You know you're on the right track. 

However, you may find that you still have a number of platform issues that can't be resolved without custom coding or switching to a new CMS provider. These may include ARIA landmarking, treatment of headers, or design issues. If the platform is not built to support website accessibility, you may want to consider moving to a platform that is. 

Looking for an Easier Path to School Website Accountability?

eChalk's easy CMS has accessibility built right in, including zoom, ARIA landmarking, keyboard navigation features, visual keyboard focus, and high-contrast design themes. And coming soon, we're introducing eChalk Guide, a new accessibility tool that helps content creators identify and fix content accessibility issues on their eChalk webpages both before and after publication. 

We can help you create a new, accessible website and migrate your current content in as little as two weeks. Contact us to get started.