Website Accessibility Archives - Page 6 of 16/Tag

Accessibility in JavaScript: A Developer’s Guide
JavaScript has revolutionized web development, enabling developers to create interactive and dynamic websites. However, these enhancements can also introduce significant accessibility barriers if not implemented thoughtfully. For web developers and eCommerce managers, ensuring that JavaScript-powered features are accessible isn’t just about compliance—it’s about creating an inclusive experience for all users.

This guide explores the essential techniques, testing methods, and best practices to ensure that JavaScript features meet accessibility standards and improve usability for everyone.

Why Accessibility in JavaScript Matters

Interactive JavaScript elements, such as modals, dropdown menus, and dynamic content updates, can be challenging for users with disabilities. Poorly implemented JavaScript can break keyboard navigation, confuse screen readers, or cause focus management issues, creating barriers that exclude a portion of your audience.

By prioritizing accessibility, developers can:
- Meet Web Content Accessibility Guidelines (WCAG).
- Improve user experience for everyone, including users with disabilities.
- Reduce the risk of legal action related to accessibility non-compliance.
- Expand your website’s audience and customer base.
Common Accessibility Barriers in JavaScript

Before diving into solutions, let’s examine some common accessibility pitfalls associated with JavaScript:
1. Keyboard Inaccessibility: Many JavaScript features rely on mouse interactions, neglecting users who navigate with a keyboard.
2. Focus Management Issues: Improper handling of focus can disorient users, especially when triggering modals, popups, or dynamic content.
3. Unlabeled ARIA Roles: Dynamic elements without proper ARIA roles and attributes can confuse screen readers.
4. Non-Compliant Custom Widgets: Custom components like sliders, tabs, or accordions often fail to replicate the functionality of their native HTML counterparts.
5. Content Updates Without Notifications: Dynamic content changes that are not announced to assistive technologies leave users unaware of critical updates.
Best Practices for Accessible JavaScript

To make your JavaScript-powered features inclusive, follow these best practices:

1. Ensure Keyboard Accessibility

All interactive elements must be operable using only a keyboard. Consider the following:
- Use semantic HTML elements like <button>, <a>, and <input>, which have built-in keyboard support.
- Add tabindex= "0" to custom elements to make them focusable.
- Avoid tabindex values greater than 0, which can disrupt the natural tabbing order.
- Implement custom keyboard interactions for widgets like dropdowns and modals. For example, allow users to close a modal with the Escape key.
2. Manage Focus Properly

Focus management is critical when working with dynamic content. Here’s how to handle it:
- Set Initial Focus: When opening a modal, move focus to the first interactive element within it.
- Trap Focus: Prevent users from tabbing out of an open modal.
- Restore Focus: Return focus to the triggering element when the modal is closed.
- Avoid Focus Loss: Ensure that dynamically added content doesn’t cause focus to disappear.
3. Use ARIA Responsibly

Accessible Rich Internet Applications (ARIA) can enhance screen reader compatibility, but misuse can lead to confusion. Follow these guidelines:
- Use ARIA Roles: Assign roles like role= "dialog" for modals or role= "menu" for dropdowns.
- Add ARIA States: Use attributes like aria-expanded, aria-hidden, and aria-live to convey element states to assistive technologies.
- Don’t Overuse ARIA: Avoid using ARIA when semantic HTML can achieve the same result.
4. Announce Dynamic Content Updates

For screen reader users, dynamically updated content must be announced clearly:
- Use aria-live regions to alert users to changes in content.
- Set the aria-live attribute to “polite” for non-urgent updates or “assertive” for critical changes.
- Avoid excessive announcements, which can overwhelm users.
5. Test Custom Widgets Thoroughly

If you create custom widgets, ensure they mimic the behavior of native elements:
- Use the WAI-ARIA Authoring Practices Guide as a reference.
- Make widgets focusable, operable via keyboard, and compatible with screen readers.
- Test with multiple assistive technologies and devices to ensure broad accessibility.
Testing JavaScript for Accessibility

Accessibility testing is an essential part of development. Use the following tools and methods to identify and address accessibility issues:

Automated Tools
1. Lighthouse (built into Chrome DevTools): Provides a quick audit of accessibility issues.
2. WAVE: Highlights accessibility problems directly on your webpage.
Manual Testing

Automated tools can’t catch every issue, so manual testing is critical:
- Keyboard Navigation: Ensure all interactive elements are focusable and operable with the Tab and Enter keys.
- Screen Readers: Test your website with screen readers like NVDA, JAWS, or VoiceOver.
- Focus Indicators: Verify that focus indicators are visible and intuitive.
Real-World Scenarios

Test your website with users who rely on assistive technologies. User feedback can uncover issues that developers might overlook.

Meeting WCAG Requirements

To comply with WCAG, focus on these key guidelines:

Perceivable
- Ensure text alternatives for images and icons.
- Provide captions for video content.
Operable
- Make all functionality available via a keyboard.
- Avoid content that flashes more than three times per second.
Understandable
- Use clear labels and instructions.
- Ensure consistent navigation and predictable interactions.
Robust
- Use valid HTML and ARIA attributes to ensure compatibility with assistive technologies.
Benefits of Accessible JavaScript

Implementing accessible JavaScript goes beyond compliance. It delivers tangible benefits, such as:
- Improved User Experience: Accessible features make your website easier to use for everyone.
- Increased Market Reach: Approximately 16% of the world’s population lives with some form of disability. Accessibility ensures they can engage with your website.
- Better SEO: Many accessibility improvements, like proper headings and alt text, also enhance search engine rankings.
- Legal Compliance: Meeting accessibility standards helps protect your business from lawsuits and reputational damage.
Conclusion

It is far easier to create accessible JavaScript from the onset rather than trying to fix it as an afterthought if you are armed with the proper knowledge.

Stay informed about evolving standards like WCAG and remain proactive in integrating accessibility into your development workflow. If you’re unsure if your JavaScript is accessible or are looking for an implementation partner who is focused on accessibility, reach out to 216digital using the contact form below.
Greg McNeil

January 17, 2025

How-to Guides

Accessibility, How-to, JavaScript, Web Accessibility, web developers, Website Accessibility
Web Accessibility: A Must for Small Businesses
Ever wonder if your website might be quietly turning people away?

As a small business owner, you already have plenty to juggle—so it’s easy to think web accessibility isn’t a top priority. But what if ignoring it costs you sales, hurts your reputation, and even puts you at risk for legal trouble?

The good news is that it’s never too late to start. By making your site accessible to everyone, you can reach more customers, show you care about every visitor, and stand out in a crowded market. Let’s explore why web accessibility matters and how simple steps can make a big difference for your business.

What Is Web Accessibility?

Web accessibility means designing websites so everyone can use them, including people with disabilities. It involves making sure your site works for those relying on screen readers, keyboard navigation, or other assistive tools. This includes people who have visual or hearing impairments, limited mobility, or cognitive differences.

But accessibility benefits more than just people with disabilities. It also helps those with temporary injuries, older devices, or slow internet, and those who can’t hear audio in noisy places. By following standards like the Web Content Accessibility Guidelines (WCAG), your small business can create a smoother, more inclusive online experience for every visitor.

Why Accessibility Matters for Small Businesses

Reach More Customers

The Centers for Disease Control and Prevention (CDC) says that more than 1 in 4 adults in the United States have some type of disability. That’s a huge group of potential customers who may struggle with a site that isn’t accessible. But accessibility also helps others—like older adults, people with temporary injuries, or those using slow internet.

By making your site easier to use, you can connect with a bigger, more diverse audience. In fact, studies show that businesses that focus on accessibility can see up to a 20% increase in their customer base.

Improve Your SEO

Did you know that accessible websites can rank higher in search results? Search engines favor sites that are easy to read and navigate. Features like clear headings, alt text for images, and proper HTML tags not only help users but also boost your SEO.

For example, the radio program This American Life added transcripts for each episode, increasing search traffic by almost 7%. By making your site more accessible, you, too, can improve your visibility and attract more organic traffic.

Build a Better Brand

People today care about inclusivity. A 2023 study showed that 70% of consumers prefer brands committed to diversity and inclusion. By making your website accessible, you show that you value every customer. This builds trust and loyalty, setting you apart from other businesses.

Avoid Legal Risks

The Americans with Disabilities Act (ADA) requires businesses to make their services, including websites, accessible. If you don’t, you might face expensive lawsuits. In 2024, over 4,000 ADA lawsuits were filed, and more than 33% targeted small businesses.

Why the focus on small businesses now? First, there are more small businesses overall. Second, large companies have been dealing with accessibility lawsuits for years, so many have strong accessibility programs already in place. Settlements can cost anywhere from $10,000 to $100,000—plus legal fees. By making your site accessible now, you can avoid these risks and show customers you care.

Don’t Let Cost Hold You Back

