Re: Nu-HTML warning - Aria-label with horizontal rule?

Joseph Polizzotto MA <[email protected]> Sat, 30 May 2020 20:23:54 -0700
Newsgroups gmane.org.w3c.validator
Message-ID <CAGQNLEUYogWG606h25OOHSb+for0BpEdm9jEdoy3F6bvuBo_fQ@mail.gmail.com>
--00000000000056ac3605a6e937a2
Content-Type: text/plain; charset="UTF-8"
Content-Transfer-Encoding: quoted-printable

Hi Michael:

I have found that the use of aria-label within <hr /> is supported by these
configurations:

- NVDA 2020.1 and Firefox 76.0.1
- JAWS 2019.1912 and Chrome 83.04
- JAWS 2019.1912 and IE 11.836
- JAWS 2019.1912 and Edge 83.0.478
- VoiceOver(iOS 13.4.1) in Gmail app

It is not supported, however, with these configurations:

- VoiceOver(macOS Mojave 10.14.6) Safari (13.1.1) or Chrome (83.04)
- VoiceOver(macOS Catalina 10.15.4) Safari (13.1.1) or Chrome (83.04)

I haven't tested with TalkBack yet.

I should have mentioned that the secondary text content in our documents is
marked up with <aside aria-labelledby=3D"page-#">.  This markup is NOT hear=
d
by students when they are using the Read All command with JAWS. They can
navigate to these areas when using the landmarks keystroke, however.

While using the aria-label within <hr /> is probably not a very common use
case, it makes sense for the students for whom we are creating alternative
formats. Since some AT support that usage (our students primarily use JAWS)
is there another reason why the Nu-HTML checker should flag it as a warning=
?

Joseph

On Sat, May 30, 2020 at 3:49 PM Michael[tm] Smith <[email protected]> wrote:

>
> https://www.w3.org/TR/using-aria/#practical-support-aria-label-aria-label=
ledby-and-aria-describedby
> and
> https://developer.paciellogroup.com/blog/2017/07/short-note-on-aria-label=
-aria-labelledby-and-aria-describedby/
> are what was used as guidance in determining what the checker should warn
> about.
>
> Note, in the later document, this general comment:
>
> > If you use aria-label, aria-labelledby, or aria-describedby with any
> > other elements (like div, span, p, blockquote, or strong etc.), they
> > generally won=E2=80=99t work across all browser/assistive technology
> > combinations.
>
> Neither of those documents list the hr element as being one that aria-lab=
el
> should be used with.
>
> So I think the problem you would run into with using aria-label with hr i=
n
> the way you=E2=80=99ve described is that you=E2=80=99ll end up finding ou=
t it=E2=80=99s not being
> announced as expected by current AT software.
>
>   =E2=80=93Mike
>
> Joseph Polizzotto MA <[email protected]>, 2020-05-29 11:00 -0700:
> > Archived-At: <
> https://www.w3.org/mid/CAGQNLEUhv84_M0ABjs9amLFPCb8rn8pBqoJFe27oi+nY-j1rS=
[email protected]
> >
> >
> > In our work within disability services, we are trying to develop a meth=
od
> > in HTML which will help our students distinguish secondary text content
> > from primary text content.
> >
> > One thought we had was to use the horizontal rule between these two are=
as
> > and to announce to the screen reader user the beginning of "extra
> content".
> > This way the student can jump over that content if they wish.
> >
> > Would it be possible to use an aria-label inside a horizontal rule
> without
> > receiving a warning message with the Nu-HTML checker?
> >
> > I have attached a file.
> >
> > Thank you,
> >
> > Joseph
>
>
>
> --
> Michael[tm] Smith https://people.w3.org/mike
>


--=20
*Alternate Media Supervisor*
Disabled Students' Program
University of California, Berkeley
https://dsp.berkeley.edu/
<https://nam02.safelinks.protection.outlook.com/?url=3Dhttps%3A%2F%2Fdsp.be=
rkeley.edu%2F&data=3D02%7C01%7C%7C4e0abffcb5b34567a22308d5e13137b3%7C84df9e=
7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C636662523854357148&sdata=3DyB5%2BUm2W6=
TBwpc%2BOF4DvN8wPoo1dozUwz8eCepYhTyY%3D&reserved=3D0>
(510) 642-0329

