Digital Masters - Growing Your Web Dev Business

How Focusing on Digital Accessibility Improves SEO and UX

November 24, 2021 Marisa VanSkiver, Captain Coder Season 1 Episode 30
Digital Masters - Growing Your Web Dev Business
How Focusing on Digital Accessibility Improves SEO and UX
Show Notes Transcript

I believe so strongly in building websites following digital accessibility best practices that I literally made it the second episode of this podcast.

But I taught digital accessibility to my MBA students just a couple of weeks ago, and I noticed some common misconceptions around the concept itself and why it's important.

I also noticed that most of my students cared less about building an inclusive website and more about what building a website that way could do for them.

That's not terribly surprising is it? After all, don't most of us just care mostly about what something can do for us?

Sadly, the answer to that is yes.

As we enter the final month of the year, I thought it was a good time to cover this again and talk about what Digital Accessibility does for you and the businesses you help. After all, when you're following best practices for accessibility online, you're doing a ton to improve your overall UX and on-page SEO, too.

It's worth the time investment, I promise.

Mentioned Resources:

I believe so strongly in building websites following digital accessibility best practices that I literally made it the second episode of this podcast.

But I taught digital accessibility to my MBA students just a couple of weeks ago, and I noticed some common misconceptions around the concept itself and why it's important.

I also noticed that most of my students cared less about building an inclusive website and more about what building a website that way could do for them.

That's not terribly surprising is it? After all, don't most of us just care mostly about what something can do for us?

Sadly, the answer to that is yes.

As we enter the final month of the year, I thought it was a good time to cover this again and talk about what Digital Accessibility does for you and the businesses you help. After all, when you're following best practices for accessibility online, you're doing a ton to improve your overall UX and on-page SEO, too.

It's worth the time investment, I promise.

This is a longer episode, so let's dig in.

What is Digital Accessibility

Let's take a quick step back. What is digital accessibility? Let's define that.

I have some students who mistakenly believe that it's about making a website useable across any device. That's not totally untrue, but that's not the definition.

Digital accessibility is designing websites and other digital media in such a way that individuals with disabilities or sensory impairments can successfully use them.

That's it. It's really that simple.

Accessibility in the real world is all about making an environment and product useable by everyone. The most common example many of us might think of includes wheelchair ramps as an alternative to a flight of stairs.

Digital accessibility is that same concept, just applied to the digital world. Web accessibility applies specifically to a website, but I like to talk about digital accessibility as a whole because it's the broader, more popular term.

Digital Accessibility Examples

There's a lot that go into making something digital accessible, but a few examples are:

  • Making a website parseable by screen readers for someone with visual impairments
  • Closed-captioned videos for individuals with hearing impairments
  • Including “alt text” on images for individuals with visual impairments
  • Ensuring font colors and background colors have a high enough contrast for those with color blindness
  • Making a website navigable by keyboard for users who may not be able to operate a mouse (i.e., navigating using the “Tab” on a keyboard)

While these are just a few examples, you can get the full list from the global standard - Web Content Accessibility Guidelines 2.1 (WCAG).

Digital Accessibility in Practice

I want to tell you just a quick story. I started really focusing on Digital Accessibility back in 2013. I'd just starting working for the Scottish Government publisher and my job was to, in part, take printed documents and PDFs and turn them into fully accessible HTML. It was often glorified data entry, but it taught me a ton about digital accessibility standards and made me an advocate for accessibility as a whole.

Why?

After all, for the Scottish Government we weren't so worried about SEO or User Experience. We were worried that these studies, publications, and documents were useable by anyone, no matter their abilities.

Every time we created a website for the government, we ran the chosen color scheme through an accessibility checker to ensure that the contrast was high enough for someone even with severe color blindness to still be able to read.

Before I really got to delve into my job, they had me browse the internet through a screen reader that someone with visual impairments would use. That was eye opening, because if you do have vision issues you have an entirely different experience with the internet and you tend to lose out on so many of the details that the rest of us take for granted.

