1 00:00:01,020 --> 00:00:03,020 Equidox by Onix 2 00:00:03,679 --> 00:00:05,279 Reach everyone 3 00:00:05,279 --> 00:00:09,058 Hello everyone, um, welcome to Equidox Webinar Wednesdays 4 00:00:10,000 --> 00:00:14,179 Today we're going to be talking about tagging images and alt text best practices 5 00:00:15,360 --> 00:00:18,959 So, many of you may have been on our previous webinars, but we do again 6 00:00:19,039 --> 00:00:22,479 Thank you for for attending today and for your time and attention this afternoon. 7 00:00:23,039 --> 00:00:27,619 Just before we get started just keep in mind that if you have any follow-up questions, 8 00:00:28,320 --> 00:00:35,059 Or would like any more information regarding Equidox. You can certainly reach out to us at EquidoxSales@onixnet.com 9 00:00:36,320 --> 00:00:38,320 Or visit our website at www.equidox.co. 10 00:00:41,120 --> 00:00:43,120 Okay, I'm going to jump into 11 00:00:43,340 --> 00:00:46,079 Equinox, and we will talk a little bit about how 12 00:00:46,960 --> 00:00:52,480 How we can provide alt text for images, uh using the Equidox interface 13 00:00:53,280 --> 00:00:57,840 Uh, so the first thing I want to do is uh, just jump into a sample document here 14 00:00:58,559 --> 00:01:04,639 And many of you who have used Equidox before are probably familiar with this. So this might be a little bit of a review. 15 00:01:05,519 --> 00:01:09,118 But it's always good to talk about best practices for writing alt text. 16 00:01:09,840 --> 00:01:13,060 And also how to sort of streamline your approach to doing that within Equidox. 17 00:01:14,479 --> 00:01:18,559 So when you arrive at the document detail page of the PDF document... 18 00:01:19,200 --> 00:01:21,519 The images tab is the third tab in 19 00:01:22,159 --> 00:01:26,478 From the from the left and if you ever select this images tab what you'll see 20 00:01:27,040 --> 00:01:28,560 in your document 21 00:01:28,560 --> 00:01:31,280 Is a consolidated list of images. 22 00:01:31,920 --> 00:01:34,320 That are currently located in the document. So 23 00:01:35,680 --> 00:01:42,319 You are then responsible as the remediator of this document to provide alt text for these images 24 00:01:43,200 --> 00:01:45,200 Now one thing that's important to remember 25 00:01:46,000 --> 00:01:49,519 about alt text is the context within the document 26 00:01:49,680 --> 00:01:55,199 so that's a big theme that we'll be talking a lot about today is the context for... 27 00:01:55,600 --> 00:02:01,759 How does this image relate to the document that is around it? Um, so when you see different images 28 00:02:02,399 --> 00:02:03,759 you might... 29 00:02:03,759 --> 00:02:10,979 you might be wondering like how in depth do I need to go in describing the--whether it's people or objects or logos? 30 00:02:11,680 --> 00:02:18,160 It really does depend on the context of the document and what the actual publisher of that document was trying to convey. 31 00:02:19,040 --> 00:02:20,000 now 32 00:02:20,000 --> 00:02:26,399 since I'm here on the images tab within Equidox I'm looking down this list of images and I'm seeing things that look like 33 00:02:26,640 --> 00:02:31,279 You know, logos. This sort of looks like a sort of a black background image 34 00:02:31,840 --> 00:02:34,000 I have little gray squares here. 35 00:02:34,480 --> 00:02:34,640 I'm 36 00:02:34,640 --> 00:02:39,919 Not really able to tell exactly what's going on with these images in the context in which they're surrounded. 37 00:02:40,400 --> 00:02:42,400 By simply looking at these thumbnails, 38 00:02:42,800 --> 00:02:44,800 now if you are familiar with the document, 39 00:02:44,800 --> 00:02:50,639 if you do know exactly what these images are and what they represent you are able to use this images tab... 40 00:02:51,120 --> 00:02:54,500 And then provide your alt text right here from within the same location. 41 00:02:55,120 --> 00:03:00,080 So you can really streamline your approach to to tagging these images by using the images tab. 42 00:03:01,200 --> 00:03:04,319 So providing your alt text it might be just a few words. 43 00:03:04,400 --> 00:03:05,920 It might be a full sentence. 44 00:03:05,920 --> 00:03:08,800 But you can just go right down the line and start typing in your alt text. 45 00:03:09,280 --> 00:03:16,000 And then the key to remember is to save your image properties when you're done adding alt text here from the image... 46 00:03:16,239 --> 00:03:17,519 from the images tab. 47 00:03:17,519 --> 00:03:21,359 So there's a button at the bottom to save the image properties and then there's also a button 48 00:03:21,760 --> 00:03:23,760 in the top right-hand corner as well. 49 00:03:24,720 --> 00:03:27,359 There's a lot of different ways to utilize this images tab... 50 00:03:27,680 --> 00:03:31,540 and perhaps I'll just return to this on a different document, but I actually want to get into 51 00:03:32,159 --> 00:03:33,920 this specific document to 52 00:03:33,920 --> 00:03:40,000 get a little bit more context as to what these images actually are, and what they represent, so we can start providing all text 53 00:03:40,480 --> 00:03:46,080 So in this case I'm not really able to determine you know, what does this black background mean? What does this gray square mean? 54 00:03:46,319 --> 00:03:49,199 I'm going to actually jump into the document to take a look at them. 55 00:03:50,959 --> 00:03:56,798 So when you open up the document and you arrive in inside here, you can see that 56 00:03:57,599 --> 00:04:01,919 that black background that we were seeing on the first on the images tab is very clearly 57 00:04:02,640 --> 00:04:07,679 sort of just the background image for this entire slide, which is the slide deck that we're using today. 58 00:04:08,799 --> 00:04:09,840 and 59 00:04:09,840 --> 00:04:10,720 since 60 00:04:10,720 --> 00:04:16,320 I'm, not really going to be able to describe this image and provide any real value to the to the document... 61 00:04:16,959 --> 00:04:21,119 This is an example of an image that you are welcome to hide and artifact. 62 00:04:21,919 --> 00:04:23,919 So that you're basically removing the 63 00:04:24,620 --> 00:04:28,399 responsibility, uh or your responsibility of providing all text for it. 64 00:04:29,199 --> 00:04:32,559 So in this case what we want to do to get rid of this... 65 00:04:33,120 --> 00:04:35,120 this black background image. 66 00:04:35,120 --> 00:04:41,699 Is we're going to actually just hide it by pressing the hide zone button, and then i'm going to unselect the visible check box. 67 00:04:42,000 --> 00:04:49,839 You'll notice that the actual sort of pink zone that was previously located on top of that black background has now... disappeared from view 68 00:04:50,560 --> 00:04:56,639 this is indicating that we have artifacted that image and we no longer have to provide an alt text for it. 69 00:04:57,680 --> 00:05:01,199 Now down here. We have an image that we might find more valuable 70 00:05:01,919 --> 00:05:05,758 because this actually is our logo and perhaps 71 00:05:06,639 --> 00:05:09,379 this is something that is worth describing with a description. 72 00:05:10,240 --> 00:05:13,280 So in this case, we want to provide an alt text for this image. 73 00:05:13,680 --> 00:05:18,660 So I'll select the image and then over here on the left-hand side. The image is probably image properties 74 00:05:19,199 --> 00:05:25,119 I see the alt text field and I can type in my description. So I will type in Equidox logo. 75 00:05:26,880 --> 00:05:29,380 And maybe even a little bit further I can type in accessible 76 00:05:30,800 --> 00:05:32,800 pdf remediation 77 00:05:35,840 --> 00:05:38,799 Okay, so now I've provided that alt text for that image. 78 00:05:39,600 --> 00:05:43,999 and now that is exactly what a screen reader will read when the uh when the end user 79 00:05:44,780 --> 00:05:47,220 Navigates to this figure within the PDF. 80 00:05:48,960 --> 00:05:52,880 Let's take a look at the next page and get into some more images as well. 81 00:05:53,919 --> 00:06:00,959 Now this is an example. Uh, this document here is an example of where we have uh, what we really wanted to explain was 82 00:06:02,000 --> 00:06:05,279 the frustration that an end user who is 83 00:06:05,919 --> 00:06:13,599 Blind or low vision that they might experience working with documents that don't have alt descriptions for their images. 84 00:06:14,400 --> 00:06:16,240 If you've ever 85 00:06:16,240 --> 00:06:18,240 had a internet connection issue 86 00:06:18,880 --> 00:06:25,359 Or maybe it's uh, you know, your phone has bad service or you have a website that's just not behaving properly. 87 00:06:26,080 --> 00:06:31,120 And you know that there's something going on in this image. You can't see it though. It won't render. 88 00:06:31,440 --> 00:06:36,239 Maybe there's like a joke on Facebook and you have to be able to see the image to understand the joke. 89 00:06:37,199 --> 00:06:42,159 And it will not render because of your internet connection or because Facebook is down or something like that. 90 00:06:42,479 --> 00:06:44,400 Well, that can be very frustrating. 91 00:06:44,400 --> 00:06:50,560 So that is exactly what would happen for everyone who is blind or low vision or is unable to visually 92 00:06:50,960 --> 00:06:53,680 see the images if there is no alt text for them. 93 00:06:54,160 --> 00:06:57,839 So keep that in mind when you're working on PDF documents and think about. 94 00:06:58,080 --> 00:07:04,240 How frustrating it would be to have no context as to what these images are throughout an entire PDF document. 95 00:07:04,479 --> 00:07:11,279 So that's why it's very important to take the time to go through and make sure that you're providing alt descriptions for images. 96 00:07:11,919 --> 00:07:17,119 So in this case, this is just a gray sort of uh sample image where 97 00:07:17,759 --> 00:07:23,279 you may have seen this before like on an email or a website that doesn't load the images properly. 98 00:07:23,840 --> 00:07:27,359 So, in this case, I'm not actually going to provide an alt description for this again. 99 00:07:27,440 --> 00:07:30,099 I'm, just going to choose to hide it and mark it invisible. 100 00:07:30,960 --> 00:07:34,799 And then down here. Um, we have another image in this document. 101 00:07:35,360 --> 00:07:36,160 where 102 00:07:36,160 --> 00:07:39,039 this is just part of the... sort of.. uh 103 00:07:39,680 --> 00:07:40,560 the 104 00:07:40,560 --> 00:07:46,399 The template for this slide deck where you have this sort of blue wave down the bottom right-hand corner. 105 00:07:46,879 --> 00:07:52,399 Now again, this is an example of an image that is not actually adding any value to the page. It's just simply there 106 00:07:52,960 --> 00:07:54,879 to take up some space. 107 00:07:54,879 --> 00:08:00,079 To make the page look a little bit nicer. We don't have to go through and provide alt text for this type of image. 108 00:08:00,720 --> 00:08:03,859 So again, I'm able to hide that zone and mark it invisible. 109 00:08:04,639 --> 00:08:10,079 Now if you're wondering, um, if you've never used Equidox before if you're looking at this for the first time... 110 00:08:10,720 --> 00:08:17,119 If you're wondering the difference between alt text and long description, um, so the difference here is... 111 00:08:18,160 --> 00:08:20,660 long description applies only to HTML. 112 00:08:21,680 --> 00:08:27,519 So keep that in mind when you are working on documents think about which format you are going to be exporting to. 113 00:08:28,240 --> 00:08:34,240 If you're going to be exporting to PDF and PDF only the only actual alt text 114 00:08:35,120 --> 00:08:41,440 that you type into the alt description field that is what's going to be attached to that image when you go to export the document. 115 00:08:41,919 --> 00:08:48,098 Anything that you type into long description, it has no place in the PDF environment, so it will not be exported. 116 00:08:48,720 --> 00:08:56,399 This is for HTML purposes only. So if you are exporting to HTML you can provide a long description, which can be 117 00:08:57,019 --> 00:09:03,439 additional context for the image... or it effectively works the way like a caption would work where it will actually visually appear 118 00:09:04,399 --> 00:09:08,879 on the HTML page. So we can talk a little bit more about that in just a second. 119 00:09:10,080 --> 00:09:12,080 So let's take a look at the next page here. 120 00:09:14,720 --> 00:09:18,240 And uh, here's another example of images where 121 00:09:19,040 --> 00:09:24,719 they could be compiling a document and located inside of a document where you have, uh 122 00:09:24,959 --> 00:09:29,359 different layers of images. Three separate images they're not rendering properly again. 123 00:09:29,440 --> 00:09:34,559 It would be your responsibility to as the remediator to make sure you're providing the proper alt text. 124 00:09:35,120 --> 00:09:40,560 So this page is somewhat similar to the first one except you can imagine the frustration that there would that you would have 125 00:09:40,880 --> 00:09:44,320 if you're working, uh with a document and there's three images on it, uh, 126 00:09:44,480 --> 00:09:48,320 three images on a single page and you do not know what's located in any one of them. 127 00:09:48,640 --> 00:09:53,599 It would be very frustrating to try to understand the entire context of the document. So 128 00:09:54,399 --> 00:09:55,420 this is just 129 00:09:55,420 --> 00:10:01,599 reiterating the point that it's very important to make sure that you're going through when you're working on documents to describe images 130 00:10:02,000 --> 00:10:07,760 with the proper alt text. This is one of those manual parts of PDF remediation. Where 131 00:10:08,480 --> 00:10:14,959 there is really no way to automate it. You have to take the time to provide a proper alt text for images. 132 00:10:17,040 --> 00:10:19,920 Um, so let's move forward here into... 133 00:10:21,760 --> 00:10:23,760 my internet's sleeping on me... 134 00:10:27,279 --> 00:10:28,880 There we go. 135 00:10:28,880 --> 00:10:30,240 Okay 136 00:10:30,240 --> 00:10:31,339 so 137 00:10:31,339 --> 00:10:35,279 Um, one other thing that we wanted to make sure that we talked about today. 138 00:10:35,360 --> 00:10:39,779 Which is something that I see a lot when working with different clients and helping them with their documents. 139 00:10:41,040 --> 00:10:43,040 Is alt text syntax. 140 00:10:43,279 --> 00:10:44,160 so 141 00:10:44,160 --> 00:10:47,920 Keep in mind that when an end user is interacting with the document 142 00:10:48,720 --> 00:10:52,240 the the screen reader is going to announce the zone type. 143 00:10:53,040 --> 00:10:55,440 Whether it be an image or a graphic zone. 144 00:10:56,560 --> 00:11:01,519 So I see this happen a lot when working with different clients. 145 00:11:02,160 --> 00:11:09,519 where they will actually type in things like "image of" "picture of" "photo of" "graphic of" 146 00:11:10,720 --> 00:11:15,519 These are... this is information that's completely redundant the end-user knows 147 00:11:16,079 --> 00:11:19,519 that the element that they are currently located on is an image. 148 00:11:20,079 --> 00:11:26,639 So typing in "image of" is just providing them useless information because they've already been told that it's an image. 149 00:11:26,959 --> 00:11:31,599 So you're just basically having the screen reader read "image image of" 150 00:11:32,160 --> 00:11:35,040 Uh, you know, uh painting whatever it may be. 151 00:11:35,920 --> 00:11:36,800 so 152 00:11:36,800 --> 00:11:37,839 um 153 00:11:37,839 --> 00:11:41,039 This is something to keep in mind when you're going through and writing alt text. 154 00:11:41,680 --> 00:11:46,959 Now sometimes the actual type of image that it is can be relevant. 155 00:11:47,120 --> 00:11:50,000 So again thinking about the context for these images. 156 00:11:50,959 --> 00:11:54,399 So if you have for example a very famous painting 157 00:11:55,040 --> 00:11:56,560 Perhaps it's worth 158 00:11:56,560 --> 00:11:59,279 taking the time to type out painting of 159 00:12:00,079 --> 00:12:02,399 Starry Night by Vincent Van Gogh. 160 00:12:03,440 --> 00:12:05,839 Or in this case you have an old 161 00:12:06,620 --> 00:12:08,880 photograph of Edgar Allan Poe. 162 00:12:09,680 --> 00:12:16,239 So perhaps it's relevant depending on the document to include the fact that this isn't this is a photograph of Edgar 163 00:12:16,240 --> 00:12:23,120 Allan Poe rather than a sketch or a portrait drawing... whatever it may be so it just depends on the type of document. 164 00:12:23,360 --> 00:12:26,260 But it might be important to include that type of information. 165 00:12:26,880 --> 00:12:34,320 But in most cases it's simply typing out "image of" or "picture of" is not actually adding value to the end-user. 166 00:12:34,880 --> 00:12:38,079 So just always keep in mind the type of document that you're working on. 167 00:12:38,560 --> 00:12:41,760 And the context for which those images sit with on that page. 168 00:12:46,959 --> 00:12:48,880 Okay, so 169 00:12:48,880 --> 00:12:50,880 talking more about alt text... 170 00:12:51,360 --> 00:12:58,000 Short, descriptive, and relevant. So what does the uh, what does the end-user need to know what the reader I should say? 171 00:12:59,200 --> 00:13:00,079 so 172 00:13:00,079 --> 00:13:04,959 Here we have obviously a very famous painting of Washington crossing the Delaware. 173 00:13:05,360 --> 00:13:10,479 So again, it's just important to keep in mind. What is the context within the document? 174 00:13:10,959 --> 00:13:14,078 Is this a document about famous old boats? 175 00:13:14,639 --> 00:13:16,639 Is this a document about... 176 00:13:17,120 --> 00:13:19,120 wintertime in Delaware? 177 00:13:19,760 --> 00:13:21,680 Is it about George Washington? 178 00:13:21,680 --> 00:13:23,680 Is it about the Revolutionary War? 179 00:13:23,760 --> 00:13:24,079 um.. 180 00:13:24,079 --> 00:13:29,519 So all of these things may be important and when you're deciding how you're writing that alt text. 181 00:13:29,920 --> 00:13:35,920 So always think about context and what does the end-user actually need to know about this image that adds the 182 00:13:36,560 --> 00:13:42,399 the right value to the document rather than giving them a bunch of fluff information that they don't actually need. 183 00:13:43,120 --> 00:13:48,639 You don't necessarily need to go through and type out that there's you know 22 people on this row boat... 184 00:13:48,959 --> 00:13:51,919 There's five different oars, uh, one of them is wearing red... 185 00:13:52,560 --> 00:13:58,880 They're holding a flag. Whatever. It may be you don't necessarily need to go that granular with it. Um, it just really depends on 186 00:13:59,600 --> 00:14:02,639 the context so keep that in mind. Again, so 187 00:14:03,360 --> 00:14:05,620 what I mentioned before about long description... 188 00:14:06,480 --> 00:14:08,320 versus alt description... 189 00:14:08,320 --> 00:14:15,839 If you are an Equidox user you're probably aware of our HTML preview page where if you press this button up here you will see 190 00:14:16,160 --> 00:14:18,320 The HTML preview of the document.. 191 00:14:18,880 --> 00:14:20,720 Of the page that you're working on. 192 00:14:20,720 --> 00:14:27,519 Um, so what I want to mention here about the long description is if you type in an alt description for the image... 193 00:14:27,600 --> 00:14:29,600 So let's just say it's "George Washington 194 00:14:31,339 --> 00:14:33,199 Crossing 195 00:14:33,199 --> 00:14:35,199 the Delaware..." 196 00:14:35,760 --> 00:14:40,239 Maybe you type in a long description something like "famous painting... 197 00:14:43,339 --> 00:14:44,639 "By uh 198 00:14:44,639 --> 00:14:49,919 Artist name? I can't remember the name of the artist, but you go into more detail about the actual image. 199 00:14:50,160 --> 00:14:55,380 Um and perhaps, you know, you want to go and describe this more, you know the year that it was painted... 200 00:14:55,920 --> 00:14:58,959 Uh, which museum it's currently hanging in... whatever it may be. 201 00:14:59,519 --> 00:15:02,078 When you look at the actual preview of the document. 202 00:15:02,160 --> 00:15:07,680 You will see your long description actually populate here on the HTML preview page. 203 00:15:08,160 --> 00:15:13,760 The alt description is not visible, but it is in fact attached to this image when you go to export it. 204 00:15:14,240 --> 00:15:20,740 But this is the difference between long description and alt text. The long description is only going to appear in the HTML 205 00:15:21,279 --> 00:15:25,059 And it's just a way of adding additional context additional information. 206 00:15:25,600 --> 00:15:27,839 Or effectively a caption for the image. 207 00:15:28,959 --> 00:15:33,919 So that is something to keep in mind when you are using Equidox to tag your images. 208 00:15:34,240 --> 00:15:37,279 anything that goes in here is only going to be for the 209 00:15:38,060 --> 00:15:40,060 HTML export. 210 00:15:46,720 --> 00:15:50,720 Okay, so again we have another image here a very famous logo, of course 211 00:15:51,360 --> 00:15:54,320 so this is another example of when um, 212 00:15:54,880 --> 00:15:56,880 you know if you are just 213 00:15:57,199 --> 00:16:01,359 Quickly describing an image. You can probably just say "Mcdonald's logo" 214 00:16:01,920 --> 00:16:02,800 and 215 00:16:02,800 --> 00:16:06,079 Most of the time everyone is going to know exactly what you're talking about. 216 00:16:07,040 --> 00:16:13,120 The the golden arches are world famous and you don't necessarily need to go through 217 00:16:13,759 --> 00:16:20,159 And write out the fact that it's a red square with an M shaped, uh yellow 218 00:16:20,480 --> 00:16:23,759 You know sort of symbol with "I'm loving it" underneath. 219 00:16:24,720 --> 00:16:28,240 This is all pretty much implied by simply saying McDonald's logo. 220 00:16:29,120 --> 00:16:32,959 However, if it's, for example, a marketing document where 221 00:16:33,680 --> 00:16:40,239 someone is going in in depth into sort of the logic behind designing logos, perhaps it's more important to 222 00:16:40,880 --> 00:16:48,079 be more descriptive of the sort of the colors that are used the short caption that's used "i'm loving it," for example. 223 00:16:48,800 --> 00:16:55,680 So again, it just depends on the context of the image and what is important about it within the document that it sits. 224 00:16:56,560 --> 00:16:58,320 So again, you can type in 225 00:16:58,320 --> 00:17:00,320 "McDonald's" 226 00:17:01,579 --> 00:17:04,639 "Mcdonald's logo" and that is going to be an effective 227 00:17:04,959 --> 00:17:10,399 um, alt description for an image such as this. I don't need to write out "picture of McDonald's logo. 228 00:17:12,720 --> 00:17:13,679 And then 229 00:17:13,679 --> 00:17:16,798 we also have again, you know as you've probably noticed on every page.. 230 00:17:17,360 --> 00:17:22,400 This uh, this small little graphic here that's embedded in the template of the of the powerpoint... 231 00:17:23,199 --> 00:17:25,678 Which I'm going to go back to the images tab. 232 00:17:26,000 --> 00:17:29,619 Towards the end here and I'm going to explain what you can do with these sorts of things. 233 00:17:34,240 --> 00:17:41,439 Um, so another image here we have another example of uh, sort of this child in the kitchen, um, so... 234 00:17:42,160 --> 00:17:45,839 How does it relate to the content? Well, it depends on the document that it sits in. So 235 00:17:46,640 --> 00:17:50,660 Is this a document about excited children? Is this a document about kitchens? 236 00:17:51,280 --> 00:17:55,039 Is this a document about cooking... or? 237 00:17:55,760 --> 00:18:01,919 Whatever it may be. Maybe it's you know about parenting from home or homeschooling during a pandemic. Um, 238 00:18:02,160 --> 00:18:06,879 you know kids making messes in a kitchen, whatever it is that should that is all relevant 239 00:18:07,120 --> 00:18:07,679 um 240 00:18:07,679 --> 00:18:14,159 and in relative to the document that it's currently located in and that should be considered when writing your alt text syste. 241 00:18:14,480 --> 00:18:18,079 And what detail are you going to go into about this image? 242 00:18:23,440 --> 00:18:28,559 Here is an example of another piece of... another image where the alt text 243 00:18:29,360 --> 00:18:36,319 tt might not be detailed enough. In fact, it definitely isn't detailed enough to just call this image of a dog. 244 00:18:36,720 --> 00:18:37,980 so sometimes 245 00:18:37,980 --> 00:18:39,039 diagrams 246 00:18:39,039 --> 00:18:41,839 Have a lot of unique information located inside of them. 247 00:18:42,720 --> 00:18:46,799 There is no necessarily, uh, you know textual context for them. 248 00:18:47,520 --> 00:18:50,639 You know, you can see that there is text in fact inside of this image. 249 00:18:51,039 --> 00:18:55,039 But a screen reader is not able to uh to read these different 250 00:18:55,679 --> 00:19:01,359 pieces of this diagram until we've provided that detail for the screen reader in the alt text field. 251 00:19:01,919 --> 00:19:05,999 So if you arrive at an image like this and you just type out "dog," or 252 00:19:06,799 --> 00:19:08,799 "drawing of a dog..." 253 00:19:08,880 --> 00:19:10,480 or "dog diagram..." 254 00:19:10,480 --> 00:19:13,679 That is not enough context to explain what this image is about. 255 00:19:14,080 --> 00:19:20,400 So this image is clearly about uh, different, uh harnesses like for leashes, uh that a dog could wear. 256 00:19:20,960 --> 00:19:28,079 And there's very distinct detail provided in this diagram where it's explaining the various different 257 00:19:28,640 --> 00:19:32,640 parts and pieces of the harness that goes around the dog's shoulders and neck. 258 00:19:33,280 --> 00:19:34,160 and 259 00:19:34,160 --> 00:19:34,559 You know 260 00:19:34,559 --> 00:19:42,079 It's up to you as the remediator to make sure that you are conveying this information in the alt text for this diagram. 261 00:19:42,720 --> 00:19:45,919 So your image for your example for your alt description here... 262 00:19:46,720 --> 00:19:50,240 Might be "a diagram of a dog harness. 263 00:19:52,860 --> 00:19:55,280 "Including the shoulder strap 264 00:19:56,880 --> 00:19:58,880 "Connector ring 265 00:19:59,679 --> 00:20:02,158 "Belly strap... chest strap 266 00:20:04,159 --> 00:20:06,159 And D ring." 267 00:20:06,559 --> 00:20:13,199 Um, you can go into even further detail by explaining their location with on the strap or how this maybe goes over the 268 00:20:13,200 --> 00:20:20,319 dog's head. Uh, but uh, it's very important to make sure that you're including well, uh relevant information about the specific diagram 269 00:20:20,880 --> 00:20:22,880 as it relates to this image. 270 00:20:26,240 --> 00:20:28,240 Moving on to the next page here... 271 00:20:31,440 --> 00:20:35,200 Here we have an example of a chart. So 272 00:20:35,840 --> 00:20:37,520 this is again 273 00:20:37,520 --> 00:20:43,280 A different type of image there is very distinct information located within a chart like this. 274 00:20:44,000 --> 00:20:44,880 so 275 00:20:44,880 --> 00:20:46,880 You know clearly this is a pie chart. 276 00:20:47,600 --> 00:20:48,559 and 277 00:20:48,559 --> 00:20:50,320 You as the remediator 278 00:20:50,320 --> 00:20:57,919 It's your responsibility then to make sure that the actual data that is inside of this pie chart is conveyed through the alt text. 279 00:20:58,960 --> 00:21:06,400 So in this case, it's a pretty simple pie chart. There's you know, it's not too complicated. You only have um five separate 280 00:21:06,559 --> 00:21:12,239 Uh variables here of strawberry, chocolate, vanilla, cookie dough, and mint...So you would go through the alt description. 281 00:21:12,960 --> 00:21:15,220 And you could type out the actual percentages... 282 00:21:16,080 --> 00:21:20,880 Of the individual, um, you know flavors of ice cream, for example. 283 00:21:21,600 --> 00:21:24,319 That people describe as their favorite. So 284 00:21:25,360 --> 00:21:28,319 This would just be as simple as typing out, uh, you know "pie 285 00:21:29,340 --> 00:21:31,679 charts of favorite ice cream." 286 00:21:33,360 --> 00:21:36,400 And then maybe uh, you could go into the detail of "vanilla 287 00:21:37,360 --> 00:21:38,799 15" 288 00:21:38,799 --> 00:21:41,759 So on and so forth. So you don't need to watch me type out all the different 289 00:21:42,480 --> 00:21:48,980 All of the different flavors, but that's basically the logic of it where you would go through and make sure that you're providing this information 290 00:21:49,520 --> 00:21:51,520 Into the alt text of that image. 291 00:21:52,320 --> 00:21:54,480 Typing it in over here in the alt text field. 292 00:21:57,600 --> 00:22:03,679 Here the next page I believe is a more complicated sort of chart where we have a bar chart. 293 00:22:04,320 --> 00:22:11,840 Which um can actually contain a bit more data than your standard pie charts. They can even get a lot more complicated than this. 294 00:22:12,960 --> 00:22:16,000 So it might be important in this case if you 295 00:22:16,720 --> 00:22:20,159 don't want to overload the alt description for the image... 296 00:22:20,799 --> 00:22:23,759 meaning that you don't want to sit here and type out a five-paragraph essay... 297 00:22:24,559 --> 00:22:29,999 It can be very helpful if you have any say on the sort of designing of documents or 298 00:22:30,880 --> 00:22:36,239 document creation process when you're dealing with uh pie or bar charts such as this... 299 00:22:36,960 --> 00:22:43,840 It can be very helpful to also provide a a table version of that. Same data. So tabular data. 300 00:22:44,559 --> 00:22:50,479 It's fast to remediate in Equidox, as we would have learned in our previous webinar going over tables... 301 00:22:51,600 --> 00:22:58,559 So you can remediate it very quickly using Equidox if you have tabular data to represent the same information in this bar chart. 302 00:23:00,159 --> 00:23:05,199 So you could go through and type out in your alt description all of the different data 303 00:23:05,840 --> 00:23:10,480 located in this bar chart which would take a little bit of time because there is a lot of information in here... 304 00:23:11,280 --> 00:23:14,479 Or if you do have the option of having that tabular data... 305 00:23:14,720 --> 00:23:22,559 You can always mark this with a high level description basically keeping the image there indicating that this is a bar chart about sales 306 00:23:22,880 --> 00:23:25,359 Such and such depending on the context of the document... 307 00:23:25,919 --> 00:23:29,999 And then make sure that you're indicating that the table that is to follow 308 00:23:30,720 --> 00:23:38,159 has all of that same information located in it. Because this is an easier element to interact with for a screen reader user. 309 00:23:38,559 --> 00:23:44,719 Um, they're able to navigate this table and gain all of the data from from this from the same chart down here. 310 00:23:45,200 --> 00:23:49,460 But it's just in a much more concise and easy to work with format if it's in a table. 311 00:23:54,480 --> 00:23:58,480 Okay, and then one other image type here that I wanted to make sure that we covered 312 00:23:59,600 --> 00:24:03,120 Are I see these quite a bit, but a lot of times you'll have sort of 313 00:24:03,740 --> 00:24:08,979 infographics. And oftentimes this will be the entire page itself will be an infographic. 314 00:24:10,000 --> 00:24:13,459 And whenever that's the case if you have an infographic, 315 00:24:15,520 --> 00:24:21,119 it can be very difficult to take this image which as you can see contains a whole bunch of text. 316 00:24:21,919 --> 00:24:24,739 And to try to plug that into a single alt description, 317 00:24:26,000 --> 00:24:30,880 you're going to be plugging this alt description with a lot of data and it's very hard to 318 00:24:31,520 --> 00:24:37,119 to navigate, uh decipher all of it as it's being read aloud to that end user. So what you might do 319 00:24:37,679 --> 00:24:44,479 in a case like this, is when you have a lot of very densely spaced data and information in an infographic type of layout... 320 00:24:45,120 --> 00:24:48,559 And believe me infographics can get 10 times more complicated than this one.... 321 00:24:49,200 --> 00:24:50,880 But what you might do... 322 00:24:50,880 --> 00:24:58,880 is hide the zone by hitting the hide zone checkbox, and then also marking it invisible by unselecting the 323 00:24:59,520 --> 00:25:02,879 visible button. This is effectively artifacting that image. 324 00:25:03,520 --> 00:25:06,159 So now we've essentially removed the image. 325 00:25:06,880 --> 00:25:12,799 But now we can use a different zone type to sort of break this dense and full of information 326 00:25:13,440 --> 00:25:15,760 type of image into more 327 00:25:16,460 --> 00:25:23,600 digestible chunks. So we can create smaller zones such as this. And once I've drawn the zone I can press G 328 00:25:24,080 --> 00:25:26,480 On my keyboard and change the zone type to graphic. 329 00:25:27,279 --> 00:25:30,079 And then i'm able to actually type out smaller 330 00:25:30,720 --> 00:25:36,900 and more concise alt descriptions, breaking this infographic into multiple graphics. 331 00:25:37,679 --> 00:25:45,599 So I could type out multiple descriptions about this graphic if I just start typing, uh, if I just start creating graphics like this 332 00:25:46,400 --> 00:25:48,000 I'm pressing G 333 00:25:48,000 --> 00:25:50,000 and from here I'm able to 334 00:25:50,320 --> 00:25:53,439 break down this information into smaller chunks. 335 00:25:54,159 --> 00:25:56,159 Which makes it a lot easier to work with. 336 00:25:56,559 --> 00:26:02,158 Um, so what you'll see when I go to press the preview. I haven't yet typed in any alt descriptions for these graphics... 337 00:26:02,640 --> 00:26:07,459 Um, so that would obviously be your responsibility as the remediator to make sure you're providing alt descriptions. 338 00:26:08,080 --> 00:26:10,080 But if I go to the preview 339 00:26:10,400 --> 00:26:17,119 you will see that I have a series of small squares which these are representing the graphic zones that I just created. 340 00:26:17,600 --> 00:26:22,240 Um, so you've essentially manually created um a series of smaller images. 341 00:26:22,799 --> 00:26:25,599 And then you're able to provide that alt text to 342 00:26:26,400 --> 00:26:34,159 the different images breaking it into smaller pieces rather than typing out all of this information into a single alt text which would be 343 00:26:34,720 --> 00:26:39,279 far too many characters for an alt text and too complicated to listen to for the end-user. 344 00:26:40,960 --> 00:26:43,360 So that's that's just another example that I see a lot. 345 00:26:44,000 --> 00:26:48,239 Um, I also want to make sure that we talk a little bit more about this images tab. 346 00:26:49,760 --> 00:26:51,120 Where 347 00:26:51,120 --> 00:26:54,400 Going through we were able to see that, for example, 348 00:26:54,480 --> 00:27:00,480 there were a lot of these images here. If you see this little blue wave there were quite a few images where 349 00:27:01,120 --> 00:27:06,419 They weren't actually adding value to the page. There's no reason to go through and type out alt descriptions. 350 00:27:07,039 --> 00:27:11,119 So these are examples of when you could very quickly especially if you're familiar with the document... 351 00:27:11,360 --> 00:27:15,679 you could very quickly make these decisions to come through here and hide these zones. 352 00:27:16,000 --> 00:27:20,959 And just artifact these images so that you are not having to then provide alt descriptions for them. 353 00:27:21,840 --> 00:27:26,319 So this is a way of using the images tab to be very efficient with your time. 354 00:27:27,120 --> 00:27:30,640 And then again, it's very easy to forget to 355 00:27:31,360 --> 00:27:37,679 yype out an alt description for a little tiny blue wavy square thing on the bottom right-hand corner of your document. 356 00:27:38,320 --> 00:27:43,439 Maybe it's a hundred pages long and you forget to tag this on one single page. Well that's going to be 357 00:27:44,240 --> 00:27:50,559 creating flags if that document would ever be audited or reviewed for accessibility after the fact so... 358 00:27:51,520 --> 00:27:52,720 It's easy to forget. 359 00:27:52,720 --> 00:27:58,319 So make sure that you are either starting your process here on the images tab or ending your process here. 360 00:27:58,799 --> 00:28:04,479 This is a great place to to revisit at the end of your remediation just to do a quick scroll through. 361 00:28:04,799 --> 00:28:08,559 And make sure that you don't have any of these big red warnings saying no alt text. 362 00:28:08,880 --> 00:28:12,559 That's a good indication that you've forgotten one of these images. 363 00:28:12,640 --> 00:28:18,239 So make sure that you go through and hide it and mark it invisible and once you've done all these changes. 364 00:28:18,559 --> 00:28:21,199 Make sure that you are saving your image properties. 365 00:28:21,600 --> 00:28:26,319 Um, and that's a great way of handling your images right here in one sort of swoop. 366 00:28:28,559 --> 00:28:33,119 The images tab is so helpful again because you are able to address everything together. 367 00:28:33,360 --> 00:28:33,600 um 368 00:28:33,600 --> 00:28:36,959 So sometimes I'll see examples where it's 100 pages long. 369 00:28:37,279 --> 00:28:43,119 And every page has one image on it and it's the same logo that appears on every page. if that's the case, 370 00:28:43,279 --> 00:28:50,719 it's not important for you to go through and type out the same logo, uh description on every single page. 371 00:28:51,120 --> 00:28:56,159 Um, it gets completely redundant. So that's an example of when you could hit the hide all zones button. 372 00:28:57,039 --> 00:29:03,119 Uh, basically you're going to hide all of the zones. And then you can maybe provide the description for it on the very first instance 373 00:29:03,120 --> 00:29:04,159 of it. 374 00:29:04,159 --> 00:29:07,278 But then you're basically relieving yourselves of having to 375 00:29:07,840 --> 00:29:10,720 type out that alt description on every page. And then of course 376 00:29:10,720 --> 00:29:12,080 you're not going to forget it... 377 00:29:12,080 --> 00:29:16,720 as you're tabbing through and going through quickly and then on page 82 you forgot to tag at one time... 378 00:29:17,200 --> 00:29:20,480 um, so that's another way uh of using this images tab 379 00:29:21,360 --> 00:29:22,159 to 380 00:29:22,159 --> 00:29:24,879 double-check your work... to handle everything right up front. 381 00:29:25,520 --> 00:29:30,879 And then to do sort of bulk artifacting where you have those repetitive logos that seem to never go away. 382 00:29:30,960 --> 00:29:32,799 They're there on every single page. 383 00:29:32,799 --> 00:29:37,999 Um, so this is uh, we're right up against 2:30 now. So that the time did fly by there! 384 00:29:38,640 --> 00:29:43,599 Tammy, are there any questions about the any of the topics that we covered today? or um 385 00:29:43,919 --> 00:29:46,639 Is this a good place to break for the day? Tammy: Um 386 00:29:47,200 --> 00:29:52,559 Someone asked a question about hyperlinks attached to images and I think Ryan was typing out an answer... 387 00:29:52,559 --> 00:29:56,479 But it might be quicker for him to answer verbally if he's still here 388 00:29:59,039 --> 00:30:02,040 Ryan:I've actually already answered that. 389 00:30:02,040 --> 00:30:05,059 Tammy Oh, okay. Um, all right then, um, 390 00:30:08,480 --> 00:30:12,159 If you wanted to just quickly read that answer because now, of course, I'm sure people are curious.. 391 00:30:18,720 --> 00:30:20,720 Dan:I um 392 00:30:20,720 --> 00:30:22,640 Tammy: I think I want all right, so 393 00:30:22,640 --> 00:30:23,520 someone 394 00:30:23,520 --> 00:30:26,479 Asked what to do for images with hyperlinks attached... 395 00:30:27,020 --> 00:30:32,399 Attached and what Ryan wrote was "a link zone can be wrapped around an image or figure... 396 00:30:32,880 --> 00:30:40,559 To create a hyperlinked image. The output will contain a link tag which contains the image with alt text nested inside it. 397 00:30:40,960 --> 00:30:42,399 This allows both the images, 398 00:30:42,399 --> 00:30:49,839 Alt text and the link destination, or link alternative text if you included that, to be read instead of choosing one or the other." 399 00:30:53,919 --> 00:30:57,359 Tammy:I believe that I think we answered all the other questions. 400 00:30:59,600 --> 00:31:00,640 Yes. 401 00:31:00,640 --> 00:31:06,799 Dan: Okay, great. Well, um just to remind everyone um that we are hosting these webinars. Um, 402 00:31:07,279 --> 00:31:09,999 whether it be a monthly or bi-monthly basis, um 403 00:31:10,000 --> 00:31:15,839 but this has been our our third one and we have another one coming up soon. So keep, um, keep that in mind. 404 00:31:16,080 --> 00:31:18,080 I'm sure the invites will be sent out. 405 00:31:18,720 --> 00:31:21,760 But we do appreciate everyone taking the time today to join us. 406 00:31:22,399 --> 00:31:28,419 To learn a little bit more about, uh, best practices for all texts and for how to do that quickly and efficiently in Equidox. 407 00:31:28,799 --> 00:31:32,079 If you have any other questions, please feel free to reach out to 408 00:31:32,079 --> 00:31:35,620 EquidoxSales@onixnet.com or visit our website at www.equidox.co 409 00:31:37,840 --> 00:31:40,819 So, thank you very much everyone and have a great rest of your day!