Re: role="list", Safari and VoiceOver

—whether developers and web authors overuse lists, or apply them unnecessarily.
Could anyone suggest some guidance in tactful/appropriate use of <ul>? E.g. how to measure when you’re overusing lists?  I’m assuming this is less an issue with <ol>? Sounds like it could be an interesting read.

Thank you,
Casey Hickey

From: Peter Weil <peter.weil@wisc.edu>
Date: Monday, May 2, 2022 at 9:39 AM
To: Jonathan Avila <jon.avila@levelaccess.com>
Cc: ML W3C, WAI <w3c-wai-ig@w3.org>
Subject: Re: role="list", Safari and VoiceOver
CAUTION: This email came from outside SUNY Cortland. Don't click links or open attachments unless you recognize the sender and know the content is safe. Please forward this to thc@cortland.edu if you think this email is suspicious.


There are (at least!) two issues here, and it would be best to keep them distinct.

One is whether developers and web authors overuse lists, or apply them unnecessarily. Apparently this annoys at least some users. I suspect that the mistreatment of list elements pales in comparison to other common developer behaviors that make web sites inaccessible, such as the misapplication of ARIA, the failure to add alternate text to images, etc.

The second, and more important, question is what, if anything, browsers (or browser vendors) ought to do to “protect” users from perceived abuse of html by developers and web authors. Safari’s treatment of lists is not an accident; it’s an “intentional bug”. However well-intentioned the Safari team might be, in my opinion it’s the wrong approach, and not one that I’d like to see other browser vendors replicate, or replicate any more than they already have.

In addition the Scott O’Hara article cited earlier in this thread, I also recommend Eric Eggert’s https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fyatil.net%2Fblog%2Fmuch-ado-about-no-lists&amp;data=05%7C01%7CCasey.Hickey%40cortland.edu%7C5c752d5ca153420171f608da2c4105ea%7C6c9b19b4c847442aa49c6d9d7fdae230%7C1%7C0%7C637870955882463523%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&amp;sdata=CqJt%2BVlj1iZ8%2FDRfNlLF4cy3onIvJ1jctlK3wYUF7Hs%3D&amp;reserved=0. As Eggert and O’Hara point out, the issue is not necessarily as simple or clearcut as one might think at first glance.

Peter


