question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

A11y question: why not using a list (<ul />) ?

See original GitHub issue
  • I have searched the issues of this repository and believe that this is not a duplicate.

Hi. Thanks for this great package, it works very fine for my usage.

I was just wondering if you had ever consider using a <ul /> for the element wrapper for a11y reason mainly: it allows screen readers to announce the number of items swipable ?

Advice made here also https://github.com/GoogleChromeLabs/ui-element-samples/issues/18 by @robdodson

Issue Analytics

  • State:open
  • Created 6 years ago
  • Reactions:1
  • Comments:7 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
renaudtertraiscommented, Dec 5, 2017

Thanks for your response. The link I shared was just to show the explanation of @robdodson on the advantage of using <ul /> tag for list in general, not to compare the use case. If you take a look to W3C recommendations, it seems that even for “Carousel”, <ul><li /></ul> is the good choice. It will help screen readers (an users) to know how many views are available.

https://www.w3.org/WAI/tutorials/carousels/structure/

We could enable to change tags thought props or at least add roles:

  • parent div: role=“list”
  • children: role=“listitem”

What do you think ?

0reactions
Klyngercommented, Jan 9, 2019

@oliviertassinari about this use case of showing multiple slides at once, is this a feature that you think is applicable here? If not, do you know any other library that has it implemented and works well with SSR? Thanks

Read more comments on GitHub >

github_iconTop Results From Across the Web

Is it accessible to have lists without a heading, assuming ...
I used to do something more like this with sub headings to guiding the user. <h2>Latest News</h2> <ul> <li>news item 1</li> <li>news item ......
Read more >
Is an HTML list (ul or ol) allowed to be empty for Accessibility?
In your example, a <ul> element without the ARIA role attribute would have an implicit role of list , but because the list...
Read more >
Content Structure | Web Accessibility Initiative (WAI) - W3C
Unordered lists are used when the order of the items is not relevant. List items in unordered lists are marked with a bullet....
Read more >
Checklist - The A11Y Project
This checklist targets many, but not all level A and AA concerns. ... Use list elements ( ol , ul , and dl...
Read more >
<ul> and <ol> must only directly contain <li>, <script> or ...
How to Fix the Problem. Ensure all ordered and unordered lists (defined by ul or ol elements) contain only li content elements.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found