Good: Spring flowers bloom across Kogan Plaza
Okay: Kogan Plaza
These standards and guidelines provide tips for addressing some of the most common accessibility issues and reflect accepted web development best practices.
We aim to meet these best practices with the POUR principles in mind:
It's important to ensure foreground and background colors have enough contrast so that people with low vision, color blindness, or other visual impairments can read your content.
To meet WCAG AA compliance for color contrast, visual presentation of text and images of text must have a contrast ratio of at least 4.5:1. Use tools such as the WebAIM Color Contrast Checker to confirm whether your color combinations meet accessibility guidelines.
Within GW's color palette, only certain color combinations meet WCAG AA or AAA guidelines. For text and images with text, be sure to use only approved colors. If you have questions related to the accessibility of GW's color palette, contact [email protected].
Users with visual impairments, cognitive challenges or technical limitations may not be able to see the images that are on a webpage. For this reason, it is necessary to provide alternate text on all images. The alternate text information is then displayed as plain text, read aloud via a screen reader, or output using a braille reader.
Follow these tips for effective alt text:
Good: Spring flowers bloom across Kogan Plaza
Okay: Kogan Plaza
Good: GW Chair of the Board of Trustees, Grace E. Speights
Okay: Grace E. Speights
Bad: Speights headshot
Good: Apply for GW Jobs
Okay: GW jobs application
Bad: jobs promo
When possible, use text rather than images to convey information. Text can be magnified, interpreted as braille, or read aloud using screen readers by visually-impaired users.
Using text on graphics is not best practice and should be avoided when possible. However, in instances where text inside of graphics is used (e.g., logos), you must provide alt text that communicates the text to screen reader and assistive technology users.
If your image includes text or is otherwise critical to understanding the content on your page, the colors used must adhere to WCAG AA color contrast ratios.
Assistive devices do not look to see where you are linking to. They look at the link text and what you say you are linking to.
For that reason, links should always be contextual, meaning that the linked text should be the plain language description of:
In the same way that a screen reader can "scan" a webpage to only read the subheads, it can also "scan" the page to only read the links aloud. When that happens, it's important for the link text be a clear indicator of what's after the click.
Bad: For more information about the university, go to www.gwu.edu.
Bad: For more information about the university, click here.
Weak: More information about the university can be found on the George Washington University website.
Stronger: More information about the university can be found on the George Washington University website.
Strongest: More information about the university can be found on the George Washington University website.
When linking to documents, it's important to include the document type in parentheses and to include that parenthetical in the link. Some document types are more accessible than others, and different devices will treat document links differently than website links. For instance, some mobile phones will download documents automatically when a document link is clicked, giving no warning to the user.
Providing the context that the link is to a document lets users make the decision on how to proceed before clicking the link. Some users may opt to call in for assistance, while others may choose to switch devices for a better user experience.
For example: GW's Visual Identity Standards & Guidelines (PDF) provides in-depth information and guidance on how to properly use the university's logos and branding components for a variety of use cases.
Color should not be the only indicator used to communicate a link. Indicate links using a variety (at least two) of indicators. Indicators can be things such as colored text, styled text (e.g., underlined, weighted, or italics), etc.
Microsoft Office documents should meet accessibility guidelines, including:
When possible, consider whether the content must be posted in a Microsoft Office format or if it could be posted online as a webpage.
GW IT offers Microsoft Office 365 free to all students, faculty and staff. We recommend using this tool and taking advantage of its built-in accessibility features.
Assistive technologies rely on the markup of a page to determine structure. This in turn allows users of those technologies to skim page content just as a non-disabled person would. Keep these best practices in mind when setting up headings:
Effective use of headings also promotes better indexing with search engines. What's good for accessibility is often good for SEO!
PDF documents should meet accessibility guidelines, including:
When possible, consider whether the content must be in PDF form or if it could be moved to a webpage.
Do not post PDFs that are one single graphic. You can test this by seeing whether or not you can easily highlight text on your PDF.
Social media websites give you plenty of tools to make your posts accessible, if you know where to look. Here are GW's expectations and where to find accessibility features on Twitter, Facebook, and Instagram.
All images must have alt text. After you add images to tweets you will have the option to "add description" which can be used to add alt-text to your image prior to posting the tweet.
Videos must be captioned. You can add captions to a video using Twitter's Media Studio. Upload your video and caption file there before you tweet it.
All images must have alt text. Facebook will auto-generate alt text when you post images, but sometimes you'll want to write your own, especially if your image has text. You can edit the alt text after you post by going into “Options”, a link in the bottom-right corner when you’re looking at an image.
In general, however, we recommend avoiding large amounts of text on Facebook images.
All videos on Facebook must be captioned.
All images must have alt text, and/or any text represented in the image should also be in the post description. Add alt text to your images by tapping on “Advanced Settings” when you’re creating a post. You can always go back and edit the alt text after you post on Instagram.
When posting Instagram Stories, make sure your text has enough contrast with its background color.
All images must have alt text, which is referred to as the "image description".
Third party software tools used to conduct business at GW, such as Calendly or Salesforce, must meet WCAG AA standards. This includes software obtained via formal contract process and purchase order as well as smaller tools purchased via PCard.
While some aspects of third party software tools are outside our control, GW departments are expected to do their due diligence on the following:
Also, be aware that GW's standard terms and conditions include language related to digital accessiblility. If you have digital accessibility questions related to procurement, contact the GW Procure-to-Pay office or the GW IT Contracts team.
As with all digital content, videos posted on websites or social media need to be in compliance with accessibility laws. In most cases, this requires some combination of captioning and/or written transcripts.
For non-live video captioning we recommend Rev, which charges a nominal fee to run the captions. Always check these for accuracy before posting. Videos under 10 minutes are usually captioned within 24 hours.
For live captioning when we stream video, we recommend AI Live. Schedule your live captioning at least 72 hours in advance.
Spontaneous live streams, such as those you might do "in the moment" for social media, must be captioned within 48 hours.
Several social media sites, including Facebook and YouTube, have step-by-step instructions for captioning videos. On both sites captions can be automatically generated or you can upload a file. You’ll still need to review these auto-generated captions because they’re not always 100% accurate.
If your video leans heavily on visuals, consider the experience for someone who is blind or low vision. If the visuals are key to understanding the video, create a written transcript that can be read with a screen reader. Don't forget to ensure that all visuals meet color contrast guidelines.
Read more about making audio and video media accessible from the W3C Web Accessibility Initiative.
1918 F Street, NW
Washington, DC 20002