0:00
Hello everyone and welcome to today's info people webinar introduction to website accessibility presented by Laura Solomon. Laura is the library services manager for the Ohio Public Library Information Network. She's been doing web development and design for over 20 years in both public libraries and as an independent consultant, she's written three books about social media and content marketing specifically for libraries and speaks nationally on both these and technology related topics.
0:30
As a former children's librarian, she enjoys bringing the fun of technology to audiences and in giving libraries the tools they need to better serve virtual customer and I am now happy to turn the webinar over to Laura Solomon.
0:45
Thank you. Hi everyone. I'm coming to you today from Cleveland Ohio. For those of you who have not heard me talk before or even if you have and you forgotten, please feel free to put comments and questions into the chat and the info people will relate those to me in a timely manner. They're very good at that. I actually really enjoy engaging directly with folks.
1:09
And if you have anything you'd like to add to the conversation or ask about don't feel like you have to wait until the Very end. I mean obviously I will still take them at the very end but don't feel like you have to wait until then just put it in the chat. I'm pretty good at keeping an eye on what's going on in that chat section and I'm also fairly good at getting myself off track to answer them and putting myself back on track again. And I appreciate actually answering questions while they're in context as well. So don't feel like you have to wait. I'm very happy to take them whenever so welcome to introduction to web site.
1:45
Right accessibility today. Here we go. I want to preface this session today with just a couple of things. The first one is and you may have already guessed this if you know anything about accessibility and the web I only have an hour today and this is also titled an introduction to website accessibility.
2:06
So if you came expecting an in-depth discussion, for example of Aria roles in HTML, probably Not going to happen if I can tell you it's not going to happen today. We don't have the time or the breath necessary really to get started with that. So this is an introduction to hopefully get you chewing on some things and also we'll be talking about some things. I think you'll find very relevant. So there's this is the tip of the iceberg. That's my first disclaimer.
2:35
Is that what I can do for you today is really just the beginning the second disclaimer that I'd like to make those some of you at least I bet are familiar with its acronym. It's fairly popular online, and it stands for I am not a lawyer I a Nal. I am not a lawyer. So you probably already knew that from my introduction, but I am definitively today not a lawyer because sometimes the questions that I might get asked about accessibility might require a lawyer to answer and even if I was a lawyer, I would not be a lawyer in California.
3:10
So I wouldn't necessarily be of any help really to you anyway, so I want to Get that out there that I will not be able to necessarily answer specific legal questions. Also as you're going to find out in today's webinar, the law isn't necessarily really very clear. We're going to talk about that a good bit. Also, I'm primarily a code geek here for really for all practical purposes a good part of what we're going to talk about today is going to revolve around some concrete examples of common HTML issues that you might see that cause excessive.
3:45
Mobility issues and I am also lastly not perfect either. I am not claiming that all of my sites are the end-all be-all of accessibility. They definitely are not especially because once I build the site gets turned over to a library and the analogy that I often use in that situation is that it's very much like when you buy a car and you drive it off with a dealer's lot the dealer can't guarantee what you're going to do to that car. You could crash it turning out of the dealership just like bye.
4:15
Car I can't guarantee what libraries are going to do websites that I build once they are given them even if they're completely compliant to begin with so I can't make any promises. They're so having said all that though. I do want to talk about what I am going to talk about today. So I've broken this out into basically three broad section.
4:37
So the first one we're going to talk about what accessibility is and why it matters and chances are you probably have some idea You about some of those things simply because by the fact that you're here with me today, which is great. So we're going to cover some foundational material, but then we're going to move on to standard. What are the rules and how can you know if you've met them or not?
5:00
And this is a slightly more complicated area than you might think is you'll find out when we start talking about some of the legal stuff and then lastly but certainly not least lie, we'll talk about some code examples, so If you've never seen HTML before I find that highly unlikely honestly if you're here today, but don't be frightened. This is stuff that you can still take back to whomever works on your library's website and chances are good. You've seen at least a little bit of HTML somewhere. Don't get too scared. I promise it's not going to be too frightening. So again, I'm covering the tip of the iceberg today, but hopefully between these three sections, I'm going to give you enough to at least get started and some things to consider.
5:46
Okay, so let's start with that foundational stuff that I mentioned. So first, obviously we have to talk about what is web accessibility.
6:00
Generally speaking web accessibility is defined as you see here at the bottom of the slide web accessibility means that websites tools and Technologies are designed and developed so that people with disabilities can use them. This is the definition from the WC3, which is actually the acronym for the World Wide Web Consortium, which is pretty much the standard creating organization or Institution for almost everything that happens online. It's an international body.
6:29
D but I want to draw your attention to one particular thing about that sentence that's almost kind of an oxymoron, but you have to recognize that it's there. It says web accessibility means that websites tools and Technologies, but it's called web accessibility makes no sense. Right? But so web accessibility as far as accessibility online digital stuff.
7:01
Is it really a broad umbrella term because it is the very definition says websites tools and Technologies. We're talking about websites specifically today, but I want to draw your attention to that because it's important to know that there's not a separate definition for example, so if you were working on say a library a poor looking at a vendor's application this all covers really all of that. It's even though it's just called web accessibility.
7:29
Leti so just be aware of that that it's an umbrella term even though it kind of includes a specific limiting word in it. So another important thing to know about web accessibility and maybe we should back up just a minute here. In fact, I'm going to do that cuz I didn't we talked about the sentence.
7:50
Everything here, they want everything to be designed developed for the people with disabilities can use them really what we're looking at is you want your website to be accessible or comfortable for people with is many different limitations or not limitations as possible you want as many people as possible to use your website regardless of what they have to deal with when they come so that means you also have to be aware of the fact.
8:20
Fact that when we talk about web accessibility, it's not just blind or visually impaired folks. It's actually a whole slew of things the most common thing that we usually worry about when we look at pardon. The planet webwork is the visual stuff because that obviously it probably affects the greatest amount of stuff that were working with, you know are especially now that everything is very visual but accessibility, you know covers.
8:50
And thank you and for people folks the wa website is they just pop that into the chat for the URL.
8:57
Well, but you want your website to be used by the maximum number of people as it is so you got includes making it comfortable for example for the elderly. That's maybe a contingent that you hadn't even considered to be in need of accessibility. 
9:11
But in fact, they might it also be anybody using any kind of assistive technology not just folks who are blind or visually impaired and I'll tell you now kind of upfront many accessibility changes that you might Make your library's website actually can help people not just in other groups of people with disabilities, but also people who may not be impaired who have other problems. They have to contend with for example, low-bandwidth people who have Graphics turned off those folks actually can benefit from a good number of things that you may have to do to your website to make it accessible. So again, you can't hurt your website by making accessible.
9:57
You can only help people.
10:00
So this is also from the wa eye which info people very kindly thank you just posted the URL for this in case you want some more in-depth reading and you can see here that they actually break down disabilities into six areas.
10:15
But today we're only going to be focusing really primarily on the visual because that is a large chunk of where a lot of the obstacles tend to be but I again, I want to emphasis it's not the only one so If you have some time, I encourage you to read the fundamentals from the wa I that's the web accessibility initiative that comes out of the WC W 3C. There's a lot of w acronyms, you know Librarians have acronym this organizing body has a lot of acronyms to sometimes it's hard to keep those straight.
10:48
Now a common question that I get when I start talking about accessibility is is that the same as usability They are not the same but like you see there they can overlap accessibility is related to issues of usability and coding standards, but it's possible for a site to be considered usable and Stephen standard compliant, but not accessible and vice versa.
11:20
So you could have a very usable site and lots of folks who don't have a disability can use it and it's great, but that doesn't Doesn't necessarily mean that it's accessible. So usability tends to refer to the ability average users and I'm putting average in quotes. You can't see me, but I'm telling you that I am we do what wa I refers to as standard equipment and that again is in quote so or abilities to navigate or use a website. So in most cases accessibility standards actually add usability to a website buttocks.
11:59
Stability consists of a lot more than just general usability clear as mud right. That's why it can be a little confusing because they tend to overlap but certainly you can't hurt anyone but making yourself more usable. You can't hurt yourself and making it more accessible either. Okay. So here's the part that makes everybody nervous and why I always say I am not a lawyer. So this is where things stand as of right now. This is literally in the last month or so.
12:29
This could change in the next week. I hope not. So one of the reasons I'm going to just guess that at least some of you are here is because the legal issues surrounding web accessibility and worried perhaps about how they might affect your library or not. So, let's talk about that a little bit.
12:53
first of all lawsuits are on the rise. Obviously. We want our library website to be as accessible as possible because libraries were about serving our communities. Whatever those communities are the mill Library intentionally wants to shut out a portion of their community and that's admirable goal for sure. Right but there's some more concerning reasons that your library needs to start paying attention.
13:21
So let's talk about what's been happening on the legal front and this is the I think we need to talk about is that ADA lawsuits for websites are on the rise for decades probably lawyers for the disabled have used the Americans with Disability Act and disabilities parole act and I I apologize in advance. I don't know if we have any folks coming to an internationally.
13:47
There's definitely going to be a heavy American bias when it comes to the legal stuff here, but they've used the 88 Force businesses to make their cases more physically accessible, you know adding ramps widening doorways flooring countertops. Those are all pretty much par for the course in which surprised nobody these days but we seen this study migration of pretty much everything to the internet, right? There's very little you can't do on the internet anymore. And so now that rise in activity of everything moving to the to online has also given rise to this new flood of litigation.
14:25
The accessibility of web sites, especially for the visually impaired and the number of lawsuits Nationwide last year nearly tripled in 2018 over the year before a lot. They've tripled in a year and this is just a small sample of companies that were sued last year for inaccessible website and what's not shown their course lots of others.
14:55
Ours, but also last year just in December alone 50 different colleges were hit with lawsuits. So if you think that this is only going to be commercial entities, I'm sorry. No, it's not 50 different colleges are dealing with lawsuits over inaccessible website experts are saying that litigation is increasing in part. Not just because everything is moving online is as I just mentioned but also because the justice department parlors are federal government.
15:25
Whines to offer guidelines and standards for what companies need to do to be considered accessible. We're going to talk more about this in just a couple minutes about why this is such a murky area, but there aren't necessarily some real hard and fast guidelines that our federal government says you need to be followed sort of kind of again, like the law. Everything is murky.
15:52
There's never remember if you ask a lawyer anything the answer to Is going to be it depends. This is definitely an area where that's going to apply.
16:01
So what about libraries right? Sometimes we think that we're kind of safe because everybody loves us not so safe. So this lawsuit actually is from 2012. So the natural National sorry Federation of the blind through the Free Library of Philadelphia on behalf of for blind patrons who weren't able to use new key readers. They weren't compliant at that time.
16:27
They were provided by the library and to settle that Suit the library agreed to purchase 10 new accessible e-readers and when sure that all it's easy readers were accessible within four years. The library did not win this suit and it's important also to note. This was not about a website. This was about some technology.
16:48
So this probably didn't make the news maybe as much as if it had been their website, but it is about technology that the library was providing now another case that Happen this year, and I'm going to bet California folks are very familiar with this. I just became aware of this a little bit ago. So this is probably not news to many of you, but it was to me probably some of you are familiar with this ruling that just happened this summer paying vs Los Angeles Community College District. So there I know there was something on the calyx web serve list or a list serve about that.
17:29
So Basically, they had to make sure they they were sued and it wasn't just their website. It was a lot of their stuff a lot of Library related to technology and what's interesting about this is that they had to they have to make sure going forward that all of their stuff and I'm using that said that very non-technical term but I mean everything digital pretty much has to meet a specific set of Standards specifically.
18:00
Wcag 2.1 a a going to talk about that don't get scared about what that means and they have to meet those guidelines or they have to be removed. So they have a year to meet that standard. What's interesting about that is that this court decided a specific standard had to be met and some of you may already be familiar with the idea that a lot of fun times get decided in the courts and this is again because the justice department is input.
18:30
Anything out there saying you have to do a b and c to be compliant. So we're going to talk about these standards in just a moment. But this is a good example of why you need to be really careful when you are buying new services for example for your library, but whether or not they're going to be accessible. So this College District has some work to do and I know that they're going to be doing their best now. Let's delve into this murkiness a little bit.
19:00
so this is from this this is from um, this is from the Department of Justice. Remember I said this is kind of murky. So this is just from this is barely a year old September 2018. So the Department's first articulated its interpretation that the Ada applies to public accommodations website over 20 years ago, and it's basically they go on to say is that the Ada Americans with Disabilities Act applies to web site as far as truly.
19:34
Authoritative things that the doj has bad. This is one of the very few and it's not especially helpful when it comes to the kind of the the nooks and crannies or the the actual things we have to do but they do say that the Ada applies. It does apply.
19:52
So just like you would put ramps in your library automatic doors lower counters all that the Ada applies to all of the stuff that your library provides to To so here's another thing. I want you to chew on.
20:10
This is a great quote from a woman named Deb quatre who is re-appropriating Clarke's Third Law, and she said any sufficiently advanced neglect is indistinguishable from malice. I doubt any of us would ever think that our library would do anything malicious in terms of disenfranchising anyone. That's just not how we operate.
20:33
But unfortunately when it comes to not being able to access resources There's no difference. I'm often telling my son. You know, it doesn't matter if you meant to do it or not. The result is the same intention doesn't matter. So we have to be really careful. We know that the Ada applies. We know that it could potentially be interpreted as being malicious unlikely, but you could still get stood malicious or not. So we have to be aware of these thing. All right, so let's talk about now.
21:08
Standards and validators. So we have a real murky picture of what we need to do legally other than well. We probably need to do something but the Department of Justice has it really come out and said what other than well you'd better be doing it. That's real helpful. Thank you doj. So we have some standard there are standards specifically there are two and I'm going to talk about those and where they do and don't apply.
21:36
Why first, let me tell you why they're there we go. Okay. So again, sorry to any International folk, but this is about section 508 and then we have another thing from the WC3. Remember we talked about that earlier the World Wide Web Consortium. So, let me talk first about section 508.
21:58
This is the US only standard its it only applies to the United States first of all, and it's a very Minimal standard to be honest, it doesn't cover a whole lot. It's like okay. If you do these things that's better than nothing kind of standard and then there's the world content accessibility guidelines that comes from the w3c. And this is an international standard because it comes from that worldwide organization. It is significantly more comprehensive than section 508.
22:31
However, we have to talk about you might think I can just jump to you know, just do Wcag and chances are good, depending on what level of the wcag. You pick. I'm going to talk more about that in a minute. You might not need to worry so much about section 508 but here's the thing. So I'll get the clear as mud right section. First of all, a lot of folks think the section 508 is part of the Ada. It's actually not it's part of The Rehabilitation Act of 1973.
23:00
Which seems weird when you think the World Wide Web wasn't really around in and any real current like four 1973 but here's what it does cover. First of all, there's a section for sorry Section 504 and a section 508. We almost never talk about Section 504 but I want you to be aware of it because this is the act or the part of the act that prevents any organization that gets Federal funding from discriminating against people with disabilities.
23:30
So that's why it still applies even though it was written in 1973 because it applies to To overall discrimination anybody with disabilities so and that provision by the way was core to the National Federation for the blind lawsuit against the Philadelphia library because what it means is that any any organization that receives Federal assistant is going to be have to be at least 508 compliance.
23:59
So they again minimal standard if you're getting any kind of federal money, you need to be at least section 5 Compliant, that's the bare minimum but section 508 which is kind of an adjunct to that ensures that federal agencies provide the same level of access to online information to all people regardless of disabilities. So that's why people often get these confused 504 deals with this Federal funding and whereas 508 really just talks about access to information.
24:33
They're both so don't think Like that, if you don't get Federal funding you don't have to do this. You should at least start here. I encourage you if you if you are just taking your first steps into accessibility start with the section 508 standard. It's a little easier to meet and the wcag and you can least get you to a somewhat Level Playing Field to start with course. If you are getting Federal funding you need to be doing this.
25:01
Anyway the other standard which is the one Honestly that the courts care about so if you're lost if for some reason your library was taken to court over your website, this is the one the court regularly site is the wcag. Now this I should have pulled the logo for the wcag 2 point 1 this is actually an older logo because it's at least up to two point one at this point. So forgive me for that.
25:29
At so the Ada was signed in 1990. It was significantly it mended in 2010 and it's a Maine law that seeks to Grant equal treatment of Americans with Disabilities in pretty much every aspect of their life. But neither the Ada or the Rehabilitation Act or the Department of Justice explicitly addressed how to provide all of this accessibility or equal access.
25:58
So other Innovation is a stepped-up and primarily the one that matters is the w3c and the wcag standard. So this is the leading document that tells organizations. Here's what you need to do. Here's what you need to fixed.
26:14
Section 508 does this to a smaller less comprehensive extent? So these guidelines don't have the power of law but attorneys and judges site them regularly in accessibility online accessibility lawsuits. So this is the one you probably want to be most cognizant of especially if you want to make sure that things are much more Equitable across the board as far as access interestingly enough. This has been around for 10 years. I'm not sure how many folks know it exists.
26:45
This is actually a resolution from the American Library institution institution Association. I like I know them or anything about purchasing accessible electronic resources. And so this is something where they and they also provide a tool kit by the way of questions that you can ask vendors regarding their compliance with standards like section 508 or the wcag. So I encourage you to take a look at this as well.
27:15
He can get some ideas particularly because now I know a lot of you folks are from California. You've already seen the outcome of the Los Angeles College District decision. This is something you may want to take a closer. Look at.
27:32
At so you might say Okay, Laura. How do we know there's our site good to it already. How do we know if our site is going to meet these standards or not? You can look up the standard pretty easily but trying to figure out what applies and what doesn't to your particular site is not always the easiest thing there are automated Checkers and one of the things you'll see on my very last slide is I will give you a URL for a whole slew of different tools and resources.
28:02
Regarded to concerning web accessibility including additional Checkers. I'm just going to talk about a couple today in this session. The one that I probably use the most is a checker. I like this one in particular because you can give it a URL and you can also tell it what to check against so you can see there in the screenshot. For example, you know, you can check against wcag different levels of wcag. You can check it again.
28:33
508 so, you know, I like to check honestly against both when we send sites out of our agency for public libraries. I like them to meet ideally not only Section 8 the wcag level AAA now I didn't talk about this before but the wcag has three different levels. It has a double it's kind of like eggs almost a double-a and Triple-A. Ideally. I want everything to leave our shop, so too.
29:02
You give a AAA compliance site again, once they drive it off or a lot. I can't guarantee what happens to it. But I like to know that at least it started out like being compliant and when you run this when the options you see here to I'm kind of the upper right of the screen shot. You'll see there's a little checkbox for show source that will enable you to see we're in the your code the problems are happening and it will also when it does the check it will show you links to for more.
29:32
Information about anything that has failed so you can find out how to fix it. And where it is that it needs to be fixed. Obviously, you're going to need some expertise to fix the problem because you need to know why it's occurring and where it is in the code a lot of content Management Systems these days it's not easy to necessarily find the code directly, but it's a big help another checker.
29:58
There we go is webaim. This is probably actually more popular than a check or but I just happen to like a check or webaim. If you're not familiar with it is a non-profit if they worked for years to make the web more accessible. They've written software and disability simulators. They shared in-depth surveys of users with disabilities. They generally published probably more articles and resources than you could probably ever guess through that will all the help all of us do our jobs a little better.
30:30
So they have an automated check or to including a contrast Checker. I'll show you in a little bit that I really like one of the event talked about surveys that webbing did one of the things that they did is in February of this year. They published an accessibility and Analysis of the top 1 million home pages. You can probably guess it was not pretty it was pretty and someone said in one word the results were abysmal.
30:58
It was pretty awful but That didn't surprise me so much as what they said. What webbing said about their results that they got from this survey. This was a real kicker. They said that automatically detectable errors constitute a small portion of all possible WCA D failures. So in other words their survey or just the errors that can be detected programmatically through an automated Checker.
31:27
The real picture is even worse than the numbers suggest so a couple things here really or maybe just one that we really need to hammer in.
31:38
Using an automated accessibility Checker is fabulous. You should do this. You should do this a lot. However, you also need to recognize that it is not the same as testing with somebody with an actual disability testing on humans by far if you can manage it is always better check her is far better than nothing, but it is not the end-all be-all of checking against a human being.
32:07
So just and thank you. And so people are really keeping up nicely with the links. I appreciate that. So does that mean you shouldn't use an automated check or no? Not at all. You absolutely should but in the back of your head, you have to recognize that it can't detect everything like in so using a combination of actual people and checkers is ideal. But I also recognize that's not something that a lot of us can do.
32:34
All right. So I encourage you to use those again lots more tools listed in the PDF. I'll give you the link to that at the end or if you have a copy of the slides already you can find it there. So let's spend the last half of this talking about the the stuff you should have learned in that basic HTML course, you probably took a long time ago or maybe even last year that you probably still didn't learn. I don't know because we don't have a gym.
33:04
I will chat here. I don't know how long it's been for many of you. But my experience teaching is session the last time a fair number of people seem to have been exposed to write HTML with maybe in library school or they took a workshop a long time ago and typically accessibility isn't covered. So what I want to cover just a little bit today are some of the most common pitfalls that you might run across obviously not everything but feel free to ask questions, especially something.
33:34
Is not clear.
33:37
So let's start with one probably the most people are familiar with and that is the alt attribute. So hopefully you've seen something like this before this is an image tag called and it's for an image called Dog dot jpg. That's the source attribute, but then we have this other attribute that salt equals and that is the altar alternative text attribute. That's what all too short for is all.
34:06
Hornet of text and the Ulta tribute is what a screen reader sees so to speak when it runs across an image on a website now, we're going to experiment with showing you literally 30 second video to show you the difference between what someone using a screen reader here's when they encounter an image when there is an ALT attribute and when there isn't so this takes a minute I'm talking hold it takes a minute to boot up so don't panic.
34:44
Heading level 2 image with no old attribute. You are currently on a heading level 2 / example 1 2 3 jpg image you are currently on an image.
34:57
Heading level 2 image with old text you are currently on a heading level two.
35:04
A small dog running across a grassy field mouth open ready to catch a tennis ball image you are currently on an image.
35:13
image with no alt attribute heading to example 123 image image with alt text heading to a small dog running across a grassy field mouth open ready to catch a tennis ball.
35:37
Okay, it's a very short introduction of what it's like to try to browse the web with a screen reader will talk more about that. But I know that I have worked with a good number of libraries that don't recognize how big a deal it is to skip that alt attribute. So not every content management system requires it when you upload an image of any kind, you should always consider it to be required because otherwise you are thoroughly disenfranchising.
36:06
One who sees that image and has a screen reader. So let's talk a little bit more about all images.
36:15
So here we've got a picture of a panda and I have two examples of an ALT attribute and if you look at the bottom, you'll see that the alt attribute is simply Panda. That's it. And that doesn't really tell anyone enough about why the pandas there or what the panda is doing, you know in the previous example that I had on this black slide. I'll backtrack here, you know, you can see that the alt attribute is young boy reading a children's book, too.
36:45
Therapy dog. You'll be very easy and quick and convenient to just say hey dog, right or kid with dog, but that doesn't really give someone the full context needed to understand that image. You need to let people know you know, why is that image there? So you and you could even expand on the good example here. It says panda bear relaxing on a large rock. It could be a panda bear with front paws crossed with grass in the background you could you don't want to go crazy.
37:15
Hazy with it the alt attribute isn't meant to be a paragraph about everything that you is going on in the picture because you know other people have lives too, but you do want to give them enough to understand what it is that they're looking at. Remember that quick little video. We just watched, you know, if you imagine if you ran across that picture of the dog with waiting for the ball and all it said was dog that really doesn't give you the full context of the picture speaking of picture you'll notice none of these examples say picture.
37:46
Or image of and you'll hopefully remember from that 30-second video. You don't need that because it will tell the screen reader already knows that it's redundant. You don't need to say it too. So you can just give what that photo or graphic is.
38:03
Is another common question that I've gotten in the past is well, why can't we see the alt tags? We all the tribute and often that question comes up because someone didn't understand the difference between an all the tribute and a title attribute. So if you look at this screenshot here, when you Mouse over event, you'll see this little tool tip pop up view all posts filed under event.
38:29
That's actually a title attribute and you can see that in The HTML just under the main title on this slide and that's great. You can use that but it has nothing to do with really accessibility that the screen reader isn't interested in the the title. It wants an ALT attribute. So in this case, you could it's a link you don't necessarily need to give it an ALT attribute, but it's a good example of what the difference is. So if you have ever wondered why I can't when I use a look at in a site.
39:03
Right on my on my regular browser and a sighted person. Why can't see the alt tag that's purely something for assistive technology software. It's not intended to be one of these little tools tips, which is actually a title.
39:19
Another thing that you can start using is the long desk or long description attribute. So let's say that you have a pie chart a funding statistics for your library and each part of the pie shows where the funding comes from. You can see here that we have in this tag, the image tag. We have both an ALT attribute and the long desperate long description.
39:48
Cute the alt attribute says 3D pie chart of funding statistics are tells people what it is when the screen reader hits it but if they want more information, that's what the long desk attribute is for is it actually provides a whole other page than may give more information about that particular graph.
40:08
So if someone can't see the graph you could say Okay, 33 percent of our funding comes from a you 33 percent of our funding comes from bees or we'll break it down in a text format for Who can't see it? And there's a question that just came in when we are promoting a book discussion is book cover of Insert Title Here sufficient or should be describing. What is on the cover? That's a really good question from whoever asked that I have not been asked that before.
40:35
I personally I would say book cover of however, I'm a sighted person and I'm extremely biased this is something where I would have somebody who has some kind of Visual disability or if using a screen reader and ask them what they think because often times especially with any kind of disability asking people directly is sometimes the best way to get information. I don't have any data to tell me either way on that one. So I'm not sure. I'm the right person to answer that.
41:09
You also want to make sure that you use meaningful images. If you've ever heard me talk about web design and the 20 years of yours really that I have been doing this. This is not a new soap box for me. I'm just giving you another reason to stop doing it. If you have been using cutesy clip art get rid of it. It is totally meaningless to folks using a screen reader. And by the way, it's totally meaningless to people not using a screen reader.
41:33
We don't want it either if you have been using as I've been saying for years the same kind of artwork that my son was putting on his third grade book reports. You are not doing your library any favors as a community institution take a look at the left side and the right side here. We've got some cutesy clip art that people use to quote unquote Jazz something up, please stop cuz you're making me cry and then we have a photo that has them actually realistic Library context in that. These are some folks using Library computers and it may have some meaning in terms of promoting an event or services at your library.
42:07
There should be something meaningful and what you're posting don't post images just to post them. You can use decorative images, you know, in fact, I was just talking with Eileen from info people about this is that you know, like bulleted lists. For example, she was talking about would like for each little bullet is a star in order to make those accessible.
42:29
You would have to say, you know, all the tribute is star star star for each one of them, but if something is purely decorative you can actually Actually still use an all the tribute. I'm going to put this in the chat.
42:42
Would be you still have an ALT attribute but the value of the alt attribute is empty. So alt equals quote quote it's there but it's empty and what that does is it tells the screen reader that this is purely a decorative image and it doesn't have any real meaning shouldn't be using as often. Please get the Cutie clipart off your sights. But when you do have something like for example Eileen sample of stars in a bulleted list where it doesn't actually mean anything.
43:11
NG this is a good thing a little work around that you can do. So the folks who are using screen readers don't have to deal with seeing that over and over. How are you sighs your font matters. Now remember being totally blind is this one as many many disabilities and even one of many visual disabilities that someone might have when they come to your website. So a lot of people are visually impaired but still can see your text.
43:39
So one of the things that you can do Despise them appropriately. What do I mean by that way back in the day and by way back, I mean late 90s early 2000s five sizes were defined in pixels or Point p x you can see there and PT and those are absolute values. Meaning they are specifically defined. They're not flexible at all.
44:06
Which means if someone is trying to size up your text on your website, it's not Not going to size up cleanly, so what you want to use instead or relative values?
44:18
And so what you see here in the green like for example, 1.3 m .78 m the m is the probably I'm going to guess it's the most commonly used relative unit instead of using pixels tx's or PT's use em, there's other relative units you can use Thank you again for people they put up a tutorial with more info about decorative images into the chat. You might want to grab that. That's also from the w3c. Wa I sections so when you use an em what that saying is not saying, okay, this this font is going to be specifically 12 pixels. It's going to be the base size that the browser is showing times 1.3 1.3 times bigger than the base. Same thing for .78. It's point seven eight.
45:04
Times the base so it's going to be a little smaller than the base. This is relative. It will help your text resize more cleanly and it is best practice. So this is something it helps sighted people and people who may have trouble you also have this which can help everyone which is Meaningful link text way back in the day. I know I'm old but it used to be standard convention that links were click here to see x y z.
45:33
So for example Care to see more best sellers and I still see that everywhere and it drives me crazy. The reason that that used to be the convention is because way back in the day remember I'm old. We were literally teaching people how to click a hyperlink. It was a new thing. So we had to tell people click here. That is no longer considered okay for anyone and it's certainly not helping folks with disabilities quick telling people how to click here.
46:00
We all know this and and honestly, it's just Distracting when we already know that people don't read their scanning for keywords. So instead of saying click here for more bestsellers. You can say more bestsellers simply make a hyperlink out of the thing. They're going to get when they click the link meaningful link text helps everyone now speaking of Link text.
46:25
Duplicate link text is kind of an issue. And this is used to be again back in the day. You mean you can be like what I just told were stories about the nineties, but it's important for context to understand where this comes from.
46:41
Come back in the day. It used to be a thing a convention. It was considered best practice to put your main navigation Links at the top of the page and at the bottom of the page and that's because back then scrolling was bad didn't want people to scroll and if you think people are still upset about scrolling you've never been on a mobile device ever people don't care about scrolling anymore. So that convention went away when we suddenly realize hey people don't mind scrolling. That's kind of silly.
47:09
But the Redundant link thing is Still a problem and if you look at this calendar and you think about how a screen reader is going to read this it becomes pretty obvious. For example, look at the Friday the 3rd here the first four links are all the same, right? So there's no differentiation there at all. So imagine a screen reader is going to be reading all day trying to see on my screen with that says Jo o help center. I don't remember what that was.
47:41
But it's going to read that four times and there's someone who's listening that has no way to know the difference and honestly someone who cited doesn't even know the difference. So what you could do here instead is you can help differentiate them by maybe if it's a for example story time, you could have the theme for that particular Story Time add the time or the day to the title. So we understand the difference something so they understand why those things are different and and again, this is another thing that will help your cited.
48:11
Your to remember accessibility can only help you another thing that's stuck around but fortunately not as much I think hopefully I'm praying from back in the day is our table so very early on in the web the only consistent way to lay out a website was in table. So you would literally have a row and you would put your door cell and you would put your graphic in a Cell in order to lay it out. That is long gone.
48:41
Gone, thankfully, it's been bad practice for a very long time once cascading style sheets came around and enable us to consistently lay out a page without using tables that one away. Hopefully nobody here is still doing that but it's important to recognize that tabular data is what supposed to be enabled. So this is a very simple table. This is literally a column of fruit a common vegetables and you can just list fruits and vegetables down, but that's an example.
49:11
Tabular data meeting data that should be laid out in the table because that's how you would want to access it. It makes sense to have the fruit and one column the vegetables and another column Graphics. You can't categorize Graphics so they don't belong in a table if for no other reason and how you mark up your tables is also important. So this might scare you if you haven't seen HTML in a while don't get too scared here though, but I want you to notice the differences are two main differences here between the red.
49:41
The bad table markup and the good table markup, even when we have a table that showing tabular data like our fruit and vegetable table that we just saw so you can see here on the bad table mark up the table tag with the very top does not have a summary field and that's important again for screen reader to know what this table is about. So the summary attribute is something you should be adding to all your tables to the screen readers know what the table is and this case it's a fruit and vegetable table or you could describe it.
50:11
Other way also if you haven't seen HTML back to like since 4.01 or something. I don't know. It's been a long time HTML5 been around for a while folks and I saw that question. Hang on just a second when I come back to it, but let me finish tables. There's also now a tea body or table body tag. That improper markup for HTML is really important.
50:39
HTML5 has a lot of Neat things in it that help folks with screen readers, you can now instead of having just kind of generic dibs. You can have sections and articles and columns all sorts of things. So marking up your tables properly matters, and I've got the let me come back to this question here. So I teach I meaningful link text I get told our older users won't understand and underline won't understand an underline any words of wisdom. I can take back to my own classes. I'm not sure.
51:11
Yes, they Oh and if they don't they need to learn we're not in remember Mike nickname is me Maura. I don't think if you're doing patrons regardless of their age any favors, if you're trying to teach them how the web works and you're not actually teaching them how the web works. If you're trying to show them that something underlined is a link which on the web. The only thing that could ever be underlying ever ever ever is a link is at the convention.
51:38
That's a standard so I guess that would be my answer is that if you really want to teach people how to use the web teach them to use the web not how to use your libraries version of the web.
51:52
Hopefully that answer your question. That's that's why my thought on it. You're not doing any favors for folks. If you can't teach them what's actually happening out in the rest of the world. How do you use color is also essential that I mentioned earlier about webbing having a color contrast Checker.
52:09
Remember not everybody who comes to your website has a visual disability is completely blind and there's all kinds of different color blindness issues that people can have so there's a contrast Checker the URL is here and I'm pretty sure I also have it on the PDF but this is directly from the wcag both levels AA and AAA and so you can plug in the hexadecimal value of your foreground color, which is probably your text and the background color and it tells you what the ratio is more importantly are these little green pass balloons that you see down below.
52:44
It'll also give you red fail balloons, but you know right away whether or not the color ratio you want to use is Okay, A lot of times. I have to come back to a library who wants to put like, I don't know white text on light blue light blue navigation bar and show them all some of the screenshot of this test.
53:02
Like if you know, it's got an awful ratio is failed on every level and we have to find another color for your navbar because people get kind of fixated on colors, but we this is a good way to give them some actual data one last thing that I want to share with you today, and that is that you Can use a screen reader to and I encourage you to do that. I gave you just a little test or taste with that 30 second video, but it's not the same as truly browsing the web with a screen reader. It's a real novel experience. If nothing else and it will really give you an idea of what people face. So there is you might think. Oh gosh for a screen readers are really expensive. And if you're thinking of something like Jaws, yeah, you're absolutely right.
53:48
It's really expensive but There is one that is free that you can download and it is called nvda, which is short for non-visual desktop access. It's a few important notes here. It is literally desktop access and what this means is that you're going to actually get the full experience of using your laptop or your desktop with this software. It's not just for a browser.
54:16
You can still obviously use it for a browser works great and browser, but it actually Give you an idea of what it's like to use an entire computer with a screen reader type of software. It is unfortunately Windows only. I'm sorry Linux and Mac spoke. It does take a lot of time to get familiar with it.
54:34
It's a very jarring experience, which is actually probably one of the best reasons to use it it so that you have a better idea of what some of your patrons might be contending with so get it is going to take you sometime you will it's not hard to download and install but it will take your time to actually get used to We get and having it read things at you in that sort of mechanical voice. And another thing is a little disconcerting. And actually I think that the nvda folks put this in their startup guide is that the page may not scroll while your readers reading so it may read an entire webpage to you, but it's not going to scroll the web page and that's simply because what it's looking at isn't the screen. It's called screen reading software, but that's not actually really what it's looking at. It's looking behind the scenes so you may not see it scroll while it's move.
55:20
Reading so don't panic if you see that and there's also they have a great web aim has a great article. They're getting started guide there and I see another question come in any information about accessibility for people who are deaf or hard of hearing may be about quality of captions. And this is I don't have that off the top of my head. I may have something about that in the resources again. I wish I could cover a lot more today. In fact, maybe this is a question that I turn over.
55:50
To Eileen from info people because I know she was talking to me about accessibility for captions Eileen. I don't know if you have any easy resource you can point this person too.
56:02
To and next question I get says I have zero HTML experience. We use Wix for web design. How do I find the HTML and wicks for things like tables? I have not used Wicks. I can tell you that not every automatic website builder is known to be great for accessibility. Not even every content management system is inherently great for accessibility.
56:33
Oh, and I think Eileen just posted something rev.com. I'm going to guess that has to do with captions. Thank you. Thank you Riley, and I thought you might know more about that. I don't have a so, I don't have a great answer.
56:47
Sir for that. So unfortunately, the reality is is that sometimes to truly make a website accessible you may not be able to stay on the platform. You're on I do not know if Wix is inherently accessible. My feeling is probably not because it's not necessarily their priority.
57:07
There are definitely content Management Systems where it is, for example And info people project says Wicks accessibility. Is that a thing?
57:18
Do we have a oh, okay, I guess not. I don't know if anyone else here and user of Wicks that can answer that question.
57:32
And I'm happy to take any other questions. I'm sorry. I don't know specifically about Wix. I'm going to make an assumption though. You can edit on the back end but without any HTML experience that might not be something you can manage.
57:48
Awesome. So info people just dug up a couple different things that may be helpful to the person with the Wix site. Awesome. I hope there's some good information in there. Thank you so much, and it's a good question.
58:05
I hope that you have a lot to chew on today. I know that you might also have a lot of work ahead of you their resources in the PDF. They can hopefully continue to help you get started. I appreciate you coming today and staying with me for this time today. I really appreciate it. Thanks so much both. Thank you so much Laura for another great webinar.