--00000000000056ac3605a6e937a2
Content-Type: text/html; charset="UTF-8"
Content-Transfer-Encoding: quoted-printable

<div dir=3D"ltr">Hi Michael:<div><div><br></div><div>I have found that the =
use of aria-label within &lt;hr /&gt; is supported by these configurations:=
<br><div><br></div><div>- NVDA 2020.1 and Firefox 76.0.1</div><div>- JAWS 2=
019.1912 and Chrome 83.04</div><div>- JAWS 2019.1912 and IE 11.836</div><di=
v>- JAWS 2019.1912 and Edge 83.0.478</div><div>- VoiceOver(iOS 13.4.1) in G=
mail app</div><div><br></div><div>It is not supported, however, with these =
configurations:</div><div><br></div><div>- VoiceOver(macOS Mojave 10.14.6) =
Safari (13.1.1) or Chrome (83.04)</div><div>- VoiceOver(macOS Catalina 10.1=
5.4) Safari (13.1.1) or Chrome (83.04)=C2=A0=C2=A0<br></div><div><br></div>=
</div></div><div>I haven&#39;t tested with TalkBack yet.</div><div><br></di=
v><div>

I should have mentioned that the secondary text content in our documents is=
 marked up with &lt;aside aria-labelledby=3D&quot;page-#&quot;&gt;.=C2=A0



 This markup is NOT heard by students when they are using the Read All comm=
and with JAWS. They can navigate to these areas when using the landmarks ke=
ystroke, however.=C2=A0</div><div><br></div><div>While using the aria-label=
 within &lt;hr /&gt; is probably not a very common use case, it makes sense=
 for the students=C2=A0for whom we are creating alternative formats. Since =
some AT support that usage (our students primarily use JAWS) is there anoth=
er reason why the Nu-HTML checker should flag it as a warning?</div><div><b=
r></div><div>Joseph</div></div><br><div class=3D"gmail_quote"><div dir=3D"l=
tr" class=3D"gmail_attr">On Sat, May 30, 2020 at 3:49 PM Michael[tm] Smith =
&lt;<a href=3D"mailto:[email protected]">[email protected]</a>&gt; wrote:<br></div><blo=
ckquote class=3D"gmail_quote" style=3D"margin:0px 0px 0px 0.8ex;border-left=
:1px solid rgb(204,204,204);padding-left:1ex"><a href=3D"https://www.w3.org=
/TR/using-aria/#practical-support-aria-label-aria-labelledby-and-aria-descr=
ibedby" rel=3D"noreferrer" target=3D"_blank">https://www.w3.org/TR/using-ar=
ia/#practical-support-aria-label-aria-labelledby-and-aria-describedby</a><b=
r>
and <a href=3D"https://developer.paciellogroup.com/blog/2017/07/short-note-=
on-aria-label-aria-labelledby-and-aria-describedby/" rel=3D"noreferrer" tar=
get=3D"_blank">https://developer.paciellogroup.com/blog/2017/07/short-note-=
on-aria-label-aria-labelledby-and-aria-describedby/</a><br>
are what was used as guidance in determining what the checker should warn a=
bout.<br>
<br>
Note, in the later document, this general comment:<br>
<br>
&gt; If you use aria-label, aria-labelledby, or aria-describedby with any<b=
r>
&gt; other elements (like div, span, p, blockquote, or strong etc.), they<b=
r>
&gt; generally won=E2=80=99t work across all browser/assistive technology<b=
r>
&gt; combinations.<br>
<br>
Neither of those documents list the hr element as being one that aria-label=
<br>
should be used with.<br>
<br>
So I think the problem you would run into with using aria-label with hr in<=
br>
the way you=E2=80=99ve described is that you=E2=80=99ll end up finding out =
it=E2=80=99s not being<br>
announced as expected by current AT software.<br>
<br>
=C2=A0 =E2=80=93Mike<br>
<br>
Joseph Polizzotto MA &lt;<a href=3D"mailto:[email protected]" target=
=3D"_blank">[email protected]</a>&gt;, 2020-05-29 11:00 -0700:<br>
&gt; Archived-At: &lt;<a href=3D"https://www.w3.org/mid/CAGQNLEUhv84_M0ABjs=
[email protected]" rel=3D"noreferrer" target=
=3D"_blank">https://www.w3.org/mid/CAGQNLEUhv84_M0ABjs9amLFPCb8rn8pBqoJFe27=
[email protected]</a>&gt;<br>
&gt; <br>
&gt; In our work within disability services, we are trying to develop a met=
hod<br>
&gt; in HTML which will help our students distinguish secondary text conten=
t<br>
&gt; from primary text content.<br>
&gt; <br>
&gt; One thought we had was to use the horizontal rule between these two ar=
eas<br>
&gt; and to announce to the screen reader user the beginning of &quot;extra=
 content&quot;.<br>
