00:00:12.480
Hello, I'm Chandra Carney. Today, we're going to discuss accessibility and explore everything surrounding it, or at least most aspects related to accessibility as we optimize it for the web.
00:00:21.760
You may have also heard accessibility referred to as 'ally,' which stands for the missing eleven characters in accessibility. But what exactly is accessibility? Some of you may not be fully sure.
00:00:36.480
Accessibility is about inclusivity; it means creating websites that can be understood by all audiences, regardless of their adaptive technologies or browsers. It's important to note that usability, while related, is not the same as accessibility. Usability refers to the ability of average users with standard technologies to navigate a site effectively, whereas accessibility adds an additional layer to ensure that users with various impairments can also navigate successfully.
00:01:16.159
You may wonder why we should care about accessibility. As software developers, we build software for people, and we need to empathize with their experiences. We get frustrated when we can't use websites effectively, so we must consider those who might face additional barriers.
00:01:50.640
When thinking about accessibility, many people focus primarily on screen readers and visually impaired individuals, but we need to consider a broader range of impairments. Cognitive and neurological disabilities are also important to keep in mind, as there are many impairments out there that affect how people use the web. Raise your hand if you know someone with an impairment; it's essential to think about their experiences when using websites.
00:02:22.080
So, how do people with disabilities or impairments use the web? They often employ assistive technologies, which can include a variety of tools. While most people think of screen readers, there are many other types to consider, including various input methods and adaptative devices.
00:02:59.280
This is a great quote by Tim Berners-Lee, the creator of the World Wide Web, who emphasized the importance of accessibility. As we navigate through this topic, I want you to think about whether we are genuinely upholding the values he encouraged us to embrace.
00:03:37.360
Now, let me pause for a moment to explain why I care about accessibility. This is a picture of my mom and me; we're both developers. She started her career in the era of Fortran and COBOL, but one significant difference between us is that she has a visual impairment—she has been blind her entire life. Her experiences have made me aware of the various disabilities beyond just visual impairment.
00:04:20.880
Let's kick off our discussion with visual impairment. There are generally four categories we think of, and many of the assistive technologies used by visually impaired individuals include braille displays. A braille display acts as an extension of the keyboard, providing tactile feedback to help navigate content.
00:04:47.680
Another common technology is a screen reader, which comes in various shapes and sizes. For instance, Apple devices are accessible out of the box, but Windows users often need to install screen readers like Window-Eyes for free if they have Microsoft Office 2010 or higher. Chrome and Chromebooks also come with accessible features. Screen readers traverse the Document Object Model (DOM), looking for focusable events, so it is critical to maintain standard HTML structures.
00:05:32.479
The accuracy of our HTML markup is essential. Screen readers cannot read divs and spans by default, so we should avoid using them for vital HTML elements. This is where ARIA—Accessible Rich Internet Applications—comes into play, as it provides attributes that can enhance accessibility descriptions for screen readers.
00:06:28.479
You might wonder how well the New York Times accommodates accessibility. As we explore the site, consider user stories: I want to log in, search, browse categories, and read content. While there are buttons for these functions, we must also evaluate how screen readers interact with site elements.
00:07:06.800
As a screen reader navigates the New York Times homepage, it will dictate what is selected and read aloud the displayed content. Let’s visualize this experience together. If you're comfortable, I invite you to close your eyes and listen to the screen reader's demonstration.
00:08:34.320
When a visually impaired user visits the site, they need to process each piece of information carefully.
00:08:39.680
Now, let's recap what we saw. The New York Times does have features that allow users to skip navigation and access main content, which is beneficial for visually impaired users. However, when we tested with a screen reader, the experience revealed some frustrating elements.
00:09:06.080
Next, let's explore how Home Depot approaches accessibility. Similar to our previous example, we want to evaluate basic functionalities like searching, logging in, and browsing categories. Their site is generally easy to navigate; however, when tested with a screen reader, certain complexities can be challenging.
00:10:03.760
It's essential to understand how many elements a visually impaired user hears as they traverse the site. If navigation is cluttered or overwhelming, it detracts from the overall experience.
00:10:46.720
Sometimes, screen reader users can find themselves stuck within search boxes, hearing repeated items and experiencing frustration trying to navigate through previously read sections. Clear labeling is crucial across the entire site, as it guides users to relevant information without confusion.
00:11:33.600
As we revisit issues in screen reader navigation, let's consider the importance of contrast for low vision users. Links and buttons must be visually distinct to help reduce eyestrain for individuals who may experience challenges with standard interface designs.
00:12:20.000
Another important aspect to consider is color blindness, as many users do not realize the extent to which color differentiation affects accessibility. For example, the red and green colors used to indicate losses and wins on sports websites can be indistinguishable for individuals with certain types of color blindness.
00:13:16.960
People with mobility impairments navigate the web using a variety of tools, such as foot pedals or single-handed keyboards, which change their experiences quite dramatically. We need to consider how a site functions for users who may be unable to use a standard mouse.
00:14:17.360
Moreover, voice control technology is often utilized by individuals with mobility impairments. For example, someone might want to navigate a website purely through verbal commands. It is essential to ensure that our website's functionality responds accordingly to such commands.
00:15:35.680
Cognitive impairments present additional challenges, as those affected may find cluttered websites overwhelming. Content should be optimized for clarity, ideally aiming for a sixth-grade reading level, making site navigation easier for everyone, not just those with cognitive disabilities.
00:16:01.679
Additionally, we need to consider the impact of multimedia elements on those with neurological impairments. Websites often incorporate video, but these can trigger issues for people struggling with vertigo or sensory overload.
00:16:58.480
Turning now to hearing impairments, it is crucial to provide closed captioning on videos, as many users expect this to be standard. If the website lacks proper audio descriptions or captioning, it can leave users feeling like they are missing an essential component of the content.
00:17:29.760
For developers, this means incorporating accessible features where possible. Properly labeled images with text descriptions in alt tags can significantly enhance the experience for those utilizing screen readers.
00:18:35.200
A good example of a platform that has improved accessibility features is Kickstarter, which allows creators to add their own captions and descriptions to videos. Another platform, Netflix, has introduced audio descriptions, providing valuable context for their visually impaired users.
00:19:44.480
We must also routinely assess our choice of typography and layout to improve legibility. For instance, using clear, well-sized fonts (about 16 pixels) can alleviate issues for users who may struggle with smaller print.
00:20:45.760
It's equally important to focus on how information is structured and laid out. Forms, for example, should be easy to navigate. If a user has an issue with memory, a poorly designed layout may lead them to mistakenly fill out the wrong field, resulting in frustration.
00:21:50.160
Large click targets aid in usability for all users, especially those on mobile devices or with disabilities. As developers, we need to consider how we structure our pages practically and with User Experience (UX) in mind.
00:22:37.440
In our busy environments, it’s crucial to advocate for accessibility and usability when business teams request expedited feature releases. By integrating a few accessibility checks into our processes, we can ensure a more inclusive experience.
00:23:28.880
Engaging in user trials can provide valuable insights into how people with disabilities perform on our sites, and this can guide our design and development processes effectively.
00:24:19.200
This has been a brief overview of accessibility and the various aspects to consider. As developers, we have a responsibility to create inclusive web experiences for all users, ensuring that every interaction is easy, intuitive, and empowering.