Episode 263 What Accessibility Means For Your Website

---

Show Summary

Rob Cairns talks to Amber Hinds about accessibility for your WordPress Website.

Some Quick Notes:

1. Why accessibility matters.
2. In many cases it is the law.
3. How to make your website accessible.
4. Many disabilities are not physically obvious.

---

Show Notes

Hey, everybody.

Rob Cairns here today.

My guest on the SDM show is Amber Hinds.

How are you today, Amber?

I’m doing well, Rob.

Thanks for having me.

Oh, such a pleasure.

Before we jump into what I really want to talk about, and that’s accessibility, I always like to ask what’s your WordPress origin story?

How did you get into WordPress and how did that come about?

Yeah, so I got into it as a Blogger initially.

I I mean, way back in the day I had a Xanga blog.

Do you remember?

Those and then when my oldest daughter.

When I was pregnant with my oldest daughter, we lived across the country from all of our family in New York.

By ourselves and I was like, how can I tell people what’s going on in our life?

And so.

For about 5 minutes I think I played around with, I don’t know if it was like weibley or wigs or like one of those firsts kind of drag and drop things and I was like, oh, this doesn’t work.

So then I went to wordpress.com and I was on wordpress.com for about nine months before I got tired.

Of the limitations on how I could edit my theme and what themes I could choose ’cause, it’s the early days of wordpress.com and so I went self-hosted pretty quickly from there and.

And it eventually became a business where I realized at one point in time that I could charge people when they asked me questions about how to make their website better and for helping them with their websites.

And then it eventually grew to I have a team.

Yeah it it’s amazing.

Many of us got in by blogging back in the in the day and you know my my story is pretty similar.

I act I started funny enough within HTML website because I got fed up with answering family tech questions so used to.

Post responses online actually.

And and then it morphed into a blog and turned into a business, and you know, I’m inside.

Yeah, so you could just say grandma, go read this post from two months ago and you’ll get the same answer I gave you.

Yeah, well, like.

Yesterday and the week before and the week before and the week before, right, so.

Yeah, that’s funny.

Uhm, so you are what I consider an accessibility expert.

Uhm, how do you think about working in accessibility?

That’s a tough Arianiti to get.

So I knew nothing about accessibility and in 2016 my team got hired to work on a website for department at Colorado State University and.

It was a little bit I I jokingly call it trial by fire.

’cause all university websites in the United States are required to be accessible to at least Wick AG 2.0 AA standards, and the university was just getting into place around the time when we started doing work uh a process for doing like formal accessibility reviews and audits before new websites.

Right.

It launched, so we got to go through that process as one of their first Guinea pigs on that, as one of the first outside developers that they had worked with also.

And so that really was when I first realized what it was and and of course then it was a lot more kind of reactive excess.

But over time we realized, you know, we liked working with the government and the higher Ed clients and the larger businesses.

And so accessibility just became part of our standard process.

And at one point I said, you know, we really need to bring users in, especially on some of these government websites because we’re saying that.

They’re accessible, but how do we really know beyond you know what we’ve been learning and reading about and studying and the web content accessibility guidelines and so?

We hired 2 students from Texas School for the Blind and Visually Impaired to test website.

And give us feedback and now it was just eye opening for me and that was in.

Well, it was right. It was towards the end of 2019, beginning of 2020 and it really.

I think seeing people navigate websites on screenreaders just really opened my eyes even more.

And and so that for me, I was just like, OK, this is it, this is what I want to focus on and this is how I feel like I can make a big impact on the world.

And that was sort of what got us into accessibility.

Yeah, it’s a it’s a big problem I was sharing with you before we went to record.

I did some work with a nonprofit for about seven months.

I actually ran all their e-mail stuff out of active campaign and trying to make.

Emails accessible and they were.

Being a nonprofit, they fall into accessibility guidelines in Ontario and they were in the process of bringing all their websites at the time up to accessibility to meet government criteria and legal reasons and things like that.

