RE: Skip links - must they navigate to a focusable element?
<[email protected]> Fri, 19 Jun 2020 18:59:32 -0400
| Newsgroups | gmane.org.w3c.accessibility.general |
|---|---|
| Message-ID | <[email protected]> |
<html xmlns:o=3D"urn:schemas-microsoft-com:office:office" xmlns:w=3D"urn:sc=
hemas-microsoft-com:office:word" xmlns:m=3D"http://schemas.microsoft.com/of=
fice/2004/12/omml" xmlns=3D"http://www.w3.org/TR/REC-html40"><head><meta ht=
tp-equiv=3DContent-Type content=3D"text/html; charset=3Dutf-8"><meta name=
=3DGenerator content=3D"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;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:"Calibri",sans-serif;}
a:link, span.MsoHyperlink
{mso-style-priority:99;
color:blue;
text-decoration:underline;}
.MsoChpDefault
{mso-style-type:export-only;}
@page WordSection1
{size:8.5in 11.0in;
margin:1.0in 1.0in 1.0in 1.0in;}
div.WordSection1
{page:WordSection1;}
--></style></head><body lang=3DEN-US link=3Dblue vlink=3D"#954F72"><div cla=
ss=3DWordSection1><p class=3DMsoNormal>Catherine,</p><p class=3DMsoNormal><=
o:p> </o:p></p><p class=3DMsoNormal>The Skip to main link should go to=
the page just after the navigation elements, and not to the first focusabl=
e element after them. This way, screen reader users can start reading virtu=
ally, either line by line or wit a Read all from that location. If it goes =
to the first focusable element past the navigation area, they may miss any =
text or images between the navigation elements and this first focusable ele=
ment on the page.</p><p class=3DMsoNormal><o:p> </o:p></p><p class=3DM=
soNormal>Does that make sense?</p><p class=3DMsoNormal><o:p> </o:p></p=
><p class=3DMsoNormal>Alan Smith</p><p class=3DMsoNormal><o:p> </o:p><=
/p><div style=3D'mso-element:para-border-div;border:none;border-top:solid #=
E1E1E1 1.0pt;padding:3.0pt 0in 0in 0in'><p class=3DMsoNormal style=3D'borde=
r:none;padding:0in'><b>From: </b><a href=3D"mailto:Catherine.Ailanjian@wdc.=
com">Catherine Ailanjian</a><br><b>Sent: </b>Friday, June 19, 2020 6:49 PM<=
br><b>To: </b><a href=3D"mailto:[email protected]">[email protected]</a><br=
><b>Subject: </b>Skip links - must they navigate to a focusable element?</p=
></div><p class=3DMsoNormal><o:p> </o:p></p><p class=3DMsoNormal>Regar=
ding =E2=80=9Cskip to main content=E2=80=9D links, must they navigate to th=
e first element in the main landmark? Or to the first focusable=
element in the main landmark? <o:p></o:p></p><p class=3DMsoNormal><o=
:p> </o:p></p><p class=3DMsoNormal>For example, on Treasury.gov, the f=
irst element in the main landmark is the text string =E2=80=9CFeatured=E2=
=80=9D and the first focusable element is the =E2=80=9CHow the Treasury Dep=
artment is Taking Action - The CARES Act=E2=80=9D link. When I activa=
te the =E2=80=9CSkip Navigation=E2=80=9D link, it navigates to the =E2=80=
=9CFeatured=E2=80=9D text string.<o:p></o:p></p><p class=3DMsoNormal><o:p>&=
nbsp;</o:p></p><p class=3DMsoNormal>If, as Deque Univ. states, the skip-lin=
k target should exist and be focusable (best practice), I can understand ho=
w that helps keyboard-only users who are able to see that there is content =
above the first focusable element in the main landmark. But, how do p=
eople using screen readers and who can=E2=80=99t see that content typically=
access it? Especially if the first element in the main landmark is a=
non-focusable heading? <o:p></o:p></p><p class=3DMsoNormal><o:p>&nbs=
p;</o:p></p><p class=3DMsoNormal>Cat Ailanjian<o:p></o:p></p><p class=3DMso=
Normal>Web QA Engineer<o:p></o:p></p><p class=3DMsoNormal>Marketing Operati=
ons<o:p></o:p></p><p class=3DMsoNormal>Pro Unlimited Contingent Worker, on =
behalf of Western Digital<o:p></o:p></p><p class=3DMsoNormal><a href=3D"mai=
lto:[email protected]"><span style=3D'color:#0563C1'>catherine.ai=
[email protected]</span></a><o:p></o:p></p><p class=3DMsoNormal>Office: 949-6=
72-9412<o:p></o:p></p><p class=3DMsoNormal><o:p> </o:p></p><p class=3D=
MsoNormal><o:p> </o:p></p></div></body></html>=