Improving accessibility takes time and money, but it doesn’t have to break the bank. Start with the biggest issues, like adding alt text or fixing color contrast. These small changes can make a huge difference. Plus, if you’re in the U.S., you may qualify for the Disabled Access Credit to help with costs.

Including accessibility from the start also saves money later. You won’t need expensive redesigns or add-ons if you prioritize accessibility now. Accessible sites often run more smoothly, which can reduce hosting and maintenance costs in the long run.

Practical Steps to Start Your Accessibility Journey

Feeling overwhelmed? Don’t worry—you can begin with small, simple steps:

Check Your Site’s Accessibility

Regularly audit your website for accessibility issues. There are free tools like WAVE and Google Lighthouse that can help you identify problems, such as missing alt text for images. For a deeper look, think about hiring an accessibility expert.

Stay Informed and Up-to-Date

Web Content Accessibility Guidelines (WCAG) and best practices can evolve over time. Stay informed about any changes and make updates to your website as necessary to remain compliant.

Train Your Team

Train your staff, especially those involved in website management and content creation, about web accessibility. This helps create a culture of inclusivity and ensures that accessibility remains a priority.

Offer Accessible Customer Support

Provide different ways for people to contact you—phone, email, or live chat. Make sure these options are usable by everyone, including people with assistive devices.

How Accessibility Helps Your Business

When you make your website accessible, you can:
- Increase Sales: If your site is easier to use, more people will stay and buy.
- Boost Customer Loyalty: People remember brands that make them feel included.
- Strengthen Your Brand: Being known for inclusivity helps you stand out.
Take the First Step

Starting your journey toward accessibility doesn’t have to be scary. Take small actions, keep improving, and celebrate your wins. The benefits—like reaching more customers, getting better SEO results, and strengthening your brand—are worth the effort.

At 216digital, we will help develop a strategy to integrate WCAG 2.1 compliance into your development roadmap on your terms so that you can focus on what matters: your business. Don’t wait—make your website accessible now. Schedule an ADA briefing with us to get started!
Kayla Laganiere

January 15, 2025

The Benefits of Web Accessibility

Accessibility, ADA Compliance, Benefits of Web Accessibility, Small Business, Website Accessibility
The EAA Lands in June
The European Accessibility Act (EAA) is set to shake things up for businesses operating in the European market. Starting in June 2025, the EAA will require companies to meet strict accessibility standards for websites, mobile apps, and digital products. If you’re working in or serving customers in the European Union (EU), this isn’t just about meeting requirements—it’s a chance to grow your reach and create better digital experiences for everyone.

Let’s dive into what the EAA is all about, why it matters, and how you can get ready for this significant change.

What is the European Accessibility Act?

The EAA is a groundbreaking law aimed at ensuring equal access to products and services across the European Union. Enforced by individual EU member states, it applies to a wide range of digital and physical products, including websites, mobile apps, software, and e-commerce platforms. The primary goal of the EAA is to eliminate barriers for people with disabilities and promote inclusivity and equal participation in society.

The EAA establishes clear accessibility requirements for businesses operating within the EU and harmonizes standards across member states. This ensures consistent accessibility efforts while simplifying compliance for companies working across the EU. For online businesses, compliance is guided by EN 301 549, the technical standard that serves as the foundation for meeting EAA requirements.

Scope of the EAA

The EAA’s web accessibility covers a broad range of applications such as:
- Websites and mobile apps
- E-books and online publications
- ATMs, ticketing, and check-in machines
- E-commerce platforms
EN 301 549: The Technical Backbone of the EAA

At the heart of the EAA’s web compliance is EN 301 549, a technical standard based on W3C’s Web Accessibility Guidelines (WCAG). These standards provide a clear framework for ensuring accessibility in websites, software, mobile apps, and other ICT products. By following WCAG 2.1 AA guidelines, companies can make their digital content usable by individuals with visual, auditory, cognitive, or motor impairments.

Suppose your e-commerce site, cloud software, SaaS platforms, or mobile apps already meet WCAG 2.1 AA requirements. In that case, they likely comply with EN 301 549—and, by extension, the EAA.

Are There Any Exceptions to EAA Compliance?

Although the EAA imposes strict accessibility standards, it recognizes that achieving complete compliance may sometimes be impractical. Under the “Disproportionate Burden Clause,” organizations can request exceptions if they show that meeting the requirements would impose an undue hardship. However, this doesn’t serve as a blanket exemption—companies must provide thorough documentation and clear justification for why they cannot reasonably comply. Even when an exception is granted, they are still expected to take every feasible step to maximize accessibility.

Why the EAA Matters

The EAA’s focus on accessibility marks a significant step forward in creating an inclusive digital environment across the EU. For businesses, compliance isn’t just a legal requirement; it’s an opportunity to reach a broader audience and demonstrate a commitment to inclusivity. As the EAA reshapes the accessibility landscape, it’s time to evaluate your products and services to ensure they’re ready to meet the new standard.

Here’s why it matters:

It’s Legally Required

The EAA is not just a guideline; it’s enforceable legislation that comes into effect in June 2025. Businesses that fail to comply could face fines, legal consequences, and even damage to their reputation. Taking action early gives you ample time to address challenges and ensure your digital products meet the required standards without unnecessary stress.

Reach a Larger Audience

Over one billion people worldwide live with disabilities, representing a significant—yet often underserved—consumer base. Of these, more than 135 million are in the EU, constituting a substantial market segment businesses cannot ignore. Making digital services accessible fulfills a critical need and demonstrates your brand’s commitment to inclusivity and respect for diverse audiences.

For U.S. businesses operating in the EU, compliance with EN 301 549 ensures alignment with the EAA’s requirements, preventing legal and reputational risks.

Better User Experience for Everyone

Accessibility improvements don’t just benefit people with disabilities; they enhance usability for all users. Features like simplified navigation, larger text options, and better color contrast make digital platforms easier for everyone. These changes lead to more satisfied customers and improved engagement.

Boost SEO and Discoverability

Accessibility isn’t just about compliance; it’s also a strategic way to improve your online presence. By following EN 301 549 and WCAG 2.1 AA standards, your website becomes more search engine-friendly, with features like descriptive alt text, clean navigation, and clear content structure. These enhancements make it easier for search engines to index your site, improving rankings and visibility. Embracing accessibility ensures your digital content is discoverable by a broader audience while meeting the compliance standards of the EAA.

How to Prepare for the EAA

Preparing for the EAA might seem overwhelming at first, but tackling it step by step makes the process manageable. Here’s how to get started:
- Audit Your Digital Accessibility: Evaluate your digital products and services against EN 301 549 and WCAG 2.1 AA guidelines. Use tools or hire experts to identify any accessibility gaps.
- Fix What Needs Fixing: Once you’ve pinpointed the issues, prioritize fixes like:
  - Adding alt text to images
  - Ensuring keyboard navigation works seamlessly
  - Improving color contrast
  - Testing for mobile responsiveness
- Train Your Team: Accessibility isn’t a one-time project—it’s an ongoing effort. Train your team on accessibility basics, like creating user-friendly designs, writing clear content, and following coding best practices.
- Use Accessible Tools: Make sure your design and development tools have built-in accessibility features. These tools can catch common issues early and save you time.
- Work with Accessibility Pros: If accessibility isn’t your area of expertise, partner with professionals specializing in it. They can guide you through audits, fixes, and long-term compliance strategies.
- Keep an Eye on Accessibility: Accessibility needs regular maintenance. Review your digital products often, especially when you update or add new features, to make sure everything stays compliant.
Overlays: The Quick Fix That Falls Short

Many businesses are attracted to accessibility overlays—automated tools that promise instant compliance. However, as the European Commission noted in 2023, “Claims that a website can be made fully compliant without manual intervention are unrealistic.”

While overlays may tackle surface-level issues, such as adding alt text or color contrast adjustments, they often fail to address deeper, more complex accessibility challenges like proper keyboard navigation, dynamic content handling, or compatibility with assistive technologies. These limitations mean overlays can leave users with disabilities frustrated and websites at risk of non-compliance. Real accessibility demands both automated solutions and hands-on human expertise.

The Upside of Accessibility

Meeting the EAA’s requirements isn’t just about avoiding fines. It’s an opportunity to:
- Boost Your Brand: An accessible business is seen as inclusive and forward-thinking.
- Build Customer Loyalty: People appreciate companies that make an effort to include everyone.
- Be Ready for the Future: As accessibility expectations grow, being ahead of the curve will pay off.
- Expand Your Market: Serving more people means more potential customers and growth.
Don’t Wait: Turn Accessibility into an Advantage

The European Accessibility Act is a big deal, but it’s also a chance to improve your business in meaningful ways. The June 2025 deadline might seem far off, but it’ll be here before you know it. Waiting until the last minute could lead to rushed fixes, higher costs, and unnecessary stress. Starting now ensures you have time to make thoughtful, lasting improvements.

