The Web Guidelines You May Not Know About but Definitely Should
If you’ve never heard the words “Accessibility” and “508 Compliance” in regards to web design, you’re not alone. As a business owner, it can be quite intimidating to learn how to run every single facet of your business, especially areas like finances (ugh) and design (fun, but quite a learning curve!). Now add on U.S. laws and codes your website must comply with, and things can get overwhelming… fast. (And don’t even get me started on all this GDPR stuff…) But seriously, follow after me…. Breathe in, now breathe out, and repeat as necessary.
That’s why we’re here! We’ve got your back. And we hope that by the end of this blog post, you feel as informed as possible about these extremely important aspects that should be implemented into your website design.
What Is Accessibility?
Simply put, accessibility is making sure that your website or app works for the physically disabled, whether they’re blind, a paraplegic, an amputee, or they have some other physical impairment that makes it difficult or impossible for them to use a keyboard or mouse in the usual way.
What Is 508 Compliance?
Section 508 of the U.S. Code is the law that enforces website accessibility. A good summary of this law is: “the use of text labels or descriptors for graphics and certain format elements. (HTML code already provides an “Alt Text” tag for graphics which can serve as a verbal descriptor for graphics). This section also addresses the usability of multimedia presentations, image maps, style sheets, scripting languages, applets and plug-ins, and electronic forms.”
If you have absolutely no idea what that last paragraph said and you’re thinking, “That’s all greek to me.” It’s okay. While all federal government departments and agencies—as well as any organization receiving federal funding—are required to have websites that are 508 compliant, not every business is required to be completely 508 compliant. (Whew!)
Why You Should Care
Even if your business isn’t *technically* required to be 508 compliant, we think you should still care deeply about your site’s accessibility for a few reasons. First, as we’ve already mentioned, it’s a good business practice to make yourself available to as many people as possible. It’s also good to show kindness and inclusivity to those with disabilities. Finally, just as a worst case scenario, you could get a fine from the government if you’re a business or organization that’s required to be 508 compliant. If you’re not in that category, there could still potentially be a lawsuit from web visitors with disabilities involved, as we’ve seen in the past with big companies like Target not having an accessible site.
Tim Berners Lee, the inventor of the World Wide Web, actually said, “The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.”
Think about it this way: almost all businesses, stores, and public venues have wheelchair access by ramps. This is mostly because they are required to, but it’s also because as a society we highly value equality and inclusiveness. Not to mention, it’s just plain bad business not to be accessible and get as many potential customers as possible.
So if brick and mortar businesses are placing high value on this, why are there so many websites with content that those with disabilities have trouble accessing? Unfortunately, there is still a chasm between people without and people with disabilities online, because of a lack of awareness about accessible online content. It’s like there are proverbial stairs and curbs in the way of disabled people accessing websites that others may visit often and even take for granted.
Maybe you didn’t realize that, because it’s not something you or anyone close to you has dealt with. No worries. We’ve all been there!
Think about it this way: have you ever been frustrated when your internet was EXTRA slow one day? Or if a site malfunctioned when you really needed it to work? Or even if the site had really bad user flow? Of course you haven’t. You’re an angel. ???? But for the rest of us, frustration often leads to a negative view of a brand, and that leads to bad business.
Take it from the famous Elle Woods, “Exercise leads to endorphins, and endorphins make you happy, and happy people just don’t kill their husbands. They just don’t!”
How does this apply to you? We thought it was obvious! Happy webpage visitors return more often and buy more, and happy customers don’t kill a business. They just don’t!
Here are some of the most important aspects of accessibility that we think you should consider for your own website.
1. Color Contrast
Guideline 1.4.3 – Contrast (Minimum) – “The visual presentation of text and images of text has a contrast ratio of at least 4.5:1”
The first is the color contrast between text and background, because those who are colorblind will have a hard time determining different colors. Your text must have a contrast ratio of at least 4.5:1. Here’s a really useful tool for figuring out your contrast ratio. So, thin light text and a light background would make the content hard to read for certain people. You may have to adjust your colors ever so slightly (or majorly), and maybe add a dark overlay and/or a drop shadow here and there when putting text over an image to achieve this. It’s okay, drop shadows are totally “in” right now!
2. Color As The Only Indicator
Guideline 1.4.1 – Use of Color – Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.
Unless you’re a designer, you’ve probably never thought about how using color to indicate important information or to direct users to take action could be an issue. If color is the only indicator, those with colorblindness will never get the cue. For example, if a product or a service time is unavailable, don’t just make it in a red font, while making available times green. Yes, the red and green fonts would be an obvious indicator to users without vision impairments; however, someone who is colorblind wouldn’t be able to see the difference. A quick fix is simply adding an icon or some other text indicator of products or times that aren’t available. Easy peasy!
3. Flashing Lights (& Words)
Guideline 2.3 Seizures: Do not design content in a way that is known to cause seizures.
Guideline 1.2 Time-based Media: Provide alternatives for time-based media.
Guideline 2.2 Enough Time: Provide users enough time to read and use content.
One of the more well known design elements that affects accessibility is flashy and bright images that can cause epileptic episodes. It’s best to consider that when choosing design elements. Another thing is fades. They. Look. Awesome. But users with dyslexia, ADHD, short term memory problems, or cognitive delays that affect reading comprehension might find it hard to read headlines that fade out. Even if you think the fade is slow enough, it may not be to some people. Since “enough time” is very vague and impossible to calculate, a creative solution could be to include a control that allows users to stop and start the animation so they can read at their own pace.
4. ALT Text
Alt text is a good way to make your website more accessible. It was originally intended to serve as a placeholder for graphics that didn’t load properly, but it eventually caught on as a way for screen-reading software to pick up descriptive labels so blind people could have a description of website images. It’s best practice to provide descriptive text for every image on your website by using alt text. In HTML, you can provide alternative text for images by adding alt=”your description of the image” within the image tag.
5. Specific Link Titles
People with vision impairment often use screen readers to visit websites. If they know where they want to go within the site, it’s pretty common for them to quickly tab from link to link, skipping over explanatory body text, just like we all do. So, “Click Here” is way too vague for a link title because it gives them no indication where they’re headed. Instead of “Click Here,” use a description of the page they’ll visit such as, “Call Us Today!” or “Register Now.”
It’s also important that you try to avoid using images for links, which are hard for people with low vision to no vision to interpret. If you absolutely want to use an image as a link for aesthetics, you should definitely provide alt text to tell disabled users where they’re going.
To sum it up, accessibility matters. A lot. And it’s in your best interest as a business owner—and in the best interest of your clients and potential clients—for you to have a more accessible website. One serious misconception about accessibility is that it always compromises aesthetics. There isn’t anything about being accessible that necessarily makes a design look ugly. Anything that you can do with web standards and other best practices can be done in an accessible way, so don’t fear, you still have plenty of room for creativity and excellence in your design! Excellence + inclusion = ❤️