WCAG and Search: Developing an Accessible Search Experience

Author: Rose Grant, Associate Product Manager
Blog Date: November 2020

What’s WCAG and ADA? 💻

ADA stands for the American Disabilities Act, which is "a civil rights law that prohibits discrimination against individuals with disabilities in all areas of public life, including jobs, schools, transportation, and all public and private places that are open to the general public." (https://adata.org/learn-about-ada).

WCAG stands for the Web Content Accessibility Guidelines (WCAG). These are the practical standards for the ADA – by creating a website that adheres to the best practices set in WCAG, you're helping your site be in-line with ADA standards. (https://www.w3.org/WAI/standards-guidelines/wcag/).

WCAG is not always black and white; its rules often have a variety of interpretations.

Why Does This Matter? 🤗

It can be frustrating to need to add another box to an already long SDK and Theme deployment checklist. However, at Yext, we feel strongly that Answers is accessible and available to all. By abiding by WCAG best practices, you'll not only ensure that everyone can find the truth about your brand, but also take a small step to make the internet a more inclusive place.

Answers and WCAG 🤝

WCAG impacts each layer of an Answers experience: The core functionality and default layout, any added customization, and finally the integration itself. We'll walk through each layer and describe that impact.

Customization

This layer consists of elements that are customizable and unique per implementation. The Items that fall into this category are selecting colors that have sufficient contrast, defining descriptive alt-text for any images, descriptive labels for buttons and any custom HTML or interaction added beyond the library and the theme. At this layer, the responsibility for aligning with WCAG falls on the implementer.

Integration

Finally, there's the integration step, which dictates how Answers fits onto a page. For example, the page where you host Answers should correctly use semantic HTML (like a header and footer) and an H1 articulating the core purpose of the page. Depending on how you integrate, this area may be outside of Yext's scope.

Core Functionality and Default Layout 🏛

The first layer of an Answers experience (built by the Answers Javascript Library and the Yext Hitchhikers Theme), are built with WCAG best practices in mind. You'll notice this throughout attributes in the Javascript library and elements in the theme.

As an example, here's our configuration for the DirectAnswer component.

<div class="direct-answer-container"></div>
ANSWERS.addComponent('DirectAnswer',
{ container: '.direct-answer-container',
//other attributes here
positiveFeedbackSrText: 'This answered my question',
negativeFeedbackSrText: 'This did not answer my question' })

In an Answers experience, you'll notice that the screen reader text controls the sr-only text for the thumbs up and thumbs down buttons in a direct answer:

Feedback 📣

We're always open to feedback on our library and WCAG approach. Feel free to post your questions and recommendations to the community.

All Blog Posts

Determine Location Intent in a Search Engine

Max Shaw, VP Product

One of the most common use cases for a search engine is finding something by a "location". Here are some basic examples: Cardiologist near Green Bay, Notary near me, Restaurants open now. These are all pretty simple queries, but getting these to work in a search engine is much more complex than you might imagine.

4 Methods for Increasing Site Search Clicks

Rick Swette, UX Research

We know good search drives business impact. It increases conversions and transactions, reduces search bounce rate, and boosts overall customer satisfaction. So, how do we get more people to trust and use site search? We embarked on a study to find this out.

How to Measure the Success of Your Site Search

Basil Polsonetti, Data Insights

Most brands know that site search is a feature their website should have, but unless the site is dominated by e-commerce, it’s often relegated as a check-the-box task when building a new website.

The Danger in Document-Level Sentiment Analysis

Calvin Casalino, Senior Product Manager

In order for your feedback to become an actionable item to help businesses provide a better experience, they need a way to analyze the granular content of all of their reviews, at scale.

Deep Dive into Duplicate Suppression

Dee Luo, Product Manager

Brands know the importance of having accurate information across all the apps, maps, and directories where consumers are searching for information. In a perfect world, powering that brand data and managing each of these listings would be enough to ensure that consumers consistently get the answers they're searching for.

Yext Answers Algorithm Update: Milky Way

Max Shaw, VP Product

Yext Answers is constantly improving it’s search algorithm to provide more relevant results over time. Milky Way is the first official upgrade to the Answers Algorithm and includes a series of important upgrades to provide better search precision and recall.

GMB API Update - Dedicated Food Menus

Dee Luo, Product Manager

On August 24, 2020, Google launched version 4.7 of its Google My Business (GMB) API. This update includes enhancements to how your restaurant locations can sync and display food menus on Google.

Structuring Your Knowledge Graph

Jessie Yorke, Yext Administrator

In this post we are going to discuss strategy and give you some tools to effectively think about structuring your own brand's Knowledge Graph!

Welcome to the Hitchhikers Program

Liz Frailey, VP Developer & Admin Experience

Welcome to Hitchhikers! We are so excited to have you join our mission of creating amazing search experiences for brands of all sizes.

Introducing: Yext Answers Plugin for WordPress

Alex Barbet, Product

Businesses of all sizes use both WordPress and Yext to build amazing client experiences, and as more and more brands around the world add the Yext Answers bar to their WordPress powered sites, we wanted to provide a way to drive their time-to-value even faster.

Yext’s Fall ‘20 Release is Now Live!

Nick Oropall, Senior Product Marketing Manager

For those of you who are new to Hitchhikers — Welcome to Yext's new training platform & community! Hitchhikers will be the home for all of Yext's product and release updates moving forward so we encourage you to create a free user and check out the platform!

Meet the Hitchhikers Team: Alyssa Hubbard

Alyssa Hubbard

Alyssa Hubbard began at Yext in the Upward Rotational Program. Now she is full-time on the Hitchhikers team, working to build a platform to empower our community of Yext power users.

Yext Answers Algorithm Update: Andromeda

Allie Allegra, Senior Product Marketing Manager

We are constantly making improvements to the underlying Answers algorithm. Our latest algorithm release, Andromeda, includes cutting edge improvements that optimize the overall search experience. With this release, our algorithm now has the ability to search semi-structured data. You can now opt-in to access these improvements depending on your configuration.

WCAG and Search: Developing an Accessible Search Experience

Rose Grant, Associate Product Manager

What’s WCAG? WCAG stands for the Web Content Accessibility Guidelines (WCAG). WCAG is not always black and white; its rules often have a variety of interpretations.

Meet the Hitchhikers Team: Amani Farooque

Amani Farooque, Program Development Manager

Wonder what's behind the avatar for some of those people you see constantly on the Hitchhikers Community? My name is Amani Farooque and I work as a Program Development Manager at Yext, managing the Hitchhiker Platform and focusing on enhancing developer and administrator experience. Read more to learn more about me and get a behind-the-scenes glimpse of what maintaining the program entails!

Now Available: Shopify Product Catalog Sync for Yext

Lilly Fast, Senior Business Development Manager

Shoppers have questions about your products, and your ability to answer will determine if they buy or if they bounce. But with rapid changes to your business, it can be hard to keep your product information consistently up-to-date.

Now Available: Yext Product Catalog Sync for Magento Commerce, an Adobe Company

Lilly Fast, Senior Business Development Manager

Shoppers have questions about your products, and your ability to answer will determine if they buy or if they bounce. But with rapid changes to your business, it can be hard to keep your product information consistently up-to-date.

A New Way to Search FAQS

Max Davish, Associate Product Manager

Semantic search is a new way of searching for FAQs. Instead of looking at keywords, it measures the similarity in meaning between two questions. Answers does this using BERT - the same revolutionary natural language processing technology that powers other Answers features like location detection and entity recognition.

How to Build Discoverable and High-Converting Landing Pages

Sonia Elavia, Senior Product Marketing Manager

Search is a massively important marketing channel. Fifty-three percent of website traffic comes from organic search, so it’s critical that businesses optimize for these experiences. But how do you actually build out a strong presence in organic search? Having search-optimized landing pages is critical.

Exporters: From Yext to Your Listings

Calvin Casalino, Senior Product Manager

Our Listings delivery pipeline ensures your data stored in the Knowledge Graph appears on Listings everywhere consumers are asking questions. How do we make sure your data is updated on all publishers as quickly as possible while still ensuring data is formatted properly for each endpoint? Yext’s Listings exporters.

2020: Hitchhikers Year in Review

Liz Frailey, VP Developer & Admin Experience

2020 has been a rollercoaster of a year for everyone for a multitude of reasons. On the Hitchhikers Team, we were able to overcome some of the year's obstacles to really transform the program.

Understanding the Answers Algorithm

Pierce Stegman, Data Scientist & Michael Misiewicz, Data Science Manager

See for yourself how the Answers algorithm works on the Understanding the Answers Algorithm site built by our Data Science team!

A Type System for Knowledge Graph Entities

Oscar Li, Software Engineering Lead

Our type system serves as the foundation of the Knowledge Graph by dictating the structure, validation, and display of fields. The type system guarantees the consistency and correctness of any field value retrieved from the Knowledge Graph. This makes it easier for our engineers to reason about code that handles particular fields, for our customers to manage their entity data, and for our publishers to trust the quality of our data.

3 Integrations That Can Help You Get More Out of Yext

Jonathan Gitlin, Content Marketing Manager, Workato

As a Yext user, you’re likely well aware of the platform’s product suite and the value each solution delivers. But did you know that you can provide even better search results for visitors, collect more reviews from customers, and analyze data more closely by integrating Yext with the apps and systems your team already uses?