College Communications
Web Accessibility
- Jump To:
- Guiding Principles
- Basic Guidelines
- Image Alternative Text
- Meaningful Link Text
- Use Headings
- Color Choices
- Accessible Document Sharing
- Video Captions
Web Accessibility is about more than following checklists and complying with the law. The internet is for everyone and this guiding principle is at the center of the work we do.
The Web Communications team oversees the Haverford College website. We care and we're here behind the scenes working to make the site a little bit better every day. We want our content to be as accessible as possible because inclusion matters.
Our guiding principles:
- reduce barriers and provide equal access to digital content on the College's website;
- craft content using standards such as the Web Content Accessibility Guidelines (WCAG) or higher education best practices;
- regularly audit, test, and improve the user experience for our visitors;
- embrace and advocate for the principles of accessible and inclusive design;
- reinforce best practices and web standards with content contributors such as staff, faculty, and students.
- In some instances, content contributors may have neglected to use alternative text. We’re correcting these as we encounter them and reinforcing best practices with the contributor.
- You may encounter legacy colors with poor contrast. Our current, approved styles meet Level AA of WCAG 2.1.
- Legacy content, especially sites created outside of College Communications, may not be in compliance with WCAG. While we’re happy to assist, our team may not have access to these projects or permission to edit the content in question.
If you have encountered an issue that affects your ability to access our website, please let us know via our form or by reaching out to websupport [at] haverford.edu.
Basic Guidelines for Content Contributors
Content contributors play an important role in maintaining any site’s accessibility. Whether you're posting an Update, working on Google or Word documents, distributing a PDF, or crafting other digital materials on behalf of the College, you should follow these guidelines to ensure your content is more accessible.
These guidelines are meant as an overview and will not cover every situation. Our team may reach out to you about issues not listed here. If you have concerns about your content being in compliance with these guidelines, contact websupport [at] haverford.edu.
Add alternative text to images.
Images are inaccessible by default. You must provide alternative text, also known as alt text, to address this issue. The alt text you use:
- is read by screen readers in place of images;
- is shown when an image doesn't load or if the user has chosen not to view or download images;
- is used by search engines to provide semantic meaning and descriptions of images.
The approach to writing alt text changes depending on the purpose and context of your image. Adding alt text to images is one of the easiest accessibility principles to learn while also being one of the hardest to master. For detailed information and examples, we recommend reviewing WebAim's Alternative Text Overview.
Alternative Text Basics
- Keep alt text succinct. The goal is to provide access to the content of the image without burdening the user with excess details.
- Screen readers announce when they encounter an image so there's no need to use "image of" in your alt text.
- Don’t use images of text. That’s what text is for.
- If your image is also a link the alt text should describe the link destination rather than the image.
- Complex images, such as charts and graphs, will need more than alt text to convey their meaning.
Use meaningful link text.
When a user encounters a link they need to know where it goes or what it does before they follow the link. The text you use when creating a link should make sense when read out of context of the surrounding content. Many screen reader users rely on the software's ability to list all links contained within a page. If your link text makes no sense when read in this list, they will be unable to determine the purpose or usefulness of the links you've included.
Try this exercise: read out the text of every link you've used. Can you determine where the links go? Great! If your links are difficult to remember URLs, or vague phrases such as "click here" or "read more," you'll need to make adjustments.
Visit WebAim: Link Text and Appearance to learn more about the role link text plays in accessibility.
Tips for Useful Links
- Avoid uninformative or repetitive link phrases, such as "click here" or "more."
- Use concise language. Links should be long enough to convey the purpose of the link and no longer.
- Avoid complex URLs as links when possible.
- Links should be underlined and there should be a 3:1 contrast between the body text and the link text.
Use headings.
Have you ever selected a word, made it bold, and changed the font size or color to help it stand out? Stop. Use a heading instead!
Headings communicate the organization of the content on the page. Users can better scan and interact with your content when it is properly organized. Browsers, plug-ins, and assistive technologies can use headings to provide in-page navigation. As a bonus, a properly structured document allows you to take advantage of word processing software's built in functionality, such as auto-generating a table of contents.
Learn How to Use Headings
- Creating haverford.edu Updates provides instructions on formatting your content in an Update.
- Add a heading in Microsoft Word
- Add a title, heading, or table of contents in a Google Doc
- Web Accessibility Tutorials: Headings
Be careful with color choices.
Adding colorful backgrounds or text to your content has implications beyond Style Guide violations. What might seem fun to you could provide a serious challenge or barrier to access for others.
- Don’t use color alone to communicate information. For example, if you decide requirements will be conveyed by blue text while optional items are green, you’ve excluded anyone unable to distinguish between these two colors.
- Choose colors with sufficient contrast. In order to meet the guidelines at Level AA, text must have a contrast ratio of at least 4.5:1.
- Be considerate. Making the background of your document an image or using harsh colors can impact a user’s ability to perceive the information you’re trying to convey.
Tools for Checking Colors and Contrast
- WebAim Contrast Checker
- Contrast Finder will recommend replacement text or background colors if your combinations have insufficient contrast.
- Color Safe can help you find a color palette based on WCAG Guidelines.
Only share accessible documents.
Make sure your document is accessible before you share it! The Web Communications team is unable to provide support for the creation of Word documents, Google documents, or PDFs, but there are other resources available to you.
- Access & Disability Services (ADS) provides support for students and faculty. Their overview on creating accessible instructional materials will help you avoid common pitfalls when using Word, PowerPoint, or generating PDFs.
- Instructional & Information Technology Services (IITS) works with students, faculty, and staff one-on-one to make technology as accessible as possible.
Resources for Creating Accessible Documents
Ensure videos have captions.
Videos should be produced and shared in ways that allow all members of your audience to access the content. This means providing captions, transcripts, or both, depending on the situation.
Captions are required for any public-facing video content that contains audio. College Communications uses Rev.com to have captions created for videos shared or created through our office. The cost as of May 2024 is $1.50 per minute and will be billed back to you via Workday.
Video Production and Editing
Patrick Montero manages the photography and video production for Haverford College. Use the Photo & Video Request Form to start a new project.