<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40"><head><META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=us-ascii"><meta name=Generator content="Microsoft Word 15 (filtered medium)"><!--[if !mso]><style>v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
w\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style><![endif]--><style><!--
/* Font Definitions */
@font-face
        {font-family:"Cambria Math";
        panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
        {font-family:Calibri;
        panose-1:2 15 5 2 2 2 4 3 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
        {margin:0in;
        font-size:11.0pt;
        font-family:"Calibri",sans-serif;}
a:link, span.MsoHyperlink
        {mso-style-priority:99;
        color:#0563C1;
        text-decoration:underline;}
span.EmailStyle20
        {mso-style-type:personal-reply;
        font-family:"Calibri",sans-serif;
        color:windowtext;}
.MsoChpDefault
        {mso-style-type:export-only;
        font-size:10.0pt;}
@page WordSection1
        {size:8.5in 11.0in;
        margin:1.0in 1.0in 1.0in 1.0in;}
div.WordSection1
        {page:WordSection1;}
--></style><!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]--></head><body lang=EN-US link="#0563C1" vlink="#954F72" style='word-wrap:break-word'><div class=WordSection1><p class=MsoNormal>Hello,<o:p></o:p></p><p class=MsoNormal><o:p> </o:p></p><p class=MsoNormal>For published materials that have long descriptions, also called extended descriptions, the two recommendations are to put the extended description inside a HTML or XHTML details element, which can be expanded and collapsed. The other recommendation is to have a link directly below the image to another place in the publication. With this second type, there must also be a back link to the exact location where you started.<o:p></o:p></p><p class=MsoNormal><o:p> </o:p></p><p class=MsoNormal>These are tested at epubtest.org using the test book:<o:p></o:p></p><p class=MsoNormal><a href="https://www.epubtest.org/books/Accessibility-Tests-Extended-Descriptions-v1.1.1.epub">https://www.epubtest.org/books/Accessibility-Tests-Extended-Descriptions-v1.1.1.epub</a> <o:p></o:p></p><p class=MsoNormal><o:p> </o:p></p><p class=MsoNormal>Note now that NVDA and Jaws supports the aria-details attribute, we will soon be updating the best practice to include this attribute in the image. This alerts the reader that there is indeed a long description associated with the image. If there is no aria-details, then the alt text is sufficient.<o:p></o:p></p><p class=MsoNormal><o:p> </o:p></p><p class=MsoNormal>Best<o:p></o:p></p><p class=MsoNormal>George<o:p></o:p></p><p class=MsoNormal><o:p> </o:p></p><p class=MsoNormal>Oh, and you can go to epubtest.org to check out all the reading systems that pass these tests, along with all the other test books, like support for MathML.<o:p></o:p></p><p class=MsoNormal><o:p> </o:p></p><p class=MsoNormal>Best<o:p></o:p></p><p class=MsoNormal>George<o:p></o:p></p><p class=MsoNormal><o:p> </o:p></p><div><div style='border:none;border-top:solid #E1E1E1 1.0pt;padding:3.0pt 0in 0in 0in'><p class=MsoNormal><b>From:</b> athen-list <athen-list-bounces@mailman12.u.washington.edu> <b>On Behalf Of </b>Steve Green<br><b>Sent:</b> Tuesday, July 5, 2022 5:40 AM<br><b>To:</b> Access Technology Higher Education Network <athen-list@u.washington.edu><br><b>Subject:</b> Re: [Athen] Placing long image descriptions within course materials.<o:p></o:p></p></div></div><p class=MsoNormal><o:p> </o:p></p><p class=MsoNormal><span lang=EN-GB>My preference is to present the long description as visible text, so it benefits everyone. However, most clients don’t want to do that.<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB>The next preference is to add the long description as hidden text behind the chart or graph. It can be in a very small font if necessary, because no one will ever see it.<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB>Both approaches allow us to apply semantic structure such as headings, lists or tables, which you cannot do with alt text. You can do this with Word and PowerPoint. In principle you can do it with HTML too, but some CMSs and content creation platforms will not let you. In both cases the image is marked as decorative.<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB>Unfortunately I can’t share any examples because all our work is done for our clients.<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='mso-fareast-language:EN-GB'>Steve Green<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='mso-fareast-language:EN-GB'>Managing Director<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='mso-fareast-language:EN-GB'>Test Partners Ltd<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB><o:p> </o:p></span></p><div><div style='border:none;border-top:solid #E1E1E1 1.0pt;padding:3.0pt 0in 0in 0in'><p class=MsoNormal><b><span style='mso-fareast-language:EN-GB'>From:</span></b><span style='mso-fareast-language:EN-GB'> athen-list <<a href="mailto:athen-list-bounces@mailman12.u.washington.edu">athen-list-bounces@mailman12.u.washington.edu</a>> <b>On Behalf Of </b>Matthew Deeprose<br><b>Sent:</b> 05 July 2022 12:18<br><b>To:</b> 'Access Technology Higher Education Network' <<a href="mailto:athen-list@u.washington.edu">athen-list@u.washington.edu</a>><br><b>Subject:</b> [Athen] Placing long image descriptions within course materials.<o:p></o:p></span></p></div></div><p class=MsoNormal><span lang=EN-GB><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'>Hello colleagues<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'>For complex images like charts and graphs, the <a href="https://www.w3.org/WAI/tutorials/images/complex/">W3C recommend writing long descriptions.</a> <o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'>I’m interested to learn how you deal with long image descriptions in course materials, for example in PowerPoint and Word documents that are uploaded to a Learning Management System like Blackboard / Canvas / Moodle etc. <o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'>For example, if you write long descriptions do you use the alt text box, or do you add it to speaker notes or a hidden slide (in PowerPoint), or an appendix or supplementary document?<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'>Does anyone have any examples to share of course content that includes long descriptions of complex images?<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'><a href="https://matthewdeeprose.github.io/alt-text-images-charts-graphs">I researched and delivered a presentation on this topic recently</a>, it uses a number of worked examples on how to write long descriptions, I’m really interested to learn some practical examples of how others are placing long descriptions within course materials.<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'>Thanks <o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'>Matt<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt'><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'><o:p> </o:p></span></p><div style='border:none;border-bottom:solid windowtext 1.5pt;padding:0in 0in 1.0pt 0in'><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'><o:p> </o:p></span></p></div><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'>This email has been checked for accessibility. <a href="https://generic.wordpress.soton.ac.uk/digital-learning/2020/11/23/how-can-i-improve-accessibility-of-my-emails/">Want to know how to make your email accessible?</a><o:p></o:p></span></p><p class=MsoNormal><b><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'><o:p> </o:p></span></b></p><p class=MsoNormal><b><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'>Matthew Deeprose<o:p></o:p></span></b></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'><a href="https://pronoun.is/he">He/Him/His</a><o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'><a href="https://generic.wordpress.soton.ac.uk/digital-learning/">Digital Learning</a><o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'>iSolutions<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'>University of Southampton<o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;color:#7030A0;mso-fareast-language:EN-GB'><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'><a href="https://www.jisc.ac.uk/news/celebrating-the-power-of-community-in-education-and-research-01-mar-2022">JISC Community Chamption 2022</a><o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'><a href="https://www.edtechdigest.com/2022-finalists-winners/">EdTech Awards 2022 Finalist: Edtech author / speaker or podcaster</a><o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'><a href="https://matthewdeeprose.github.io/">My accessibility presentations, blog posts, and projects</a><o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'><o:p> </o:p></span></p><p class=MsoNormal><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'><img border=0 width=142 height=142 style='width:1.4791in;height:1.4791in' id="Picture_x0020_1" src="cid:image001.png@01D8903F.FB9D0260" alt="Digital Leaning Team Logographic."></span><span lang=EN-GB style='font-size:14.0pt;mso-fareast-language:EN-GB'><o:p></o:p></span></p><p class=MsoNormal><span lang=EN-GB><o:p> </o:p></span></p></div></body></html>