By aligning with EN 301 549 and integrating accessibility into your workflows, you’ll not only meet the EAA’s standards but also create better experiences for your customers. Embracing accessibility can boost your brand, build customer loyalty, and expand your market while positioning your business as inclusive and forward-thinking.

Take the first step today by scheduling an ADA briefing with 216digital. Our experts can guide you through compliance, helping you stay ahead of the curve and turn accessibility into a strategic advantage.
Greg McNeil

January 10, 2025

Legal Compliance

Accessibility, EAA, European Accessibility Act, International Accessibility Laws, Web Accessibility, Website Accessibility
Accessibility Extensions: How Reliable Are They?
Making a website that everyone can use is an important goal for content creators, website owners, and developers. People who have disabilities, such as vision or hearing impairments, should have the same access to information and services as anyone else. Web accessibility removes barriers so all users can enjoy and navigate online content. One tool that can help is accessibility extensions—browser add-ons or standalone software that scans a website for common accessibility problems. But can you rely on these extensions alone to achieve a fully inclusive site?

In this article, we’ll discuss how these tools work, where they shine, and where you need to look beyond them to create truly accessible websites.

What Are Web Accessibility Extensions?

Web accessibility extensions are programs that you add to your internet browser or use as separate tools to check how well a website follows specific accessibility standards. These rules often come from guidelines like the Web Content Accessibility Guidelines (WCAG) set by the World Wide Web Consortium (W3C).

The extensions scan a webpage’s code and point out things that might make it hard for users with disabilities to use. For example, if a picture is missing a text description (called “alt text”), an accessibility extension might highlight that. Or, if your text color and background color are too similar, the extension might let you know that the contrast is poor.

Popular Accessibility Extensions

There are many accessibility extensions to choose from, and each has its own strengths:
1. Google Lighthouse: This free, open-source tool is built right into Google Chrome’s Developer Tools. It checks your website for performance, accessibility, and search engine optimization (SEO) issues. Lighthouse’s accessibility report can show you issues like missing labels on form fields and low color contrast.
2. BrowserStack: While not strictly an extension, BrowserStack is a popular platform that lets you test your website on many devices and browsers. It also includes accessibility checks so you can spot problems before your site goes live.
3. Color Enhancer: This Chrome extension is helpful for testing different color settings. It simulates how someone with color vision challenges might see your site, helping you adjust your color palette.
4. Total Validator: This tool checks for multiple issues at once. It looks for accessibility problems, HTML errors, and even spelling mistakes. It’s useful if you want an all-in-one solution.
Why These Tools Are Helpful

Accessibility extensions can save time and money, especially in the early stages of website development. They’re usually easy to install and use, often with just a few clicks. Many come at no cost, making them friendly for anyone’s budget. They also highlight the low-hanging fruit—simple issues you can fix quickly, like missing alt text, mislabeled buttons, or poor contrast.

When used regularly, these extensions can become part of your workflow. For instance, you can run Google Lighthouse each time you make a new page, making sure you don’t introduce new errors. Color Enhancer can be switched on while you design graphics, so you can instantly check your chosen colors. By catching issues early, you reduce the risk of more significant accessibility barriers piling up later.

The Limits of Accessibility Extensions

While these tools can be beneficial, they can’t do everything. Accessibility is about real-life user experience. Extensions might catch many problems, but there are several reasons they might not be enough:
1. They Don’t Catch All Errors: Some issues are complicated and need a human eye. For example, a tool might not realize that your navigation menu is confusing or that your form error messages aren’t explained well.
2. Automation Can Miss Nuances: An extension may mark something as fine even if it’s not easy to use in practice. Think of a button that looks accessible but is tricky to reach using keyboard navigation. Human testing would catch that, but an automated tool might not.
3. Limited Customization: Some extensions can’t adapt to specialized needs. If your website has complex interactive elements or unique design features, an extension might not provide accurate feedback.
Practical Steps for Using Accessibility Extensions

To get the most out of your accessibility extensions, you can follow a simple process:
1. Install One or More Extensions: Pick a couple that make sense for your workflow. For a developer, Google Lighthouse is a solid choice; Color Enhancer might be more fitting for a designer.
2. Run Automatic Scans Often: When you add new content or launch a new feature, rerun the extension. This helps you fix issues before they become widespread.
3. Review the Reports: Look at what the tool says and note any errors. For example, if Lighthouse tells you there’s missing alt text, add it immediately.
4. Cross-Check with Another Tool: Since no single extension catches all issues, try a second tool to see if it spots something different. Combining tools gives you a more complete picture.
5. Document Your Changes: Keep track of what you fix. If your team grows or you step away from a project, the next person will know what was corrected and why.
Going Beyond Extensions: Manual Testing & Real Users

Even the best technology can’t replace the insight of real people. To go beyond automated checks, try these methods:
1. Manual Testing: Walk through your website with a keyboard only (no mouse). Can you reach all interactive elements, like menus, links, and form fields? Check if focus indicators (the outlines around clickable items) are visible so users know where they are on the page.
2. Test with Assistive Technologies: Screen readers like NVDA (free for Windows) or VoiceOver (built into macOS and iOS) let people with visual impairments hear text read aloud. Try them out on your site. Can you follow the page structure logically? Are buttons and links announced clearly?
3. Get Feedback from Users: Invite people with disabilities to test your site. This can be done in person or through online platforms. Their first-hand experiences will show you things no tool can catch.
4. Follow WCAG Guidelines: The W3C’s Web Content Accessibility Guidelines provide detailed advice about making websites more inclusive. Follow these guidelines to ensure you’re meeting recognized standards.
5. Keep Checking Over Time: Accessibility isn’t a “one-and-done” situation. Technology changes, and so does your site’s content. Regular audits help you stay current with new requirements or tools.
Professional Tools and Services

For more significant sites or those in specific industries, it can help to invest in professional tools or services. Some companies offer advanced scanning that runs on a schedule and sends alerts when accessibility issues are found. Others offer expert audits, which include hands-on testing by accessibility specialists. Examples include:
- a11y.Radar: Provides automated scans, real-time issue tracking, and actionable developer guidance. It integrates with CI/CD workflows and offers analytics to monitor progress and prioritize critical fixes.
- Siteimprove: This includes monitoring and scoring your site based on accessibility, SEO, and more.
- Specialized Accessibility Consultancies: Hiring an experienced team can help with complex sites or strict legal requirements.
Additional Resources to Explore

If you’d like to learn more or go deeper into this topic, here are a few helpful links:
- W3C Web Accessibility Initiative: Offers guidelines, techniques, and tutorials on how to create an accessible website.
- WebAIM: Contains articles, tools (like the WAVE Extension), and a community forum focused on accessibility.
- A11y Project: A community-driven site with guides, checklists, and news about web accessibility.
- Section508.gov: Focuses on accessibility laws and standards in the United States.
Conclusion

Accessibility extensions are a great starting point. They quickly show you common issues and give you ideas on what to fix. Yet, relying on them alone doesn’t ensure everyone can use your site. By also doing manual checks and involving people with different abilities, you can create a richer, more usable online experience. Combining automated scanning, real-world testing, and guidelines like WCAG gives you the best chance of meeting everyone’s needs.

Remember, building an inclusive website is an ongoing journey. Updates to your site, new browser versions, and changing assistive technologies mean there’s always something more to learn. Encourage your team to see accessibility as a shared responsibility. Keep your tools up to date, document your progress, and work together to reduce barriers for all. In the end, these efforts not only help people with disabilities, but they also make your site more user-friendly for everyone.

If you’re ready to take the next step in making your website accessible, 216digital can help. From expert audits to ongoing monitoring with our a11y.Radar tool, we’re here to guide you every step of the way. Contact 216digital today and ensure your website meets the highest standards for accessibility, usability, and inclusivity. Together, we can build a web that works for everyone.
Greg McNeil

January 8, 2025

Testing & Remediation

Accessibility, accessibility extensions, evaluation tools, Website Accessibility, Website Accessibility Tools
2024 Accessibility Lawsuits: Trends and Lessons

2024 has been another big year for web accessibility—and not in a good way. More than 4,000 accessibility lawsuits were filed against digital properties this year, affecting businesses of all sizes. Whether you’re a small business facing your first lawsuit or a larger company dealing with repeat claims, the message is clear: ignoring web accessibility is no longer an option.

Despite the alarming rise in legal risks, the good news is that you can take practical steps to protect your business and create a better online experience for everyone. Below, we’ll examine the highlights of 2024, why they matter, and how you can get ahead in 2025.

Accessibility Lawsuits Are Shifting to State Courts

In 2024, over 4,000 accessibility lawsuits were filed—1,600 in state courts and 2,400 in federal courts. While federal cases dipped slightly, lawsuits in state courts surged, led primarily by New York and California. These two states accounted for more than 40% of all claims.

