Accessibility Initiative

Tutorials for Web Authors

Our CMS checks for many of the required accessibility standards when you publish a page, but there are still things that the CMS can't check for. Here are some areas web authors can focus on to make our website more accessible for all users.

Images

All images are required to have both a title and an alternative description to add context for website visitors who may not be able to see the image. Just having these two elements does not make an image fully accessible, however. Understanding their purpose and learning to write better descriptions can help web authors improve the accessibility of their pages.

  • The title is a short name for the image. This can be a very basic description and is often related to the file name. The title also serves as the tooltip that will appear when a user hovers their mouse over the image, so make sure it is easily readable:
    • Example: "Department Group Photo"
  • The alternative description is intended to describe the image and convey any additional context that would be missing for someone who can't see the image. It is helpful to consider the purpose of the image on the page and what you want visitors to take away from it. The alternative description is often (but not always) longer than the title:
    • Example: "Department faculty and staff standing together on the steps of the office building, smiling and waving at the camera."
  • Try to avoid uploading images that contain text. If doing so is necessary, you must either include the entirety of the text in the image's alternative description or elsewhere on the page, and then use the alternative description to tell users where to find the text:
    • Example 1: "Event flyer. Please join us at 5 p.m. on September 1 for..."
    • Example 2: "Decorative event flyer. All text is duplicated in the paragraph below."

Links

Screen readers allow users to view all the hyperlinks on a page in one place, separate from any context they may have in the surrounding text. Because of this, it is important to use descriptive link text and include a title when adding hyperlinks to your pages.

  • Include descriptive link text. Avoid using text like "click here" that doesn't tell the user where the link is going.
    • Example: "Find more information on our Department Homepage" is better than "Click Here to find more information."
  • Include a descriptive title. The title serves as the tooltip when a user hovers their mouse over the link. It should be short, but also tell users exactly where the link will go. A good practice is to use the name of the file or page that you are linking to.
    • Example: "Department Homepage"

Text Styles

Styling text—with bold, italics, or different colors and sizes—and using bulleted or numbered lists can help to draw visual attention to important information and topics. In order for a webpage to be accessible, web authors need to ensure that visual cues are not the only thing signifying important information and that the styling is not making it harder for users to access information.

  • Use the Header Styles built into the CMS to indicate your page's main topic headings. Screen readers understand what these headings are and will allow users to quickly jump to the areas of the page that are relevant to them.
    • Note: It is equally important to avoid using Header Styles for things that are not headers just to make them bigger or red. This is confusing for visitors using a screen reader and makes it difficult for them to navigate the page content.
  • Use the list tools built into the CMS to create bulleted lists or numbered lists. Screen readers will recognize these as lists and make it easy for visitors to navigate the page.
    • Note: Do not copy-and-paste lists from a document or e-mail, or try to manually create lists by typing "-" or "•" in front of lines. Doing this makes it difficult for visitors using screen readers to navigate the information on your page.
  • Draw attention to important information with text cues in addition to visual cues. Including something like "Tip:" or "Important:" before a line of information communicates its importance to users who may not see the bold or italic styling.
  • Avoid justifying text on your page. Text that is left-aligned, right-aligned or centered is easier to read and makes the page content more accessible for users with dyslexia or cognitive disabilities.

PDF Files

PDF files and Adobe Reader have many built-in accessibility features, but the files need to be created correctly to take advantage of them. PDFs that were created by scanning a physical document or by using an image-editing software like Photoshop or Canva are likely not accessible. Files that were created with document-editing software like Word or InDesign are more likely to be accessible, but may still need to be edited to ensure that no accessibility features are missing. 

Section 508 Explained

These tutorials are written to assist web authors in meeting Section 508 requirements. Section 508 is a 1998 amendment to the Rehabilitation Act of 1973 that establishes federal accessibility guidelines for electronic and information technology. South Carolina mandated that state agency websites be compliant by July 21, 2006. Winthrop University is included in this state-wide accessibility initiative.

In January 2017, the 508 standards were updated. They went into effect January 18, 2018. To ensure institutions of higher education are in compliance, courts have recommended schools refer to the World Wide Web Consortium's (W3C) Web Content Accessibility Guidelines (WCAG). The WCAG is a set of accessibility standards to help guide web teams in making their work more accessible to all, including users with disabilities. The updated 2018 version of the ADA uses the standards published in the WCAG 2.0. For your convenience, you can view WebAIM's WCAG 2.0 accessibility checklist online.

Adobe Acrobat Reader is needed to view and download forms and information in PDF format.