While yes, we were largely taking boring government documents (things like environmental impact reports and marine life studies) and turning those into accessible HTML, it was still amazing the care the Scottish Government insisted we took to make sure everyone could access those documents.

If you're at all familiar with recent Scottish politics, you know that they had a vote in 2014 for independence. I got to be part of the team that took the 700 page, pro-Independence document and turn that into an eBook and accessible HTML. It took a team of 3 of us working round the clock for a couple of days to beast it out, but it also meant that literally everyone in the country was able to access the document. That was a huge benefit to the Independence movement, even if they did lose 45% to 55% on the day of the vote.

As you can imagine, our work won awards each year for how accessible it was. But more importantly, I learned the value of being 100% inclusive with the websites and digital content I created.

How Digital Accessibility Affects Your SEO & UX

Now that I've gotten through the ethical and moral reasons you should care about digital accessibility, let's talk about how it affects your on-page SEO. Yes yes, we're diving in to the selfish reasons, but honestly that's OK. Hey, I get that if you have to convince a client to pay more to have an accessible website that you've got to showcase the selfish reason after all.

I'm going to break down some specific examples for you that fit not only into digital accessibility best practices but also on-page SEO standards and User Experience best practices..

Meaningful Page Titles

Using a meta title, or <title> tag, with something that's descriptive of what's on the actual page not only gives your users a quick way to understand what tab they have open, it also tells Google really quickly what the page is about.

For accessibility though? That page title is actually read out loud by a screen reader. You want to avoid simple titles like "Home" or "Profile" and instead give something that's actually descriptive of what's on the page.

This will provide better information to those browsing your site with a screen reader, but it will also help Google understand what your page is actually about.

Using H tags Correctly

Using the H tags - H1 down to H6 - correctly allows your browsers to quickly scan your content. Your largest headline should be the H1 and you should only include one on each page. That's the main heading and the main topic for the page.

Then, each section should be introduced with an H2 and subsequent subsections with H3, H4, etc. If you skip heading levels or don't use them the right way, a screen reader can think it's missed content.

In the case of your SEO, proper headings improve your User Experience because it makes your content easier to read. Since Google cares about UX and it now affects rankings, well, this one is an easy no-brainer.

Descriptive Links

It's long been known that using internal links within your website boosts your SEO. But being descriptive in the text that you're actually linking is helpful to not only user experience, but also accessibility and SEO.

How? Well, when you use simple link text like "Click here" and "Read More," you're not giving any information or context for the link. A screen reader user, especially, might be navigating the links within a website quickly, but can't figure out where to go because all of the link text is the same. Plus, descriptive links are required to meet WCAG standards.

But when you're using good link text (like I did above with Google cares about UX), it helps Google to understand what that target page or website is all about.

Moz recommends that link text should be succinct and relevant to the target page, again, because it tells search engines and users exactly what to expect when they click that link.

Want to know if your links are clear enough? Check out this list of generic link text that fails.

Alternative Text Tags

Basically, if you don't add a proper ALT tag to your images on your website, people with visual impairments have no way to access that content.

ALT tags or ALT attributes are super easy to add to image; most website builder programs like WordPress and SquareSpace give you a way to add those easily to your images.

Remember that Google cannot view your images either. The only way they know what's in the images you include on your websites is if you use an ALT tag.

For ALT tags, you just need to add a description of what is actually in the image. Not just keyword stuffed, but an actual description. However, if you're able to include your target keywords or keyphrases naturally, ALT tags can be great for your SEO.

Transcripts and Captions

If you've ever been to this actual website to catch my podcast, you've probably noticed that the podcast and the blog post itself are pretty much word for word the same.

That's because I start with the blog post and turn that into my podcast script, which in turn makes my blog a transcript of my podcast.

I understand that not everyone can listen to my podcast, but I also want to reach those who can't with the same content.