Why are state courts becoming more popular? State-specific legal frameworks and streamlined procedures may be giving plaintiffs an edge. For businesses, this shift means that federal-level compliance isn’t always enough—you must also stay aware of state-level requirements. Regular audits, attention to WCAG (Web Content Accessibility Guidelines) updates, and a clear understanding of how your state enforces accessibility standards can help you stay ahead. Ignorance, as it turns out, is no longer bliss.

New York Is at the Center of the Action

New York isn’t just the city that never sleeps—it’s also the state that leads the nation in accessibility lawsuits. In 2024 alone, 2,541 cases were filed in its federal and state courts, surpassing even California.

What’s especially notable is New York courts’ willingness to hear cases against businesses with no physical presence in the state. If your website is accessible to New Yorkers, it’s open to potential litigation. Combine that with active plaintiffs and law firms focusing on accessibility, and you have a recipe for heightened risk.

Copycat Lawsuits Are a Growing Threat

One of the more frustrating trends of 2024 is the rise of “copycat” lawsuits. Out of this year’s filings, 961 cases—41% of all accessibility lawsuits—targeted companies that had already faced noncompliance claims in the past.

These repeat claims often happen when companies fix only part of their accessibility issues, leaving gaps that draw new lawsuits. New plaintiffs may target the same website, related brands, or even parent companies. The takeaway? Partial fixes can turn a one-time lawsuit into a recurring problem.

Small Businesses Are in the Spotlight

Historically, large corporations shouldered most accessibility lawsuits, but 2024 marked a shift. Small businesses—those earning under $25 million a year—were targeted more than ever.

There are two key reasons for this change. First, there are simply more small businesses out there, creating a bigger pool of potential defendants. Second, many large companies have been managing lawsuits for years and have implemented robust accessibility programs. With 82% of big companies already working toward compliance since 2018, plaintiffs are now focusing on smaller businesses that may have fewer resources or less awareness.

For small business owners, this trend can feel overwhelming. The silver lining is that you’re not alone, and even modest efforts can go a long way. You don’t need a massive budget to make your website more accessible—you just need to know where to begin.

Accessibility Widgets: Not the Quick Fix You Think They Are

If you’ve ever considered adding a simple “accessibility widget” to solve all your problems, you’re not alone—but this strategy might create more headaches than it relieves. In 2024, over 1,000 companies with widgets on their sites were still sued for accessibility noncompliance.

Why? Widgets often fail to address the deeper, structural issues that make a site inaccessible. In some cases, they even introduce new barriers, like interfering with assistive technologies or complicating site navigation for users with disabilities. Plaintiffs are increasingly calling out widgets as insufficient and pointing to WCAG violations or “band-aid” approaches that neglect larger accessibility gaps.

Relying on widgets alone could lead to a rude awakening. True accessibility requires meaningful changes to your site’s structure and content. This investment will reduce your legal risk and provide a better experience for all users.

What You Can Do in 2025

The prospect of a accessibility lawsuit is stressful, but there’s plenty you can do to minimize your risk. Consider these steps as you plan for the coming year.

Immediate Actions

Conduct a WCAG 2.2 Audit

Start by evaluating your site against the WCAG 2.1. Common issues include missing alt text, poor color contrast, and unlabeled form fields. Fixing these core issues can make an immediate impact.

Train Your Team

Accessibility isn’t a one-time project. Train your developers, designers, and content creators so that accessibility best practices are woven into everything they do. The more knowledge your team has, the fewer issues will arise.

Long-Term Strategies

Build Accessibility Into Your Workflow

Don’t wait until the end of a project to think about accessibility. Integrate it into each stage of development, from initial design to final testing. Known as “shifting left,” this proactive approach saves both time and money.

Partner With Experts

Accessibility is complex, and you don’t have to navigate it alone. Working with a team like ours at 216digital can help you stay up-to-date on guidelines and maintain ongoing compliance.

Conclusion

Yes, the surge in accessibility lawsuits is concerning. Yes, courts in states like New York and California are becoming more aggressive in penalizing non-compliant businesses. And yes, copycat claims mean one lawsuit can quickly snowball into multiple suits. However, this issue isn’t just about minimizing legal risk—it’s about building an inclusive internet that everyone can use and enjoy.

At 216digital, we strive to be more than just a service provider. Our aim is to be an ally, guiding you through the complexities of digital accessibility. Creating an inclusive website benefits your customers, your brand, and your legal standing. It might sound daunting at first, but that’s where we come in. Our step-by-step approach can help protect your business and empower a broader online audience.

The sooner you begin, the easier it becomes to get your site on track. So, let’s move forward—schedule a call with us, take that initial step, and start building a web experience that truly works for everyone. You’ve got this, and we’re here to help.

Greg McNeil

January 6, 2025

Legal Compliance

2024 accessibility lawsuits, ADA Compliance, ADA Lawsuits, web accessibility lawsuits, Website Accessibility
Making Hidden Content Accessible to Assistive Technologies
As a web developer, you want your website to be usable by everyone, including people who rely on assistive technologies. These technologies—such as screen readers, braille displays, and speech recognition software—can help individuals with disabilities navigate the web more easily. Sometimes, you may need to hide certain parts of your webpage visually without hiding them from these tools. However, doing this incorrectly can cause big accessibility issues.

In this article, we’ll explore how to effectively hide and manage hidden content for people using assistive technologies. We’ll discuss why display: none is problematic, how to use the clip pattern, and how attributes like aria-hidden and hidden can help. By the end, you’ll have a better understanding of how to ensure your website remains inclusive and user-friendly.

The Problem with display: none

When you use display: none in your CSS, you remove an element from the visual flow of the page. This means sighted users will not see it. But, it also means the element is completely invisible to assistive technologies such as screen readers. If you’ve hidden important text or controls this way, users who rely on assistive technologies might miss out on content or functionality that they need.

For example, imagine you have a button that visually looks like an icon, but you hide the text label using display: none. Now, people who can see the icon know what the button does, but people using assistive technologies hear nothing. This creates a poor user experience and makes your site less accessible.

The Clip Pattern: A Better Approach

To visually hide content while keeping it available to assistive technologies, the clip pattern is a popular solution. The idea is to position the element off-screen so sighted users don’t see it, but screen readers can still find it. Here’s an example:
```
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
```
By applying the .visually-hidden class to your element, you ensure it’s hidden visually but remains accessible to assistive technologies. This makes the content discoverable by screen readers, letting users who can’t see the screen still benefit from it.

Why the Clip Pattern Works

This pattern relies on moving the element so it’s not visible in the viewport and restricting its size to 1px by 1px. With clip: rect(0, 0, 0, 0); (or clip-path in modern CSS), the browser cuts off any visual display. Yet, the element remains in the Document Object Model (DOM), meaning assistive technologies can still access it. That’s the key difference between this and display: none.

Managing Visibility with aria-hidden and the hidden Attribute

Beyond CSS, there are HTML and ARIA (Accessible Rich Internet Applications) attributes that also control how content is shown to both users and assistive technologies. Two important attributes here are aria-hidden and the HTML5 hidden attribute.

aria-hidden="true"

When you add aria-hidden="true" to an element, you’re telling assistive technologies not to read or announce that element to users. This is handy for decorative images or redundant content. For instance, if you have a background image that doesn’t provide important information, you could mark it with aria-hidden="true" so screen readers ignore it.

But be cautious: if you need an element to be read by assistive technologies, do not use aria-hidden=”true”. This attribute will block that element from being announced entirely.
```
<div aria-hidden="true">
  <img src="decorative-image.jpg" alt=""/>
</div>
```
HTML5 hidden Attribute

The hidden attribute is another way to remove content from everyone—both sighted users and assistive technologies. When you use it, browsers typically hide the element. Screen readers will also skip it. This is good if the element is meant to be inaccessible to all users, like a form section that’s not yet relevant or a menu item that’s not available.
```
<div hidden>
  <p>This content is hidden from all users.</p>
</div>
```
Use hidden or aria-hidden when you truly want to exclude an element from assistive technologies. If you want it hidden visually but still available to screen readers, you should stick with the clip pattern or .visually-hidden approach.

Best Practices for Accessible, Visually-Hidden Content

1. Use Semantic HTML

Using proper semantic HTML elements (like <nav> for navigation, <main> for main content, or <section> for thematic grouping) is important for clear structure. It helps assistive technologies interpret your content correctly. Semantic HTML also reduces the need for extra attributes and complex styling, since the markup itself conveys meaning.

2. Avoid Hiding Focusable Elements

If an element can receive focus (like links, form inputs, or buttons), think carefully before hiding it. A hidden yet focusable element can be confusing for keyboard-only users, since it might get focus without being visible. If you must hide a focusable element, consider removing it from the tab order by using tabindex="-1" or ensuring it’s properly revealed at the right time.

