WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: text in addition to arrows for flashcard navigation?

for

Number of posts in this thread: 5 (In chronological order)

From: Mike Warner
Date: Tue, Aug 30 2022 1:59PM
Subject: text in addition to arrows for flashcard navigation?
No previous message | Next message →

Hi all,

we have a flashcard feature that works great and passed the
accessibility audit from a very well-known organization. As it currently
is, there are three columns of divs. The first column is the navigation
for the previous card and contains an arrow icon link (with appropriate alt
text) and a corresponding text link that says "Previous Card." The middle
column is the card, and the right column is the navigation for the next
slide, with the icon and text as previously described. Since the arrow
icons have alt text, do we need the text in addition to the icons? It
seems like the text is not needed, but I wanted to run it by this list
before making a change to accommodate a learner.

Thanks,
Mike

Mike Warner
Director of IT Services
MindEdge Learning

From: Steve Green
Date: Tue, Aug 30 2022 2:04PM
Subject: Re: text in addition to arrows for flashcard navigation?
← Previous message | Next message →

You don't need text for WCAG conformance, but I would recommend it for usability.

Steve Green
Managing Director
Test Partners Ltd


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Mike Warner
Sent: 30 August 2022 21:00
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] text in addition to arrows for flashcard navigation?

Hi all,

we have a flashcard feature that works great and passed the accessibility audit from a very well-known organization. As it currently is, there are three columns of divs. The first column is the navigation for the previous card and contains an arrow icon link (with appropriate alt
text) and a corresponding text link that says "Previous Card." The middle column is the card, and the right column is the navigation for the next slide, with the icon and text as previously described. Since the arrow icons have alt text, do we need the text in addition to the icons? It seems like the text is not needed, but I wanted to run it by this list before making a change to accommodate a learner.

Thanks,
Mike

Mike Warner
Director of IT Services
MindEdge Learning

From: Murray Inman
Date: Thu, Sep 01 2022 9:29AM
Subject: Re: text in addition to arrows for flashcard navigation?
← Previous message | Next message →

I would suggest considering the removal of the icon and keeping the text.
Generally, only screen readers benefit from alt text images and using an
icon assumes the user has similar cultural iconography experience or has
the cognitive ability to understand the implied meaning. Whereas, keeping
the text will give all users, sighted or unsighted, a similar experience.
It also has the benefit of being available to other technologies like page
translators and browser extensions that can define words that the user
doesn't understand.


Murray Inman

Manager, Instructional Media and Accessibility

VP, Ability Maricopa Employees with Disability Advocacy Group

480-517-8561 | = EMAIL ADDRESS REMOVED =

RIO SALADO COLLEGE | https://riosalado.edu

2323 West 14th Street, Tempe, AZ 85281

Definition of "Accessible" <http://learnatrio.com/accessibilityDefined>; by
the Office for Civil Rights


On Tue, Aug 30, 2022 at 1:00 PM Mike Warner < = EMAIL ADDRESS REMOVED = > wrote:

> Hi all,
>
> we have a flashcard feature that works great and passed the
> accessibility audit from a very well-known organization. As it currently
> is, there are three columns of divs. The first column is the navigation
> for the previous card and contains an arrow icon link (with appropriate alt
> text) and a corresponding text link that says "Previous Card." The middle
> column is the card, and the right column is the navigation for the next
> slide, with the icon and text as previously described. Since the arrow
> icons have alt text, do we need the text in addition to the icons? It
> seems like the text is not needed, but I wanted to run it by this list
> before making a change to accommodate a learner.
>
> Thanks,
> Mike
>
> Mike Warner
> Director of IT Services
> MindEdge Learning
> > > > >

From: Steve Green
Date: Thu, Sep 01 2022 9:43AM
Subject: Re: text in addition to arrows for flashcard navigation?
← Previous message | Next message →

You cannot assume that text gives all users a similar experience. Some people, especially those with cognitive impairments, benefit greatly from the provision of supporting images.

In user testing sessions I have seen people with dyslexia completely fail tasks even though they text they needed to complete the task was right in front of them. In one case it was a 24pt bold red error message, but although they saw it, it just didn't register. In that case the participant reckoned that it would have registered if the text was supported by an icon or had a thick border.

The lesson for me was that it's really difficult to understand what some people perceive when presented with text. It's not just about the words - it's about the position, spacing, background colour, supporting imagery and other factors. There is no such thing as "universal design"!

Steve Green
Managing Director
Test Partners Ltd


-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Murray Inman
Sent: 01 September 2022 16:29
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] text in addition to arrows for flashcard navigation?

I would suggest considering the removal of the icon and keeping the text.
Generally, only screen readers benefit from alt text images and using an icon assumes the user has similar cultural iconography experience or has the cognitive ability to understand the implied meaning. Whereas, keeping the text will give all users, sighted or unsighted, a similar experience.
It also has the benefit of being available to other technologies like page translators and browser extensions that can define words that the user doesn't understand.


Murray Inman

Manager, Instructional Media and Accessibility

VP, Ability Maricopa Employees with Disability Advocacy Group