And people don’t realize it’s more than just.

Playing around with.

The tags are playing around with the colors.

There’s a whole big process to accessibility.

Yeah, yeah.

I mean, the thing that’s interesting and it’s a large learning curve.

Uhm, because it’s not really just.

During your testing and debug phase, let’s say that you make things accessible.

There’s a lot of talk in the accessibility community of shifting left and trying to move accessibility as early into the process.

So even when we’re designing, we’re doing accessibility audits of our designs before it’s even being built out into code.

You know, or our content, I mean, we start training our clients on accessibility.

Subversively during our discovery phase and they send us inspiration.

Websites will sometimes you know, be like, oh, this is nice, except for XYZ to help them.

Like start to see.

Accessibility problems because I think they don’t really see it.

So it is it is definitely a process, but I think once you get into it and you build the routine and some things, once you’ve built that in and you just know color contrast or you you just know our our links can never just say learn more.

Then you build that habit in whether it’s in content or design, or whether it’s in code, and then I think it goes a little bit faster.

Yeah, now let’s jump into color since you mentioned it.

Are there certain types of colors or colors contrasts that work really well versus some that don’t work well?

I mean, there’s discussion that lighter colors are better.

Is that true?

And where does that kind of fall?

So there is no inaccessible color.

Any individual color can be used, and you don’t have to be limited by accessibility guidelines in your color selection.

What you are limited by is in your color combinations.

There’s two different levels of color contrast ratios, so there’s actually a mathematical formula.

That calculates the difference in luminosity and shade between.

Two different colors, and there’s the AA, which for a lot of people is considered the standard, and then AAA has a higher contrast ratio where they’re further apart.

We try as much as possible on color contrast to sit in the AAA land, but sometimes we end up with AA just because they want. There needs to be more options, but it’s really about making sure that the background.

And is sufficiently different from the foreground, and so you know you can use orange for example on a button, but you need to put.

Dark blue or black text on it, not white text, those sorts of things.

So it’s not that, like some people say, orange is an inaccessible color, and that’s not the case.

It’s just you have to be, you know?

Thoughtful about how you use.

Certain colors.

Yeah, and I think that’s the case too.

And you know, along with color goes fonts and uh.

I would think a little bigger font would be better, but.

That said, I think many web designers use fonts that are too small to start with, even for non accessible reasons.

Like, like who? Who?

Puts out a website in a 12 point font anymore like it’s just.

I’d say I’m typically cited.

I mean, I wear glasses or contacts depending upon the day.

I’m I’m still in my 30s, I’m getting closer to that 40 point Mark.

But like, I sometimes encounter websites when I’m just like, I cannot read this, the text is too small.

I’m there.

So I think yeah, font science comes into play.

When it comes to fonts.

And I’ve only you know, I’ve read about some studies that are really fascinating.

If you really like, do some research on like font accessibility.

Carrie Fisher is someone who’s done a lot of research on that, and she actually gave a talk for our word press accessibility.

Meet up on it.

But like there’s a lot you can get into with the kerning or the spacing between letters.

Obviously you don’t want them to be too tight.

It’s also helpful if it’s consistent, so some in some fonts the spacing between letters changes based upon what letter it is, or the width of letters is like drastically different in some situations.

Also having whether it’s serif or San Serif.

But one of the things that is really helpful is making sure that your letters are distinctive from one another.

So for example, you don’t want your.

B&D, to be exact, mirrors of one another, because that could be hard for someone with dyslexia, whose mind might flip the letter as they’re coming across it. You want them to have subtle differences, like maybe in the height of the tail.

That goes up or I guess it’s not tail.

If it goes.

Up, or rather, maybe it has like a slight serif, or the rounding is slightly different on the curve.

Another really common one is making sure that your.

Uppercase I, your lowercase L and your number one look different from one another.

