Webinar Accessibility 56:07
Join us for a dive into the world of PDF accessibility! In this webinar (recording and files below), we examine a few federal and state PDFs and identify areas for improvement, even with existing accessibility tags. Learn recommended strategies for enhancing document compliance with WCAG 2.1 standards, with a special focus on why HTML is the benchmark. Through interactive discussions and live demonstrations, learn practical methods to make your PDFs accessible.
Video
Hello everyone and welcome to our webinar on PDF accessibility,
where we'll be having a candid and open conversation about compliance and best practices.
We are the Training and Development team. I'm Moncerratt. I work in instructional development for ITS.
Our Instructional Designer, Stephanie Corwin, will be facilitating and managing the Q&A in chat.
Alx and I will be presenting. I want to briefly mention we do have The Accessibility Minute, our audio series,
and it's a series of ten short audio episodes that are available on the Training and Development website.
They're each about a minute long. We invite you to check those out.
There are some great tips and best practices for document accessibility, and we also have individual consultations.
We are available on a one on one basis or with your team, and you can book a consultation and we'll include all the links.
But bring us your PDFs, your documents, and we'll help you remediate or better yet,
guide you to better designs and HTML formats and any other accessible formats that are best suited for your documents.
I will now let Alx introduce himself and hand it over.
Well, I'm Alx. I'm just the part of this team of three.
I lead them and we created courses as well as anything training for it.
But today we're going to talk about how compliance is not the same as accessibility.
And how "it looks accessible" is not enough. And that remediation,
no joke, it can be quite a bit expensive. So what we're going to go ahead and do,
We're going to do an introduction of what we mean by these three points.
Then we're going to show you actual examples that we found out there in the wild.
And by the wild, I mean a federal agency and a state agency.
and we grabbed what they had. We randomly did this.
We knew that we could strike gold. And we found a couple of them, that speak to these points that we're going to share with you.
And then at the end of the session, we will not give you a handout, but we are working on a bigger document that will be shared
with this recording. So we are recording this session and we'll edit it and make it accessible, of course, as well as the notes,
so you guys can go ahead and see what you missed in case you came in a little later or in case you want to have some reference.
All right. So before we go into the examples, let's talk a little bit about what compliance is.
Compliance tells us whether we met a certain requirement, versus accessibility
asks the question of whether a person can actually use the what we produce.
So compliance tells us that we met our requirement. But accessibility asks whether a person can actually use what we produced.
That's why- And accessibility also speaks to user experience
and whether the intended meaning or content is conveyed to an end user or a learner or viewer, whoever is accessing that material. And to that point,
a PDF can literally pass an accessibility checker, either the accessibility checker built in, in Acrobat Pro,
if you've been trying to use that, or one of our favorites, which is the P-A-C
the PAC validator. It can pass, but it's still difficult to use, so it's not really accessible.
And we'll see an example soon.
Also, automated checkers identify the potential issues and failures, but not if the document makes sense to a human user.
And again we'll show you some examples. One more thing,
Accessibility is about meeting about the meaning, the structure, the navigation and interaction, not simply whether it passes a checklist.
Instead of that, think of the following questions. Could someone use a screen reader?
Could someone that uses a screen reader understand this document without seeing the page?
Could someone navigate this document without using the mouse? Does the document communicate the same information in the same order?
We're going to look at all those examples. Hey, Monserrat, what do you think about it?
Looks accessible. That should be enough. No, I think that's a that's not sufficient.
I think that looking accessible can have different meanings also.
And I think it usually you require a series of manual tests, automated tests,,
real end user experiences to really identify, you know, how accessible the material is.
Right. So when we have headings they look like headings, but they're not tagged in the background as headings.
Then that's not going to work right. It's not accessible. A list is actually several paragraphs that's not explicitly a list.
a table that is really position text or a table attempting to do a layout that where people don't know how to do it,
using breaks or page breaks or section or column breaks. I'm not going to cut it.
A figure with no alt alt text or alternative text or alternate text is not going to cut it either.
Right? So basically site is sighted.
Users experiences the page so we can see a page.
But then those people who use assistive technology, they experience the document structure.
That's why structure is so important. And one more thing I want to talk about.
Remediation can be an expensive business model.
A typical organization has the following accessibility cycle.
Creating accessible document. Publish. Discover.
Complaint. Remediate. Republish. Repeat instead of design with accessibility in mind.
Create. Export. Test. Publish. When you don't.
When you do the the entire remediation at the end, you might be paying somebody to prepare something that could have been fixed at the very beginning.
And again, I promise examples. So we're going to dig into some of those examples right out.
So I am going to go ahead and show three PDFs that we found out there.
And we're going to talk about it. This is just a frank discussion. And yes, you have 20 minutes at the end of this meeting.
So the presentation, 40 minutes to ask us any questions that you might kind of struggle with or if you ever wonder a PDF, we're very capable.
And if we are not, we will find an answer for you. So here we go.
So tell us a little bit about this PDF. Since you were the one that you founded.
Moncerratt. Yeah. So,, we wanted to have a selection from different departments and also,
state and federal examples just to show you that,, even at,, you know,
top government levels, there are there are some great efforts,
but also some areas for improvement in areas where, pdf accessibility specifically can be improved.
and and then also areas where there is a little bit of nuance and where really
it's a judgment call and and where the manual testing is important to determine,
like what the end user experience is and how accessible a document or PDF is going to be for users.
So stop sharing Moncerratt so that I can see my full screen just in case people don't have big screen.
There we go. So in here you're going to see the double check to make sure I'm sharing what I'm supposed to be sharing.
There we go. You're going to see the PDF that we're going to be talking about.
Okay. So let's start. This PDF is open in Acrobat Pro.
So I am going to open something called the accessibility tags which is for me on the right hand side.
So I'm just going to open that. This is called Accessibility Tree. And if you've done any HTML in the past it's very similar to that.
So Let's go and find some of the very specific things that we want to look at from this.
Okay. So I'm going to go to page number four right.
So this is page number four. In here everything seems to be pretty good.
I'm going to go ahead and select this word that says job. And I'm going to go to find tag from selection.
Because I'm looking at the tag. And I don't want to be scrolling forever to find that place.
Right. So here it is. It's a paragraph. So when I click on this tags it selects what that is.
Then if I click here it shows me that that's a header and grab some tips and tricks.
Okay. So now I want you to go ahead and focus on this area. So I'm going to make it a little bigger.
Okay here we go. And I'm going to go ahead and throw it to Monserrat and tell me what her thoughts about this and what it is,
what is attempting to describe and see if if her opinion jibes with yours.
And then I'll come in and ask them questions. So go ahead. Tell us a little bit.
Yes. I access a document visually. Kind of just read through.
Um, and at a first glance, just based on the visual layout and representation here, it looks like this is a list.
So that graphic on the,, on the kind of in the middle of the page, but,, where there's like, yeah,
it looks like it could be either like a timeline or perhaps an illustration of an abstract,, like spiral binder.
And so it's not a like perfectly clear, but to me, those are, those are like bullet points almost that point to the list on the,
on the, on the right of that, which is to me, I assume it's a list because of the way the line spacing is as well.
However, when we look at the structure of the and the tag tree, you'll notice there are some, even though there is a list tag there, there's some.
There's missing elements as well. But let's open that tag.
The tag is the parent. The list is the parent. And then these are list items.
Okay. So let's look at the first list item. See what we got. So it has something called elf body.
But something that is missing is the list label, which would have been if this was a real bullet a bullet, but is but it is now a graphic behind.
So how is it interpreted by a non-visual browser?
Would be it is a list item, but there's no number. There's no bullet.
There's nothing that that indicates that it's a list.
So so the experience that they're going to here, they're just going to here keep your resume at one page.
But then let's go back to the point that Monserrat made, you know,
at first glance it just looks like it could be the bullets, but it's actually a timeline.
Look. These are in order. So this would have benefited from actually putting one, two, three.
This is a number list. Okay. So you don't proofread, before keeping your estimate at one page, right.
And you don't do certain things. So this is actually the right order. So they could have benefited the site user as well as the non sighted users.
Right. To tell you that this is the order of importance and how to go ahead and do that.
Now are we sequential. So we'd have a number right.
So how would you fix that here. Well we do have a raised hand if you wanted to.
Go ahead. Send. Oh, yes. Will answer questions at the end.
But if it's a write down what your question is, then we'll go ahead and, and address those questions because we have quite a bit to cover.
You'll have 20 minutes. I think we can also, unmute, when we do our Q&A as well.
If yes, yes, we'll unmute you. Okay. so what to do here?
How do you remediate this? Well, if you're the owner, I already gave you some advice.
Make it a number list.
If you are not the owner and you just happen to be the unfortunate soul that's going to remediate this, can you make something up?
Well, that's beyond what we're going to cover today. But the workflow would do something like this.
You go here, the list item, you would create a label. But then what do you graph from here.
There's nothing I can select from here. I can also not break this because this is one image.
So I cannot break it into different little parts.
What I would need to do is edit the PDF, make sure that there's a bullet here somewhere that I can grab a picture or a character or a bullet,
then make that dead label and that is a consuming process, right?
So this is one one portion of this PDF where they could have done a little bit better, but it passes accessibility with some warnings.
Right. All right. Let's move on. So I want to go ahead and really show the next one.
So the next one is on the next page I'm going to ask you a question really quick.
And we have some shapes react with a shape either.
Thumbs up if you think this is a table or laughing face.
If you think this is a list. So go ahead kind of take a minute and just react using those one of those emojis.
Okay here we go. Laughing faces.
Yeah I see a thumbs up. So that's good. Comes up as well. Okay.
All right. So what is it. And what did they call it here in the actual document.
Right. So we want to go ahead and find out what sort of item is this.
Well in the document it's telling you that it's a list.
Now, I want to do something here and provide you the same information as how we experience by somebody who is just listening to this.
So instead of running it, I'm going to show you visually how it comes across situation.
Describe the situation you're in. Task. Describe the task for action.
Describe the action that you result. There shouldn't be a a column there because it's not their result.
Describe the result of your actions. this is where right now I'm going to show you a different version.
There you go. So this is the version of for a table that has a proper heading situation, describe the situation.
You're in the task. Right? So the experience is even visually is different where here the perception might be a table.
It's not. It is a list. So it's kind of difficult to tell.
At first I wasn't sure, and I thought maybe it was the list because there's no distinct heading.
So it was a little bit confusing for me at first. Also just visually.
Like which is supposed to be. So if you guess that it should have been a table, a table, that's what a table tells you.
Data. It parses data visually. And in here they decided to go with a list.
And I can tell you that they might have used a program or they did manually where they make that call here.
Well, you could also make a different call. And even if you're not the owner, you could create a table label.
And then the first row would be the header. And if you notice these are bold also.
So the first column is also technically a header. So you have header on the row and the column.
And then the way people get to experience as they tabbing through the content or is being read to them aloud,
then they'll get to hear the right order. So if they click here, if they were to be here, then they would be here.
This is a situation action described situation you are in. Describe the action that you took and how you did it.
So again, a very pretty picture that looks like a table that is not a table according to the structure.
Right. So you could fix it.
But if you had been the designer, you could have made one distinct choice, which would have been to add a header.
And then it could be a list, because then the context would be header list.
Right. So this is about this right now without any context context.
And it's not really a format table.
Then it's a little bit hard to kind of digest what this is about.
Right. So if you were to remediate this and also brings up the question if this is not a document that you own or your department owns,
but you're presenting and it's an external source. In this particular case,
you would be able to re tag that portion into a well formatted table and not have to change or edit any of the content itself,
because you would just designate that top row as the header.
Right. And also another thing to consider is that if you change this to a table here,
the original document, if it's sent to you again it will strip it from anything.
So if it was done indeed as a list on, say, InDesign, it's going to come over again as a list and you'll have to redo the table.
So that's kind of something to notice. Yeah.
All right. Ready for the next one. Let's do it.
Let's do it. Okay. So this one is from the Department of Education.
And we're going to look at three pages from that. It's a it's a pretty long document.
Okay. Yeah. This is their strategic plan. It's a previous version I think 2022 2026.
So the first page is intentionally blank. So maybe they should have say intentionally blank instead of just given to me blank.
But I'm just splitting hairs here. Right. Because they do do it on other documents but not on this one.
But let's talk about this this specific page.
Go ahead and answer you. You do this one and then I'll chime in.
Okay., so for this one, the original document and you might and maybe navigate to this,, tag,
but or actually it's not in there because that, photograph of Miguel Cardona and the,
the part the US Secretary of Education in this particular document, there is no tag for this figure,
in PDFs, images are designated as figure tags, and it's missing.
And that is because in this specific document, that figure was artifacts.
in other words, it was set to be decorative,
which means that a screen reader or assistive technology would skip over that as a decorative or not a meaningful image.
And our team had a discussion about whether that was, accurate or appropriate for this case, given that at the end of that letter.
So this is a letter message from the Secretary. At the end of the letter, there's a signature,, of Miguel Cardona.
So that would I mean, in a way seemed a bit redundant.
However,, the actual the image is,, you know, I feel it's it's significant.
It's an official portrait., it carries it conveys the meaning, and therefore it should not be artifact or set as decorative,
but rather included in the tag tree and included as a meaningful image with meaningful alt text or description.
And our,, instructional designer Stephanie also pointed out that section 508,
actually has specific information and instructions on how official portraits should be,, described and tagged.
So here we go. Text., let's.
So again, the question is, well, how you read me and I went back and forth, should I show them how to do this.
And I am going to show you because this is like a heinous, event that was done to this PDF to por Miguel.
So let's do it or Doctor Cardona. So in here I'm going to go to the page where it has that,, missing.
So I'm navigating to the Content button in Acrobat Pro, I'm going to the page.
I'm trying to find where that might be. I'm starting from the bottom going up.
There's the picture. There's the text that was also artifact. I'm going to focus on the picture on the image.
So since this artifact, I need to take it out of this and create a different container that is an image or a figure.
In this case put that image in that container. So I'm just dragging and dropping that little picture.
Yes, I'm going super fast and I'm going to put it outside so that it doesn't have the artifact.
So see if this was the old artifact I'm going to delete that because now it's an empty,, thing.
I'm an empty container, so don't eat it. And now it doesn't say artifact, but it says figure, right.
And I have it selected. So here it is. Now I go back to my tags and I find where I want to put it.
So in here there's the first paragraph. Right.
So it has to be before the first paragraph in this scenario because it's three pages long.
So I'm going to put it right here as the first thing that gets read.
So here we go. I am going to go ahead and add from the top right hand corner.
Another tag. Go figure. I got that figure right after the paragraph but I want it above.
So there it is. I select that tag and I go back to where this image is right.
So going back to the content panel. Yes. Kind of toggling between content and tent panel.
And then once I have selected it I go here. My figure is still selected.
And then I go create tag from selection. So now I have the tag.
So I'm halfway there. The next thing I need to put in there is what alt text.
So I'm going to go ahead and right click on the image and go to properties. And then where it says alternate text for images?
I'm going to paste what we already decided. It's official partner doctor Miguel Cardona, US Secretary of Education.
Click that. And I would save it. Right. And now this would read as follows.
Message from the secretary. And then they'll tag with show.
Right. Because I just saved it and it would read official portrait of Doctor Miguel Cardona, US Secretary of Education.
Then I will jump onto what he's actually saying. So they shouldn't have our artifact at this image.
And the point of this is that when when to artifact is only when it is a decorative element, right?
This is an official portrait like monster. It says. So it's a big deal that we describe who that is.
And I have seen actually this on some of our newsletters. There are PDFs at our school Where they wanted to archive that artifact out.
And I said, no, no, no, no, no. Let's just keep that person because it's an official person that has an official title.
And they went to trouble to go ahead and give us the picture. And it's an important thing to kind of introduce that.
Again, remember structures. It's experienced by that person who cannot see like we do.
Right. I mean, your experience is a nice picture of him and telling you his name, right?
I bet you, most of you not even know that it was a Latino noun, something named that was in charge of that, right?
So that's what this is about, to make sure that we have equitable experiences as well for those people who are using assistive technologies.
Okay. All right. Next one. Now I have fun with this one.
I think you skipped over a point on the last. Yeah.
So do you want to I did, but I did. I was going to talk about the TLC.
So let's go. We have TLC or the color contrast strategic copy.
have done. We have done so. This is a table of contents that was kind of like forcibly done,
not by the program from which this comes from, but from the person who did it, the tags.
Okay. How do I know that? This is how I know that when you look at table contents, there should be only one table of contents.
But if you open that table of contents tag and I'm looking right here,, on the lower right hand corner.
Right. That's where I have my tag right here displayed. I'm going to now display the table of contents item okay, which has a reference okay.
And it has a link okay. And then it has another POC in there.
See that TOC. So there are embedded TOC inside this document which makes the navigation a lot more complicated.
So essentially you have TLC's nested within TLC's.
Yeah. It's like layers deep. And it shouldn't have to be that way.
Table of contents. It should be one item, one, 2 or 3, and then one item once, literally toy two, which stands for table Contents item.
And then inside the item you have anything that you need to convey that this is where it's going to take you.
Right? Highlights. Right. And again this table contents has that issue.
I'm just letting you know don't use embedded table or table or contents.
And then and then for the next questions like where can I use embedded list.
Embed is list of different actual embedded lists can tell you that there is a subject, right.
And then a sub subject and a sub subject here that is a table content.
So you don't need that and it just adds more structure that is necessary.
Any other thoughts about the table of contents? once.
Right. You want to share?, just that sometimes these nested errors occur not manually by somebody mis tagging,
but they can also occur with some auto tagging where the the application just tries its best to discern what was intended with the visually and,
and it just creates a tag structure which may not always be accurate. So that's why with auto tagging,
you want to make sure you verify that it's the correct structure and you don't
have additional like nested tags where they should where there shouldn't be.
Okay. Now let's talk about one of my favorite subjects in life.
Caller so for this it's on page 25.
We're going to look at this because this doesn't pass a validator.
It says that there's some color contrast issues. And this is what the issue is found on this on pages like this one.
So for that I am going to use something called the color analyzer.
Okay. It's a tool that we use to to check out for color contrast.
The link is on the chat and this I use it.
I'm going to click on this little color picker inside the tool, and I'm going to drag it.
Or without dragging no clicking hole. Just move your mouse my mouse to where the one is.
So that that is the sorry, I did it backwards.
I'm going to select the background first, and then on the top color picker I'm going to select the color of the number.
And right now it's telling me that the contrast version is 2 to 1, which is not ideal.
And because all of us already have committed to memory, the the contrast ratio is proper.
Um, you don't need to know anything else. No no no no no. See, you see this tool, it tell you why it doesn't pass.
So if you click right here, it tells you that the ideal contrast would be 4.5 to 1.
Some people write it as 5 to 1, right, for regular text.
And it tells you what a regular text size is supposed to be, and for large text, which is 18 points to 24 points, it should be 3 to 1.
Well, this one fails on the regular text as well as the large text.
So, Moncerratt, how would you go about fixing this?
So it looks like in this design there's a decision made to use a lighter version of that
kind of olive green tone for like balance or like visual harmony of that large one number.
But since it doesn't pass and there's obviously not sufficient contrast,
I would make that one lighter to the point where it's where it reaches or exceeds that ratio.
So you could make it a white color so that there's enough contrast,, between the, the number and the number one and the green background.
Right. So that would require editing the PDF. Correct? That's correct.
Or going to the original source. And then I mean they could have made this one quite.
Right. Or make that choice if it's, something close to white or something that is more contrast to the background.
Right. Now, again, you could remediate this, but again, it requires editing the PDF.
So you would go here, you would highlight the specific number.
You change the color and just use white. So I can do this quick.
Okay. But that doesn't change it. And it can't potentially change your document.
So in this case it lowered the number one down a few spaces.
So then you have to do all this gymnastics to kind of.
So it might select a different font too. And they might.
Yep. Well let's let's pretend that you match the font and exact positioning.
Right. Then what? Well there's more.
So not only did the contrast doesn't need. It shows.
And I'm using the pack just to kind of demonstrate where this is showing. So where it the color contrast fails and it's minimum.
It's not just on that one. There's other areas. Right.
Because this is kind of like what they did for the chapters. Yeah. Now if you're wondering.
But I can see it. So what's the problem? You can I have a hard time looking at this one and this one, but the other ones are okay.
Whatever. But then those that I just pointed out disappear for me.
So in here, you would have to select that number and then make it a certain color.
If you remediated the the file like the PDF, if you don't have access to the to the main file, then there's another thing.
So I'm going to go ahead and select this number one. And then again go to to find the stack from selection so that I can find it real quick.
So here's this is what it is right. And it goes one through five.
So this is heading three. And inside heading three they have strategic goal one promote equality equality equity and student access blah blah blah.
Right. So let me ask you something is that is does that look like the right order to you.
When you read first strategical one. Yeah.
Which one would you put first if it's again one through five.
Well I'm going to argue that maybe the one should go first. So I need to move some of this stuff around.
And again because it is a text that is standing alone in a tag for H3.
I could go ahead and do this now. Watch what I'm going to do. I'm just going to bring it over here.
Hey, happy days. I achieve what I want it to do. Well, let's look at the reading order, okay?
That's what I'm getting at. So right here, this little Z button on the right hand side, I'm going to click on it.
And then I am going to go ahead and go to the page.
This is the page. And then this shows me the order. So this is number one.
This is number two. This is number three. So I need to change the order also on the reading order.
So it makes sense. So I'm going to drag this one and place it right here in the first position.
And now this gets read first. This gets read second and this gets third.
I would need to do that for different times Again the decision when it was when this was put together.
Certain decisions could have been made, no matter what software you use,
so that the order could be respected in the order you wish the people to experience this.
Okay. Anything else about this? That's right. I think you cover the main points.
Um, yeah. Just that even though this document was designed well visually and there are definitely accessibility tags,,
associated with it, there are still areas where it falls short a little bit and,, room for improvement.
So. Yep. Okay. So we have five minutes.
So we're going to go ahead and talk about this document. Okay.
All right I'm going to make it as big as possible because I just kind of want you to kind of take it in.
This is the first page and this is from the California Department of General Services.
It's a document on an alternate text for figures or images.
So they're trying to teach you with this document how to properly add alternate text using Adobe Pro.
Okay. So here's what it is. I'm going to open all the tags.
Okay. The first thing that I am a little concerned is is there's no header one.
It's just a paragraph. So I could fix that.
And actually we're going to provide the remediated version,, of this so that you can see how it got done.
And then there's a paragraph, another paragraph a picture.
So it's a picture. And we know the picture should have alt text. This is the alt text image of a simple image.
So I know you could do better. I don't know why they decided not to do better on this,
but there's some clues later on that I found out that the reason why they might have chosen to do that.
So so this is an example where the document might pass an automated checker.
Because it has tags it has paragraphs, tags.
It has alt text. It has figures for images., but there's the actual tags themselves.
And the actual alt text is not necessarily conducive to accessibility.
So right. You know, you knew it was a car of some sort. Right.
So I am describing that now in a little more detail. That is a diagram showing a car from different views.
Okay. So I'm fixing it right there.
All right. Second paragraph. The next paragraph from the accessibility checker plane.
And then and then I'm like okay cool transition.
Let's go ahead and look at this. It tells me what to do.
And then does the figure again have some alt text that is, that is that allows me to do the better the better thing.
And when I looked at it, it's just a image showing figures.
Alternate text fail error. Okay, well, that could be better.
The action shot is all on this.
The accessibility checker in Acrobat Pro, which means that it was accessibility checker for Macro Pro because it was so like not in the text.
It was just in the image. Low resolution. Yeah. I thought it was low resolution.
Okay. So then and it's specifically it's a screenshot.
It's not just an image. So that yes, as you correctly added to your custom alt text, it specifies that you're looking at a screenshot.
Right. So and then what the and what the relevant part of that screenshot is.
Right. Right. Here we go. Right. Then I jump to the next paragraph the next page.
And then I see this rando two. And I'm like, wait a minute.
Could the first paragraph before the paragraph before that been one?
But they forgot to enter. One and then if I looked at it again. Yes, they forgot to enter.
One so this is like step by step instructions.
This is instruction number one,
but it doesn't have a header telling me that it's instruction number one and that it has a number to let me know that it's perhaps even a list.
Right. It's not formatted as list with list tags. If that were, you know, the intent to make it a number.
Right. And again, same thing. Right. 2345. So there are steps.
There were meant to be steps. Right. Could this have been a typo.
Let's go ahead and hope so that this was a typo right.
And and but to make this more more accessible better for everybody a simple header saying step one.
Step two or accept we could have h2 h3 h4.
So which would make a better opportunity. Yeah.
For all, for all the readers of the document because I missed that as well, that this was a sequential.
It just went from glancing at it that it was like sequential step by step process.
Especially without with the missing one on the first step. Right.
So whenever you look at at images, I would say you should ask these questions for yourself.
What is the image. What why is the image there? What information does the image communicate?
Does the surrounding text already communicates some of that information or all of that information?
Then distinguish if it's a decorative image it needs to be an artifact informational image,
meaningful alt text, complex image, short alt text, and longer explanation.
Charts and graphs. Communicate the data or conclusions have.
Give me the data table right underneath the chart. It doesn't look any worse than having this.
Just a chart. It's better.
And also, if it's a screenshot, describe the relevant portion of the screenshot, making a little square box around it like how they did here.
That's not enough because I'm using color in some shape that is not a, you know, conducive.
Yeah. If you're showing a process on your screenshot or infographic, describe, at least in general sense what the major steps are,
what the general process is, and then, you know, have your full explanation and text version on the rest of the document.
And also, if it's a diagram, describe the relationships, right?
I don't know a lot of diagrams in our campus. And and they just want to go ahead and put everything on the alt tag.
Just give us the that short tag and then a long description describing the relationships.
Right. Think of an art chart that that might be simple for us to go ahead and proceed, but it's kind of hard to describe once.
You just have to listen to it. All right.
Okay, so we're at 341 right now. So now we can we can unmute you if you have any questions.
And Sandra, I hope you're still here so that you can ask.
there was a question, actually from Jake Terpstra that I answered in text, but I wanted to make sure that you guys had a chance at it.
Um, let me just share my screen really quickly. Okay, so Jake's question is,
if there is any guidance available for PDFs that are generated by a program where we don't have control over the formatting,
for example, extract of a report from power BI or Fin hub.
And are those PDFs from those programs? Yes.
They're generated reports. Okay. If it's a PDF that was generated, there's something in between.
Whatever is generating the report should have some of the rules, right.
Like the reason it's not accessible is because the tool is not adding the semantic, the, the accessibility tags.
Can you program can you program that? Yes, but the vendor is not going to do it.
It's going to have to be like a homemade thing with an AI, probably behind the scenes doing that.
Like some of our, schools have done some of those kind of workarounds.
If you have the PDF, it's a manual process. What I would advise you to do is strip all the tags.
Start over. Have the tags be generated automatically from Acrobat Pro and see how it does it.
That's the first pass. Then it would be a manual process to say oh yeah that's not a that's a table.
It has a header and it has a row. There's a header.
And then a first column is also a header and it has a title.
So then you have to kind of describe that manually. It's a manual job.
But my question is why is it a PDF.
Why could if it's already a dashboard like RBI, why are we not giving access to the people to go ahead and have access to the power by.
Which is a little bit more accessible than a PDF.
And what I mean by a little bit more accessible, dashboards by the nature are going to be described as tables.
So they already have some embedded accessibility, and it takes just a little bit more to make those truly accessible.
And, and the companies are still making stuff accessible. You know, there's a lot of hate through like Canva, for example,
which is a favor this designers tool even this week they made something pretty cool.
They made a pretty good color contrast tool.
That is awesome. But all these tools will be improved for now.
It's a manual process. I would I would suggest that you don't provide them as PDFs.
You provide them as the native dashboard. That's my take on it.
And again, it's data. You could in theory, you could also take that data and generate a table literally with some PHP.
Okay. Let's see.
Sandra has her hand up. Okay. Could you.
Could we unmute her? Here we go. Go ahead.
Sandra. So my question is sort of a follow up to that.
I mean, I think, you know, I'm thinking about Fan Hub and we allow campus users to go in and they can get the reports on their screen,
but they have the ability to export those as PDFs. And I can imagine there are cases where somebody wants to share data with someone else,
maybe a dean or assistant dean, and it says here around this report, take a look.
You know, are we expecting those folks to take that PDF, make it accessible before they share that with the dean?
How do we how do we manage that? So the rule, the rule about sharing documents is like, if you're sharing it with me and you know,
my limitations, Sandra, and it's just with me, you know, you can share with that.
Whatever. However, you and I have communicated. Yeah. Send me a PDF.
Right. The problems begins when it's more than one.
When it's like publish on a website. Right now it's available to more than one.
It's a it's available publicly to somebody or internally.
Internally to many people. Here's here's the example I like to use.
So imagine currently we don't have anybody who works for us who is a blind.
Okay. We would and we find this candidate who is blind.
So they're going to need to have a couple of systems, the same PDF that you would share with me.
Now you and I have responsibility if they are part of our team, to make sure they're accessible.
Right? Okay. Because we want them to go and to incorporate that.
So it's the public. So the one on one it's not.
It's when it's shared with a group.
Right. And it's because it's published and now people can access it.
So then if somebody finds his document and they find it, even if it's a member of the public,
because we are a public university, even if somebody finds it, they might go ahead and say, hey, can you make this accessible?
And then we have to comply. Right. So in the past we've done that.
Well, the law says now that we have to be preemptive. So, you know, still they'll find some stuff it's not accessible.
And that let us know and we will go ahead and comply and make it as accessible as possible.
But the the standard we never had a standard until now.
So now they're standard there. So now there's a law that ask us to follow the standard.
So does that answer your question Sandra. Yes it does. Thank you so much.
Okay. Actually some people were thinking that a workaround would be, well, can I just passively protect every file and just share it with.
Yeah, you can do that. You can do that in box or even in Google. But then it becomes a problem when it gets out of that group.
Right? So it's like, hey, look at this neat work report the standard did for me.
And then all of a sudden it's out there. That's when this kind of issue.
Okay. Thanks, guys. Sure. Any other questions?
I'm going to put it in the chat., a link to our The Accessibility Minute ish video series that is scheduled to be released next week.
So, yeah,, this is just the,, the link where the videos will be posted, so they're not up there yet.
Um, but they will be. You need to provide the URL separately.
We can't do meaningfully text on our instincts. Yeah.
Let me let me,, grab that. So what she's talking about, because it's, it's a video.
It's a video version of more of the same, the accessibility minute.
It was just audio. We wanted to make sure it was something that was accessible real quick until we kind of figure out,
well, how can we make some videos more accessible and we figure it out.
There's a video about zoom on how to make your zoom settings a lot better.
and then that gives the collateral to be able to make accessible videos.
And although they're short, although most of them are less than 3 minutes or 3 minutes and 26 seconds.
Um, and it's it's ten of them.
The last one is kind of like a summation of everything else,
but it is a visual video representation of some of these common issues that come up with when remediating documents,
including how to build a well-designed, complex, word document that you can export with confidence.
And it will be pretty darn accessible, after you export it.
Um, sometimes people say, well, you can't create anything this pretty.
It's also accessible., say, I haven't been able to I haven't been able to find something that you know that it's pretty.
That could not be made also accessible. It's just the decisions that we made along the way, right?
So just just for fun, while we're waiting for more questions, anybody else has any other questions?
I do want to just comment on a question that,, Shawnee had,,
asked about whether the accessibility requirement applies to campus or divisional letterhead templates and correspondence created using these,
for example, an offer made to a job candidate or an MOU between departments.
And, Stephanie answered the question, but also I wanted to,, to mention that the UCSB branding,,
has some templates available that you can download, and they can be customized for your specific departments.
And there are additional letterheads, I'm sorry, additional templates are available, and aside from letterheads, there is also.
Templates for slide decks, including PowerPoint and Google Slides.
So let me get that. Let's get that URL and we'll share it in the chat as well.
So this is an example of an exercise that I that I did recently where I went into InDesign.
I made a PDF. Didn't care what the tags were, I just had to just make a PDF.
And then from PDF I save it as a word document and then it gave me something.
Um, it was kind of challenging to look at.
So then I'm like, okay, well, I'm going to go ahead and use this word to kind of duplicate some of the styles, design styles that they chose here.
Like for instance, this is just this is two columns. This is not a table.
There's no tables on this. You're not sharing right now Alex. Sorry about that.
I stopped the sharing and then I went away. Here we go. Thank you.
So here we go. Right. So this was a again an InDesign template that I exported.
Right. Is not accessible. It was not accessible. Then I save it as a word document.
And then I went through word. And then without the use of tables, I redefined what an H1 was, an H2 right?
To match what it was. This is not a box. This is not a floating box.
This is made exactly how it's supposed to be made, which is controlling the spacing between the margins and also the the color on the paragraph.
So the color of the paragraph is selected.
And then you select the paragraph that you want instead of making a box that is floating.
Right. So all this is achieved without any of that. This is two columns. This Yes.
One column and again using the margins. You can see here there's a margin right there.
And then March stop right there. And then a graphic on the background. That is our artifact.
So I was able to do this just with.
Spacy. Page breaks. Section breaks. Column breaks.
Right. And it didn't take me long, but it does require that I.
It did require that I knew enough about word to know that it could do certain things like,
you know, column breaks and section breaks and having two sections of one page, etc..
Right? This could be duplicated in Google, but it would be more difficult.
So that's why I chose word and about word. This is fresh news right after press.
For the first time ever, you could actually have a form that you design in word,
be exported, accessible from word to a PDF by using something called Access Word.
I downloaded the demo because I got so excited and that is something for something some other time.
But I wanted to let you know that there are tools, and there are plugins that allow you to do more of accessibility.
I mean, it's a whole industry that is exciting.
Previously that was not available for yeah, that was even a simple form, even if it was not accessible.
Right. Great. Right. So yeah. So just to kind of summarize for that your workflow for that particular document you started in Canva.
Right. And then, you know, InDesign, you started InDesign. Sorry, but I can start Canva also.
So you exported I export it to PDF.
PDF then to word. Yep. Fixed up whatever remaining issues needed fixing.
And then you could export to PDF.
Yep. Again with a little bit better. Oh, yeah. Results.
Yeah. Yeah. Because when I look at this and I check for accessibility. It says hard to read, right?
So this is the find some stuff. Right. Well, I know why do you need that?
Because this is not the color background. This is white on white.
So yes, I understand that. So this is where the human element comes in. Right. Right.
And then this is this also has issues that will report because again it's white on white and then white on white again.
Right. So why does it pass it. Because here as a warning I'm using my human brain to know that.
No that's good. That's it. Then I exported as PDF.
And then when I went to PDF there was very little I had to remediate.
Like, there was like two things that I had to kind of make sure that I had include it.
So yeah, that would be very useful for like thinking like long documents, like annual reports and just multi-page content.
Yeah. Right. Anybody else has any other questions? Burning questions.
Questions that you were wondering about PDFs at all. So we don't go at this alone.
We're going to provide you a document,, that will have some of this information and more.
Right. We didn't get to talk about how a PDF really has three layers.
There's a visual layer, a structural layer, a semantic layer.
You know, I'll show you this,, and that the visual layer check for these things color,
contrast, font size, whitespace, headings, tables, links and images.
Then the structural does have headings, does have a right hierarchy.
You know H2 cannot become before one and H3 cannot become after H1 and then list tables, figures, navigation document language, bookmarks.
And then the semantic does it the structure communicate meaning. Right.
And Then we will have and this will be nicely formatted for you so you can decipher what we're trying to tell you.
Automated, automated testing can identify these things. But then human testing.
They're not getting rid of us so quick. We can do this.
And exciting news. AI is attempting to do some of this stuff, but it requires a lot of documentation from humans to teach it.
Okay. The alt text is meaningful. Okay. What does that mean?
If a picture is missing the alt text.
Well, in the early days and still right now, if you use word to generate with their AI, the alt text is going to be very brief, very minimal.
Very, very, very cheap. But then if you use something where you have access to a true AI and you copy and paste or attach the image and you ask,
you'd be the best meaningful alt text for this image, because now that model, understand what we mean by that.
It's going to give you something way better then. Yeah. And I will associate.
Like the context of the rest of the document or whatever., yeah, we'll contextualize it better, right?
So remember, it's about patterns, right? So if it has a pattern, if it's missing something on the alt text where it should be there, that's a pattern.
So it knows what to look at if it was missing the tags altogether. Patterns.
So it's all about the patterns. So we're going to go ahead and provide something for you that is in a way better or inaccessible of course,
so that you can, get probably a little bit more than what we did here.
I look something like this while we're waiting. Still working on it.
Okay. All right. Anything else or any PDF that you have where you have a question?
Other than that, we have three minutes, so we'll stick around. Just in case you're shy.
We'll stick around for five more minutes after the top of the hour, but thank you for coming.
We really appreciate this and thank you for coming soon.
On other topics, or if you have a topic of accessibility that you want us to explore and share with the rest of campus,
I know the video is something that people are maybe worrying about.
How do we go about that? Well, we've already gone through that.
So we have some advice and and with the standards and there's much more about accessibility and get excited because again,
as of this week combo is being added, Microsoft being added, creating better accessibility.
I'm very excited for what's coming down the pike in terms of accessibility.
So thank you. Yes. Thanks for joining us. And for you to visit our website.
We will post the recording of this session, along with the accessible slide deck and all of the links provided.
And we will also include a handout with additional resources.
Sample files
PDF Example #1: Further Your Career
Google Drive · may require sign-in
Open opens in a new tab
PDF Example #2: Strategic Plan
Google Drive · may require sign-in
Open opens in a new tab
PDF Example #3: Alternate Text for Figures or Images
Google Drive · may require sign-in
Open opens in a new tab
Remediated PDF Example: Alternate Text for Figures or Images
Google Drive · may require sign-in
Open opens in a new tab