Submind YouTube summaries
Thumbnail for Beyond Plugins: Real Accessibility for WordPress Websites | Joseph LoPreste

Beyond Plugins: Real Accessibility for WordPress Websites | Joseph LoPreste

Watch on YouTube

Video summary

The core message of the presentation is that while WordPress plugins and overlays are useful tools, they are not a magic solution for web accessibility. Many website owners mistakenly believe that installing an accessibility plugin or adding an overlay guarantees compliance, but these measures often provide only a false sense of security. Automated testing tools can identify roughly 70% to 80% of issues, but they frequently miss critical problems such as keyboard traps, improper focus states, and context-dependent errors like missing or inaccurate alt text. True accessibility requires a manual process where developers and designers verify that users with disabilities can actually complete tasks, navigate the site using only a keyboard, and understand all dynamic content changes, such as pop-ups and modals. To build a genuinely accessible website, one must focus on the user experience and journey rather than just checking off legal boxes like ADA Title II or WCAG 2.1 standards. The speaker emphasizes that accessibility is not a static state achieved once and for all; it is an ongoing process that requires testing at every stage of development and maintenance. Common pitfalls include using headers incorrectly by making text large instead of using proper H1, H2, and H3 tags, failing to announce error messages to screen readers, and neglecting focus indicators on interactive elements. Even if a theme claims to be accessibility-ready, the final product can become inaccessible if plugins, page builders, or custom content introduce new barriers. Therefore, it is essential to test the fully assembled site with real assistive technology, such as NVDA, to ensure that the end-user's needs are met in all scenarios. Practical strategies for maintaining accessibility include setting up guardrails within the WordPress backend to guide clients when they add their own content, ensuring that block patterns and templates adhere to accessibility standards from the start. When a client insists on using an inaccessible feature, such as an unmapped Google Maps widget, developers should employ workarounds, like providing a primary method for finding directions alongside the map, rather than simply adding a CSS fix or overlay that might break further down the line. The most effective approach is to integrate accessibility into the initial design and development workflow, treating it as a fundamental requirement rather than an afterthought. This proactive stance not only reduces the risk of costly lawsuits but also saves money in the long run by preventing the need for expensive retrofits after a site has gone live or been sued. Ultimately, the responsibility for web accessibility lies with the creators and maintainers of digital content, as they have the power to make a significant difference in the lives of millions of people with disabilities. The speaker encourages professionals to educate their clients about the importance of accessibility, framing it not as an extra cost but as an essential investment that protects against legal liability and ensures inclusivity. By building accessible sites from the ground up, using tools wisely, and committing to regular manual audits, the web community can move beyond mere compliance toward a culture of genuine inclusion. As laws evolve and deadlines approach, such as those for government contracts, the industry must continue to prioritize the human element, ensuring that every digital interaction is open, usable, and respectful for all users.
Read the full video transcript
I appreciate that introduction. Uh, if you don't mind, could you follow me around everywhere I go and when I walk into a room, just introduce me? >> As long as you always have >> I got you. All right. Well, I appreciate everybody coming in today. This is a very important conversation. I want you to imagine for a moment you're WordPress. You're you're a business owner and you've got a website. More than likely, your your main focus is going to be your business. And your website is how you generate your income. You've heard about accessibility. You've had friends that have had uh runins with web accessibility. You're a good person. You want to do the right thing because you feel you have this personal responsibility. The way WordPress is set up, we think to ourselves, all right, great. we we will get a uh we'll put a plugin. So, we put a plug in there. The plugin runs at scan. It says, "Hey, we found x amount of issues. We've fixed all the issues for you. Here's your special little green check. You are good to go." You want to do a little extra. You say, "You know what? I'm not 100% sure if that's going to get me there. So, I'm going to go ahead and add an overlay." So, you go ahead and throw an overlay on there. And now you feel good. You sleep like a baby at night until you get a letter, a legal complaint, or until an individual reaches out and says, "Hey, I can't use your site." This happens all the time. Excuse me one second here. Now, accessibility affects so many people. You got 70 million plus people dealing with some sort of disability. This stat here is very important. 41% of the internet of websites run WordPress. This is why I'm so passionate about coming and talking to WordPress uh designers, developers because we can make a dent in this. Another stat is uh they ran a test on the top 1 million websites and 94% of them had way failures on on the homepage. That's a big deal. The standards that when we talk about web accessibility, that word gets thrown thrown around a lot. We're talking about ADA title two. We're talking about section 508. Um, there are laws that are in place. Uh, you know, WAG 2.1 is the base standard. WAG 2.2 is really coming down the pipeline. So, in my opinion, when I deal with clients, I always just try to push them to WAG 2.2. It's only a few extra things. Um, but the real important thing here is to understand that these laws and these standards are the floor. They are not the end goal. These are this is just the base level. This is the starting point and that that's very important to understand. One of my favorite things about WordPress, what got me into I've been doing this 10 plus years were the plugins. I didn't have to be a developer to do cool stuff. And that's kind of how WordPress is built. You're able to get a plugin. Hey, I I need a contact form. There's a plugin for that. I need uh whatever it is you need, there's a plugin for that. WordPress is very good with that. So, you've got different plugins. You got plugins that just do testing. They'll go through and they'll test some stuff. You have plugins that are made for authoring that you can put on the back end that helps your clients when they're authoring, when they're creating content. It kind of puts some guard rails there for you. Then you have uh your component plugins where your forms, your menus, all these other things. And then you've obviously got your widgets and overlays. But the key is there's no single magic bullet. There is no one plugin that can get it all done for you. We have a plugin out there and it does a lot of different things for you. So I'm not trying to naysay on plugins. There is definitely a role and a place for them. But just please understand that it's not the it's not the end all beall. It's not the start and finish. Plugins are are a tool for you to use in your toolbox. And with that said, you got accessibility. WordPress also does a really good with accessibility just internally and with their with their base. But you got to be careful because just because a theme says that this this theme is uh accessibility ready. It gives it that tag. That doesn't mean your website as long as you use that theme, your end product's going to be accessible. Because I'm sure we all know that once you get you get your theme, but then once you start adding your plugins and you start adding your page builders and and your templates and and all this other stuff, it's going to change your accessibility. It's no longer just uh your your accessibility ready theme. And it's important to understand that accessibility it's you want to test that. You want to test it during the process, but you have to test it at the end once you've merged all of your things. You've added your plugins, your themes, all all of your content. You got to still check it. And it at the end of the day, it's really about the user experience. So that's that's what's most important. And and honestly, this is what I find most the time is is a lot of people are like, "Well, I got the accessibility ready theme. I've got this plugin that says that says it's accessible, but they don't understand that really at the end of the day, it's about the user and it's about the user flow and journey. Can they accomplish a task? Can they fill out that form? Can they whatever it is they need to do, can they do that?" So, it's always important to test those things. Now, we do have a lot of plugins and and I'm sure everybody here is can probably name two or three automation tools that that you can use and that's great. I I am not saying don't use those. But what I do want to say is that understand that automation is only going to get you so far. automation, they'll tell you right out of the gate. We can only catch you make a number up 50% 70%. Some of the testing software that I use is just highend and at its best it's only going to catch 70 to 80%. And they tell you that right out of the gate. So you have to go through and add your manual process to that. One thing that automation well there's a bunch of things automation cannot find. Um things like uh it can tell whether an image has an alt text but it can't tell whether that alt text is is an actual descriptive text of that image. Uh one thing that I find on a bunch of websites is the focus is the focus state indicator. uh there's no tool that's able to find out whether you have that and another even if you do have that what the color contrast ratio of your focus state indicator is is another very important thing um we hit on it you you need to verify whether the the enduser's journey can be accomplished another big area that I see automation does not cover is uh multiple states of your website what'll happen is you'll open up your website you'll run a tool that tool tool is only checking your site in that state. It does not check it if you open up a modal or it does not check it if you change that state in any way. It it it just doesn't do it. So it it's just the base site and and that's very important because as we know websites are are say almost like living breathing things. They they they change, they grow, expand. So, it's it's very important to to make sure you're testing and that it's accessible in all in all states. Some common things I find I I do I do audits all day long on websites. It really doesn't matter the the platform, the CMS. I have an affinity for WordPress is where I got started. I believe it's the best CMS out there. Uh but it really doesn't matter. I find these problems all over the place. Keyboard traps. um navigating to make sure you can actually reach all of the interactive items. Make sure you can back up. Make sure when you're hitting forms that your keyboard is able to hit all of the forms. And I I'll show you here in a little bit, but a way to do that is is we call this tab navigation. You're going to use a low vision individual or somebody that needs help like that will use the tab button mainly to navigate your site and then do things like shift tab or control space and arrows and all that. But your tab navigation is going to be a big thing. I find a lot of silent failures too as far as error codes go when you're filling out a user's filling out a form and it says name, email, and they don't fill it out uh completely. And when they hit submit, everybody knows you'll get the red text up that says, "Hey, you got to fill this out, fill that out." But that has to be accessible to your assistant tech, the screen reader. So when that error pops up, you got to make sure the screen reader is announcing that. Otherwise, the individual has no idea that that error just just incurred. Um, structural problems. You got page builders. It's headings. It's it's a big one uh with headings. A lot of people will take their text and just kind of make it large and bold and use that for a for a header that you can't do that. So, um you know, and we find a lot of PDF documents as well that that's another kind of silent killer for a website is you can get your website fully compliant, but the laws and what we want to accomplish is for all digital content and that that's everything. That's websites, that's PDFs, videos, that's all of it. So, when you're going through and checking, please understand that it's not just your website. If you're offering PDFs or a video, all those have to be compliant as well. Not just because it's the law, but because it's it it's it's the right thing to do. And I do believe that we everybody in this room has a personal responsibility because we run so much of the internet. Everybody here runs so much of the internet. When I do talk to some people, sometimes they are not really fully able to understand how much they could really make a difference. You know, like they say, the ocean is made up of of raindrops and and that's and that just that point really hits home to me with with the WordPress community. All right, if you I would like to run a demonstration here. What I have here is I have a I have a broken site and then I have a uh an actual site. Well, neither are actual sites, but one one's broken, one's good. So, what I want to do is I'm just going to show you a couple of things real here real quick that and this is not the end all beall. This is not okay. Well, I did I did the four things Joe told me to do. We're good. Ship it. That that's not the case at all. But here are some things what I was talking about earlier about focus state indicator. What that is is when an individual is using the tab button to navigate the web page, there's a uh a focus state indicator that tells them where they are. Without it, you have no idea where you are. So, we are going to use the tab button and I'm going to go through here and you can uh you'll see the skip skip skip to main content just popped up. So, we know we're there. But as I hit the tab button, if you notice I'm tabing, you have no idea where I am. It's just not possible. You can look down in the bottom leftand corner, bottom lefthand corner, and you can see like the links and you can kind of make out where you are, but that that's not acceptable. So, here's the proper way of what that would look like. Sorry about that. There we go. There. Right out of the gate, you see that is the focus state indicator. So now as I tab press the tab button, you can see exactly where you are. The user knows where they are at all times. This is very very important. This is a constant fail and it's an easy fix and it makes a big difference. Um and you can see as you go through you'll be able to see where everything is and that's a big deal. Uh we got another one here. Um, what you want to do is you'll notice these read more here. And I was going to try to put up my screen reader, but we're not going to do that now. But it says read more here. And it says that on the other one, too. So the actual text of read more. I mean, that's okay. But what you need to do is you need to explain to the end user what's going to happen if they click read more. And you can imagine if I'm if I'm a low vision individual and I'm skimming through this and I hear read more, read more, read more, learn more, read more, learn more. I have no idea what that means. So what I always try to do is on on the working site it, and this is just an example, you can still have it say read more because I know we all like our aesthetics and we want we don't want a big long explanation there. So we can just add an ARA label. So the first one would say read more about running more productive meetings. And when I go to the next one, I'll say read more about creating clear content process or making training more engaging. So I'm adding that Arya label to allow the user to know where they are uh when when they're clicking the read more and learn more. Now, personally, I avoid try to avoid read more and learn more. I would um just use some other text, but if you have to use the learn more, read more, just add that Arya label. Um, and another good way to we're on here. So, we're on here. We're going to add our, you know, put our name. I always think of the tech. My name is Jeff. Uh, so we're we're Jeff today. And then when you come in down here and you're going to you're going to hit send request. We can see the errors pop up and all of that's fine. A broken site on the broken one, if I would have my screen reader on and I did this, you wouldn't hear anything. the screen reader wouldn't announce anything. But on the proper site, the screen reader announces that you have there are some errors and you have to correct them and it reads out what those corrections are. So that's very important. Another major one that I see a lot is as you're going through here the modal if a modal pops up on this one, the proper working one, if you notice the close button has the focus indicator. So when someone opens up a a pop-up or a window, you you have to bring the focus state to the modal. You have to and best practice is just to have it immediately on the close button and you go and then you can just scroll around and close on the broken one. What it'll do is when they're broken and you and you use the modal, the focus state behind. So now the modal popped up. If you notice, there's no focus indicator. And as I'm tab navigating, my my focus state is behind the popup. It is still on the web page and I'm not able to get to the modal. So that's very very important. And that's another very very common mistake. Another common mistake here, I'm not going to show you here, but you see headers is headers out of place. You want headers in dist descending order. You're going to want one H1 header per per web page. And that H1 header should be basically your your almost like your document title. That should describe what your page is. And then all of your headers under underneath that should be in descending order in order. So you have your main H1. And then of the next section, you're going to have an H2. And then if you have a couple other headers in that section, that's fine. H3, H4, and then the following section is going to be H2 again. So every new section starts back at the H2, not an H1. Um, and and you want to make sure you don't go from an H2 to an H4, back to an H3 to an H5. Um, so your H2 should be the header of each section, and they should be in descending order. So, those are just some simple fixes, some simple things um that that to pay attention to. And these aren't things that a plugin can fix. You're not going to put a plugin in or any kind of automated software and and get to that point. This is something that you have to manually do. And you know, that's just the way it is. So, with that said, when you're testing your your WordPress website, you obviously want to test the front end for user and stuff, but I'm sure there's a lot of people here that uh you know, agencies, developers that you're going you're making your websites for your clients. And what's going to happen is it's happens all the time is is the client is then going to take the finished product and they're going to continue to add content to it. Change content, add content because our websites are le are living. they grow, they expand with time. So, after you check the front end before delivery, I suggest adding like an interface uh a tag 2.0. And what that is is that's something uh for WordPress that it kind of puts guard rails on the end user when they're adding content. It helps them keep their content accessible because we could put out a perfectly accessible website, but if if the end user or the client adds some inaccessible contents with bad contrast ratio with bad readme text uh links, then that's going to kind of break the site. So, it's it's just important to to test the front end and the back end to make sure that the the what the client is using is accessible. Now, for plugins, again, I'm not here to tell people not to use plugins. They are very useful. Absolutely 100%. But I will give some suggestions on some questions you can ask yourself if you want to use that plugin or not. So, use the plugin, upload it, activate it, test it, make sure you can reach it with your keyboard. Make sure that that it handles errors correctly by announcing it. Make sure that um all all the changes, dynamic changes as far as like uh on because we have our website or we have our desktop, but it also be on on your mobile devices. So, that's another area that really kind of gets messed up. But it'll look beautiful on your desktop, but once someone pops it up on on a on a mobile device, you're going to lose content. Sometimes they won't uh refflow properly. You'll have overlapping content. So, you want to make sure the plugin's not doing any of that. Make sure you're you're zooming in to 200%, 400%, putting it in a mobile state. Make sure nothing's overlapping. And if you want to go the extra mile, you can always check that plugin's VPAD or ACR because that company should be providing a VPAD and ACR. Uh an ACR is an an accessibility conformance report that tells you where the plugin uh meets accessibility requirements and where it doesn't meet accessibility requirements. And that gives you kind of a head start on knowing, okay, well, this plugin is going to have issues in these situations. And if you're not able to get the plugin to work, you're going to want to think of another solution. Is there another plugin? Is there another workaround? I do a lot of workarounds because I come across a lot of clients are like, "No, that's my that we're using that plugin. I am going to have a Google Maps." This was a problem five, six years ago. I am going to have a Google Maps on my website. So, you may have to kind of get creative and think outside the box. And a a way to do that is that I found is to make that I'm just using Google Maps as an example to make that the secondary way of the end user reaching that information. So you can add a a primary method of someone finding an address and getting a d and getting directions and then using the Google map as a secondary way. If you do that, you're good. But that's that's that's only in the cases where the client's like, "No, no, I I am going to use this particular plugin no matter what." So, we want to make it as accessible as possible. And then obviously let them know, well, there's some accessibility issues here, but we're going to do a workaround, and if you still want to move forward with it, we will. Again, this is this is really big. You want to make sure that you're testing the end journey, not just, okay, I put the theme up, let's run a scanner. Okay, let's add this plugin. Let's run our scanner. Let's we did this piece. Let's let's run our scanner. You want to put the site obviously check as you're going and to make sure make sure you're doing everything properly, but at the end when all pieces are together, when you've built this car, you got to take it for for for a joy ride. You got to you got to figure out where the problems is. Are there accessibility issues here? Is it reading properly? Is there is there reflow issues? And if there is, you're able to kind of go back and and fix those things. Things you want to check are like the key journeys. Again, the user journey. That's if you're building an e-commerce site for for a client, check the go through the checkout process. Make sure an enduser can actually uh take a product, put it into the shopping cart, go to the shopping cart, and buy it. uh WooCommerce beyond the page. You want to make sure again your popups work and and make sure your website works in all states, but it's important that you're testing the the user flow at the end. That I just can't express that enough because although the law says every all of your guidelines have to be all your checkboxes have to be checked, at the end of the day, it's about the individual and it's about the user being able to have access to everything we do. So that's really the most important thing. So just add that to your flow. And when you do come across issues, and we always will fix the problem. Don't try to just add a layer of CSS on top of it or find a plugin to fix it. It's always better to just fix the the the actual code, HTML or whatever it is. fix the problem at the foundation because if you just do a quick fix, the next major update, it's going to rebreak and you probably won't know because it's not really in our flows to check accessibility every time we update something. So fix the foundation, replace if needed, and if you absolutely have to add some workarounds. As developers, designers, agencies, when we're building our websites, again, you're going to be shipping off the website and more than likely that client is going to be adding their own content and adjusting as you go or adjusting as they go. And so I believe that it's very important for us. WordPress does a great, this is just another reason why I love WordPress. Does a great job with allowing you to add some guard guard rails, your block patterns, create them, test them, and then lock them. So if an individual wants to add or rearrange, they can use blocks that they know are accessible. Um, your theme, your JSON, that's going to be really important as well. So you can create that and and we know the clients, they'll all have their own their own company branding and they have their colors and their logos and everything they want to do. So it's real important that you can add something like this. So when they're adding stuff and they want to use this color or that color, if it's already an inaccessible color, um they're just going to just plaster that everywhere. So, in a way, you're kind of limiting their options, but you're giving them great options, and you're allowing them to kind of have their own sandbox to do what they want and be confident that the the content they're creating is more than likely going to be accessible. That and again, there none of these are end all bealls. It's just not. So, always be on the lookout. But what you can do is set your clients up for success. And really this is when I got into accessibility for WordPress back in 2015 16. I had to work overtime to explain the importance of accessibility and I felt like a a cheap salesman because I had to explain the importance of accessibility legally as and then explain the importance of it as far as it's just what we have to do as a community. come together and do these kind of things. You're talking lawsuits. Um if you're doing any kind of work with the government or contracting or um RFPs with them, everything you do has got to be accessible and but nowadays it's kind of starting to become more mainstream. So I want to make a suggestion to everybody in here to just add that as a line item. I don't believe you'll have to work real hard to justify that because more and more clients I'm working with fully understand the importance of web accessibility, especially with the new laws coming out. Um, they were for April of 2026 that got pushed back to April 2027 and for government agencies with like 50,000 or less than 50,000 constituents that uh deadline is April 2028. But but the the client, the end user is starting to wake up to the fact that this is important, that I'm not just trying to sell them extra stuff. This is very important. Build accessibility in your workflow. I learned this early on. This was really the biggest game changer for me because I learned early on that the real expense is twofold. one the the real expense is a client getting served a lawsuit. Obviously, they got to lawyer up. Then they got to bring somebody like me in and they got to deal with the headache, lose sleep. It's a mess. Um, so you want to build it into the workflow. So early on, okay, that's right. I apologize. I lost my train of thought. The other biggest part of that is is we build a website. Right? We make this big beautiful website and then the client's like, "Hey, I got served papers." Or, "Hey, uh, I have a a friend with a company that just got served a lawsuit." And then we have to go back, we have to audit the site, we have to fix the site. You're talking thousands of dollars for a small site. But had we had just built that process into our workflow, we could have shipped the project um to be fully accessible from the beginning. And again, add it as a line item. Say, "These are what we're doing. We're building your site to be accessible from the beginning. It's a little bit more, but it's going to be way less in the long run, and it really won't add that much uh time or scope to your project if you're doing it from the beginning. So, discovering design right from the get-go. When you're discovering, ask the questions. When you're designing, add it into your design. When you're building, build it. Author, test it. Once it's done or as you're building it, test it. Make sure you're testing it. Verify it's accessible. And then once you launch it, maintain it. A lot of times I have the majority of my clients want the uh ability to add their own content as they go, which is fine, but then we will we'll check in quarterly, or we'll check in uh annually, by annually, or after any major updates. A lot of times I have clients that just say, "Hey, listen. this month we've we've created these these blog posts or these pages. Can you just skim over them? Make sure everything's good. So, that's going to be part of your launch and maintain. And again, it's a line item for you. This is a way to I don't want to say it's it's just a way for you to to really offer and provide a absolute needed um project, but also you're getting paid for it. So don't feel like early on it was I got a lot of push back from developers and designers saying well this gonna add so many hours and and my clients aren't interested in this so I don't even want to mention it but I I really believe that the tide is turning the clients know about this and I've actually seen a few instances that when I talk to them they say you know what you're the first one to mention these kind of things to me I'm going to go with you because the other developers and agencies didn't didn't mention accessibility at all and the client Clients are becoming more and more educated. So, don't feel bad about mentioning it. Add adding adding it to your scope. All right. What I want you to do today for me, if anybody here is available, you can open up your laptop right now and I want you to tab through your homepage the same way I was tabing through. I want like for you to just check your interactive items, your your um your input values, all those kind of things. Make sure you know where you where your focus state is. Tonight when you're at your hotel, spend 10 minutes. And this is this is something I highly recommend. Download NVDA. It's a free screen reader. It it's actually created by two low vision um developers. It it's my personal favorite. Turn that on and just start navigating your site and hear what they hear. I always like to say, close your eyes and just start clicking the tab button and see if you know where you are. And when you open your eyes, see if you can tell where you are. If you can, you're you're ahead of the curve. If you can't, you know what to work on. This month, I personally would take one of your clients, maybe your best client or your most recent client, and and navigate their site, figure out what's good and what's bad for accessibility. um they they will be they will be thankful and you can add it you can say hey listen on our next iteration because we when we deal with clients it's not usually oneoffs it's we we deliver the product but then we get we be we're kept on board so we're able to say okay here here are some things maybe our next check-in we can address that because we have x amount of hours this month to use to spend on the website for maintenance we're going to do these couple of things and it really kind of I've learned that it makes the client feel better. All right. Well, that's pretty much the bulk of it. I on our website, I have compiled some free resources for everybody. So, if you want, you're more than welcome to scam that. You can just go to our web page. It's going to give you some some free resources that you can use for your accessibility. Um, and I would like to say again that we do have a plugin. So, I'm not trying to ex any any plugins. They are very helpful. But just remember that the plugins are just a tool in your tool belt. You are the contractor. You are the mechanic. These tools do will not fix the car by themselves. That that hammer and and drill are not going to build the house by themselves. They are your tool. Please use them. Um yeah, that's it. Is there any questions, concerns? Yes. Hey, can I jump in there while he's uh working his way over there? >> Super. And before you do, I'll just mention uh we'd love to have you if you have uh questions, ask them. We have about 10 minutes left and so if you'd like to ask a question, just line up behind the gentleman at the microphones right now. >> Thank you. >> Go for it. Oh. Oh, thanks. Uh thanks for the talk. Absolutely. >> Uh you mentioned that you had um um It's weird hearing my voice over the speaker, isn't it? >> Yes. >> Uh you mentioned that you had automated testing tools that could check up to 80% of accessibility issues. >> Um would you mind sharing what those tools or tool is? >> Yeah, absolutely. And I just want to make it clear 80% I was being very nice because I don't want to hurt any feelings, but yes. Um >> I'm used to around 30%. So yeah. What tool are you using that I'm not using? >> Uh there's a lot of them. Um you have Axe Dev tool, you have Wave, you have the Google Lighthouse, you have Andy. Um I use the like uh developer inspect tool a lot. Um and and what I found that these tools are good in certain areas. Wave is great in checking my header hierarchy and checking color contrast. And is great at checking like alt text and interactive elements. Um, Google Lighthouse is is really just kind of a backup. Um, Axe is kind of a go-to because I feel like they're the better one in this space, but even they will tell you we're only catching 70% on full maps. Uh, we only have 70% um, confidence in what we're finding. So, that's saying that even if they find something, they're only 70% confident they found it. That's not even including things that they haven't found. So, those are pretty much the tools. I would not use overlays. Shameless plug here. We have a plugin that helps um test. It also helps you bring all of your images into one place to add alt text, send them to the front end as a contrast checker, free resources, stuff like that. But th those are the basic ones. >> Yeah. Yep. Sounds good. Thanks. >> Absolutely. >> I have uh two questions, but the first should be pretty quick. Um, first question is for the focus indicator when, uh, you're working with, you know, some focusable items that are on a dark or medium colored background, uh, do you try to apply a universal focus indicator that works on any background color or do you do a uh, you know, a unique one for those uh, color variations? >> Right. No, that's a great question and I've come across this quite a bit and what I found to work best is you get a focus indicator that's two colors or a sandwich. It's like it'll be like a two black outlines with a white center. So, no matter what they're against that you'll have proper color contrast because that's a major problem. Uh just because you have a focus state indicator, I see a ton of them that that actual focus indicator does not have the proper color contrast. So, that is a major issue. So that is a way that I found it to alleviate that. >> Yeah. Like a combination of a border and an outline. >> Exactly. For each color. >> Exactly. >> Um All right. And then second question is uh if you have the same image on multiple pages, have you ever found that it's appropriate to use different alternative text uh for each image based on the context of the page? Um or do you always use the same alt text if an image is used multiple times? >> I typically use the same alt text. I just try to keep it descriptive, one to two sentences in general, but I have come across situations that that you just mentioned. Um because sometimes an image I want to say could have like a duality meaning, but sometimes you can pull different things out of it depending on the content around it. So the real important key here to think about is that uh is that alt text describing the image properly for its use in that content? if if that makes sense. So it it you could need different alt text kind of slightly different if it's in a completely different content setting, but in general I would try to keep the alt text the same short and descriptive. >> Yeah. The example I was thinking of is like if somebody has a profile picture on the team page versus if there's like a, you know, a full article about them on a blog, >> like how descriptive each of those should get. Should it cover, you know, uh how much of describing what they look like versus what their relation is to the the uh content on the paper? >> Right. So, I mean, in this in this exact uh situation you're mentioning, I personally would just be very vague kind of this is uh you know, a head shot of so and so or this is their profile, a profile picture of so and so and just kind of leave it at that. We don't really need to describe the individual because what's going to happen is just going to make a really long alt text and then and then that individual is just going to have to deal with all of that. >> Yeah, it gets convoluted really quick. >> It really does. >> Appreciate it. Thank you. >> Absolutely. Good questions. >> Yes, >> great presentation. Thank you for the information. My question is around tools like userway access that offer um I think one of them offers 99% uh and then they even give you money guarantee if you do get a lawsuit. Do you have any experience on those or any of them better than the others or any that should we avoid? >> No, absolutely. That is a great question because we fall in this trap of it's it's WordPress plugins, overlays. Um, I don't want to be rude. I hate overlays. I hate them because for me it gives the individual a false sense of security. What happens typically if a site is broken, they'll put an overlay on it and all they're doing is just slapping a layer on top of a broken site. Um, so it won't actually fix the issue. I would suggest the use of an overlay to be after your site is accessible, add an overlay just to help out because they are great as far as you can change the contrast ratio and text size or cursor size. Those are great. But other than that, I wouldn't rely on them. And I'm not going to name names, but there are overlay companies that have been sued and owe upwards of a million plus dollars because of the claims like you you had mentioned that they make. Um because in my opinion, it's it's just not real. Because again, if your site's broken, it it's it's an overlay is more than likely not going to fix the broken part. It just slaps and really can make it even more difficult. I actually just gave a a talk a presentation at at a local word camp and that was my focus were overlays. A lot of times they add broken elements to an already broken site. So for instance, if you add an overlay to something and your tab navigation does not flow in a logical order that'll break that even more because a lot of time that's the second or third item you'll tab to. So you'll tab and all of a sudden you're down here and you have no idea and then you're back up here. Um or it'll open it'll open its window and not tell the user it's open. So use an overlay but have your site accessible first and use overlay just as extra >> if that answers your question. >> Yeah. Any that you recommend that you know are really great or you've seen I don't know if you can name. No, just because I don't really like them. But there's a lot of them and and they're pretty free. They're most of them are free that you can add. But >> as long as your site's accessible, I'm okay with that. But just try not to. >> Thank you. >> You're welcome. Thank you. >> Hi. Um, so I work in higher education and we love our PDFs. Mhm. >> Uh no matter how many times we try to persuade them to turn into web pages that some cases are special and we have to have PDFs which are some of the hardest things to make accessible. Um but we currently use site improve and they just released um a PDF accessibility tool that will remediate the PDFs. >> Um >> it sounds too good to be true in some ways. Um and we're currently in the testing phases. So, what are some things that we probably need to like look for um in a tool like that? Like some things we might need to watch out for, >> right? Um there is no such thing as a tool that will remediate a PDF or a website all by itself. It's not it's just not it's not there. The race has started. The we are racing to get there, but we are not anywhere near that point. if it's a good tool, it'll tell you what it fixed and it will tell you what you need to check manually. It'll say check these items again because a lot of times they'll they'll it can tell if it image has an alt text, but it can't tell if that alt text is proper. Um, and there's a lot of thing things that they cannot tell. So, use the tool can get you so far and if it's a good tool, it'll say you have to manually check these items and then stick them in other tools as well. You got pack adobe. I mean we use common look uh you know check kind of counter check with other tools to find out but right now and for the foreseeable future there is no way to circumvent the human person in that process. >> That's what I thought >> and that's what we do. But your idea is right and that's what we suggest. If you can take those PDFs and turn them into a web page that's the best. But if you can't then you got to remediate it. >> Okay. Thank you. >> Thank you. All right. All right. Well, I think I'm about to get the hook. I appreciate everybody. Web accessibility is a very important subject to me. So, I want to thank everybody for spending your part of your day, this part of your day here with me. Thank you. Thank you.