How to Make Your Student News Website Fully Accessible

A news website opens all of a publication’s content up to all individuals, including those who rely on screen readers, multimedia transcripts, and other tools to access the information. 

Over the past year, SNO has received dozens of questions and requests regarding the accessibility of our sites. This article will highlight some of the things you can do to make your site as accessible as possible.

However, if a district has a legal concern regarding the accessibility of a site, the staff should reach out to the Student Press Law Center for advice.

Below are the key things to know about making, or keeping, student news sites accessible to all.

• All of SNO’s sites are WCAG 2.1 AA compliant out of the box. That means those who ordered a site from SNO, and haven’t made any design changes, have content that will be accessible.
• Design plays a big part in making, or keeping, sites accessible. Some things to be aware of when redesigning a site are:
  • Color contrast – sites that use a white font should make sure it’s placed on a dark background and vice versa.
    • If your school colors do not have a strong color contrast consider developing a different color scheme for the publication that ensures accessibility.
  • Links – A couple of things to keep in mind when embedding links in stories:
    • Always keep links distinguishable. There are several ways to do this: Underlining, color contrast (with a ratio of 3:1), underlining on hover or the highlighter option available on SNO Sites.
    • Make sure the linked text is descriptive and clearly explain where it goes (e.g. View the full photo gallery). Avoid vague phrases with links (e.g. Read more here).
  • Outlines – When breaking a longer story into multiple sections, make sure to use the heading styles (h1, h2, etc.), available in the WordPress story editing screen to create those section titles. Headings create a clear structure that helps both readers and screen readers navigate your content. 
• The biggest accessibility upgrade that sites should make regarding content is to ensure that all photos and graphics contain alternative text (often called alt text). Alt text is the language that will be read by screen readers to describe what the reader sees in a photo or graphic. It should be a sentence or two that literally describes the content and purpose of the image. There are a couple of ways to do this:
  • SNO sites are built to automatically use the caption as the alt text, if no additional alt-text is added. If a caption accurately describes what is in the photo or graphic, it probably doesn’t need additional alt text.
  • With SNO Sites, users can add alt text by going to the file in the site’s media library and editing the details. There is a standalone text box labeled alt text. This text will not be visible on the front end of the site, but it will be picked up by screen readers. Sites that place a drawing or graphic that is not captioned should make sure to add alt text to those files. Alt text can also be added in SNO’s newsroom management tool, FLOW.
  • For additional information about alt text check out this page from Section508.gov.

Advisers, staffs or other interested parties can check the accessibility of a site by running it through the WAVE Accessibility Evaluation Tool. That will generate a report identifying potential improvements to increase the accessibility of a site.

SNO customers who have questions on how to make any adjustments based on the WAVE report, or in general based on the tips above, should reach out via support ticket and we’ll be happy to help!