<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=utf-8"><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:Helvetica;
panose-1:2 11 6 4 2 2 2 2 2 4;}
@font-face
{font-family:Wingdings;
panose-1:5 0 0 0 0 0 0 0 0 0;}
@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:12.0pt;
font-family:"Times New Roman",serif;}
a:link, span.MsoHyperlink
{mso-style-priority:99;
color:blue;
text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
{mso-style-priority:99;
color:purple;
text-decoration:underline;}
p.msonormal0, li.msonormal0, div.msonormal0
{mso-style-name:msonormal;
mso-margin-top-alt:auto;
margin-right:0in;
mso-margin-bottom-alt:auto;
margin-left:0in;
font-size:12.0pt;
font-family:"Times New Roman",serif;}
span.EmailStyle19
{mso-style-type:personal-reply;
font-family:"Calibri",sans-serif;
color:windowtext;}
.MsoChpDefault
{mso-style-type:export-only;
font-family:"Calibri",sans-serif;}
@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=blue vlink=purple><div class=WordSection1><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'>Making this visible again </span><span style='font-size:11.0pt;font-family:Wingdings'>J</span><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'><o:p></o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'><o:p> </o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'>Anybody knows?<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'><o:p> </o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'>Thx,<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'><o:p> </o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'>N<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'><o:p> </o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'><o:p> </o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'>Think not with your Eyes and you shall have a Perfect Vision!<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'><o:p> </o:p></span></p><p class=MsoNormal><b><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'>From:</span></b><span style='font-size:11.0pt;font-family:"Calibri",sans-serif'> athen-list [mailto:athen-list-bounces@mailman13.u.washington.edu] <b>On Behalf Of </b>William Frankhouser<br><b>Sent:</b> Friday, January 20, 2017 11:50 AM<br><b>To:</b> Access Technology Higher Education Network <athen-list@u.washington.edu><br><b>Subject:</b> Re: [Athen] The <header> element VS Banner region landmark<o:p></o:p></span></p><p class=MsoNormal><o:p> </o:p></p><div><div><p class=MsoNormal>Would forcing the ARIA label role="complementary" on any sidebar or sections with the <header> element? (Instead of role="banner") <a href="https://www.w3.org/TR/wai-aria/roles#complementary">https://www.w3.org/TR/wai-aria/roles#complementary</a><o:p></o:p></p></div><div><p class=MsoNormal><o:p> </o:p></p></div><div><p class=MsoNormal>That article states: "the banner role is only mapped to <header> when the element is not within a <section> or <article> element, i.e. when <header> is scoped to the <body> element." But It looks like your testing proves otherwise based on the reader. Would the screen reader pick up the roles?<o:p></o:p></p></div></div><div><p class=MsoNormal><br clear=all><o:p></o:p></p><div><div><div><div><div><div><div><div><div><div><p class=MsoNormal><o:p> </o:p></p></div><div><table class=MsoNormalTable border=0 cellspacing=0 cellpadding=0 width="100%" style='width:100.0%;background:white'><tr style='height:22.5pt'><td style='padding:0in 0in 0in 0in;height:22.5pt'></td></tr><tr><td style='border:none;border-top:solid #EAEAEA 6.0pt;background:whitesmoke;padding:7.5pt 22.5pt 0in 22.5pt'><table class=MsoNormalTable border=0 cellspacing=0 cellpadding=0 width="100%" style='width:100.0%'><tr><td style='padding:0in 0in 0in 0in'><p class=MsoNormal><strong><span style='font-size:10.0pt;font-family:"Helvetica",sans-serif;color:black'>William Frankhouser</span></strong><span style='font-size:10.0pt;font-family:"Helvetica",sans-serif;color:black'> / Web Development Services</span><span style='font-family:"Helvetica",sans-serif;color:black'><br><i>Information Technology / Advance, Equip, Serve.</i><o:p></o:p></span></p></td></tr><tr><td width="100%" style='width:100.0%;padding:0in 0in 0in 0in'><div class=MsoNormal align=center style='mso-margin-top-alt:3.75pt;margin-right:0in;margin-bottom:3.75pt;margin-left:0in;text-align:center'><span style='font-family:"Helvetica",sans-serif'><hr size=2 width="100%" align=center></span></div></td></tr><tr><td style='padding:0in 0in 0in 0in'></td></tr></table><table class=MsoNormalTable border=0 cellspacing=0 cellpadding=0 align=left width="70%" style='width:70.0%;margin-bottom:5.25pt'><tr><td style='padding:0in 0in 0in 0in'><p class=MsoNormal><strong><span style='color:black'>Phone: 425-259-8705</span></strong><b><span style='color:black'><br><strong>Email: <a href="mailto:wfrankhouser@everettcc.edu" target="_blank">wfrankhouser@everettcc.edu</a></strong></span></b><span style='color:black'><br><br><strong>How did I do?</strong><br>Please take a minute to help us improve by completing the IT Feedback Survey. (<a href="http://goo.gl/J3nGC" target="_blank"><span style='color:#777777;text-decoration:none'>http://goo.gl/J3nGC</span></a>) Thank you!<o:p></o:p></span></p></td></tr></table><table class=MsoNormalTable border=0 cellspacing=0 cellpadding=0 align=right width="30%" style='width:30.0%'><tr><td style='padding:0in 0in 0in 0in'><p class=MsoNormal align=right style='text-align:right'><span style='color:black'><a href="http://www.everettcc.edu/" target="_blank"><span style='color:#777777;text-decoration:none'><img border=0 id="_x0000_i1026" src="https://drive.google.com/uc?id=0B7eLqCFtBr5ZbzVuLXBlNkNKQ2s" alt="Everett CC logo"></span></a><br><br><a href="http://www.facebook.com/EverettCC" target="_blank"><span style='font-size:9.5pt;color:#1155CC;background:white;text-decoration:none'><img border=0 id="_x0000_i1027" src="http://www.everettcc.edu/_inc/icon/social/facebook.png"></span></a></span><span style='font-size:9.5pt;color:#222222;background:white'> </span><span style='color:black'><a href="http://twitter.com/EverettCC" target="_blank"><span style='font-size:9.5pt;color:#1155CC;background:white;text-decoration:none'><img border=0 id="_x0000_i1028" src="http://www.everettcc.edu/_inc/icon/social/twitter.png"></span></a></span><span style='font-size:9.5pt;color:#222222;background:white'> </span><span style='color:black'><a href="http://www.youtube.com/EverettCommCollege" target="_blank"><span style='font-size:9.5pt;font-family:"Arial",sans-serif;color:#1155CC;background:white;text-decoration:none'><img border=0 id="_x0000_i1029" src="http://www.everettcc.edu/_inc/icon/social/youtube.png"></span></a><o:p></o:p></span></p></td></tr></table></td></tr></table></div><div><p class=MsoNormal><o:p> </o:p></p></div></div></div></div></div></div></div></div></div></div><p class=MsoNormal><o:p> </o:p></p><div><p class=MsoNormal>On Fri, Jan 20, 2017 at 11:37 AM, N Dogbo <<a href="mailto:ndogbo@gmail.com" target="_blank">ndogbo@gmail.com</a>> wrote:<o:p></o:p></p><blockquote style='border:none;border-left:solid #CCCCCC 1.0pt;padding:0in 0in 0in 6.0pt;margin-left:4.8pt;margin-right:0in'><div><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Hi web / HTML5 gurus on the list,<o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>What is the best way / coding to ensure that the <header> element is not mapped to banner region landmark when used in the body of the page?<o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>According to <a href="http://html5doctor.com/the-header-element/" target="_blank">http://html5doctor.com/the-header-element/</a><o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>When the <header> element is used within the <section> element then it is not mapped to the banner region landmark as seen and read by screen readers.<o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Does this truly work? When I test, doing as recommended in the above URL, it only works partially, in that the banner region landmark does not appear when using screen reader landmark keys, (e.g., ‘r’ and ‘d’ for jaws and nvda respectively). However when reading through the page using up / down arrow keys the banner region landmark gets picked up by screen readers.<o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>First, is my observation correct? And is there another way to do it better so that the <header> element is only mapped / perceived as banner when used in the header area of the page only and not anywhere else on the page?<o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Your help is most helpful.<o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Thx,<o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Nicaise<o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p><div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'>Think not with your Eyes and you shall have a Perfect Vision!<o:p></o:p></p></div><p class=MsoNormal style='mso-margin-top-alt:auto;mso-margin-bottom-alt:auto'> <o:p></o:p></p></div></div><p class=MsoNormal style='margin-bottom:12.0pt'><br>_______________________________________________<br>athen-list mailing list<br><a href="mailto:athen-list@mailman13.u.washington.edu">athen-list@mailman13.u.washington.edu</a><br><a href="http://mailman13.u.washington.edu/mailman/listinfo/athen-list" target="_blank">http://mailman13.u.washington.edu/mailman/listinfo/athen-list</a><o:p></o:p></p></blockquote></div><p class=MsoNormal><o:p> </o:p></p></div></div></body></html>