Videos

How to Make Your Website Accessible to Everyone with accessiBe

Why Web Accessibility is important

Did you know that 20 to 25% of the population has a disability? Why should you care?

Well, that could be 25% of the population who cannot access your website, cannot find your products, services, or whatever information you're sharing online.

So in today's video, I want to show you a tool so that you can help others get the information and get the products and services that they're seeking.

Hello everyone, Scott Friesen here at Simpletivity, helping you to get more done and enjoy less stress.

And in today's video, we're looking at helping others to get more done, people who are looking for your products, your services, or your information online, and giving them the ability to access that information.

Regardless if they have a visual impairment, maybe motor skills, or cognitive disabilities, or maybe just something as simple as poor eyesight, how can they access your information easily, without you having to do a lot of work?

Now, I think there are two key reasons why it's important for us to talk about web accessibility.

Number one, if your website is not ADA and WCAG compliant, you put yourself at risk of receiving lawsuits for not being accessible to other individuals.

But I think the second reason is so much more important, is so that everyone can enjoy the use of the web, including whatever it is that you have to offer.

How to know if your website is ADA & WCAG compliant

So how do you know if your website or websites are compliant? Well, a great place to go and check is Ace.accessiBe.com.

And when you get here, you can just enter in the name of any website, but probably your own, 'cause that's where you're most curious, and select get the results.

What accessiBe will do is a quick check of your website and evaluate it through the industry standards.

And in a matter of seconds, what it will spit out is a short report telling you if you are compliant or if you are not.

As we can see here on the website that I ran through the checker, it is not currently compliant.

And I can go through this report and see the different areas in which it is not accessible to those with a variety of disabilities.

How to make your website compliant with accessiBe

So what do you do if your website is not compliant? Well, it's not always an easy fix.

The thing is, you can't just change your font or use web-safe colors and instantly make it accessible to everyone.

There are simply too many and various disabilities. You have to make certain changes for their needs.

So instead, you can use a tool like accessiBe. Let me show you how it works.

Once you sign up and install accessiBe on your website, you will have the option to have this icon appear on your web pages.

By having this appear, your users can click it and now start to adjust your content, adjust the way that your website's information is displayed, so that they can more easily digest and find the information that they are looking for.

And accessiBe makes it really easy because it has a number of profiles ready-set, depending on that user's disability, to change your website.

But just before I show you how accessiBe is going to change your website for the better, let's take a look at a few things that we sometimes don't think about, in terms of the challenges that many users experience.

On this sample webpage, for example, we have a carousel that is rapidly moving here.

We've got a GIF image, which can be difficult for some people. It may even trigger a seizure for those who suffer from epilepsy.

We've got a number of bright colors, and the font is maybe not the easiest to read.

How accessiBe makes web content accessible

How could someone with a disability safely navigate and find the information that they are looking for? Well, by clicking on accessiBe, I can make a few changes.

So, let's start with the first one: Seizure Safe Profile. Immediately, you can see that the colors have been dialed back a little bit.

It's not exactly black and white, but it's a lot easier on the eyes. This GIF image, for example, has stopped moving, and the carousel has as well.

Again, the content is still there. It's all still clickable, it's all still accessible, but much easier and much safer for someone who suffers from epilepsy.

The second one down is the Visually Impaired Profile. So, by selecting this one, you can see that now the colors are much more distinct.

And I'm sure you saw that the text, the font itself, not only became a lot larger but became much easier to read.

As I scan down through this webpage now, there's a much sharper contrast between the images, and the text is that much easier for me to read.

How do website visitors know about accessiBe

Now, I'm sure some of you may be asking, how does someone with a disability identify that this is a button that is for them and it's gonna help them navigate your website?

Well, this symbol that you see here has become a universal symbol for web accessibility.

For those who use a screen reader, or those who perhaps need to navigate by keyboard alone, are used to and becoming more accustomed to finding this on the web.

So if you have this on your website, there's a good chance that they're going to find it immediately because it never goes away.

It's gonna be floating in either the bottom left or right-hand corner.

But for someone who is blind or visually impaired and needs a screen reader, no problem, by having accessiBe installed on your website, the screen reader will alert the visitor that this is an additional option to make their navigation so much easier.

Let's take a look at a quick example. So when I first visit this website with my screen reader.

  • [Computer voice] Press alt plus one for screen reader mode. Stop this message with alt plus zero.

It's letting me know there's some enhanced functionality, just for me. If I press alt plus one.

  • [Computer voice] Screen reader mode is on. Alt plus zero to cancel, button, heading three, a good looking, comfortable, traditional collection. Heading three, list item. Woman in gray denim jeans. Woman in black tank top with black tattoo on arm. List item.

What accessiBe is doing is enhancing my picture tags, my image tags, so that people who are wanting to view that information can see it.

Even if they can't view it with their own eyes, they can access it with their screen reader with the help of accessiBe.

Custom options and accessiBe features

Now, keep in mind that even though accessiBe has these six different profiles at the beginning of its menu, if you scroll down, you've got so much more available to you.

So, for example, a user could simply click the readable font and just change the text, the font on the page here.

Maybe you want to be able to align all the text on the page to the right-hand side so that's easier for the way that you like to read.

If we go down a little bit further, we can choose a higher contrast, which if I close this down for a second, here you can see, it's a much higher contrast between the lights and the darks.

And for those who may suffer from color blindness, again, color blindness is different for different color blind people.

So what is the proper text color, depending on your color blindness?

Now, as we continue down the accessiBe interface, we come to orientation adjustments, and again the user can tweak this and make adjustments depending on their needs.

Here's one, for example, is hide images. So if you just want to be able to focus in on the text and not be distracted by videos, GIFs, and other images, you can turn that off as well.

There's also the option to increase the size of your cursor. Maybe I want a big black cursor, which is going to help me navigate and follow along where I am and make sure I know what I'm clicking on and where it is.

Another feature that I find most helpful is where are the actual links? So here, under content adjustments, I can select highlight links.

And now this is going to tell me what is clickable and what is not.

You can see the little orange around these buttons here, I can see that there's orange around these images, I can clearly see what is clickable and what is not as I scour and browse this website.

So if you want to make sure that your website is accessible to all, be sure to check out accessiBe at accessiBe.com.

Thank you so much for watching today's video. I hope you subscribe right here to the Simpletivity Channel, and remember being productive does not need to be difficult. In fact, it's very simple.

Read More
Text Link
Presentations