E-mail List Archives
Thread: Good Example of an ARIA-Label Bug
Number of posts in this thread: 3 (In chronological order)
From: Kelly Ford
Date: Thu, May 27 2021 7:50PM
Subject: Good Example of an ARIA-Label Bug
No previous message | Next message →
Hi,
I sometimes look for real-world examples of unique accessibility bugs that are not immediately obvious to use in presentations. CBSSport.com appears to use aria-label on links for the scores of baseball games. However, the label doesn't match the actual result.
For example today the Milwaukee Brewers beat the San Diego Padres 6-5 but the aria-label reflects a 0-0 score.
<a href="/mlb/gametracker/recap/MLB_20210527_SD@MIL/" aria-label="San Diego Padres 0, Milwaukee Brewers 0 - Final">
<div class="scorecard mlb post-game ">
<div class="away-team ">
<div class="logo"><img src=https://sportsfly.cbsistatic.com/fly-284/bundles/sportsmediacss/images/team-logos/mlb/alt/SD.svg alt=""></div>
<div class="team">SD</div>
<div class="score"> 5
</div>
</div>
<div class="home-team winner">
<div class="logo"><img src=https://sportsfly.cbsistatic.com/fly-284/bundles/sportsmediacss/images/team-logos/mlb/alt/MIL.svg alt=""></div>
<div class="team">MIL</div>
<div class="score"> 6
</div>
</div>
<div class="current-status">
<span class="status-left">
FINAL/10</span>
</div>
</div>
</a>
Sharing here on the chance anyone else wants an interesting example.
Kelly
From: Birkir R. Gunnarsson
Date: Thu, May 27 2021 10:01PM
Subject: Re: Good Example of an ARIA-Label Bug
← Previous message | Next message →
I sometimes see links with aria-label="opens in a new window". There
was one on an Intuit blog about accessibility even (and it was a good
blog too).
https://blogs.intuit.com/blog/2021/05/06/proving-accessibility-is-worth-it-with-analytics/
Fortunately, after I pointed it out to them, they fixed the problem.
On 5/27/21, Kelly Ford < = EMAIL ADDRESS REMOVED = > wrote:
> Hi,
>
> I sometimes look for real-world examples of unique accessibility bugs that
> are not immediately obvious to use in presentations. CBSSport.com appears
> to use aria-label on links for the scores of baseball games. However, the
> label doesn't match the actual result.
>
> For example today the Milwaukee Brewers beat the San Diego Padres 6-5 but
> the aria-label reflects a 0-0 score.
>
> <a href="/mlb/gametracker/recap/MLB_20210527_SD@MIL/" aria-label="San Diego
> Padres 0, Milwaukee Brewers 0 - Final">
> <div class="scorecard mlb post-game
> ">
> <div class="away-team ">
> <div class="logo"><img
> src=https://sportsfly.cbsistatic.com/fly-284/bundles/sportsmediacss/images/team-logos/mlb/alt/SD.svg
> alt=""></div>
> <div class="team">SD</div>
>
>
> <div class="score"> 5
> </div>
> </div>
> <div class="home-team winner">
> <div class="logo"><img
> src=https://sportsfly.cbsistatic.com/fly-284/bundles/sportsmediacss/images/team-logos/mlb/alt/MIL.svg
> alt=""></div>
> <div class="team">MIL</div>
>
>
> <div class="score"> 6
> </div>
> </div>
> <div class="current-status">
> <span class="status-left">
> FINAL/10</span>
> </div>
> </div>
> </a>
>
> Sharing here on the chance anyone else wants an interesting example.
>
> Kelly
> > > > >
--
Work hard. Have fun. Make history.
From: Mallory
Date: Sat, May 29 2021 3:44AM
Subject: Re: Good Example of an ARIA-Label Bug
← Previous message | No next message
I recently tweeted one I saw in an audit last week:
<button aria-label="confirm">Delete</button>
(it's not really a button, it's a web-component button, but I anonymised it)
Now this button is found within a section that's all about the thing to be deleted, and the user has already clicked some kind of delete control and this is sort of a "are you sure?" additional step, so the "confirm" and "delete" are not as opposite as it may initially seem... but still. Huge difference.
Developers seem to think aria-labels are added to acc names rather than replacing them. I see it also with aria-labelledby + aria-label but less often.
cheers,
_mallory
On Fri, May 28, 2021, at 6:01 AM, Birkir R. Gunnarsson wrote:
> I sometimes see links with aria-label="opens in a new window". There
> was one on an Intuit blog about accessibility even (and it was a good
> blog too).
> https://blogs.intuit.com/blog/2021/05/06/proving-accessibility-is-worth-it-with-analytics/
> Fortunately, after I pointed it out to them, they fixed the problem.
>
>
> On 5/27/21, Kelly Ford < = EMAIL ADDRESS REMOVED = > wrote:
> > Hi,
> >
> > I sometimes look for real-world examples of unique accessibility bugs that
> > are not immediately obvious to use in presentations. CBSSport.com appears
> > to use aria-label on links for the scores of baseball games. However, the
> > label doesn't match the actual result.
> >
> > For example today the Milwaukee Brewers beat the San Diego Padres 6-5 but
> > the aria-label reflects a 0-0 score.
> >
> > <a href="/mlb/gametracker/recap/MLB_20210527_SD@MIL/" aria-label="San Diego
> > Padres 0, Milwaukee Brewers 0 - Final">
> > <div class="scorecard mlb post-game
> > ">
> > <div class="away-team ">
> > <div class="logo"><img
> > src=https://sportsfly.cbsistatic.com/fly-284/bundles/sportsmediacss/images/team-logos/mlb/alt/SD.svg
> > alt=""></div>
> > <div class="team">SD</div>
> >
> >
> > <div class="score"> 5
> > </div>
> > </div>
> > <div class="home-team winner">
> > <div class="logo"><img
> > src=https://sportsfly.cbsistatic.com/fly-284/bundles/sportsmediacss/images/team-logos/mlb/alt/MIL.svg
> > alt=""></div>
> > <div class="team">MIL</div>
> >
> >
> > <div class="score"> 6
> > </div>
> > </div>
> > <div class="current-status">
> > <span class="status-left">
> > FINAL/10</span>
> > </div>
> > </div>
> > </a>
> >
> > Sharing here on the chance anyone else wants an interesting example.
> >
> > Kelly
> > > > > > > > > >
>
>
> --
> Work hard. Have fun. Make history.
> > > > >