Top Tips for Making Your Website Accessible

Use headings correctly to organize the structure of your content (this is an H2)

Headings are much more than a big bold title—when used properly, they are the structural foundation of your webpage.

Think of headings as an outline of your webpage. In total, there are six levels of headings you can use to structure sections of content on the page (<h1> through to <h6>).

Screen reader users use heading structure to navigate content. By using headings correctly and strategically, the content of your website will be well-organized and easily interpreted by screen readers.

Best practices for headings and subheadings (this is an H3)

• Use headings to indicate and organize your content structure.
• Do not skip heading levels (e.g., go from an <h1> to an <h3>), as screen reader users will wonder if content is missing.
• When you build a website in Pace's CMS, the title field is automatically the <h1> heading. Do not add the <h1> heading to any webpage. The first heading, for example, on a left-navigation page would be a <h2>.

Include proper alt text for images

Add alt tags to images so that users who are visually impaired can understand what the image is about. Alt tags should be descriptive and provide context for the image. These guidelines can and should be used to help craft both web content and HTML-based email content (e.g., newsletters, digital publications, etc.).

Image ALT text best practices

• Describe the image, and be specific. Use both the image's subject and context to guide you.
• Add context that relates to the topic of the page. If the image doesn't feature a recognizable place or person, then add context based on the content of the page. For example, the alt text for an image of a student typing on a computer could be "Pace University student submitting their financial aid application on a computer". The alt text of an image of a faculty member in a classroom could be "Pace University faculty member lecturing a group of students about the environmental impact of single-use plastic products," depending on the topic of the webpage.
• Keep your alt text fewer than 125 characters. Screen-reading tools typically stop reading alt text at this point, cutting off long-winded alt text at awkward moments when verbalizing this description for the visually impaired.
• Don't start alt text with "picture of..." or "Image of..." Jump right into the image's description. Screen-reading tools (and Google, for that matter) will identify it as an image from the article's HTML source code.
• Review for spelling errors. Misspelled words in image alt text could hurt the user experience or confuse search engines crawling your site. You should review alt text like you would any other content on the page.

How Alt Text Affects SEO

According to Google, alt text is used—along with computer vision algorithms and the contents of the page—to understand the subject matter of images.

Alt text therefore helps Google to better understand not only what the images are about, but what the webpage as a whole is about. This can help increase the chances of your images appearing in image search results.

Images that appear in either Google Images or image packs provide yet another way to receive organic visitors.

Learn more about Google Images SEO best practices.

Give your links unique and descriptive names

When adding links to your web page or to an HTML-based email, it is important to ensure that link text clearly identifies the target of each link. Having a descriptive link text for each link will ensure that the links are distinct, understandable, and accessible to everyone including screen reader users.

When writing link text, avoid using common, non-descriptive phrases like “Click Here,” “More,” “Read More” or using only the URL (e.g., https://www.pace.edu/human-resources/working-pace/employment-income-ver…).

Example of a descriptive link text

The sentence “Visit the Admission and Aid website for more information on how to apply as a transfer student. ” sounds clearer and more useful to users of assistive technology than “for more information on how to apply as a transfer student, click here.”

Provide captions for video and transcripts for audio

Provide captions and transcripts for videos so that users who are deaf or hard of hearing can understand the content of the video. This will also make your content more accessible to users who are in a noisy environment and can't listen to the audio, or non-native English speakers.

• Provide captions for videos: Full-text, verbatim, captions that are synchronized with the presentation should be provided for all video content. Captions should identify when sound effects or audio cues are used, where appropriate. Ideally, a user would be able to turn captions on or off based on need and preference.
• Provide transcripts: Full-text, verbatim transcripts should be provided for audio recordings. Transcripts should identify when sound effects or audio cues are used, where appropriate. Transcripts are usually available on a separate web page or as a downloadable file.
• Do not "autoplay" videos: Video or audio content should not “autoplay” on page load. People using screen readers navigate by listening, so any sound playing when the page loads will interfere with their experience. Purely decorative and/or background videos are exempt from this requirement.

Helpful resource to provide captions and transcripts for videos

• Add subtitles and captions (YouTube Help Center)

Create an accessible PDF

• Use an accessible PDF authoring tool: Choose an accessible PDF authoring tool, such as Adobe Acrobat Pro or Microsoft Word, which allows you to create accessible PDF documents.
• Structure your document properly: Use headings, paragraphs, lists, and other appropriate formatting elements to organize your content and make it easier to navigate.
• Provide alternative text for images: Add alt text to images so that people with visual impairments can understand the content of the image.
• Use descriptive hyperlink text: Use descriptive text to describe the purpose of the hyperlink, rather than using generic text like "click here".
• Check the reading order: Ensure that the reading order of the document is logical and follows the visual order of the content.
• Use PDF tags: Add PDF tags to help assistive technology devices interpret the document correctly.
• Provide a text-only version: Consider providing a text-only version of your PDF for people who may have difficulty accessing the content in its original format.

Helpful Resources to Create an Accessible PDF

1. How to create accessible PDFs with Adobe Acrobat Pro DC (video from a technology accessibility expert at the University of Alabama).
2. Create and verify PDF accessibility: Acrobat Pro (Adobe website)
3. Three steps to creating an Accessible PDF file: Word (Framingham State University)

Using a PDF vs. Building a Webpage

1. Documents for printing: If you're providing documents that need to be printed, you can provide them as PDFs.
2. Document downloads: If you have long documents that you provide on your website, using PDFs is much better than the Word document itself. Readers can't modify the PDF like they can the Word document, and you can be sure that people on various types of computers will be able to open and use them.
3. Forms: Forms that require a signature should be uploaded as a PDF.
4. Otherwise, if your document will be viewed on a computer or mobile device, you should use a simple webpage.

Create accessible Microsoft Office documents

When creating content with Office, you can make it accessible to people with disabilities through some simple adjustments. You can use several built-in Office features to make sure that everybody can read and understand your documents.

The following file extensions can be uploaded to Pace's CMS: PDF, DOC, DOCX, XLS, XLSX, PPT, PPTX.

• Create accessible Office documents (Microsoft website)
• Make your Word documents accessible to people with disabilities (Microsoft website)
• Improve accessibility with the Accessibility Checker (Microsoft website)