They shouldn’t all just be a straight line, because that can make it more challenging for people to read.

So there’s a whole bunch of like the art of fonts that I think is really cool if people are interested that they could get into on what makes fonts easier.

For people to.

Yeah, and and and as people get older, I mean I’ve got a mum who’s 77 and you know, she’s constantly saying to me this website is small and I said, yeah, it’s small and I’m younger and and I’m forever doing the old control plus to increase the size of the website because.

Somebody didn’t take that into effect and that that’s an interesting conversation there.

Uhm yeah.

And that’s, you know, I might add on that real quick, something that is also really important with accessibility is that it’s mobile responsive.

Like a lot of people don’t realize, mobile responsive actually goes hand in hand with accessibility.

A lot because.

If someone is increasing the size of the font, which for people with low vision they may be increasing the website to 200%.

More and and they might always engage with the web in that way, and so you want to make sure that when that’s done that the text.

You haven’t added anything in the code that would stop the font from resizing, but it can just normally resize as someone zooms in on their browser.

And also it has to reflow well so you know it needs to wrap and not go off screen.

Or get cut off.

Uhm, and of course your mobile menu then has to work on a desktop because a lot of times when you zoom in 200% you get the mobile menu instead of the desktop menu.

So true.

That’s a really good point.

And then the other thing we like to think about and I I know I do a lot of newsletter stuff.

I personally prefer to put buttons on stuff.

Uhm, if somebody is gonna read more link to an article, I personally don’t like to.

Uh, just highlight Doink and put the hyperlink in ’cause?

I think from an accessibility point of view, if somebody got a vision problem, it’s really harder to see than a button where they could just push to have.

Any thoughts on that?

So it is an interesting conversation, because I think what you’re saying actually isn’t that you put a button in, it’s just that you put a link in and you style it to look like a button.

Is that right?

Rather than using an HTML button tag?

Yeah, that’s correct.

That’s that’s correct.

Yeah, uh, so I do think that so tap size.

Can come into play, especially on mobile devices, and it can be really helpful when links are styled like buttons on that sense because it can make the area that someone can tap on larger.

There’s also this whole conversation about is this confusing for people because the functionality of a button?

Is different than the functionality of a link, but I think at this point it’s so ubiquitous that we style links like buttons when we’re making them more like a CTA or to like attract attention to.

To them that I feel like most people are sort of used to that at this point in time.

But I do think, you know, that can be helpful, whether it’s to attract attention or to give people a larger area that they could click or tap on if they’re on a mobile device, definitely.

And then the other thing that people always forget about and you know we see it again and again when I look at sites even from an SCO perspective, but it matters for accessibility is image tax.

I can’t tell you the number of websites that look at that.

People just refuse to put image tags into the website and that is a big problem.

Yeah yeah, I mean having alternative text is really important for people who can’t see so they know what the image about or if something is wrong and the image doesn’t load.

A sighted person would see that as well, and as you mentioned, it’s super great for SEO.

I feel like Alt text is one of those like low hanging fruits.

It should be.

Easy to do and even in social media now.

UM, Twitter has done a great job.

I feel like of making it easy to add alt text and they even flags.

It it’s almost like the the Hall of shame on tweets, because you can see who’s putting in the effort to putting in all text and who is just like, not bothering because they have a visible labor.

And I’m awful.

A label of alt.

On the image and so everyone can see if it’s there or not.

Yep, yeah, and I’m awful.

And I have been.

So there you go.

That’s actually a recent change like in the last month pretty well I think it’s.

Making it visible, yeah, I think, but I think it’s important and I think that’s something like that sort of visibility because some people might be like, well, what is this?

I don’t know what this is, right?

If they aren’t a web developer, they haven’t.

Heard of accessibility before?

Just the average user.

And so the fact that they made it really visible that there is alt text and allow anyone to click on it and read that alt text, whether or not they’re using a screen reader or and they don’t have to inspect the code, I think is really great for helping to bring awareness to the need for alt text and the need.

