<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)">
<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;}
@font-face
{font-family:Cambria;
panose-1:2 4 5 3 5 4 6 3 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
font-size:14.0pt;
font-family:"Cambria",serif;
color:#1F3864;}
span.EmailStyle20
{mso-style-type:personal-compose;
font-family:"Cambria",serif;
color:#1F3864;}
.MsoChpDefault
{mso-style-type:export-only;
font-family:"Calibri",sans-serif;
mso-ligatures:standardcontextual;}
@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">Everyone:<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">I’ve been trying to figure out why my screen reader, starting in 2019 divides the TOCI items into:<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">Introduction as a link<o:p></o:p></p>
<p class="MsoNormal">The dot leaders as a link.<o:p></o:p></p>
<p class="MsoNormal">The page number as a third link in the TOCI.<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">This was not happening before October 2018.<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">I didn’t think that a <Span> tag would cause such an accessibility barrier. I also haven’t had time, until now to track this down.<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">The culprit is the <Span> tag in the TOCI tag.<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">Problem semantic:<o:p></o:p></p>
<p class="MsoNormal"><TOCI><o:p></o:p></p>
<p class="MsoNormal"> <Reverence><o:p></o:p></p>
<p class="MsoNormal"> <Link><o:p></o:p></p>
<p class="MsoNormal"> Link-OBJR<o:p></o:p></p>
<p class="MsoNormal"> <Span><o:p></o:p></p>
<p class="MsoNormal"> Introduction<o:p></o:p></p>
<p class="MsoNormal"> <Span><o:p></o:p></p>
<p class="MsoNormal"> Dot Leaders<o:p></o:p></p>
<p class="MsoNormal"> <Link><o:p></o:p></p>
<p class="MsoNormal"> Dot Leaders and page number<o:p></o:p></p>
<p class="MsoNormal"> <Span><o:p></o:p></p>
<p class="MsoNormal"> The space after the period.<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">I remediated the TOCI by moving the second <Link> item under the first <Link> item and deleting the empty <Link> tag. That didn’t work.<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">It wasn’t until I removed all the <Span> tags under the <Reference> tag that I was able to get a coherent TOCI item read by the screen readers.<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">So the syntax best practices guide creates an inaccessible TOCI. I looked at their example and it was set up like the problematic one at the start of this post.<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">The fix – remove the <Span> tags completely: <o:p></o:p></p>
<p class="MsoNormal"><TOCI><o:p></o:p></p>
<p class="MsoNormal"> <Reference><o:p></o:p></p>
<p class="MsoNormal"> <Link><o:p></o:p></p>
<p class="MsoNormal"> <Link-OBJR<o:p></o:p></p>
<p class="MsoNormal" style="margin-left:1.0in;text-indent:.5in">Introduction<o:p></o:p></p>
<p class="MsoNormal" style="margin-left:1.0in;text-indent:.5in">Dot Leaders<o:p></o:p></p>
<p class="MsoNormal" style="margin-left:1.0in;text-indent:.5in">Page number<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">Ya gotta love clean tags!<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">…and it’s NOT the fault of my screen reader! It is the tag implementation!<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">BTW, do not put Alt text on the <Link> tags in a TOCI…It breaks the TOCI. It is read as it should be without the Alt Text.<o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal">Cheers, Karen<o:p></o:p></p>
<p class="MsoNormal"> <o:p></o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal"><o:p> </o:p></p>
</div>
</body>
</html>