I also understand that when I visit other podcast websites and blogs I get annoyed when the blog doesn't give me everything that's in the podcast. What if I just want to scan and find a part I liked? What if I wanted to quote part of that podcast? I don't necessarily want to scroll back through and find the relevant part on Spotify; that's annoying.

Providing a full transcript of my podcast gives all of my listeners and followers the ability to interact with my content in a variety of ways.

Transcribing Video Content

The same is true if you use video content on your website, too. If you just have the audio, you're excluding a large portion of your potential audience and you're missing out on the SEO benefits that content could provide you.

Instead, look at adding closed captioning to your videos (at the very least) and explore including a full transcript for your videos on your website, too.

I built an online course for a Chicago-based food entrepreneur incubator. With those courses, we ensured all the videos not only had Closed Captioning on the videos, but also included transcripts that could be expanded below the video. It just gave their students a variety of ways to get the content in the way that they chose.

If you want a super simple way to create transcripts and time closed caption files - called SRT - just head to Rev.com.

Make Your Content Readable

OK, so I definitely struggle with parts of this myself, but readability is all about making your content easy to read. Avoiding technical jargon, difficult language, and shorter sentence structures helps to improve user experience, SEO, and accessibility.

With accessibility, remember that not everyone has the same reading level. Not only that, but many people have reading challenges like dyslexia or English is their second language.

Keep content simple, short, and clear and to the point. It opens up your content so that more people can understand and access it. This in turn makes content more enjoyable and easy to read for everyone.

When you focus on readability, it improves your user experience, which, like we said, positively affects your SEO. Plus, content that is easy to read will keep your browsers on your website longer, digging further into your projects.

Keeping Navigation Consistent

Honestly, this is just a best practice for building a website for a number of reasons. But using consistent navigation makes your website easy to navigate for all visitors.

When your navigation is in the same place on your website, no matter the page they're on, your users with cognitive differences and visual impairments will be able to predict where they can find it.

Plus, consistent navigation is an accessibility requirement to be WCAG compliant, so there's that.

It also helps to improve your user experience and your SEO by helping website visitors navigate more easily over all. It signals to Google and other search engines that your users are finding the answers to their questions in your content.

Using Semantic HTML

Now, this is going to dig into the technical, web developer portion. But if you're using <div> throughout your content, you're doing it wrong.

Container elements like <div> and <span> are meant for layout only. They're meaningless and don't tell a search engine anything about the content inside. More than that though, they don't provide any keyboard or touch support.

HTML Elements to Structure Every Page

Instead, you want to utilize the HTML elements that actually tell the browser, the screen reader, and Google what the purpose of your content is.

Those elements include:

  • header
  • nav
  • main
  • article
  • button
  • aside
  • footer

When you use semantic HTML tags, it allows assistive technology to more easily navigate throughout your website. While of course most users aren't going to "see" what tags you're using (so it doesn't affect your UX), Google does. Google uses that structure to break down your page's content and assign value.

SEO & UX Best Practices Align with Digital Accessibility

This entire episode has really just been a lot of ways to demonstrate that best practices for SEO and User Experience really just aligns with digital accessibility best practices.

You'll see a lot of people argue for you to follow good web accessibility standards to avoid lawsuits (which is a real threat), but it's more about providing the best possible experience for your target audiences.

After all, marketing is all about the targeted user. It's not about the brand and what you like. It's about what they like.

Adding Value for Your Clients

When you're following web accessibility best practices in the websites you're building, you're adding an incredible amount of value for your clients.

You're protecting their businesses from being targeted for ADA lawsuits. You're building for SEO and best user experience. And you're also ensuring they're capturing their entire target audience without excluding anyone.

When you focus on digital accessibility best practices, you're adding enough value to your clients' websites that you're able to raise your prices for those websites.

Want to charge more? Dig into WCAG standards and make sure you communicate how well it works for their SEO and UX. They'll be sold!