For example, if you have a pop-up form that appears only after a button click, you can initially hide it with the clip pattern. Once the user clicks, you can remove the clip pattern or switch the CSS to show the content. This way, the form becomes available to both sighted users and people using assistive technologies at the same time.

3. Provide Context for Hidden Content

Sometimes you want to reveal hidden content dynamically (like a drop-down menu). In these cases, use ARIA attributes such as aria-expanded and aria-controls to inform assistive technologies that a certain part of the page is now visible or hidden. This can help screen reader users understand changes on the page.
```
<button aria-expanded="false" aria-controls="menu" id="menuButton">
  Toggle Menu
</button>

<nav id="menu" class="visually-hidden">
  
</nav>
```
When you click the button, you can toggle its aria-expanded value from false to true, and remove the .visually-hidden class from the menu. This ensures that both visual and non-visual users know the content has been revealed.

4. Test with Multiple Assistive Technologies

It’s important to test your website with different assistive technologies because each one may behave slightly differently. Popular screen readers include NVDA, JAWS, and VoiceOver. Don’t forget to check on both desktop and mobile devices. Regular testing can help you catch accessibility issues before your users do.

Handling Localization

If you’re translating your site into multiple languages, remember that hidden text might also need translation. For example, your .visually-hidden text for instructions or links should be available to screen readers in every supported language. Make sure your language attributes (like lang="en") are correct, and consider cultural differences that could impact how you label hidden elements.

For instance, if you have an English site and a Spanish site, your hidden instructions should be translated into Spanish on the Spanish version. This ensures that users relying on assistive technologies can access the content in the correct language.

Putting It All Together: A Quick Example

Let’s look at a simple example of an accessible button that has visually hidden text:
```
<button class="icon-button">
  <span class="visually-hidden">Submit Form</span>
  <img src="icon-submit.png" alt="" aria-hidden="true" />
</button>
```
- The .visually-hidden class hides the text “Submit Form” from sighted users, but screen readers can still read it.
- The <img> tag includes an empty alt attribute and aria-hidden="true", so assistive technologies ignore the image itself.
- Sighted users see only the icon, while screen reader users hear “Submit Form.”
This example keeps your content accessible to people using assistive technologies and also meets visual design needs.

Additional Resources
- Web Content Accessibility Guidelines (WCAG): A detailed guide on making web content accessible.
- WAI-ARIA Authoring Practices: Official tips on using ARIA roles, states, and properties.
- MDN Web Docs on ARIA: In-depth explanations of ARIA attributes and best practices.
Exploring these resources will help you master hiding content effectively, ensuring people who use assistive technologies can still access everything they need.

Conclusion

Hiding content from sighted users while keeping it accessible to assistive technologies is an essential skill for modern web developers. By avoiding display: none for important information, using the clip pattern for visually hidden content, and carefully leveraging aria-hidden or hidden, you can ensure everyone has a good experience on your site.

Remember to keep the following points in mind:
1. Use the clip pattern (.visually-hidden) to hide content from sighted users but keep it readable by assistive technologies.
2. Use aria-hidden and hidden only when you truly want to hide content from all users, including those using assistive technologies.
3. Pay attention to focusable elements, making sure you don’t accidentally trap keyboard users in hidden sections.
4. Test frequently with various tools and real users to ensure your hidden content behaves as you expect.
5. Localize your hidden text so that people using assistive technologies in other languages can also benefit.
By following these guidelines, you’ll be well on your way to building inclusive websites that work for everyone. Your careful attention to accessibility shows that you value all your users, regardless of their abilities or the assistive technologies they use. Embracing these practices will help ensure a positive, welcoming, and user-friendly experience across the board.
Greg McNeil

December 31, 2024

How-to Guides

Accessibility, assistive technology, How-to, web developers, web development, Website Accessibility
Accessibility Overlays: Band-Aid Solutions?
Web accessibility is about making sure that everyone, including people with disabilities, can use your website with ease. Many businesses, however, reach for a quick fix known as a “web accessibility overlay.” These overlays claim to instantly solve a website’s accessibility problems by adding a single line of code. At first glance, this may sound like a dream come true: no major redesigns, no deep coding changes, and no extended timelines. Yet overlays often fail to address the real barriers that people with disabilities face. In fact, they can create new challenges and offer website owners a false sense of security.

In this article, we will explore why web accessibility overlays are often called a “Band-Aid solution” and why relying on them can do more harm than good. We will look at some of the technical limitations, discuss how they can conflict with assistive technologies, and share better ways to make your website truly accessible. We will also include links to helpful resources you can explore independently.

What Are Web Accessibility Overlays?

Web accessibility overlays are add-on tools, often in the form of a plugin or script, that claim to repair accessibility issues on a website automatically. Once installed, they usually give users a menu of features such as:
- Text resizing
- Color contrast adjustments
- Keyboard navigation controls
- Screen reader-friendly labels
These options may seem helpful, and some are. However, these overlays do not usually fix deeper issues in the website’s code. Overlays focus on surface-level changes that might look or feel good initially. For example, making text larger or changing color contrast might help some people. But someone who uses a screen reader or another assistive device might still find the site impossible to navigate if the page structure is confusing or missing proper markup.

Why Accessibility Overlays Fall Short

While overlays may claim to bring your site into compliance with standards like the Web Content Accessibility Guidelines (WCAG), they cannot fix serious problems that come from poor coding, improper headings, or missing labels. Let’s explore some core reasons why these tools can fail.

1. They Don’t Fix Structural Code Issues

A website that is built with accessibility in mind has clean, well-labeled HTML code and logical headings (like <h1>, <h2>, and so on). It also uses the right ARIA (Accessible Rich Internet Applications) attributes where needed. These parts of the code help assistive technologies—like screen readers—understand how the page is organized. If your code is poorly structured, an overlay might add color adjustments or keyboard focus outlines, but it won’t rewrite the site’s underlying structure. Missing or incorrect code stays broken, which causes ongoing problems for anyone who relies on a screen reader or keyboard navigation.

2. Conflicts with Assistive Technologies

One goal of web accessibility is to ensure that people using screen readers, braille displays, or voice recognition software can move through a site and understand its content. Overlays can accidentally disrupt these tools by adding unwanted code or labeling. For example, a screen reader might end up reading duplicate or confusing text because the overlay tries to label items automatically. This could result in a frustrating experience, causing users to abandon your site altogether.

3. False Sense of Compliance

Some businesses install an overlay hoping to protect themselves from legal action under the Americans with Disabilities Act (ADA). However, simply having an overlay does not mean your website is truly accessible or “ADA compliant.” In fact, in 2024 alone, 1,023 companies with an accessibility widget on their website received lawsuits, underscoring that overlays alone cannot shield businesses from legal action. In recent years, many sites using these tools have still faced lawsuits because of the underlying accessibility problems. Accessibility overlays often promise quick compliance, but the law cares about actual accessibility, not just appearances. Relying on an overlay can leave you vulnerable and unprepared if complaints or legal notices arise.

4. Ethical Concerns and User Frustration

Overlays may look like an easy fix for you, but they can feel like a barrier for those who need real accessibility improvements. Many people with disabilities have shared stories of frustration when they encounter overlay menus that don’t work correctly or override their screen reader settings. This can be discouraging for users who regularly deal with inaccessible websites. They may see the overlay as another obstacle rather than a tool that truly helps them. From an ethical standpoint, offering a patch that doesn’t solve deeper issues can be viewed as ignoring the experiences of people with disabilities.

The Risks of Taking the Easy Way Out

Accessibility overlays give website owners the idea that fixing accessibility is simple and quick. Sadly, that is almost never the case. By relying on an overlay, you risk:
- Legal Action: Courts can—and do—rule that a website with an overlay still has accessibility problems. An overlay will not protect you if people with disabilities cannot use your site.
- Damaged Reputation: When users have a poor experience on your site, word can spread quickly. This can harm your brand and turn potential customers away.
- Ongoing Maintenance Issues: Overlays must be updated along with your website’s updates. If the overlay breaks or conflicts with new code, your site could become even harder to use.
Instead of merely putting a bandage on the problems, developing or improving your website in ways that truly benefit all users would be better.

Steps to Achieve Real Accessibility

To create a site that everyone can use, consider a more thorough strategy. This involves reviewing the code, testing it with real users, and making changes that last. Below are some steps you can take.

1. Start with Clean, Semantic Code

Semantic HTML is a fancy way of saying you use the right tags to describe the right content. For example, headings (<h1>, <h2>, etc.) should be in order, and important landmarks (such as navigation and main content) should be labeled. Make sure that images include informative alt text, forms have clear instructions, and interactive elements have correct ARIA attributes if needed. When the base of your site is strong, many common accessibility problems disappear.

2. Test with Real Users and Automated Tools

Automated checkers can point out some problems, like missing alt text or heading errors. However, these tools cannot catch everything. The best approach is to test your website with actual users who have disabilities. Ask for their feedback and watch how they move through your site. You will quickly find issues that an overlay would never fix. This user-first approach ensures your improvements are based on real-world experiences.

