Web Accessibility is about reaching as much of our target audience as possible, and it’s the law. It’s our commitment at Manhattan College to present information on our site that can be utilized regardless of ability or disability. As an institution dedicated to ensuring equal access to programs, services, and activities, Manhattan College has developed the following web content guidelines.
Guidelines for Creating or Updating Web Pages
Use only black font color for paragraph text. Contrasting colors such as black text on a white background make the text more readable for color-blind and low-vision users.
Using headings indicates the hierarchy of content.On long pages of content, consider using a table of contents to help readers jump more quickly between headings.
Headings help screen readers determine which content is most important, so that visually impaired users can navigate through your content more quickly.
Use the predefined style headings in the CMS. You can find these styles in the WYSIWYG editor under "Formats/Headings".
For example, the main heading in this section ("Guidelines for Creating or Updating Web Pages") is using the "heading 2" style, while the sub headings ("Text", "Heading Styles") are using the "heading 3" styles. This denotes the hierarchy of content.
Provide alternative text for images, graphs, and charts.Screen readers “read” the images, graphs, and charts using the alternative text that you have provided. This explains the purpose of your image, graph, or chart to users who are visually impaired.
An added bonus to providing alternative text is that it will help to increase the likelihood of your content showing up in Google search results.
When inserting an image into the web page, enter a description in the "image description" field. If images are decorative and don’t directly relate to the content, check the box to indicate it is "decorative".
The image description should be as specific as possible.
Good Alt-Text Example: A large, diverse group of cheering students, standing up and fist-pumping on the bleachers of a basketball game.
Not-so-good Alt-Text Example: A crowd at a basketball game.
Why is this ineffective? The second example should be more descriptive. It also doesn’t convey young students filled with school spirit, or conjure excitement.
Multimedia Captions and Transcripts
Supply multiple avenues for multimedia content (e.g., audio with a transcript, video with captioning). Video, audio, and interactive media requires captioning or an alternative method to deliver the same information.
Captions and transcripts benefit a wide variety of users, including non-native speakers, users who are deaf and hard of hearing, and users in sound-sensitive environments.
Use descriptive titles, headers, and link text to provide added context. Link text that describes what you are linking to, which helps readers scan and anticipate where they will go when clicking a link. Link text like “Click here” provides little context to where the link is actually going. Do not solely rely on references to shape, size, or position to describe content.
Descriptive link text also provides the main context for screen readers. Screen readers linearize content and do not communicate all aspects of shape size, or position of visual elements.
Format and use simple tables with column and row headers. Split nested tables up into simple tables, and don’t use tables to control layout.
Rationale: Complex tables can be difficult for readers to follow and comprehend, especially for screen reader users who have to remember the headers.
It is important to note that PDFs and flipbooks are not accessible to those with visual disabilities, unless they were specifically created for that purpose (typically a process that takes longer than creating webpages). Lengthy PDF documents which were developed for printing are not suitable for the web. The web is used to present concise, relevant, and searchable information, that can be linked to additional sources, not just volumes of text and PDFs.
Before submitting your page to the workflow, check your page for any accessibility issues. To do this, select "More" on the top right corner of the CMS, then select "Check WCAG Compliance". This accessibility checker will find and display any issues on the page. You can click on each of issue to see where on the page it is appearing, and to see more information. Please note that the checker will display issues with the top navigation, but you can ignore those. You only need to address any issues with the content that you have added to the page. If you have any problems understanding or fixing issues, feel free to contact Tracy Guyton.
Use capitalization sparingly. Capitalizing all letters in a word or sentence can be visually difficult to read, and it causes a screen reader to read each individual letter instead of the word.
Any text, media, or activities that you provide from an external website or resource should be accessible.
Keyboard Navigable Content
Make sure content can be navigated via a keyboard. Keyboard navigation is the primary means used for navigating content on a web page by users who have visual or mobility impairments.