&gt; This way the student can jump over that content if they wish.<br>
&gt; <br>
&gt; Would it be possible to use an aria-label inside a horizontal rule wit=
hout<br>
&gt; receiving a warning message with the Nu-HTML checker?<br>
&gt; <br>
&gt; I have attached a file.<br>
&gt; <br>
&gt; Thank you,<br>
&gt; <br>
&gt; Joseph<br>
<br>
<br>
<br>
-- <br>
Michael[tm] Smith <a href=3D"https://people.w3.org/mike" rel=3D"noreferrer"=
 target=3D"_blank">https://people.w3.org/mike</a><br>
</blockquote></div><br clear=3D"all"><div><br></div>-- <br><div dir=3D"ltr"=
 class=3D"gmail_signature"><div dir=3D"ltr"><div><div dir=3D"ltr"><div><div=
 dir=3D"ltr"><div><div dir=3D"ltr"><div><div><b style=3D"font-family:verdan=
a,sans-serif;font-size:small;letter-spacing:0.2px">Alternate Media Supervis=
or</b><br></div><div dir=3D"ltr"><div dir=3D"ltr" style=3D"color:rgb(0,0,0)=
;font-family:-webkit-standard;font-style:normal;font-weight:normal;letter-s=
pacing:normal;text-align:start;text-indent:0px;text-transform:none;white-sp=
ace:normal;word-spacing:0px;text-decoration:none"><div dir=3D"ltr"><div><di=
v dir=3D"ltr"><div><div dir=3D"ltr"><div dir=3D"ltr"><div dir=3D"ltr"><div =
dir=3D"ltr"><div dir=3D"ltr"><div dir=3D"ltr"><div dir=3D"ltr"><div dir=3D"=
ltr"><div dir=3D"ltr"><div dir=3D"ltr"><div><font size=3D"2" face=3D"verdan=
a,sans-serif">Disabled Students&#39; Program</font></div><div><font size=3D=
"2" face=3D"verdana,sans-serif">University of California, Berkeley</font></=
div><div><font size=3D"2" face=3D"verdana,sans-serif"><a href=3D"https://na=
m02.safelinks.protection.outlook.com/?url=3Dhttps%3A%2F%2Fdsp.berkeley.edu%=
2F&amp;data=3D02%7C01%7C%7C4e0abffcb5b34567a22308d5e13137b3%7C84df9e7fe9f64=
0afb435aaaaaaaaaaaa%7C1%7C0%7C636662523854357148&amp;sdata=3DyB5%2BUm2W6TBw=
pc%2BOF4DvN8wPoo1dozUwz8eCepYhTyY%3D&amp;reserved=3D0" target=3D"_blank">ht=
tps://dsp.berkeley.edu/</a></font><br></div><div><font size=3D"2" face=3D"v=
erdana,sans-serif">(510) 642-0329<br></font></div></div></div></div></div><=
/div></div></div></div></div></div></div></div></div></div></div><div><br><=
/div></div></div></div></div></div></div></div></div></div></div>

--00000000000056ac3605a6e937a2--