How to Make Your Web Content Truly Accessible Using the WCAG
Written by Shannon Mackenzie, Jen Siomacco, and Brittinee Phillips. Meet Our Team.
As a small business owner you should always ensure you’re inclusive to a variety of customers, beyond the dominant identities prioritized in our society.
Accessibility is one of the many ways you must set and implement inclusivity with your brand. It’s not a trend, it’s an important approach to connecting with people typically relegated to an afterthought.
You might wonder, what exactly is accessibility? Accessibility is the practice of ensuring that all people have equal access to content and services. Inclusive and universal design is a design practice where all products, buildings, and services are built to be accessible. This makes the experience better for everyone — whether they are disabled or not.
What exactly is a disability?
A disability is a societal imposition on people who have impairments, making it more difficult for people to do certain activities or interact with the world around them. Due to cognitive, developmental, intellectual, mental, physical, and/or sensory differences, disabled people are “unnecessarily isolated and excluded from full participation in society” (as cited by Marta Russel, Wikipedia).
Disability includes physical and motor disabilities — which might be visible to others, and cognitive, mental, and sensory disabilities — which are very often invisible to others. Additionally, some disabilities are temporary — such as when someone breaks their arm but will regain use of it for mobility once healed; but many people live with permanent, life-long disabilities. Almost everyone on this planet will experience a disability at some point in their lives.
Disabled people continuously face extreme levels of discrimination in their day-to-day lives. This is exponentially amplified when a disabled person is also Black, Indigenous, or a Person of Color and/or LGBTQ+.
How is accessibility addressed on the Internet?
In 1994 the World Wide Web Consortium (W3C) was founded as an international standards organization for the Internet. Four years later, the W3C published the first Web Content Accessibility Guidelines (WCAG 1.0). When the second version of the guidelines were published in 2008 it became the international standard in web accessibility. With web accessibility, different countries tend to adhere to different legal regulations. Since the W3C is an international organization, WCAG 2.1 has become the best practice for international brands.
What should I understand about Web Content Accessibility Guidelines?
The WCAG 2.1 guidelines are the current standard for web accessibility. It is comprised of four principles and 13 guidelines, which we provide a breakdown of each below:
Principle 1 — Perceivable. A user should be able to perceive the content on your website or digital experience. This means that in order for your web content to be accessible it must meet the following guidelines:
Guideline 1: Text Alternatives
Should provide text alternatives for any “non-text” content, so that it can be used to translate into other forms people need, such as large print, braille, speech, symbols or simpler language. For example, descriptive alternative-text (or alt-text) for images and graphics, or audio alternative provided for CAPTCHA
Guideline 2: Time-based Media
Should provide alternatives for time-based media, such as video or audio content. For example, captions or audio descriptions for video content, or transcripts for audio content.
Guideline 3: Adaptable
Should create content that can be presented through different methods for different screen sizes or simpler layout without losing information or structure. For example, mobile-friendly responsive web design or an appropriate heading structure ensure compatibility with functions like Safari Reader.
Guideline 4: Distinguishable
Should make it easier for users to see and hear content, including separating foreground from background. For example, using text color that sufficiently contrasts with the background (i.e. contrast ratios), or options for controlling audio must be provided.
Principle 2 — Operable. A user should be able to interact with your web content to complete tasks.
Guideline 5: Keyboard Accessible
All functions of your website’s content can be accessed by using only a keyboard. For example, a user can use the “tab” key to move through an entire site without missing information, structure, or functionality
Guideline 6: Enough Time
Should provide users with enough time to read and interact with web content. For example, time-based media (i.e. video or animation) needs to allow the user to pause, stop, and/or hide it.
Guideline 7: Seizures & Physical Reactions
Do not design web content in a way that is known to cause seizures or physical reactions. For example, videos or animations should not flash more than three times per second.
Guideline 8: Navigable
Should provide ways to help users navigate, find content, and determine where they are. For example, each page has a title that describes the purpose of the page, or you provide a menu or a table of contents.
Guideline 9: Input Modalities
All functions of a website’s content can be accessed by inputs besides a keyboard, such as a mouse, touch screen, and/or speech to text. For example, can a user use the entire site with only a mouse, on a tablet, or on a smart TV web browser?
Principle 3 — Understandable. Your web content is created and displayed in such a way that it’s easy to understand.
Guideline 10: Readable
Should make text content readable and understandable. For example, avoid jargon or idioms, and provide a way to identify definitions of abbreviations.
Guideline 11: Predictable
Should make web pages appear and operate in predictable ways. For example, your website’s navigation remains the same (or nearly the same) on all pages, the location and links don’t change.
Guideline 12: Input Assistance
Should help users avoid and correct mistakes in forms and other input fields. For example, provide instructions or labels for input fields, and suggest corrections if the error content is known.
Principle 4 — Robust. Your web content is structured in a way so that it works with assistive technologies.
Guideline 13: Compatible
Should make content compatible with current and future assistive technologies. For example, using proper semantic HTML or having your web content tested — ideally by people who are disabled.
How can I make sure these things work on my website?
There are many content management systems (CMS) already built into a portion of website building and hosting functionality that is WCAG compliant, but unfortunately, most fall short. Themes for website building and hosting platforms such as Squarespace, Shopify, and Wordpress aren’t required to be WCAG compliant.
This means that self-built websites can allow users, like your small business, to select their own type fonts, colors, animations, and other elements — with accessibility ultimately being subject to the individual user’s knowledge.
There is hope for mindful small brands! Each website building and hosting or CMS platform has resources available about accessibility — Shopify and Shopify Accessibility App, Squarespace, Wordpress.com, and Wordpress.org. If you decide to use any of these platforms for your website and CMS needs as a small business, please use their provided resources to best work within the given platform’s abilities.
W3C also provides a guide that can help you start assessing your website for accessibility.
Simply meeting accessibility guidelines isn’t enough
WCAG 2.1 compliance creates a baseline for web content to be functional. The goal is to make your website content reliable, usable, functional, and enjoyable for all users. Below are more resources VVITCH recommends you read or watch as well:
Need help? Unsure how you can effectively apply the above steps with your business? Hire us! VVITCH can be a trusted partner for your small business. Learn more about the web design and build services we offer by contacting our team.
Jen Siomacco - Founder and UX Designer
Jen has worked in technology, marketing, and publishing for ten years. After years as a CX/UX designer in the corporate world, Jen put her skills to work as one of the owners of Catalyst Wedding Co.
After seeing both the corporate and entrepreneurial world, Jen is committed to helping feminist small businesses grow into revolutionary brands.
Shannon Mackenzie - Web Content Manager
Shannon is an artist and activist who has worked in marketing and public relations for small businesses and nonprofits across the US since 2015. She is passionate about the ways a great SEO strategy makes web content more accessible.
Brittinee Phillips - Copywriter
Brittinee has worked in marketing for a little over ten years. She has a passion and talent for storytelling. Brittinee's philosophy is that storytelling is the most integral part of the consumer and product experience, which is why she makes it a focal point in her approach to product and brand messaging.
