WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Carousel semantics in native apps


From: Murphy, Sean
Date: May 22, 2020 11:48PM


The challenge with native apps for mobile is the reduce number of roles defined by default in the accessibility API. There is no role called card nor does a screen reader user understand this concept. I had to be explain what a card was. For example, the iPhone iOS Setting apps, each option like Mobile, General, Bluetooth, ETC are all cards. Voiceover announces them as buttons.

From my point of view - links is something used within apps to open web content in a browser or within the same app, activation of a phone number and sending emails. I would not use them for scrolling carousel's. The SC for Hide, pause and stop on a principle level still applies here by the way. If you are developing an app, I would make the cards shown in the carousel static and not auto scrolling. Provide the buttons to move forward and back. I would treat each card as buttons using the similar approach as apple. I am not aware of a role that can explain carousel's in a better manner.

Web is a different beast.


Sean Murphy | Digital System specialist (Accessibility)
Telstra Digital Channels | Digital Systems
Mobile: 0405 129 739 | Desk: (02) 9866-7917
Digital Systems Launch Page
Accessibility Single source of Truth

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Jeevan Reddy
Sent: Thursday, 21 May 2020 4:18 PM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: [WebAIM] Carousel semantics in native apps

[External Email] This email was sent from outside the organisation – be cautious, particularly with links and attachments.

Hello all, Happy GAAD 2020.
I have been observing in native apps scrollable carousel displaying more than more than one card item in the viewport which is quite popular in social media and eCommerce. The carousel doesn't have pagination, previous and next buttons but conveying number of items such as 3 of 10.
I also observed that the card is provided with button semantics in some apps, for example stories section at the top in Facebook app. The same card item used as link in some other apps, for example, related products/customers also bought section in Amazon app.
What would be the semantics you prefer: button, link, card, slide? In eCommerce context.