As tech professionals, we have the opportunity to help make the online world a more inclusive and equitable place. Web accessibility is a crucial aspect of building modern websites and applications, which helps ensure that people with disabilities have access to the same information and services as people without disabilities. Here, we will explore what web accessibility is, why it’s important, and what we can do to improve it.

So, what is web accessibility?

In a nutshell, web accessibility is the practice of designing and developing websites and applications that can be accessed and used by people with disabilities. This includes a broad range of people; disabilities can include visual, auditory, physical, or cognitive impairments, among others. For engineers and designers, web accessibility means using the appropriate tools and methods to build digital products that everyone can use. 

In a world where we strive to achieve web accessibility, there exist myriad guidelines and standards. One such entity is the Web Content Accessibility Guidelines (WCAG), an internationally recognized standard for web accessibility. The WCAG provides a list of guidelines with success criteria for making websites and applications more accessible to folks with disabilities.

Why is web accessibility important?

Web accessibility is important for tech professionals because it is a way to ensure that our products reach the widest possible audience. When we design with accessibility in mind, we make our products more user-friendly and create a more positive user experience. Solving for persons with disabilities solves for all, and allows everyone to benefit from a more positive user experience and inclusive solutions. This can directly lead to higher user engagement and conversion rates. In addition, accessible design can help prevent legal risks and reputational harm to the company.

A prime example of this occurred in 2019, when the Supreme Court of the United States refused to hear an appeal from Domino's Pizza regarding a lawsuit that accused the company of violating the Americans with Disabilities Act (ADA) by having a website that was not accessible to people with visual impairments. This case highlighted the very real legal risks associated with non-accessible websites and applications, as well as showcased the importance of designing with accessibility in mind.

How can we improve web accessibility?

Improving web accessibility in tech is an ongoing process that involves everyone on the team being on board. Accessibility is an easy thing to want to do, but it’s sometimes difficult to understand where to begin, or what accessibility truly means, or looks like. Here are some examples that may spark more ideas surrounding where and how we can improve web accessibility:

1. Use accessible design frameworks. Using accessible design frameworks (Bootstrap, Foundation, Material Design) can help ensure that your website or application is accessible to all users. These frameworks are built with accessibility in mind and can save time and effort when building accessible products.

   Bootstrap, for example, includes various features that can improve accessibility. These features include keyboard navigation, colorblind friendly color schemes, and built-in ARIA roles for components. Using accessibility friendly frameworks can give you a solid foundation toward making your website or application adhere to the WCAG guidelines.
   
   

2. Conduct automated accessibility testing. Automated accessibility testing tools like aXe or pa11y help detect accessibility issues in a website or application. These tools can check for issues like missing alternative text, color contrast, or keyboard accessibility. This can save time and resources when testing for accessibility.

   These automated tools check for accessibility issues by scanning HTML pages and providing detailed reports of the issues they find. Using pa11y can help software engineers find and fix accessibility issues before their website or application is even launched.
   
   

3. Provide captions for videos. Captioning videos can help users with hearing impairments access the content. YouTube provides an automatic captioning tool that generates captions for videos in multiple languages.
   
   Similarly, software engineers can use tools like Amara or Rev to create captions for videos. Ideally, captions are synchronized with the audio, and include both speaker identification and sound effect descriptions to provide a comprehensive experience for the user.
   
   
4. Use semantic HTML. Semantic HTML is a way of writing HTML that makes it easier for assistive technologies like screen readers to understand the content of the website or application. Using semantic HTML elements (<nav>, <header>, <footer>, <article>) can help provide important context for the user.
   
   When using the <nav> element to mark up the main navigation of a website, users can navigate through the website more easily. Screen readers can recognize the <nav> element and present it as a list of links, making it much easier for users with visual impairments to navigate the website.
   
   
5. Provide alternative text for images. Providing alternative text for images helps users with visual impairments understand the content of the website or application. Alternative text should be descriptive and provide a complete description of the content of the image.
   
   

   If an image on a website is a chart or a graph, the alternative text should describe the information presented in the chart or graph. If an image is purely decorative and doesn't add any information to the content, it can be marked as decorative with a description of the content.

Wrapping Up

Web accessibility is an important aspect of building inclusive and user-friendly digital products. As tech professionals, we have the power to make a difference by designing an online world that can be used by everyone, including people with disabilities. By employing some of these basic strategies, we can help improve web accessibility and make the internet a more accessible place for everyone.

Want to know more about web accessibility and testing tools you can use? HubSpot’s got you covered. Check out HubSpot's Web Accessibility Guide! 

We're hiring - check out our Careers Page for your next opportunity! And for a behind-the-scenes look at our culture, visit our Careers Blog or follow us on Instagram @HubSpotLife.