WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Mobile Native apps - buttons that use colours and text without any borders.


From: Birkir R. Gunnarsson
Date: Jan 25, 2020 2:06PM

1.4.1 it is, but it explicitly applies to links embedded in a block of text.
I've found it weird that some WCAG requirements only apply to links
(1.4.1 and 2.4.4). I think all labels of interactive elements should
be unique (or unique in context) and you could just as well have a
button in the middle of a block of text as a link (else you can just
change the role of the link to a button to avoid having to pass either
To the actual topic of discussion, 2.4.7 (keyboard focus) basically
gives you a pass if you are using operating system/browser defaults
for keyboard focus outline. Since this sitaution is similar I think
WCAG should give you a pass on it.
Since we care more about users than conformance, one big difference
between a native mobile app and the web is that the assistive
technologies are biult into the device itself (or at least the vast
majority of the devices we are looking at), unlike computers where you
often have to download, even purchase the assitsive technology you
So I see an argument in users easily being able to configure operating
system buttons to have an outline, if it is a matter of changing a
setting (then again, we often rely on users being able to discover
these settings, just like we expect users to know how to navigate
tables, both assumptions tend to be wrong).
On the balance of things, I think this is acceptable, but wonder why
both operating systems have gotten away from visually presenting
actionable items as such, don't they want users to click buttons?

On 1/23/20, Murphy, Sean < <EMAIL REMOVED> > wrote:
> Steve,
> Your referring to SC 1.4.1 where you cannot only use colour alone. This is
> a mobile native app, not web. The sc 1.4.11 I will have a look at, thanks
> for that pointer.
> The standards provided are great. But I am more concern on everyday usage
> that this is occurring in all mobile native apps on both platforms on how
> people with Low vision and Colour Blindness are handling it. What about
> people who have cognitive issues as well. Has anyone done any studies in
> this space to find out if these types of buttons are easily understood and
> comprehended?
> Regards
> Sean Murphy
> -----Original Message-----
> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Steve
> Green
> Sent: Friday, 24 January 2020 1:41 AM
> To: WebAIM Discussion List < <EMAIL REMOVED> >
> Subject: Re: [WebAIM] Mobile Native apps - buttons that use colours and text
> without any borders.
> [External Email] This email was sent from outside the organisation – be
> cautious, particularly with links and attachments.
> I agree that SC 1.4.11 states that button borders are not needed to identify
> controls, but I believe this conflicts with another SC. Unfortunately, I
> can't recall which it is - perhaps 1.3.1 or 1.4.1. Anyway, that one says
> something to the effect that link text needs some form of affordance, such
> as an underline, if the context does not make it obvious that it is a link.
> Links in menus do not require such affordances because the grouping together
> of the words makes it obvious that they are links (according to the SC).
> Technique G182 talks about this.
> Although links and buttons are different things, my view is that the same
> reasoning applies. A single button without a border does not have enough
> context for users to know it is a button, so some other affordance, such as
> an underline is required. That may not be necessary for groups of buttons
> though.
> Steve Green
> Managing Director
> Test Partners Ltd
> -----Original Message-----
> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
> Jonathan Avila
> Sent: 23 January 2020 14:19
> To: WebAIM Discussion List < <EMAIL REMOVED> >
> Subject: Re: [WebAIM] Mobile Native apps - buttons that use colours and text
> without any borders.
> Hi Sean, WCAG 2.1 SC 1.4.11 indicates that button borders are not needed to
> identify controls. It leans on the idea that the text alone is enough to
> communicate the item is actionable. I personally have concerns with this
> notion because that assumes a certain level of cognition and also ability to
> scan and read all text in order to understand a role. Borders, backgrounds,
> and other indicators and other affordances help people with low vision and
> cognitive disabilities with cues so they don't have to read through each
> piece of text trying to figure out if it is actionable or not and doesn't
> require them to try and mouse over everything or tab to it to find out.
> While it is possible to apply custom CSS to buttons to in a browser to make
> all buttons appear actionable this is not always an option such as in mobile
> browsers and many users won't even know this is an option.
> Jonathan
> -----Original Message-----
> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
> Murphy, Sean
> Sent: Thursday, January 23, 2020 12:54 AM
> To: WebAIM Discussion List < <EMAIL REMOVED> >
> Subject: [WebAIM] Mobile Native apps - buttons that use colours and text
> without any borders.
> 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.
> All,
> From iOS 7 and onward Apple introduce buttons without any borders. The
> button only has a colour background with text. There is an accessibility
> feature when turned on provides a underline for the button to help a low
> vision user to know the it is a button if they cannot determine the colour.
> Android now apparently is also using this design style. Below is a graphic
> showing an example on what I am referring too:
> [cid:image001.jpg@01D5D20D.A597BB50]
> Does anyone know how the above impacts users with colour blindness or low
> vision? Is there any stats indicating what type of impact the above has to
> users? As we are trying to identify if any extra accessibility consideration
> is required.
> Note, We are aware the above could fail "Using only colour" SC but all the
> OS's are now using it, indicating either really bad practice or relying on
> assistive tech within the OS.
> Sean
> > > http://webaim.org/discussion/archives
> > > > http://webaim.org/discussion/archives
> > > > > >

Work hard. Have fun. Make history.