> On May 2, 2022, at 7:47 AM, Jonathan Avila <jon.avila@levelaccess.com> wrote:
>
> Hi Marc, I personally find that lists are overused as well.  Especially when you are within navigation elements and that structure is sufficient having an additional list structure just adds extra verbosity for users of screen readers.    Lists are often used in that manner for horizontal items, 1 or 2 items and unrelated items such as two navigation links and a profile menu.
>
> Jonathan
>
> From: Marc Haunschild <marc.haunschild@accessibility.consulting>
> Sent: Sunday, May 1, 2022 10:32 AM
> To: John Foliot <john@foliot.ca>
> Cc: Peter Weil <peter.weil@wisc.edu>; Bernat Lleonart <bernat.lleonart@proton.me>; ML W3C, WAI <w3c-wai-ig@w3.org>
> Subject: Re: role="list", Safari and VoiceOver
>
> CAUTION: This email originated from outside of the organization. Do not click links or open attachments unless you recognize the sender and know the content is safe.
>
> Interesting discussion - I read, that users complain a lot about too many lists and that most users appreciate apples design decision.
>
> Sorry, but I don’t find this resource anymore. But maybe you have more reliable studies/ insights, that users want to have the lists back?
>
> Greetings
>
> mh
>
> --
>
> Mit freundlichen Grüßen
>
>
> Marc Haunschild
> Accessibility Consultant
>
> https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Faccessibility.consulting%2F&amp;data=05%7C01%7CCasey.Hickey%40cortland.edu%7C5c752d5ca153420171f608da2c4105ea%7C6c9b19b4c847442aa49c6d9d7fdae230%7C1%7C0%7C637870955882463523%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&amp;sdata=2rORI7feHoq3DRdi5u%2F%2FRJXuAu4Q%2BXzp9GIwoxHc8UM%3D&amp;reserved=0
>
>
>
> Am 29.04.2022 um 18:23 schrieb John Foliot <john@foliot.ca>:
>
> Hi  Bernat,
>
> A few thoughts: first, the arrogance of Apple is well documented, and this is not the only example of their tools not supporting web standards properly. The hubris of their decision policies is extremely frustrating.
>
> While I understand the desire to have "error-free" HTML, I think there are a few bullet points here to go back to your powers-that-be to discuss:
>
> a) due to a bug in Apple's product, their tool is not meeting the expected standard. Applying the fix, while not technically conformant, addresses the real need and gap that users experience.
>
> (Perhaps also remembering the design principle that drove the development of HTML 5 may help here: the priority of constituents then was summed up as: "In case of conflict, consider users over authors over implementors over specifiers over theoretical purity'".) Here, I would argue that knowing the rules, and the impact on breaking the rules, should be the final arbiter, and specifically adding that role - even though the validator is squawking - is the better choice for the accessible user-experience. Choose users over theoretical purity!
>
> b) It may also be worth remembering that back when ARIA was first introduced, the ARIA spec itself was 'vetted' and approved by the W3C, yet if/when you added ARIA attributes to a valid HTML 4.1 document back then, the validator complained that the resulting code was invalid. But as an informed developer, I knew that if my HTML 4.1 code was valid without the ARIA attributes, that adding those attributes really wasn't creating harm, and in fact was making things EVEN BETTER.
>
> So, really, the agency where you work sort of need to choose between two objectives: error-free HTML, or optimized accessibility for all users on all platforms/user-agents. (For me it's a no-contest decision, but I appreciate that it may not be that way everywhere).
>
> HTH
>
> JF
>
> On Fri, Apr 29, 2022 at 11:33 AM Peter Weil <peter.weil@wisc.edu> wrote:
> Bernat,
>
> For what it’s worth, I use role=“list” in these situations, and respectfully disagree with the reasons given by the Safari team to change the semantics. See https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FCSS%2Flist-stylefor&amp;data=05%7C01%7CCasey.Hickey%40cortland.edu%7C5c752d5ca153420171f608da2c4105ea%7C6c9b19b4c847442aa49c6d9d7fdae230%7C1%7C0%7C637870955882463523%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&amp;sdata=lMyjPl5yYvWxU%2B%2FTA8dko6WKCt1kaQf3dbZXKAnFW4Q%3D&amp;reserved=0 a more complete explanation. I would ignore the validator warning. If you want the list semantics to be there in Safari, then it *is* necessary.
>
> I’ll let someone else answer the other question.
>
> Peter
>
> > On Apr 27, 2022, at 3:43 AM, Bernat Lleonart <bernat.lleonart@proton.me> wrote:
> >
> > Hi,
> >
> > Some time ago I came across this blog post: https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.scottohara.me%2Fblog%2F2019%2F01%2F12%2Flists-and-safari.html&amp;data=05%7C01%7CCasey.Hickey%40cortland.edu%7C5c752d5ca153420171f608da2c4105ea%7C6c9b19b4c847442aa49c6d9d7fdae230%7C1%7C0%7C637870955882463523%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&amp;sdata=mSXMeoUOrXXx3LARdo0K2XMB3mBP4qxe5fPJNgsyc5o%3D&amp;reserved=0 and this tweet: https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Ftwitter.com%2Frogerjohansson%2Fstatus%2F1083600157076324352&amp;data=05%7C01%7CCasey.Hickey%40cortland.edu%7C5c752d5ca153420171f608da2c4105ea%7C6c9b19b4c847442aa49c6d9d7fdae230%7C1%7C0%7C637870955882463523%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&amp;sdata=UH6SbkaYQS3mjvWssg4nZFIdfrwGuuNXPP%2BNlEuNadU%3D&amp;reserved=0
> >
> > Since then I'm adding role="list" to the lists that have list-style: none applied.
> >
> > However, the w3c validator show a warning: "The list role is unnecessary for element ul."
> >
> > In the web design agency I'm working I'm asked to produce error/warning free html code.
> >
> > So my questions are:
> >
> >       • Which CSS properties/values remove list semantics apart from list-style: none? For example: does display: flex remove list semantics?
> >       • What's your approach around this issue? Do you use role="list" on lists with list-style: none?
> >       • Since O'Hara's post is from 2019, I wonder if VoiceOver/Safari approach is still the same.
> >
> > Thanks.
> >
> > --
> > Bernat Lleonart
> >
> > Enviat amb h ProtonMail correu segur.
>
>
>
> --
> Peter Weil
> Web Developer
> University Marketing, University of Wisconsin–Madison
> 608-220-3089
>
>
>
>
> --
> John Foliot |
> Senior Industry Specialist, Digital Accessibility |
> W3C Accessibility Standards Contributor |
>
> "I made this so long because I did not have time to make it shorter." - Pascal "links go places, buttons do things"