3. Collaborate with Accessibility Experts

If you are not sure where to begin, seek help from professionals who specialize in digital accessibility. They can run a thorough audit, identify areas that need work, and guide you in making the proper fixes. This often involves reviewing your design, testing your site’s code, and recommending best practices so that all new content you create will also be accessible.

4. Provide Ongoing Training

Accessibility should be a team effort. Everyone who works on your website—developers, designers, content creators—should know the basics of accessible design. This means understanding how to create keyboard-friendly navigation, how to write alt text, and how to structure pages with clear headings and labels. If your team knows these skills, you are less likely to introduce new barriers when adding or editing content.

5. Plan for Long-Term Maintenance

Websites are never finished; they change over time. That means accessibility is an ongoing project. As you update pages, launch new features, or switch platforms, keep accessibility in mind. Continue testing, train your team, and regularly check for new issues. This helps you stay proactive rather than relying on any one tool to fix barriers as they come up.

Additional Resources

If you would like to learn more about doing accessibility the right way, here are some helpful links:
1. Web Content Accessibility Guidelines (WCAG): The official guidelines published by the World Wide Web Consortium (W3C).
2. W3C Web Accessibility Initiative: Offers guidelines, techniques, and tutorials on how to create an accessible website
3. WebAIM: A well-known resource that offers articles, tools, and services related to web accessibility.
4. The A11Y Project: A community-driven site with resources for building and maintaining accessible websites.
These resources can guide you in understanding the deeper aspects of accessibility and how to address them.

Moving Forward with True Accessibility

Web accessibility overlays may seem like a quick and convenient solution, but they are ultimately a Band-Aid on a much larger problem. While they can address surface-level issues, they often fail to tackle the deeper, structural barriers that prevent people with disabilities from fully engaging with your website. Worse, relying on overlays can give businesses a false sense of compliance, leaving them vulnerable to legal action and alienating users who need genuine accessibility improvements.

Real accessibility requires a proactive, thoughtful approach—one that prioritizes clean code, user testing, and ongoing education. By investing in these strategies, you can create a website that is not just compliant with legal standards but genuinely inclusive for everyone.

If you’re ready to move past quick fixes and build a site that welcomes all users, 216digital is here to help. We offer expert accessibility audits, training, and monitoring services to ensure your website meets WCAG standards and delivers a seamless experience for every visitor. Reach out to us today to schedule an ADA compliance briefing and take the first step toward meaningful, lasting accessibility.

Let’s build a more inclusive digital world—together.
Greg McNeil

December 30, 2024

Web Accessibility Remediation

Overlay, Overlay widgets, screen overlays, Web Accessibility, Website Accessibility
Why Website Accessibility Should Your New Year’s Resolution
As each New Year begins, we all look for ways to improve. Some people aim to eat healthier or learn a new skill. Others plan to grow their business or find new ways to help their community. This year, consider making website accessibility your top goal. By doing so, you can help create a more inclusive online experience while also boosting your company’s success. In this article, we will look at why website accessibility matters, how it helps your business, and what steps you can take to get started.

What Is Website Accessibility?

When people talk about website accessibility, they are talking about making sure that everyone can use a website. This means people who are blind, have low vision, are deaf, have hearing loss, or have other disabilities. For example, many users rely on screen readers to read text out loud if they cannot see the screen well. Others may navigate only with a keyboard if they have trouble using a mouse.

Making your site accessible helps all users find the information they need. It also shows that you respect and value every visitor. Most importantly, it creates an inclusive online space where everyone can participate.

Why Focus on Website Accessibility?

Inclusivity

One main reason to focus on website accessibility is to make sure people with disabilities have the same chances as everyone else. It can feel frustrating when someone cannot use a website because images don’t have text descriptions or the site requires the user to click small buttons they can’t see. By updating your site to be accessible, you send a message that you care about all visitors.

Better User Experience

Another reason to care about website accessibility is that it improves the user experience for everyone. For example, providing clear and simple navigation helps people with vision or mobility issues. But it also allows users on mobile phones who want easy buttons and menus. By making your site clear, organized, and simple, you help all visitors find what they need faster.

Search Engine Optimization (SEO)

Many of the steps you take to improve website accessibility also make your site more search-engine friendly. Search engines like Google look for well-structured content, headings, and alternative text for images. These are the same features that help people who use screen readers. As a result, when you improve your site’s accessibility, you can also see a boost in your SEO. This can lead to more site visitors and potential customers.

Avoiding Legal Risks

In some places, it is the law that businesses must make reasonable efforts to ensure website accessibility. If a site is inaccessible, there could be legal consequences, such as lawsuits or fines. By taking the time to keep your site accessible, you protect your business from these risks.

Future-Proofing Your Website

Staying on top of website accessibility helps future-proof your site as technology changes. When new devices or tools come out, users with disabilities may rely on them to access the web. A site that follows best practices for accessibility will likely work well with new devices and software.

Steps for Getting Started with Website Accessibility

1. Conduct an Accessibility Audit

A good place to start with website accessibility is to run an accessibility audit. This can show you where your site is working well and where you need to improve. You can use online tools like WAVE Web Accessibility Evaluation Tool or Google Lighthouse to scan your web pages. These tools will point out errors, like missing image text or poor color contrast.
- Check for Alt Text: One of the first things these tools look for is alt text for images. This text should describe the image so that people using screen readers know what it shows.
- Inspect Headings: Proper headings (H1, H2, H3, etc.) make it easier for users and search engines to understand your content. They also help screen readers tell listeners what section of the page they’re on.
2. Improve Color Contrast

Many people have trouble reading text if the colors do not have enough contrast. For instance, gray text on a white background can be hard to see, even for people without vision disabilities. Try using a tool like WebAIM’s Color Contrast Checker to make sure your text stands out from the background.

3. Make Your Site Keyboard-Friendly

Some people cannot use a mouse. Instead, they use the keyboard to move from button to button on a page. Make sure that all interactive parts of your site, such as links and forms, can be reached and used by pressing Tab or the arrow keys. You can test this by trying to use your site without a mouse.

4. Use Clear Labels and Instructions

Forms, buttons, and links should have labels that tell people what they do. For example, avoid using a button that says “Click Here.” Instead, use a phrase like “Sign Up for Our Newsletter.” This helps visitors understand what action they’re taking. It also helps users who rely on screen readers since the screen reader will say the label out loud.

5. Provide Captions and Transcripts

If you have videos or audio content on your site, make sure you have captions for people who are deaf or hard of hearing. You can also provide written transcripts. This way, all users can understand your content, even if they cannot hear the audio.

6. Follow the WCAG Guidelines

The Web Content Accessibility Guidelines (WCAG) offer detailed advice on how to make sites more accessible. They cover things like color contrast, text size, and how to handle media. While the guidelines can be lengthy, you don’t need to tackle everything simultaneously. Pick the biggest problems first, then work on the rest over time.

Technical Explanations in Simple Terms
- Screen Readers: These programs read text on a screen out loud. People who cannot see well often rely on them to use the web. If your site lacks alt text or uses odd layouts, it can confuse screen readers.
- ARIA Labels: These are extra bits of code that tell assistive technologies how to treat specific parts of a website. They are used when basic HTML tags aren’t enough to explain what something is or does.
- Semantic HTML: This means using HTML tags the way they were meant to be used. For example, using the <header> tag for your header and <main> for your main content. Semantic HTML makes reading your site easier for browsers and assistive tools.
Links to Additional Resources
- W3C Web Accessibility Initiative: This is the group that creates the official guidelines on web accessibility.
- WebAIM: They offer articles, tools, and services to improve accessibility.
- The A11Y Project: A community-driven site with accessibility resources, tips, and tools.
- National Center on Disability and Access to Education (NCDAE): Provides resources on creating accessible web content for education and beyond.
Embracing Accessibility as a Competitive Advantage

Improving website accessibility can make you stand out from your competition. People notice when a site is easy to use and welcoming. They are also likely to return if they had a good first experience. In today’s online world, building a site and hoping for the best is not enough. Making it accessible can bring new customers and keep the ones you already have happy.

Committing to Website Accessibility for 2025

Focusing on website accessibility sets you up for long-term success. By making your site inclusive, you show you care about all visitors, protect your business from legal risks, and improve SEO while creating a more welcoming internet for everyone.

Start the New Year with an accessibility audit and tackle high-impact fixes like adding alt text, improving contrast, and ensuring keyboard navigation. Each step brings you closer to a more inclusive and future-proof site.

Ready to take action? Schedule an ADA briefing with 216digital today. Let us help you build a compliant and inclusive digital presence for 2025 and beyond!
Greg McNeil

December 20, 2024

The Benefits of Web Accessibility, Web Accessibility Remediation

2025, New Year's Resolution, Web Accessibility, Website Accessibility
Play Your Part: Role-Based Advice for Web Accessibility