480-517-8561 | = EMAIL ADDRESS REMOVED =

RIO SALADO COLLEGE | https://riosalado.edu

2323 West 14th Street, Tempe, AZ 85281

Definition of "Accessible" <http://learnatrio.com/accessibilityDefined>; by the Office for Civil Rights


On Tue, Aug 30, 2022 at 1:00 PM Mike Warner < = EMAIL ADDRESS REMOVED = > wrote:

> Hi all,
>
> we have a flashcard feature that works great and passed the
> accessibility audit from a very well-known organization. As it
> currently is, there are three columns of divs. The first column is
> the navigation for the previous card and contains an arrow icon link
> (with appropriate alt
> text) and a corresponding text link that says "Previous Card." The
> middle column is the card, and the right column is the navigation for
> the next slide, with the icon and text as previously described. Since
> the arrow icons have alt text, do we need the text in addition to the
> icons? It seems like the text is not needed, but I wanted to run it
> by this list before making a change to accommodate a learner.
>
> Thanks,
> Mike
>
> Mike Warner
> Director of IT Services
> MindEdge Learning
> > > archives at http://webaim.org/discussion/archives
> >

From: Murray Inman
Date: Thu, Sep 01 2022 10:04AM
Subject: Re: text in addition to arrows for flashcard navigation?
← Previous message | No next message

Very excellent point Steve! Thank you for the reminder.

One thing that I have learned is that when it comes to accessibility, and
something that I try to help people understand, is that accessibility is a
very personal experience for every user. The best way to improve overall
accessibility is to talk to more people (especially those less-similar to
ourselves) and provide options where possible.

I hereby revise my recommendation to keep both text and icon, but to be
sure that the icon doesn't repeat the same thing as the text. I find that
in most situations like this, hiding the icon from screen readers
with aria-hidden="true" attribute works well. A good resource to check is
the accessibility section of Font Awesome
<https://fontawesome.com/docs/web/dig-deeper/accessibility> that breaks
down different common use cases for icon use.

Murray Inman
Manager, Instructional Media and Accessibility
VP, Ability Maricopa Employees with Disability Advocacy Group
Rio Salado College | https://riosalado.edu



On Thu, Sep 1, 2022 at 8:43 AM Steve Green < = EMAIL ADDRESS REMOVED = >
wrote:

> You cannot assume that text gives all users a similar experience. Some
> people, especially those with cognitive impairments, benefit greatly from
> the provision of supporting images.
>
> In user testing sessions I have seen people with dyslexia completely fail
> tasks even though they text they needed to complete the task was right in
> front of them. In one case it was a 24pt bold red error message, but
> although they saw it, it just didn't register. In that case the participant
> reckoned that it would have registered if the text was supported by an icon
> or had a thick border.
>
> The lesson for me was that it's really difficult to understand what some
> people perceive when presented with text. It's not just about the words -
> it's about the position, spacing, background colour, supporting imagery and
> other factors. There is no such thing as "universal design"!
>
> Steve Green
> Managing Director
> Test Partners Ltd
>
>
> -----Original Message-----
> From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of
> Murray Inman
> Sent: 01 September 2022 16:29
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] text in addition to arrows for flashcard navigation?
>
> I would suggest considering the removal of the icon and keeping the text.
> Generally, only screen readers benefit from alt text images and using an
> icon assumes the user has similar cultural iconography experience or has
> the cognitive ability to understand the implied meaning. Whereas, keeping
> the text will give all users, sighted or unsighted, a similar experience.
> It also has the benefit of being available to other technologies like page
> translators and browser extensions that can define words that the user
> doesn't understand.
>
>
> Murray Inman
>
> Manager, Instructional Media and Accessibility
>
> VP, Ability Maricopa Employees with Disability Advocacy Group
>
> 480-517-8561 | = EMAIL ADDRESS REMOVED =
>
> RIO SALADO COLLEGE | https://riosalado.edu
>
> 2323 West 14th Street, Tempe, AZ 85281
>
> Definition of "Accessible" <http://learnatrio.com/accessibilityDefined>;
> by the Office for Civil Rights
>
>
> On Tue, Aug 30, 2022 at 1:00 PM Mike Warner < = EMAIL ADDRESS REMOVED = > wrote:
>
> > Hi all,
> >
> > we have a flashcard feature that works great and passed the
> > accessibility audit from a very well-known organization. As it
> > currently is, there are three columns of divs. The first column is
> > the navigation for the previous card and contains an arrow icon link
> > (with appropriate alt
> > text) and a corresponding text link that says "Previous Card." The
> > middle column is the card, and the right column is the navigation for
> > the next slide, with the icon and text as previously described. Since
> > the arrow icons have alt text, do we need the text in addition to the
> > icons? It seems like the text is not needed, but I wanted to run it
> > by this list before making a change to accommodate a learner.
> >
> > Thanks,
> > Mike
> >
> > Mike Warner
> > Director of IT Services
> > MindEdge Learning
> > > > > > archives at http://webaim.org/discussion/archives
> > > >
> > > at http://webaim.org/discussion/archives
> >