When do you need manual testing to make your website accessible, and when is automated testing enough? There are advantages and disadvantages to each. Which one works best depends on what you’re testing and when. In this blog post we’ll explain automated vs manual accessibility testing, and when you might need each of them.
What is Automated Accessibility Testing?
Automated accessibility testing uses programs to scan your website and uncover accessibility obstacles. This process is automatic, and generally you only need a URL to get started. A number of apps and programs can scan your site for many different accessibility issues. These problems can be found in the code of your website, and they’re often easy to fix. When comparing automated vs manual accessibility testing, a program is easy to run and will give you peace of mind, though it won’t be able to cover everything that a person can.
For example, an accessibility testing program can crawl your site and identify any pictures that don’t have alt-text. It will flag these as accessibility issues to fix. A program can also identify any areas that don’t have sufficient color contrast by recognizing HEX values. Automated testing tools can look for empty links, missing labels, and other elements that can make your website hard to navigate with a screenreader or other assistive devices. Some of these programs can test a single page of your site, certain elements, or even your entire public-facing site.
The biggest advantages of automated accessibility testing vs manual testing are ease and speed. Tell the program to run and it will check your page or website for a variety of common accessibility issues. Some services will even check your site at regular intervals, automatically, and provide a report. This means you can perform accessibility maintenance without lifting a finger.
As you add content and make changes to your site, accessibility issues will inevitably arise. Testing your site regularly will help you to solve these problems. Automated testing programs are ideal for this type of upkeep. Many of the most common accessibility issues can be identified by these programs and resolved fairly easily. When you perform manual accessibility testing, it’s also a good idea to conduct automated testing at the same time. This will allow you to quickly test individual elements across your site, while also testing functional elements that automated testing can’t.
When to use automated testing
When you significantly update your site content
At regular intervals for accessibility maintenance
Before launching a new site
After conducting a site redesign
What is Manual Accessibility Testing?
Manual accessibility testing allows a real human to use your site in multiple ways, and uncover accessibility obstacles. Often, this involves the use of assistive devices, such as a screenreader. This can also mean making adjustments to the browser to simulate what someone with a disability might face. Manual accessibility testing might include using your website with images or style sheets turned off, magnifying the screen, or navigating with a keyboard instead of a mouse. These types of tests imitate how someone with low vision or limited dexterity might use your site.
When it comes to automated vs manual accessibility testing, the biggest advantage of manual testing is the ability to critically assess the site. A program cannot make a judgement about whether something is or isn’t accessible, it can only look at code and make a determination. However, a person can look critically at an element of your site and see whether it works or not. This is ideal for elements that would require a level of interpretation or understanding. For example, a program can tell you whether or not an image has alt-text attached, but only a person can tell you whether the alt-text accurately explains the picture. A program can tell you whether your form fields have labels, but only a person can tell you whether they can actually fill out the form without too much difficulty.
When to Use Manual Testing
Since it requires time and energy from a real person, manual testing takes longer. However, manual testing gives you valuable insights about how your site really works for people with disabilities. This type of testing is ideal for assessing the functionality of your site and how visitors can interact with important elements.
When to use manual testing
Before launching your website
After or during a redesign
Changing or adding important inputs like forms
Changing or adding important navigational elements like menus
The easy answer when deciding between automatic vs manual accessibility testing is to use both. Conducting regular accessibility assessments will not only show your customers that you care about their experience, but it will also protect you from liability.
A dramatic increase in internet-connected devices such as smart speakers and smart tvs has brought voice search into the mainstream. However, web usability through voice commands and readouts is not brand new technology. Many people who don’t use computers or the internet in traditional ways have been using this technology for years through screenreaders. As voice search becomes more common, it invites changes to the web landscape that can benefit all users.
What You Need to Know About Voice Search in 2020
More Devices Than Ever Use Voice Search
Though most of us probably don’t think about it very often, computers aren’t very versatile from a mechanical perspective. A computer requires a clear and visible screen to display a result, and a mouse or keyboard for inputs. Though we’ve changed these things to make them very small (your smartphone) or very large (your smart tv), these changes are far from perfect. Plugging a keyboard into your smart tv isn’t practical and watching videos on your small smartphone screen isn’t much fun. Moreover, other devices present more challenges. How could you possibly type into a wearable device? How could you see a result on a device without a screen, like a speaker? This is where voice search and voice commands come in.
In 2017, experts estimated that voice search would account for 30% of search activity by 2020. These projects appear to be on target, with 35% of smartphone users alone reporting using voice search at least once a week. This doesn’t include searches made on the 118 million smart speakers now in use, wearables like the smartwatch, or a long list of other connected devices. As internet connectivity becomes a larger and larger part of various devices we use everyday, voice search will continue to expand.
How Voice Search Results Work
Ask a smart speaker like Google Home or Alexa a question, and it will read out an answer derived from online search results. How do smart speakers and other connected devices decide what to read?
Smart speakers determine which search results to read out in similar ways that search engines determine which results to display. An algorithm determines content that is reliable, relevant and easy to understand, and then organizes results. A smart device can only read out one to three results, so it generally chooses the three best. A part of this automated decision-making process is whether or not the device can actually interpret the results. This is where optimizing for voice search comes in.
By developing Featured Snippets in 2014 and expanding them in later years, Google started to solve this problem early on. Featured Snippets displayed a quick blurb to answer a user’s question as directly as possible, then displayed the rest of the results underneath. This is very similar to the requirements for a brief response to a voice search. Many of the responses Google Home and other smart devices give are based on Featured Snippets.
Some voice searches require a longer list of results. In an effort to solve this problem, Google released Speakable. This markup makes it easier for devices to read out the content on a website. Though it is currently in beta, Speakable has the potential to make more search engine results accessible through a voice search. This can also make complex voice searches easier to ask and complex results easier to provide.
How to Optimize for Voice Search
You don’t need to know Speakable to get your results on a voice search. Optimizing for a featured snippet can be a good way to get your content seen as well as heard. This involves restating the question, using lists and snippets where appropriate, and utilizing accessibility best practices to ensure a device can recognize and read your content. This allows a smart device to parse through the content and code on a page to find an answer to the user’s question.
Even if your content doesn’t show up on a voice search, optimizing this way is likely to increase your SEO value regardless, and provide other benefits. As the top results of typeable searches and the top results of voice searches grow closer together, this optimization will become increasingly important.
The Internet is Changing—Again
Up until the last five or ten years, the internet was primarily a text-based world accessible through a computer. However, the wide availability of internet access, smartphones, and cameras changed it. There are now more videos and images than ever. These changes brought a host of accessibility problems, many of which have yet to be fixed.
The expansion of internet-connected devices relying on voice search has the potential to change the landscape again, and solve some of these accessibility problems. Those who have difficulty reading a computer screen or typing a search can utilize the same voice search technology that millions of others use. And while internet connected devices are still expensive, they’re often more affordable than expensive screenreading software and other assistive devices. As webmasters vie for top search spots for voice search, they’ll also be making changes for accessibility. Though there will certainly be other challenges, this is a change that will continue through 2020, and one webmasters should pay attention to.
Web accessibility primarily helps people with disabilities to use websites equally with abled users. However, instituting a web accessibility policy can also have other benefits. Your user experience, SEO, the versatility of your site and your site’s speed can all improve when you use web accessibility best practices. If you’re not sure if web accessibility testing is worthwhile for your business, here are 6 benefits of web accessibility you should know about.
6 Benefits of Web Accessibility You Should Know About
1. Improved Mobile Usability
For your website accessibility to be successful, users should be able to magnify the screen. This helps users with vision loss see a website more clearly. This capability can also help with mobile usability. Magnifying content on a large screen and showing content on a smaller, smartphone screen are very similar. If your site can do one of these, it can easily do the other.
Responsive sites are made to easily switch between mobile and desktop interfaces. If your site is responsive, it can also be easily magnified. Since the majority of Google searches are now made from a mobile device, this is a great additional benefit of web accessibility. If your site isn’t mobile-friendly yet, now is a good time to make the change, and improve your web accessibility at the same time.
Another important benefit of web accessibility is the ability to access the site under less-than-ideal conditions. A common scenario is the ‘bumpy bus.’ A user may be trying to access your site on their smartphone while riding a bus, but the bumps in the road cause them to continually tap the wrong button. A user who struggles with motor control might have a similar experience. The ability to magnify the screen or use alternative controls to scroll through buttons can help make this experience easier for both users.
3. Better User Experience
When color contrast is low, fonts are too small, menus don’t open properly, and links aren’t clear, the result is a bad user experience for everyone. When users visit your site, these elements immediately jump out of them, and they’re unlikely to linger on your site unless they absolutely have to. These types of sites are frustrating for everyone to use, and particularly frustrating for people who use the web with assistive technologies.
4. Improved SEO
Many different factors play into search engine optimization (SEO), including a good user experience, content, links, and keywords. By improving the user experience on your site, users will want to stay longer, which can improve SEO. Adding alternative text (alt text) to images, removing broken links, and linking text properly can all improve SEO and improve web accessibility. Fixing many of the most common accessibility problems have the added benefit of improving SEO.
5. Less Liability
In 2018, over 2,250 web accessibility lawsuits were filed in the U.S. This number will likely continue to grow. By improving web accessibility now and creating a plan for maintaining it, you reduce your chances of a costly and time-consuming lawsuit.
6. Usable for All
The primary and most obvious benefit of web accessibility is that your website and web services are accessible to all patrons. By making a few changes to your website layout or how you add content, you can make the difference between a site that is easy to use and enjoyable for everyone, or frustrating and difficult. By keeping web accessibility in mind, your website and online services are available to the maximum number of users.
Web accessibility is a part of online best practices, and using the principles of web accessibility has multiple benefits. Web accessibility does not have to be complicated. With basic testing and a few proactive policies, you can make your site accessible.
Web accessibility lawsuits are on the rise. With the latest website accessibility case declined by the Supreme Court, there will likely be more web accessibility lawsuits in 2020. If you’re uncertain about your website’s accessibility and nervous about a lawsuit, now is the time to take action. Web accessibility doesn’t have to be complicated. Here are 4 things you can do right now to improve your web accessibility. If you’re not a web designer, don’t worry—these changes are relatively simple and won’t require much experience.
4 Fast and Easy Web Accessibility Solutions
Some of the most common accessibility problems are also some of the easiest to solve. These are accessibility problems that you can test for and solve right now with very little web design experience. If you know how to add content to your site and make small changes, like editing text and images, you’ll be able to make these fixes. Making these fixes will remove many of the issues that have caused notable web accessibility lawsuits, and will put you ahead of many other websites.
1. Improve Contrast
In WebAIM’s programmatic analysis of the top 1,000,000 homepages, low color contrast was the most common accessibility issue, affecting a shocking 85% of pages. This is particularly unfortunate, since it is so easy to solve!
Here’s how you can easily improve the color contrast of your site.
First, use a color contrast testing tool. If your pages are mostly all alike, testing one page may be enough. If your pages are markedly different, use a tool like Accessible Metrics, which will test your whole site for these and other problems.
The testing tool will show you where your color contrast is lacking. You can fix these problems individually by changing text color, backgrounds, or changing images or icons. Or, you can change the color presets on your whole site by accessing the theme or template.
Make these changes and try testing again. If your site checks out, you’ve fixed the most common accessibility problem!
Every web content management system (CMS) is a bit different, but you can generally change the color of text in the same place that you would add text. Or, you can change your entire site in a themes or appearance section.
2. Add Alternative Text
The lack of alternative text is also a very common accessibility problem that can be easily fixed.
First, what is alternative text? Alternative text, commonly called alt-text, appears in place of an image, link, icon or another visual element. Screenreaders can read out alt-text to a user who cannot see the visual elements. Therefore, alt-text is especially important for visually-impaired users.
The process for fixing this accessibility problem is very similar to the previous one. Here’s how:
Where images, icons, buttons or links do not have alt-text, add some. Describe what the visual element is in a few words. You can do this by logging into your CMS, clicking the element, and selecting edit. There will be a space to add and edit alternative text.
3. Add Link Text
This is very similar to the previous accessibility problem. Your site pages are connected by dozens, even hundreds or thousands of interconnected links. This is how users navigate around your site. In some cases, these links are already created through text, like the following link that leads to our home page. However, linked images and icons need text to show where the link leads.
Consider a button with the image of a house. Sighted users understand that this button will probably lead to the home page. However, without link text, a screenreader won’t be able to interpret the link. This is why missing link text can be problematic.
Also, consider linked text that simply says “click here.” This does not tell a user where the link goes. Instead, use text that explains the link, such as “click here to return to the home page.”
4. Use Skip Navigation Links
Navigation links at the top of your site can make it difficult for screenreaders to read. Screenreaders and other assistive devices must read through each link before moving to the content of the page. If you only have a few links at the top of your page, or you can expand and collapse these menus, this won’t be an issue. However, a large number of links at the top of the page can cause problems.
Luckily, you don’t even have to change your navigation to avoid this problem. By adding a “skip navigation” or “skip nav” link at the top of the page, you can make your page easier to use. To do this, simply add a link at the top of the page with the text “skip navigation.” Then, create an anchor point after the navigation links, usually at the start at the page’s content. Connect the link to the anchor point, and you’ve solved this accessibility issue.
By making these simple changes, you’ve made your site much easier to use for everyone, including both abled and disabled users. If you’re not sure whether or not your site is accessible, try a test. You can use a program to test your site, or conduct a manual test yourself using a few simple hacks, like disabling style sheets and removing images. Though it’s ideal to work with an accessibility professional, especially if your site is complex, this is a great place to start.
As the World Wide Web becomes increasingly important in everyday life, web accessibility is a growing concern for many users and many businesses. In an effort to use the web equally with abled users, many disabled users and advocates have filed accessibility lawsuits against businesses that do not have accessible websites. Businesses large and small can learn from high-profile web accessibility lawsuits. These are the most prominent recent cases as of the start of 2020, with more likely on the way.
Website accessibility compliance is no longer optional. Businesses large and small are increasingly involved in accessibility lawsuits due to a lack of web accessibility. To help protect your brand from lawsuits, we’ve put together a list of the best free accessibility tools to make sure your website is fully accessible and adheres to common standards. You can use tools to test your site or individual pages for a number of common accessibility issues, or use tools to test for particular problems related to accessibility standards like WCAG 2.0, Section 508, the ADA, and more.
The 25 Best Free Accessibility Tools to Test Your Site
The Importance of Website Accessibility
Website accessibility standards consider auditory, cognitive, physical, speech, and visual needs when assessing websites. Additionally, websites must be accessible under all types of circumstances, including different users, environments, and conditions. Often, improving website accessibility also makes your website more useable in the following situations:
People using mobile devices
Users with broken arms or limited dexterity
People who are blind or have limited vision
Users on a bumpy bus or another difficult environment
Slow internet connection
For those approaching web accessibility for the first time, it can seem a bit overwhelming. However, these free accessibility tools can help. Website accessibility testing is the step-by-step process of checking whether or not a website or mobile application is completely accessible for all users. Some accessibility problems can be detected by a program, while others will require user testing.
Programmatic accessibility testing tools will sort through your site and detect issues as they are written into the code. These tools can detect issues like a lack of alternative text (alt text) for images, HEX or RGB color codes that do not have enough contrast between them, form fields that do not have labels, or links without descriptive text. This is a great place to start a website accessibility assessment, and can uncover a number of the most common accessibility issues. The following are some popular, effective, free accessibility tools for making these and other checks.
Free Accessibility Tools to Test for Multiple Accessibility Issues
A number of free accessibility testing tools can test individual pages of your site for multiple issues at once. Accessible Metrics can test your entire site for these issues, and provide regular updates to detect problems as you add new pages and content.
1. Accessible Metrics: With a free account, you can test individual pages of your website for ADA and Section 508 compliance. With a subscription, you can test your entire site at regular intervals and get alerts about any accessibility issues that arise as you change your site.
2. Cynthia Says: According to Cynthiasays.org, “Cynthia Says educates you in the concepts behind website accessibility. It is meant for personal, non-commercial use to inform the community on what constitutes accessible web design and accessible content. It identifies errors in Web content related to Section 508 standards and/or the WCAG guidelines for Web accessibility.”
3. WAVE: According to webaim.org, “WAVE is a suite of evaluation tools that help authors make their web content more accessible to individuals with disabilities. WAVE can identify many accessibility and Web Content Accessibility Guideline (WCAG) errors, but also facilitates human evaluation of web content.”
4. AChecker: According to achecker.ca, “This tool checks single HTML pages for conformance with accessibility standards to ensure the content can be accessed by everyone.”
5. Web Accessibility: According to webaccessibility.com, “Our free web accessibility test will determine whether your website complies with the Web Content Accessibility Guidelines (WCAG) 2.0 standards.” You can test five webpages for free.
Free Accessibility Tools to Check for Color Contrast
In order to make your website useable for those with colorblindness or poor vision, you must have a certain contrast between colors across your website. If an individual can’t distinguish the background from the foreground, the content is considered illegible and therefore not accessible.
6. Accessible Colors: allows you to input the HEX code, size and weight of your text color, HEX code of your background color and the standard your website is required to comply with. It will then alert you to whether you are passing or failing for that particular standard, so you can make changes accordingly.
7. Colour Contrast Check: allows you to input HEX codes for your foreground and background color. This will give you results based on contrast as well as WCAG compliance levels.
8. A11y Color Contrast Accessibility Validator: According to color.a11y.com, “This website provides free color contrast analysis tools that will display the color contrast issues of a web page or chosen color-pair; per WCAG 2.1 Guidelines.”
9. Accessible Brand Colors: According to abc.useallfive.com, “his tool shows you how ADA compliant your colors are in relation to each other.”
10. Accessible Color Evaluator: This tool allows you to enter multiple text and background colors to assess your overall color scheme.
Free Accessibility Tools to Check for Flashing
If there is any flashing or flickering effects included on your website, it could trigger seizures from users on your site. That is a direct violation of website accessibility standards.
Free Accessibility Tools to Check for Image Alt-text
Alt-text describes images on a screen with text. So, for the visually impaired who need screen readers to use a website, the screen reader registers the alt-text in place of the image. Without alt-text for all non-text elements on the page, your website could be subject to an accessibility lawsuit. Accessible Metrics is one tool that can test your entire site for alt-text, among other accessibility concerns, and provide a full site report. Proper alt-text can also help to improve your site’s search engine optimization (SEO), so many of these tools are also used primarily for SEO.
12. WAVE Chrome extension: Evaluate your website accessibility standing right from your browser. No information will be sent to the WAVE server, guaranteeing you complete privacy.
13. Image Alt Test: According to SEOsitecheckup.com, “Check if images on your webpage are using alt attributes. If an image cannot be displayed (e.g., due to broken image source, slow internet connection, etc), the alt attribute provides alternative information.”
14. Screaming Frog: Screaming Frog SEO Spider is a website crawling tool that is used mainly for search engine optimization (SEO). However, it can also be used to find missing alt text in images, among other things.
15. SEOptimer: This is also primarily an SEO tool, however can also be used to detect missing alt text for your images.
Free Accessibility Tools to Check for Empty Links
Those who are visually impaired will struggle to understand the context of links on a website if there is not accessible text paired with the link. The link text allows a screen reader to interpret it and communicate back to the user. If your links do not have some form of text replacement they are considered “empty links” and violate website accessibility guidelines.
Keep in mind that “dead links” are different from “empty links.” Dead links lead to pages that are no longer active or no longer exist. Empty links contain no descriptive text to show where the link goes. Many link-checking tools will check for both of these elements.
16. Dead Link Checker: According to deadlinkchecker.com, “Are broken links damaging your website’s rankings and usability? There’s no getting around it – error 404 pages are bad for business. Dead Link Checker crawls through your website, identifying broken links for you to correct.”
17. Check My Links Chrome Extension: This extension to your Chrome browser “is a link checker that crawls through your webpage and looks for broken links. Check My Links is an extension developed primarily for web designers, developers and content editors.”
Free Accessibility Tools for Adding Video Subtitles
Video subtitles are also an important part of making your website accessible. The more accurate the subtitles, the better, but any attempt is better than none. With these free accessibility tools, you can add powerful videos to your website and make them usable for everyone, without going over budget.
18. YouTube: The popular video-hosting service YouTube can add subtitles to many videos automatically.
19. Amara: Amara.org makes it easy to add your subtitles in multiple languages.
20. Kapwing: By working with smaller chunks of your video, Kapwing makes it easy to add captions.
21. Closed Caption Creator an easy user interface and shortcuts allow you to add captions in a short amount of time.
Manual Accessibility Testing Tools
Accessibility testing programs can detect many accessibility issues that your website may have. However, there are limits to what a computer program can detect. Some issues can only be detected by a real person using accessible technologies, like a screenreader. Fortunately, there are free accessibility tools you can use to see how your website actually performs. The following are some popular, effective, free accessibility tools you can use to see how your site might work with assistive technologies.
Users who are blind or visually impaired may use screenreaders to read the words on a webpage. High-quality screenreaders like JAWS can be expensive, but there are also free options that you can use to test your site. Here are a few popular free accessibility testing tools that can show you how your site works for visually impaired users.
22. NVDA: NVDA is a free, open-source, international, high-quality screenreader developed by the not-for-profit organization NV Access. This software can be downloaded for free, but users are encouraged to donate what they can to continue to support the organization.
23. Mac VoiceOver: Mac computers come with a number of helpful free accessibility tools, including VoiceOver. You can find these and many others under System Preferences. VoiceOver can help you navigate your site purely through keystrokes and read-outs, or you can scroll over text to read it out on command. This makes it useful for blind and low-vision users.
24. ORCA: ORCA is an open-sourced, free accessibility screenreading tool made for Linux operating systems. It uses keyboard shortcuts and screen reading to make webpages navigable.
25. ChromeVox: This Chrome browser extension is easy to install and allows you to try screenreading out on your site quickly and easily.
It’s important to test your website to make sure it is fully accessible to everyone. Web accessibility testing is also not a one-time to-do, it’s an ongoing process. Keep up on overall compliance to protect your website. These automated tools are a great start to making sure your site is safe from lawsuits. Download the Ultimate Website Accessibility Checklist to learn more about common accessibility risks and complete the testing process.
When it comes to accessibility compliance, the Web Content Accessibility Guidelines (WCAG) version 2.0 AA is the most-used standard worldwide. There are three levels of WCAG compliance; A, AA, and AAA. Though this distinction is important, it can be confusing. In this blog post, we’ll answer some common questions about WCAG compliance levels, including what WCAG A, AA and AAA are, what they mean for your site, and which compliance level you need.
What are the Levels of WCAG compliance?
There are three compliance levels within WCAG 2.0 (and, most recently, WCAG 2.1): A, AA, and AAA. Each level includes guidelines that must be met to consider the website accessible for all users. The distinction between conformance levels gives developers an organized structure for minimal, acceptable, and optimal accessibility. The different WCAG levels also provide more flexibility, so even very complex websites or cutting-edge technologies can maintain a minimum level of compliance.
What do the different WCAG conformance levels A, AA, and AAA mean?
As previously mentioned, WCAG 2.0 A, AA, and AAA all have criteria that must be met. These criteria cover everything from site navigation to text to videos to inputs and more. However, WCAG does not outline specific actions that every website must take, rather it states what accessible websites should do. This means the biggest difference between conformance levels A, AA and AAA are what they actually mean for users.
These conformance requirements essentially prohibit elements that would make the website inaccessible. Websites that do not at least meet WCAG 2.0 A are impossible or exceedingly difficult for people with disabilities to use. Hopefully, your site already meets at least WCAG 2.0 level A
Some notable WCAG 2.0 Level A requirements include:
Meaning is not conveyed through shape, size, color etc. alone
WCAG 2.0 Level AA: Acceptable compliance
This conformance level is used in most accessibility rules and regulations around the world, including the ADA. To meet WCAG 2.0 Level AA conformance, the website is usable and understandable for the majority of people with or without disabilities. The meaning conveyed and the functionality available is the same. Your site may not be WCAG 2.0 AA compliant yet, but a few simple updates can help you get there. A WCAG checklist can help you go through the requirements in an organized way and take them on one at a time.
Some notable WCAG 2.0 Level AA requirements include:
Color contrast is, in most instances, at least 4.5:1
Alt text or a similar solution is used for images that convey meaning
Navigation elements are consistent throughout the site
Form fields have accurate labels
Status updates can be conveyed through a screen reader
Headings are used in logical order
Accessible Metrics and the Website Accessibility Checklist also use WCAG 2.0 AA to help webmasters improve or start an accessible site. Testing for accessibility problems is a great place to start.
WCAG Level AAA: Optimal compliance
Compliance at this level makes your site accessible to the maximum number of users, and makes this experience easy. While this level of conformance would be ideal to make the web experience truly equal for all users, W3 explains, “It is not recommended that Level AAA conformance be required as a general policy for entire sites because it is not possible to satisfy all Level AAA Success Criteria for some content.”
If your website or application caters to the elderly or people with disabilities, WCAG Level AAA compliance can help to ensure that your audience can use your site easily. This also shows that you are considerate of your audience and their needs. Since many websites are not accessible, your users will notice this extra level of care.
Some notable WCAG 2.0 AAA requirements include:
Sign language interpretation for audio or video content
Color contrast is at least 7:1 in most instances
Timing is not an essential part of any activity
Context-sensitive help is available
Understanding the different compliance levels of WCAG 2.0 and what they indicate can help you to understand these guidelines as a whole, and why they are important. They can also help you make changes to your website or applications so you can better serve your audience. Even if you do not understand all of these guidelines, taking steps to test for and correct accessibility problems will improve your online presence and can prevent expensive lawsuits.
Videos have quickly become the preferred format for information sharing. They generate more engagement and shares than pictures or text, and there are more videos online than ever before. Making videos accessible to all internet users not only helps improve your SEO, but it also makes your videos more enjoyable. In this blog post, we’ll explain ways to make your video accessible, and tools you can use to add subtitles quickly and easily.
Why Do Videos Need to Be Accessible?
Videos need captions to meet ADA website accessibility requirements. Captions are also required for videos to be accessible for people with complete or partial hearing loss. Though these aspects are important, accessible videos also have other benefits.
Videos with captions or transcripts have been shown to improve SEO and gain higher position on search engine results pages (SERPs) than videos without captions or transcripts. This is partially because search engines can “read” the content of videos when they are accessible. Search engines can read the text files attached to videos containing captions or the transcripts contained on a page. This tells search engines more about the content of the video and whether it suits a particular search query. Since relevant posts show up higher on a SERP and posts that appear higher generate more traffic, videos need captions to improve organic search traffic. This is sometimes called video SEO.
Video captions are also important for anyone who does not watch video with sound. An estimated 85% of users watch Facebook video without sound. This probably represents mobile users who might not have headphones or might be watching in a noisy environment. This also indicates that users on other, similar social media also watch media without sound. In this case, videos without captions would be ineffective.
Videos need either captions or transcripts for to be most effective for most users. There are several ways to do this, some which are more clear and others which take less time. There are also best practices for videos with captions or transcripts that we’ll discuss further in the post.
To make a video accessible, you must provide text representation of sound. This might include a text transcript, posted on the same page as the video, or captions throughout the video. Which method you choose will depend on the purpose and type of video you have. For example, some podcasts include transcripts for hearing impaired users and for SEO value. On the other hand, shorter videos with more action will probably use captions.
What Are Transcripts?
A transcript is a full, written account of the monologue, dialogue or sound effects in the video. To make videos accessible using transcripts, the transcript should contain the substance of the video. This means that stutters or hesitations might be excluded, unless they affect the mood or understanding of the content. Whole sections or sentences should not be skipped. Even if some sections appear to be outside the point or purpose of the video, skipping them means straying from the content of the video too far and making the transcript inaccurate.
It may also be helpful in a transcript to include coordinating timing marks showing where the transcript interacts with the video. For example, you might put timing marks where an interviewer asks a question, or where the video content changes topic or direction.
When Should I Use Transcripts?
Transcripts are ideal to make video accessible when the content is mostly informational. This is best for podcasts, interviews, essays, or speeches. If the movement or actions in the video are important to the content, a transcript will probably not be ideal.
What are Captions?
Captions are bits of text that correspond with the spoken words or sound effects in the video. Captions must accurately follow the timing of dialogue, monologue or sound effects, or they won’t accurately convey the content of the video. In some cases it may be helpful to include sound effect descriptions such as (door closing) or (soft laughter) to describe a situation.
When Should I Use Captions?
Captions are ideal for short videos or videos where timing and coordination of speech or sound effects are important. This includes shows, movies, ads, how-to videos, or music videos, among others.
8 Ways to Make Videos Accessible
There are several different ways to add captions or transcripts to your video. Some will be more accurate, but take more time, while others will be faster, but may be less accurate. You can do some of these yourself, or work with another company to add subtitles or transcripts for you. Here are a few ways to make videos accessible.
The video hosting service YouTube will automatically provide subtitles for some videos. For others, you can add your own captions when you upload the video. Keep in mind that automatically added captions are not always correct, so it is a good idea to look these over and edit them where appropriate.
2. Video Editing Programs
Most video editing programs, like Adobe Premiere, AVS video editor, iMovie and others allow you to add captions to your video within the software.
3. Free Caption Services
Amara.org allows you to add captions and translate your captions into other languages where needed. This service is free and allows you to work with others on your team. Other services like Kapwing and Closed Caption Creator work similarly.
4. Paid Caption Services
If you have a very long video or you don’t have time to add captions yourself, paid services like Dotsub will do it for you. You simply upload your video, pay for their service, and they will caption your video with quick turnaround. Other services like Automatic Sync Technologies, 3PlayMedia, cielo24 will also add captions for a fee.
5. Transcription Programs
If you are looking for a transcript instead of captions, several programs will help you with this process. InqScribe helps you type out transcripts as you watch a video, making it easy to start and stop the video without a mouse. NCH Software, FTW Transcriber and several other programs work similarly.
6. Voice Recognition Transcripts
Software like Designrr recognizes words automatically and converts them into transcripts. This software is ideal for long transcripts that might be made into books or other media. Trint works similarly.
7. Paid Transcripts
Services like Scribie as well as many independent contractors on sites like Upwork or People Per Hour will transcribe your videos or audio files for you. Keep in mind that accuracy is dependent on the transcriptionist’s skill, so you may pay more for better quality transcription.
8. Word Expanding Software
Programs like Swift Text and Fast Fox make it easier for you to transcribe audio or videos yourself by providing a library of text shortcuts. You can do this yourself by customizing your autocorrect settings, but some people prefer a separate program.
Now that you have eight ways to make videos accessible, try out different services or try creating captions or transcripts yourself to see which method works best for you or your organization. With video captions or transcripts, you’ll not only see SEO benefits, but you’ll also meet ADA requirements for an accessible site.
Once you’ve conducted website accessibility testing and you’ve fixed and barriers in your site, you want your site to stay accessible. For this to happen, everyone adding content to your site must understand the importance of website accessibility and how to maintain it. ADA website accessibility training will help your team understand why online accessibility is important, and how they can maintain website accessibility in the future.
ADA Website Accessibility Training For All Team Members
Website accessibility involves many layers of skills. It’s not necessary for everyone on your team to know all of the details of web accessibility. However, each person should know how to maintain accessibility for the common items that they work with. For that reason, we’ve divided ADA website accessibility training based on tasks that different members of your team are most likely to work with.
For Everyone: Why is Web Accessibility Important?
From web designer to blog writers, programmers to videographers, everyone on your team will be more likely to maintain web accessibility if they understand why it’s important. Here are a few points to emphasize at the beginning of your ADA website accessibility training, so everyone understands why web accessibility matters.
When it’s difficult or impossible to leave your home, websites offer a virtual space that is easy to navigate, but only if the website is accessible. Web accessibility allows everyone to use the web equally.
Web accessibility allows all users to magnify screens, use voice search, and navigate websites more easily on smaller screens. This benefits disabled users as well as abled users in situations where it’s more difficult to use a website in the traditional way, such as a bumpy bus.
Using best practices day-to-day makes accessibility audits and overhauls much easier.
Everyone on your should also have access to web accessibility policies and procedures, so everyone is on the same page. It’s also helpful to list contact information for your technical expert or accessibility expert, so staff members feel comfortable asking questions when needed. Finally, a list of links to helpful resources, such as the Web Content Accessibility Guidelines (WCAG) can also be helpful for answering questions.
For Writers and Photographers: Alt-Text and Formatting
Any staff members who might add text, images, videos, or sound bites to the site should know how to add these in an accessible way. It’s a good idea to extend this training to those who might work with the site in the future, as well as those who currently do. Printing out an ADA website accessibility checklist might be useful, as some of these items can be easy to overlook.
Add alternative text (alt-text) to pictures. The alt-text should be brief, but accurately describe the picture. Make sure to demonstrate, using your CMS, how to do this when adding pictures.
Use logical formatting. Headings and proper heading formatting (h1, h2, h3 etc) should be used in a logical order to divide content. Use bold, italics, and underlining for its actual use in the text, not as a way to format headings.
Links are clear. Link text should accurately convey where the link is going.
Color contrast is clear. Surprisingly, this is the most common web accessibility issue. Color contrast between text and backgrounds should be at least 4.5:1. Generally, this will already be built into the website’s styles and templates. Before changing any colors from their defaults, use accessibility testing tools like a contrast checker.
For Videographers: Closed Captions and Controls
Videos are becoming increasingly important across the worldwide web. Making accessible videos is therefore an important part of your ADA website accessibility training. Team members that create, edit, and post videos should all be aware of these elements.
Videos use closed captions. This way videos can be understood without sound. Deaf users cannot use sound and many mobile users do not use sound, so this is a good measure for everyone.
Audio and video do not play automatically. It’s disruptive for people using screen readers and for users in general when content plays without a command. These controls should also have a stop button.
Video does not flash more than three times a second. Frequent flashing is distracting for everyone, and hazardous for people with seizure disorders.
For Designers and Developers: Navigation and Control
Designers and developers deal with more complex aspects of the site. These experts have more technical knowledge, but they will also have more responsibility when it comes to keeping the site accessible. Make sure that your ADA website accessibility training session and facilitator can address more complex questions related to web design and development.
The site should be navigable with a keyboard. This means using elements like skip navigation links and menus that can be opened and dismissed on click. Any “keyboard traps” where a user can get stuck should be eliminated.
The site has reflow capabilities. Reflow allows the site reorganize based on screen size or magnification, which is helpful for mobile users or those with visual impairments.
The site is usable without images or color. You can test this yourself by turning off images and style sheets in your browser. If your site is tough to use without them, it’s even more difficult for someone using a screen reader.
How to test. Since designers and developers are responsible for the site’s function, navigation, and appearance, they should know how to test the site to ensure any changes or additions are still accessible. A number of programmatic testing tools and manual testing procedures can help.
Though some will have more experience with the website than others, it’s important to remember that web accessibility is not just one person’s responsibility. Anyone working with the website should understand how to maintain web accessibility, and why it’s important. ADA website accessibility training combined with audits and corrective measures will ensure that your site remains accessible to all patrons.
Like all essential rules and procedures, website accessibility requires proper documentation. For government websites, ADA website accessibility compliance documentation is required. Though ADA compliance for private business websites isn’t yet required by law, expensive civil suits can and have happened. ADA website accessibility compliance documentation gives you proof that your organization takes website accessibility seriously, and protects you from legal battles. Keeping documents organized is not always easy, however. In this blog post, we’ll cover ADA website accessibility compliance documentation best practices, so you can stay on top of accessibility.
ADA Website Accessibility Compliance Documentation Best Practices
What to Document
To make sure that your ADA website accessibility compliance documents cover all the bases, you need to know what your documentation should include. For many compliance matters, documentation requirements are clearly spelled out in legislation, or detailed by government agencies. Unfortunately, this is not the case for web accessibility. However, compliance documents required in other cases can help to inform what you’ll need for ADA website accessibility compliance documentation. Your accessibility documentation should at least contain the following items, and others may also be helpful depending on your organization’s needs.
Documentation, especially those needed for employee reference, such as policies, are not useful unless they are easy to find. Use a file sharing system to make sure they are easy to find, and be sure that all employees and new hires know where this is. This might be a shared hard-drive, a file sharing system like Google Docs, or a communal document storage space like DropBox. Whatever you use, be sure that your employees know when it is updated, and where they can find the most recent version. If your employees are all looking at old versions of the documents, future updates won’t be useful. Finally, make sure that these are well-organized using a clear file naming convention, so employees don’t have to hunt for what they need.
Easy to Read and Understand
When it comes to web accessibility documentation that your employees must use and understand, complexity is not an indicator of quality. Your policies should make sense with each person’s level of technical understanding. For example, if someone only adds text and images to the blog section of your website, requiring them to learn programming languages doesn’t make sense. Use clear and straightforward language, and try to avoid jargon where possible. Clearly state what an employee can do and who they can ask if they have a question about the policies.
Accurate and Updated
Technology changes fast. Website accessibility policies that are outdated or inaccurate are generally not useful, so this is an especially important part of your documentation process. Otherwise, all the other efforts you’ve put into making high-quality documents and procedures will be wasted.
As your website or technology changes, some accessibility policies will become obsolete, and new ones will need to be enacted. A system for updating your technology, your accessibility policies, and your overall ADA website accessibility compliance documents should be clearly laid out. Staff will also need to know when these changes are made, so they will know when to look at policies for updates.