For people to be thoughtful in the content that they’re putting out on the web and how it impacts people with.

Yeah, it’s so true.

It’s funny and I think we have to think about as web hosts or designers, how we put content out.

So like an example is if you put out a podcast, you put out a show notes that can be read.

Do you put out content in different formats?

What people don’t realize is, first of all, we consume content differently, but when we get in accessibility, even more so.

And you know, we’re kind of focusing on.

Right now we’re we’ve been talking more about people can’t see or people can’t hear, but there’s a lot of other cognitive.

Accessibility issues that are what I call hidden illnesses that we never see and we gotta factor those into as well and and be aware that it’s not just hearing and sight that are the issues here.

Sure, yeah.

I mean a really big one that I think people don’t maybe think about as much as the blind and deaf community is people with mobility challenges.

So there are a lot.

Of sighted people who can see that use.

Some of them use screen readers because they have neurodivergent.

Some of them use screen readers because it’s easier for them to hear the text than to or to move through the page with the screen reader.

Some people use keyboard, they just use a keyboard only, or they’re using completely alternative devices like.

There’s a keyboard called the Darcy USB keyboard, which is just a couple buttons and it allows someone who has very limited mobility like they can maybe only move one finger, to use Morse code to move around and engage with the web.

So mobility is a big one.

Epilepsy is another one or people that have vestibular or inner ear disorders.

So I’ve heard I’ve heard someone speak and they were talking about how their wife was on a website and there is so much like motion moving in and parallax that she got so nauseous.

So she just, like threw up.

Right.

And and those are things that a lot of us don’t even realize.

You know, our website, if it’s coded in a certain way, could make someone feel physically ill or it could cause them to have a seizure and.

And then there’s the whole land of situational limitations or things that, as you mentioned, like hidden disabilities, so like a DD.

There are certain things in websites that can make it harder for someone with ADHD or dyslexia.

We talked about earlier the situational limitation.

A great example of that is if you’re riding on the train and you don’t have headphones and you come across a video, but you don’t want to play it and bother everyone on the train, it doesn’t have captions you’re probably just going to skip.

That video and that website owner is going to miss out or, you know, whoever put it out on social media is going to miss out on that potential person in their user base.

And that’s not a it’s a situational limitation, but it still comes into play with accessibile.

Yeah, so true.

I, I, I I really like that discussion highlighting, you know, everything.

The problem with accessibility is many.

Organisations only jump into it for legal reasons.

In Canada and certainly I think in the states for non profit your websites must be accessible.

For government they must be accessible and then other companies don’t seem to jump into it frankly until they sued or they lose a lawsuit instead of kind of doing the right thing and that’s.

You know, if your your reach is so big, maybe you should just bite the bullet and make it accessible to start with.

Yeah, I mean, I wish I could say that there that you didn’t have to motivate with the the fear of a a government fined or a lawsuit.

But we definitely see that, like statistically there’s a big deal made in Ontario at the beginning of the year because.

There was a lot.

Or maybe it was.

Now I’m spacing.

It was actually last year, I think, when the accessibility for Ontarians with Disabilities Act aoda.

OK.

Uhm had sort of.

Cliff, where they started to require websites of organizations with more than I think it’s 25 employees have to file an annual accessibility report.

They do, yeah.

And so it was interesting for us because we have an accessibility auditing tool that we saw a lot of purchases.

At that time of year from people in Ontario like it’s a huge shift in who was buying our product.

And I wish I could say that a bunch of people were just like, let’s do something great and test for accessibility problems on our website.

But in reality, I think it was.

It was motivated by the legislation and the fear of getting a fine.

But but that.

Said, like I do think there are organizations out there that, you know, maybe they have really strong diversity, equity, inclusion goals.

And so they’re thinking more broadly about how people with disabilities can be included in everything that they do, whether it’s their employees or their customers and making their website accessible as part of that.