When you first dive into web accessibility, it’s completely normal to feel a bit overwhelmed—there are so many things to consider. But making sure your website works for everyone isn’t just a one-time fix; it’s a group effort that involves every role on your team. Developers, designers, content creators, marketers, and website owners all contribute their own strengths and insights. When everyone’s efforts line up, you create a smooth, inclusive experience for all your users.

This guide is for teams who are already working on—or are fully committed to—improving their websites. It’s packed with practical, role-specific tips to help you approach accessibility in a way that’s both strategic and effective. Whether you’re refining your code, fine-tuning your visuals, crafting inclusive content, or ensuring your brand message is accessible, you’ll find helpful, targeted advice for your particular responsibilities. Together, these steps ensure your site meets the needs of every user while staying on top of WCAG compliance. Let’s jump in and see how each role plays a part in building a more accessible web.

Developers: Building the Accessible Foundation

Developers form the core of any website—they’re the ones who take an idea and turn it into a working reality. When it comes to WCAG compliance, the quality of your code truly matters. By following accessibility best practices from the get-go, you help guarantee that everyone can use your site, right from the start.

Practical Tips for Developers

Semantic HTML and Proper Structure

Use semantic HTML elements like <header>, <nav>, <main>, and <footer> to support screen readers and other assistive tech. Keep headings and landmarks organized, so users can navigate your site with ease.

Keyboard Navigation

Make sure all interactive elements—buttons, links, and form fields—work smoothly using just a keyboard. This isn’t just about meeting standards; it’s also a big help to people with motor impairments who can’t rely on a mouse.

ARIA Attributes

ARIA (Accessible Rich Internet Applications) attributes can add valuable context, but use them wisely. Overdoing it can confuse rather than help.

Robust Error Handling

Provide clear, accessible error messages and confirmations for form submissions. When users understand what went wrong and how to fix it, they’re more likely to stay engaged.

By building accessibility directly into your code, you set a strong foundation for WCAG compliance and create a reliable platform that benefits every other role on your team.

Graphic Designers: Creating Inclusive Visuals

Graphic designers can help shape accessibility by making sure the website’s visual elements are both attractive and functional. You don’t have to sacrifice creativity for inclusivity—instead, design with everyone’s needs in mind.

Practical Tips for Graphic Designers

Color Contrast

Ensure there’s enough contrast between text and background elements. Check your color choices against WCAG guidelines so people with low vision or color blindness can still see everything clearly.

Scalable Designs

Plan for responsive and scalable design. Users who rely on screen magnification should still see a layout that’s visually appealing and makes sense.

Accessible Icons and Imagery

Give icons and images proper alt text, and avoid using color alone to convey meaning. This helps users who depend on screen readers understand your site’s visuals.

Consistent Design Patterns

Reusable design elements and predictable navigation make it easier for everyone, including those with disabilities, to find their way around.

By focusing on inclusive visuals, you ensure the site looks great and works smoothly—even for those using assistive technologies—moving you one step closer to WCAG compliance.

Content Creators: Writing for All Audiences

Your words matter. As a content creator, it’s your job to make sure the text on your website is clear, easy to understand, and accessible to everyone. Inclusive content goes beyond grammar and style; it also means structuring your writing to support people with different abilities.

Practical Tips for Content Creators

Plain Language

Keep your language simple and direct. Steer clear of jargon or overly complex sentences so users of all backgrounds and reading levels can follow along.

Heading Hierarchies and Lists

Break content into logical sections with headings, bullet points, and numbered lists. Many users rely on these elements to “jump” between sections and navigate quickly.

Descriptive Links

Swap out vague phrases like “click here” for links that clearly describe the destination. This small change can make a huge difference in accessibility.

Closed Captions and Transcripts

For videos and podcasts, always provide captions and transcripts. This ensures that users who are deaf or hard of hearing don’t miss out on any information.

By considering everyone’s needs when writing content, you help make your site more engaging, accessible, and in line with WCAG standards.

Marketers: Promoting Accessibility as a Brand Value

Marketers bridge the gap between the company and its audience. When you emphasize accessibility in your messaging, you’re not just showing you meet the guidelines—you’re proving you care. Highlighting your commitment to WCAG compliance can foster trust, build loyalty, and boost your brand’s reputation.

Practical Tips for Marketers

Inclusive Messaging

Talk openly about your brand’s dedication to accessibility. Use language that’s positive, empathetic, and respectful, making it clear that you value inclusivity.

Transparent Policies

Publish your accessibility statements and share your ongoing efforts. This honesty reassures people with disabilities and shows your brand is serious about doing the right thing.

Social Media and Email Marketing

Ensure your emails, ads, and social posts are accessible, too. Add alt text to images, use clear language, and include descriptive hashtags so everyone can participate.

Continuous Feedback

Invite users to share their thoughts on your site’s accessibility. By listening and improving, you show that your commitment to WCAG compliance isn’t just talk.

When marketers celebrate their brand’s accessibility journey, they create a positive narrative that resonates with a wide, diverse audience and strengthens brand loyalty.

Website Owners: Setting the Vision and Investing in Ongoing Compliance

As a website owner, you’re the one steering the ship in terms of resources, priorities, and long-term strategy. Achieving WCAG compliance isn’t something you do once and forget—it’s a continuous process. Owners need to keep accessibility front and center, provide the right tools, and foster a culture that values inclusive design.

Practical Tips for Website Owners

Leadership and Accountability

Make accessibility a non-negotiable core value. By setting clear expectations and holding everyone accountable, you empower each team member to do their part.

Budget for Accessibility

Invest in accessibility tools, auditing services, and training. Recognize that these efforts aren’t just expenses—they add value, protect you from legal risks, and improve user experience.

Regular Audits and Updates

Accessibility changes over time. Stay on top of it by revisiting your site regularly and making improvements as standards and user needs evolve.

Team Training

Tap into resources like 216digital’s web accessibility training to give your team the skills they need. By training developers, designers, content creators, and marketers, you ensure everyone’s working together toward WCAG compliance.

By providing clear leadership and long-term support, you set the stage for ongoing success. Accessibility becomes everyone’s priority, not just another item on a checklist.

Collaboration and Continuous Improvement

The journey to WCAG compliance isn’t a straight line—it’s a continuous loop of learning, adapting, and improving. When each person on your team understands their unique role and how it fits into the bigger picture, the result is a cohesive, user-friendly experience that truly works for everyone.

This is where a comprehensive training resource like the one from 216digital comes in handy. By investing in accessibility training that’s tailored to each role, you make sure every team member feels confident and supported. Developers learn best practices for semantic code, designers refine their approach to inclusive visuals, content creators craft language everyone can understand, and marketers become champions of accessibility. As a website owner, you can rest easy knowing your entire team is dedicated to meeting and maintaining WCAG compliance.

Remember, accessibility isn’t a final destination—it’s an ongoing journey. Working together and following these role-specific tips will help you build sites that aren’t just legally compliant, but genuinely welcoming to every visitor. This approach enhances trust, expands your audience, and reinforces your brand’s good name.

Ready to take the next step? Schedule an ADA briefing with 216digital through the contact form below. Let’s join forces to create a web experience that’s truly inclusive for all.

Greg McNeil

December 19, 2024

WCAG Compliance

Accessibility, ADA Compliance, Graphic Designer, Marketer, Web Accessibility, web developers, Website Accessibility
Measuring Accessibility: How It Impacts Marketing Goals

You’ve invested time, effort, and resources into making your website accessible—now what? Whether you’ve completed web accessibility remediation or are actively planning it, the next step is understanding how these changes impact your business goals. Accessibility improvements aren’t just about compliance; they’re about driving measurable results. From website traffic to engagement and conversion rates, every change you make has the potential to influence key marketing metrics.

But how do you connect the dots between accessibility and performance? Measuring the impact of your efforts can provide powerful insights, helping you refine your strategy and justify the investment. Below, we’ll explore which core metrics to watch, how to set up effective measurement techniques, and how to interpret these findings so that they can shape your ongoing marketing strategy.

Understanding the Marketing Payoff of Accessibility Improvements

When you enhance your site to be more accessible—maybe by improving color contrast, refining navigation for keyboard users, adding descriptive alt text to images, or ensuring multimedia content includes transcripts and captions—you’re helping visitors of all abilities have a smoother, more intuitive experience. While that’s a worthy goal in itself, these improvements can also influence how people engage with your brand online.

A More Welcoming Experience for Everyone

Accessibility isn’t only for users with disabilities; often, making content easier to parse benefits all visitors. A cleaner interface, clearer calls-to-action, and faster loading times can reduce frustration and encourage visitors to stay longer, explore more deeply, and trust your brand’s commitment to serving them.

Building on Existing Marketing Foundations