So I do think that there are organizations that are approaching it from the more.

Like, how can we make a difference in the world?

I don’t think it’s all fear of lawsuit, but yeah, that is definitely a motivator for some people.

Yeah, there was no question the the deadline in Ontario last year was I believe was like June 15th or something, somewhere in June.

So it didn’t surprise me and I I can remember walking in the meetings.

Every day and listening to the web accessibility talk and just shaking my head saying oh boy.

Like it was.

It was just.

It’s been interesting.

I was.

I was at access U, which is an accessibility conference last week.

Someone I know pretty well from the web who focuses on accessibility.

Cam is his name.

He was down and he’s from Ontario, and I asked him, you know, if he had really noticed a difference and he was saying it’s a really great law with no.

So they haven’t.

He doesn’t think that they’re actually sending.

Out notices or doing anything, but I mean, I don’t know, maybe it’s just a matter of time for them to figure out what their process is for doing automated scans, sort of like the web, a million and and then just sending out form letters automatically to people.

I what I will tell you, Amber is from Canada as a whole in the digital space, when it comes to privacy, accessibility and a lot of other things are really more stringent than a lot of places.

So I think the time is coming, it’s just the rude awakening will hit sooner or later.

To be honest with you so.

And, you know, the privacy conversation is really interesting because one of the things you don’t really think about, maybe, I think a lot of people are familiar with different privacy legislation around the world, like GDPR, for example.

And here in the United States, there’s some really strict regulations around privacy in California.

Well, a lot of those cookie notices that pop up on websites are not keyboard accessible or there’s no focus shifted to them.

They a blind person can’t really interact with them.

So if you are asking someone to legally accept something, or a greedy, or privacy policy, or your cookie.

Policy, but they actually can’t because it’s inaccessible.

I’ve seen cases where.

Here the con quote contract with someone with a disability was thrown out because they were able to show that they actually didn’t accept it, or they had no way of fully reading it or anything like.

That and so.

That’s something, I think, that organizations that are aware of their privacy.

Requirements really have to keep in mind that accessibility and ensuring that all people can actually read your privacy documents is really important.

So true.

Uhm, so company A wants to make their website WordPress website accessible.

And they say, I forget this, I I’m just gonna go by.

Accessibility, template, and we’ve all heard this story and be done with it.

I don’t think that’s going to solve their problem, but what are your thoughts on that?

So in WordPress there are themes that have been audited by people that know a little bit about accessibility on the themes team and they follow some basic standards for best practices and accessibility and they have the accessibility ready tag in the WordPress theme repository.

No cut.

These are a great.

Starting point, but they will not ensure that your website is accessible and the main reason for that is.

The moment you add a plugin from a plugin developer who’s never tested for accessibility, or the moment you start, you know, inserting custom widgets from other.

For vendors around the web, then you’re likely to be adding accessibility problems.

Another thing as well is that a lot of problems come in in the form of the content, so users are adding them right in the content editor.

Uhm, you know, like we talked about earlier, they’re inserting an image and they’re not filling in that all text box when they really should be.

That’s true and good advice.

So yeah, so it’s not just about the theme.

The theme is can be a good starting point, but that alone will not get you an accessible website.

Is there an easy way to audit a website to see if it’s successful or not?

So there are some automated tools I mentioned earlier.

We have one.

It’s called accessibility checker.

It’s a.

It works specifically in WordPress.

So it’s a WordPress plugin.

There’s a free version on dot org and then we have a a pro version and it puts reports.

So a really great parallel is if you think about some of your favorite SEO plugins and how on your.

Poster page edit screen.

It gives you a little summary of what you’ve done right or wrong with your COR plugin.

Does similar for accessibility.

There’s also some browser extensions that are free that are really useful for doing front end scans on.

Websites, a really popular one is called wave.

IBM also has one that’s completely open source called enable access, and those are just browser plugins that you can install in your browser and test websites with.

Uhm, so those are probably the best way to get started with automated testing. What’s important to know is that automated tools, including arms, can’t catch 100% of the issues.

There are just some things that require a human being to assess it.

So, for example, we can tell you if you’re missing alternative text.

But we can’t necessarily tell you if your alternative.

Text is correct.

Act in the UM.

In the use of the image on the page is that makes sense, so a human would have to assess that.

Or keyboard focus.

So for people who kind of want to start diving into it, another great thing in addition to automated tests is going just to the front end of your website.

And using your tab key, maybe your arrow keys and your return key, and seeing if you can do everything on your website that someone on them would do with a mouse.

So can you get to every page?

Can you submit forms?

Can you add products to the cart and check out all of those things with your?

Tab Key only, and that would start to give you a feel for what the keyboard user experience is like.

Yeah, that’s some really good advice, Amber.

Thanks for having a conversation about accessibility.

I think it’s really important and people need to be aware of it, I mean.

Accessibility’s taking more of a forefront and I think it’s just kind of accepting what people are capable of doing or not capable of doing personally.

You’re just sort of wondering like.

How to know where where your limits are?

Yes, basically, yeah.

So I think, you know, I think there’s there are different schools of thought on this.

I tend to be in the camp that.

You know, don’t let perfection get in the way of progress.

So even if someone you know, maybe they don’t have a budget to hire an accessibility consultant, they’re building their own website themselves.

Like they don’t even have an external developer using some of the automated testing tools and doing that keyboard testing like I mentioned and if you really get interested in it.

You could try using a screen reader.

Uhm, there are free screen readers.

If you’re on a Mac, it has voice over.

If you’re on Windows, you can get an open source free screen reader called involved, so just doing some testing yourself.

Uh, will make a difference, and you’ll be able to use the tools and find problems now, whether or not you’ll always know how to fix them.

If you’re not a developer, you know you may be able to if it’s a content problem.

If it’s something that, uh, plug in inserted that is, uh, a developer you know requires a dev fix or code fix, then you’re in the land.

Of either reaching out to that plug in developer or you might have to find another developer to write a patch for you.

Uh, so so there is sometimes more of a limit to.

What people can do on their own on the fixing or the remediation side and and then I think if you are a developer or an agency, you have to maybe be a little bit more careful if you’re telling your clients that you can deliver an accessible website to them, but you don’t actually know what that means.

Or you’re not super experienced in it.

Especially I would say here in the States because I have seen cases where the website developer got pulled into the lawsuit and if you in your statement of work had said you would deliver an accessible website and then the client gets sued because there’s accessibility problems.

Left over on the web.

Like then you could be putting yourself at risk.

So I think, you know for individuals, get started and you know, if you can’t pull in a consultant, don’t pull in a consultant.

Just do the best you can.

But if you’re approaching it from a business standpoint, then I would be a lot more cautious about just saying I’m not going to, you know, I’m going to do everything on my own.

And I’m not going to pull in a consultant or another company to help with these aspects of it.

At least for the first few.

It’s very helpful to have someone show you how to.

Yes, have someone point out their problems to you, and once you have them, audit enough of your websites.

You’re going to start to see the pattern of what those problems are or how they’re finding those problems, and you’ll be able to do it more on your own.

Yeah, it’s so true.

If somebody wants to get ahold of you or your team to talk about accessibility, how’s the best way?

So, our website is https://equalizedigital.com/

And you can get a hold of us there.

We also have a Facebook group, WordPress accessibility on Facebook, and I’m on Twitter – https://twitter.com/heyamberhinds

And I would say that’s probably the best place to get Amber.

She seems to be there more than she would care to admit, right?

Yes, I’m active on Twitter these days.

Yeah, thanks amber.

Have an amazing day and thanks for the conversation.

Thank you for having me.

My pleasure. Bye, bye.

 

---