If you’ve already fine-tuned SEO, user experience (UX) design, or content marketing, accessibility improvements can boost the effectiveness of these efforts. For instance, when images have descriptive alt text, it doesn’t just help screen reader users—it also can support better image search rankings. In short, accessibility can amplify the impact of the marketing strategies you’ve worked hard to build.

Key Marketing Metrics to Monitor

To measure how accessibility changes influence your marketing goals, focus on core metrics that tell a story about user behavior, engagement, and conversion. Before implementing changes, establish benchmarks for these metrics so you can accurately track growth over time.

1. Website Traffic

Your site’s overall traffic and traffic sources can signal whether accessibility is drawing in new users or encouraging return visits. After implementing accessibility improvements, compare monthly or quarterly traffic data to your benchmarks. If the number of unique visitors increases or if you see a rise in organic search traffic, it may be partly due to your site becoming easier to navigate for all users, including those who rely on assistive technologies.

2. Bounce Rate

A high bounce rate often indicates visitors didn’t find what they were looking for or had trouble engaging with the page. Accessibility refinements—like making interactive elements more intuitive and ensuring readable text—can encourage visitors to explore more pages and stay longer. If your bounce rate drops after accessibility updates, that’s a strong indicator you’re delivering a better initial user experience.

3. Conversion Rates

Whether you want visitors to fill out a form, sign up for a newsletter, or complete a purchase, conversion rates show how effectively your website turns casual visitors into engaged participants or customers. Accessibility improvements can streamline this path, removing friction that might have previously deterred some users. Look for upticks in completed forms, successful transactions, or sign-ups following the changes you’ve made.

4. Engagement Metrics

Time on site, pages per session, and the frequency of return visits all shine a light on how interested and comfortable users are once they arrive. Accessibility-focused features like captioned videos, properly structured headings, or easily clickable buttons can create a more enjoyable browsing experience. Over time, an increase in these engagement metrics can be traced back to the site’s enhanced usability.

Methods to Measure and Attribute Results

Once you know which metrics to prioritize, it’s time to implement a measurement plan that can show the direct or indirect influence of your accessibility initiatives. Below are several methods and tools that can help you gather meaningful data.

1. Benchmarking Before and After Changes

Before rolling out your accessibility improvements, use tools like Google Analytics to record baseline metrics. These might include average monthly traffic, typical bounce rate, conversion funnels, and standard engagement levels. After the changes have been in place for a set period—often a few weeks or months—compare the new data against your benchmarks. Any positive shifts can help you see how your accessibility efforts are contributing to better outcomes.

2. A/B Testing Specific Elements

If you’re still refining your approach, consider testing pages or features. For instance, try presenting one version of a landing page with enhanced accessibility features (clear labeling, streamlined forms, strong color contrast) and another version with fewer improvements. Monitor which variant achieves higher conversion rates or lower bounce rates. By isolating certain features, you can identify which specific accessibility enhancements resonate most powerfully with users.

3. Reviewing Analytics on Assistive Technology Usage

Some analytics platforms and specialized tools can help you understand how users with assistive technologies, like screen readers, interact with your site. While you won’t often see these visitors singled out in basic analytics reports, certain surveys or session recordings (always anonymized and with proper privacy considerations) might reveal patterns in navigation. If more visitors using keyboard-only navigation or screen readers are successfully completing key actions, that’s a compelling sign your accessibility changes are having a positive effect.

4. Direct User Feedback and Surveys

Numbers are crucial, but qualitative feedback can provide context. Consider reaching out to your audience through surveys or feedback forms that specifically ask about the site’s usability and clarity. If visitors comment that it’s easier to find products or read blog posts since recent updates, that personal insight can validate your quantitative data. Even an open-ended prompt like “How can we make our site more user-friendly?” may yield telling feedback. Better yet, if you have a dedicated user base that includes people who rely on assistive technologies, invite them to share their experiences. Their insights can help explain why certain metrics changed—and suggest new opportunities for improvement.

5. Accessibility Testing Tools and Audits

Tools like WAVE and Lighthouse can run automated checks to highlight where your site excels and where it might still be falling short on accessibility standards. These audits can’t directly tell you how conversions or bounce rates change, but they can ensure that you’re making genuine, meaningful improvements to the user experience. By regularly auditing, you maintain a level of quality that can translate into better marketing performance over time.

Integrating Accessibility into Your Ongoing Marketing Strategy

For those who’ve completed accessibility remediation or are deep into the planning process, it’s important to view these changes not as a one-time project, but as a continuous element of your online presence. To keep accessibility efforts aligned with your marketing goals:

1. Make Accessibility a Standard Part of Your Workflow

Rather than seeing accessibility as a separate task, integrate it into your content creation, campaign planning, and website updates. That way, new blog posts, landing pages, and marketing materials will be accessible from the start, ensuring long-term consistency.

2. Train Your Team on Best Practices

Share guidelines and tips with everyone involved in your marketing and website development. When the whole team understands the importance of descriptive link text, proper heading structure, and inclusive media formats, accessibility becomes second nature—and its marketing benefits compound over time.

3. Keep Monitoring and Iterating

Markets shift, user expectations evolve, and technology changes. Make it a habit to review accessibility metrics alongside other key marketing KPIs. If conversions start to plateau, examine whether new accessibility enhancements could remove a new barrier. As you refine your approach, keep using data to inform your next steps.

The Bigger Picture: Trust, Loyalty, and Growth

At its core, effective accessibility improvements help you create a site that’s genuinely welcoming. It’s about minimizing frustration, simplifying navigation, and making it easier for all visitors—whether they have a disability or not—to connect with your content and your brand.

By actively measuring the impact of these changes, you show that you’re not just making improvements as a formality. You’re committed to understanding their effect and using that insight to guide your marketing strategy forward. Over time, this transparency and responsiveness can enhance your reputation, build trust, and foster loyalty, creating a multiplier effect on your growth.

If you haven’t yet started your journey toward web accessibility, now is the time to take the first step. Schedule an ADA briefing with 216digital using the contact form below, and let us help you create a more inclusive and impactful digital presence.

Greg McNeil

December 18, 2024

The Benefits of Web Accessibility

Accessibility, digital accessibility, KPI, Marketing, Website Accessibility

Why Accessibility in JavaScript Matters

Common Accessibility Barriers in JavaScript

Best Practices for Accessible JavaScript

1. Ensure Keyboard Accessibility

2. Manage Focus Properly

3. Use ARIA Responsibly

4. Announce Dynamic Content Updates

5. Test Custom Widgets Thoroughly

Testing JavaScript for Accessibility

Automated Tools

Manual Testing

Real-World Scenarios

Meeting WCAG Requirements

Perceivable

Operable

Understandable

Robust

Benefits of Accessible JavaScript

Conclusion

What Is Web Accessibility?

Why Accessibility Matters for Small Businesses

Reach More Customers

Improve Your SEO

Build a Better Brand

Avoid Legal Risks

Don’t Let Cost Hold You Back

Practical Steps to Start Your Accessibility Journey

Check Your Site’s Accessibility

Stay Informed and Up-to-Date

Train Your Team

Offer Accessible Customer Support

How Accessibility Helps Your Business

Take the First Step

What is the European Accessibility Act?

Scope of the EAA

EN 301 549: The Technical Backbone of the EAA

Are There Any Exceptions to EAA Compliance?

Why the EAA Matters

It’s Legally Required

Reach a Larger Audience

Better User Experience for Everyone

Boost SEO and Discoverability

How to Prepare for the EAA

Overlays: The Quick Fix That Falls Short

The Upside of Accessibility

Don’t Wait: Turn Accessibility into an Advantage

What Are Web Accessibility Extensions?

Popular Accessibility Extensions

Why These Tools Are Helpful

The Limits of Accessibility Extensions

Practical Steps for Using Accessibility Extensions

Going Beyond Extensions: Manual Testing & Real Users

Professional Tools and Services

Additional Resources to Explore

Conclusion

Accessibility Lawsuits Are Shifting to State Courts

New York Is at the Center of the Action

Copycat Lawsuits Are a Growing Threat

Small Businesses Are in the Spotlight

Accessibility Widgets: Not the Quick Fix You Think They Are

What You Can Do in 2025

Immediate Actions

Conduct a WCAG 2.2 Audit

Train Your Team

Long-Term Strategies

Build Accessibility Into Your Workflow

Partner With Experts

Conclusion

The Problem with display: none

The Clip Pattern: A Better Approach

Why the Clip Pattern Works

Managing Visibility with aria-hidden and the hidden Attribute

aria-hidden="true"

HTML5 hidden Attribute

Best Practices for Accessible, Visually-Hidden Content

1. Use Semantic HTML

2. Avoid Hiding Focusable Elements

3. Provide Context for Hidden Content

4. Test with Multiple Assistive Technologies

Handling Localization

The Problem with `display: none`

Managing Visibility with `aria-hidden` and the `hidden` Attribute

`aria-hidden="true"`