WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Live Chat - ARIA recommendations and/or good examples?

for

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

From: Judith.A.Blankman@wellsfargo.com
Date: Thu, Nov 13 2014 1:44PM
Subject: Live Chat - ARIA recommendations and/or good examples?
No previous message | Next message →

I'm being asked to review, for accessibility considerations, the design requirements for a pretty standard live chat interface on desktop. Tablet and smartphone are not in scope at this time.

I'm clear about specifying the need for focus when the chat initially opens, the form fields, etc.

My concerns are around how a blind customer using a screen reader would interact with the input field for their message, how this person would know that the service representative is responding, and then when the rep responds. So, it seems like there is a need to inform the customer when these events happen in a way that is clear, not confusing.

(This could also be reversed, saying that the service representative would be the screen reader user, however the interface I'm reviewing is customer-facing.)

Is this a good use of aria live regions?

Also, I'd appreciate any examples of where this has been delivered successfully with accessibility in mind.


Thanks,


Judith Blankman

Accessibility Strategist
Customer Experience



Wells Fargo Digital Channels Group | 550 California Street, 2nd floor | San Francisco, CA 94104

MAC A0122-020

Tel 415-947-6583 | Cell 415-601-1114 | Fax 415-974-7452


= EMAIL ADDRESS REMOVED =

From: Bryan Garaventa
Date: Thu, Nov 13 2014 2:38PM
Subject: Re: Live Chat - ARIA recommendations and/or good examples?
← Previous message | Next message →

The technique for implementing live chat with custom messages is actually very easy.

All you really need is an offscreen container element at the end of the page that innerHTML can be used to write custom strings to,
and include aria-live='polite' within the offscreen tag.

This automatically works across desktop and mobile.

Live demo:
http://whatsock.com/tsg/Coding%20Arena/Web%20Chat%20and%20Dynamic%20Message%20Announcement/Web%20Chat%20(Static)/demo.htm


-----Original Message-----
From: = EMAIL ADDRESS REMOVED = [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of
= EMAIL ADDRESS REMOVED =
Sent: Thursday, November 13, 2014 12:45 PM
To: = EMAIL ADDRESS REMOVED =
Subject: [WebAIM] Live Chat - ARIA recommendations and/or good examples?

I'm being asked to review, for accessibility considerations, the design requirements for a pretty standard live chat interface on
desktop. Tablet and smartphone are not in scope at this time.

I'm clear about specifying the need for focus when the chat initially opens, the form fields, etc.

My concerns are around how a blind customer using a screen reader would interact with the input field for their message, how this
person would know that the service representative is responding, and then when the rep responds. So, it seems like there is a need
to inform the customer when these events happen in a way that is clear, not confusing.

(This could also be reversed, saying that the service representative would be the screen reader user, however the interface I'm
reviewing is customer-facing.)

Is this a good use of aria live regions?

Also, I'd appreciate any examples of where this has been delivered successfully with accessibility in mind.


Thanks,


Judith Blankman

Accessibility Strategist
Customer Experience



Wells Fargo Digital Channels Group | 550 California Street, 2nd floor | San Francisco, CA 94104

MAC A0122-020

Tel 415-947-6583 | Cell 415-601-1114 | Fax 415-974-7452


= EMAIL ADDRESS REMOVED =

From: Jonathan Avila
Date: Thu, Nov 13 2014 6:51PM
Subject: Re: Live Chat - ARIA recommendations and/or good examples?
← Previous message | Next message →

> how this person would know that the service representative is responding, and then when the rep responds. So, it seems like there is a need to inform the customer when these events happen in a way that is clear, not confusing.

In addition, to Bryan's comment, it may be useful to provide keystrokes or navigation structures to allow users of screen readers to move between messages so that they may review what's been said. A review of how screen readers work with programs like Skype, Lync, and AIM may be useful.

Sounds (earcons) may also be useful to provide other auditory feedback.

Jonathan

-----Original Message-----
From: = EMAIL ADDRESS REMOVED = [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of = EMAIL ADDRESS REMOVED =
Sent: Thursday, November 13, 2014 3:45 PM
To: = EMAIL ADDRESS REMOVED =
Subject: [WebAIM] Live Chat - ARIA recommendations and/or good examples?

I'm being asked to review, for accessibility considerations, the design requirements for a pretty standard live chat interface on desktop. Tablet and smartphone are not in scope at this time.

I'm clear about specifying the need for focus when the chat initially opens, the form fields, etc.

My concerns are around how a blind customer using a screen reader would interact with the input field for their message, how this person would know that the service representative is responding, and then when the rep responds. So, it seems like there is a need to inform the customer when these events happen in a way that is clear, not confusing.

(This could also be reversed, saying that the service representative would be the screen reader user, however the interface I'm reviewing is customer-facing.)

Is this a good use of aria live regions?

Also, I'd appreciate any examples of where this has been delivered successfully with accessibility in mind.


Thanks,


Judith Blankman

Accessibility Strategist
Customer Experience



Wells Fargo Digital Channels Group | 550 California Street, 2nd floor | San Francisco, CA 94104

MAC A0122-020

Tel 415-947-6583 | Cell 415-601-1114 | Fax 415-974-7452


= EMAIL ADDRESS REMOVED =

From: Ryan E. Benson
Date: Fri, Nov 14 2014 12:31PM
Subject: Re: Live Chat - ARIA recommendations and/or good examples?
← Previous message | Next message →

Jonathan said:
In addition, to Bryan's comment, it may be useful to provide keystrokes or
navigation structures to allow users of screen readers to move between
messages so that they may review what's been said. A review of how
screen readers work with programs like Skype, Lync, and AIM may be useful.

While I agree, however I would say this might be slightly overkill for
people with mobility disabilities, so allowing them to tab into the
container and scroll using only the arrow keys would help.

--
Ryan E. Benson

On Thu, Nov 13, 2014 at 8:51 PM, Jonathan Avila < = EMAIL ADDRESS REMOVED = >
wrote:

> > how this person would know that the service representative is
> responding, and then when the rep responds. So, it seems like there is a
> need to inform the customer when these events happen in a way that is
> clear, not confusing.
>
> In addition, to Bryan's comment, it may be useful to provide keystrokes or
> navigation structures to allow users of screen readers to move between
> messages so that they may review what's been said. A review of how
> screen readers work with programs like Skype, Lync, and AIM may be useful.
>
> Sounds (earcons) may also be useful to provide other auditory feedback.
>
> Jonathan
>
> -----Original Message-----
> From: = EMAIL ADDRESS REMOVED = [mailto:
> = EMAIL ADDRESS REMOVED = ] On Behalf Of
> = EMAIL ADDRESS REMOVED =
> Sent: Thursday, November 13, 2014 3:45 PM
> To: = EMAIL ADDRESS REMOVED =
> Subject: [WebAIM] Live Chat - ARIA recommendations and/or good examples?
>
> I'm being asked to review, for accessibility considerations, the design
> requirements for a pretty standard live chat interface on desktop. Tablet
> and smartphone are not in scope at this time.
>
> I'm clear about specifying the need for focus when the chat initially
> opens, the form fields, etc.
>
> My concerns are around how a blind customer using a screen reader would
> interact with the input field for their message, how this person would know
> that the service representative is responding, and then when the rep
> responds. So, it seems like there is a need to inform the customer when
> these events happen in a way that is clear, not confusing.
>
> (This could also be reversed, saying that the service representative would
> be the screen reader user, however the interface I'm reviewing is
> customer-facing.)
>
> Is this a good use of aria live regions?
>
> Also, I'd appreciate any examples of where this has been delivered
> successfully with accessibility in mind.
>
>
> Thanks,
>
>
> Judith Blankman
>
> Accessibility Strategist
> Customer Experience
>
>
>
> Wells Fargo Digital Channels Group | 550 California Street, 2nd floor
> | San Francisco, CA 94104
>
> MAC A0122-020
>
> Tel 415-947-6583 | Cell 415-601-1114 | Fax 415-974-7452
>
>
> = EMAIL ADDRESS REMOVED =
>
>
>
> > > messages to = EMAIL ADDRESS REMOVED =
> > > >

From: Joy Relton
Date: Fri, Nov 14 2014 3:24PM
Subject: Re: Live Chat - ARIA recommendations and/or good examples?
← Previous message | Next message →

Can a mobility impaired person using Dragon "scroll"? I know that they can
command the software to "tab". Ihaven't tested with Dragon for a while but I
didn't think that it scrolled.

-----Original Message-----
From: = EMAIL ADDRESS REMOVED =
[mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Ryan E. Benson
Sent: Friday, November 14, 2014 2:31 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Live Chat - ARIA recommendations and/or good examples?

Jonathan said:
In addition, to Bryan's comment, it may be useful to provide keystrokes or
navigation structures to allow users of screen readers to move between
messages so that they may review what's been said. A review of how
screen readers work with programs like Skype, Lync, and AIM may be useful.

While I agree, however I would say this might be slightly overkill for
people with mobility disabilities, so allowing them to tab into the
container and scroll using only the arrow keys would help.

--
Ryan E. Benson

On Thu, Nov 13, 2014 at 8:51 PM, Jonathan Avila < = EMAIL ADDRESS REMOVED = >
wrote:

> > how this person would know that the service representative is
> responding, and then when the rep responds. So, it seems like there is
> a need to inform the customer when these events happen in a way that
> is clear, not confusing.
>
> In addition, to Bryan's comment, it may be useful to provide
> keystrokes or navigation structures to allow users of screen readers to
move between
> messages so that they may review what's been said. A review of how
> screen readers work with programs like Skype, Lync, and AIM may be useful.
>
> Sounds (earcons) may also be useful to provide other auditory feedback.
>
> Jonathan
>
> -----Original Message-----
> From: = EMAIL ADDRESS REMOVED = [mailto:
> = EMAIL ADDRESS REMOVED = ] On Behalf Of
> = EMAIL ADDRESS REMOVED =
> Sent: Thursday, November 13, 2014 3:45 PM
> To: = EMAIL ADDRESS REMOVED =
> Subject: [WebAIM] Live Chat - ARIA recommendations and/or good examples?
>
> I'm being asked to review, for accessibility considerations, the
> design requirements for a pretty standard live chat interface on
> desktop. Tablet and smartphone are not in scope at this time.
>
> I'm clear about specifying the need for focus when the chat initially
> opens, the form fields, etc.
>
> My concerns are around how a blind customer using a screen reader
> would interact with the input field for their message, how this person
> would know that the service representative is responding, and then
> when the rep responds. So, it seems like there is a need to inform the
> customer when these events happen in a way that is clear, not confusing.
>
> (This could also be reversed, saying that the service representative
> would be the screen reader user, however the interface I'm reviewing
> is
> customer-facing.)
>
> Is this a good use of aria live regions?
>
> Also, I'd appreciate any examples of where this has been delivered
> successfully with accessibility in mind.
>
>
> Thanks,
>
>
> Judith Blankman
>
> Accessibility Strategist
> Customer Experience
>
>
>
> Wells Fargo Digital Channels Group | 550 California Street, 2nd
> floor
> | San Francisco, CA 94104
>
> MAC A0122-020
>
> Tel 415-947-6583 | Cell 415-601-1114 | Fax 415-974-7452
>
>
> = EMAIL ADDRESS REMOVED =
>
>
>
> > > list messages to = EMAIL ADDRESS REMOVED =
> > > list messages to = EMAIL ADDRESS REMOVED =
>
messages to = EMAIL ADDRESS REMOVED =

From: Jonathan Avila
Date: Fri, Nov 14 2014 4:42PM
Subject: Re: Live Chat - ARIA recommendations and/or good examples?
← Previous message | Next message →

> Can a mobility impaired person using Dragon "scroll"?

If the scrolling area is keyboard focusable they can give commands to move down or move up or issue keyboard commands by voice.

Earlier today I posted a blog on considerations for testing with Dragon and speech recognition software.

https://www.ssbbartgroup.com/blog/2014/11/14/considerations-for-testing-with-speech-recognition-software-such-as-dragon-naturally-speaking/

Best Regards,

Jonathan

-----Original Message-----
From: = EMAIL ADDRESS REMOVED = [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Joy Relton
Sent: Friday, November 14, 2014 5:25 PM
To: 'WebAIM Discussion List'
Subject: Re: [WebAIM] Live Chat - ARIA recommendations and/or good examples?

Can a mobility impaired person using Dragon "scroll"? I know that they can command the software to "tab". Ihaven't tested with Dragon for a while but I didn't think that it scrolled.

-----Original Message-----
From: = EMAIL ADDRESS REMOVED =
[mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Ryan E. Benson
Sent: Friday, November 14, 2014 2:31 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Live Chat - ARIA recommendations and/or good examples?

Jonathan said:
In addition, to Bryan's comment, it may be useful to provide keystrokes or navigation structures to allow users of screen readers to move between
messages so that they may review what's been said. A review of how
screen readers work with programs like Skype, Lync, and AIM may be useful.

While I agree, however I would say this might be slightly overkill for people with mobility disabilities, so allowing them to tab into the container and scroll using only the arrow keys would help.

--
Ryan E. Benson

On Thu, Nov 13, 2014 at 8:51 PM, Jonathan Avila < = EMAIL ADDRESS REMOVED = >
wrote:

> > how this person would know that the service representative is
> responding, and then when the rep responds. So, it seems like there is
> a need to inform the customer when these events happen in a way that
> is clear, not confusing.
>
> In addition, to Bryan's comment, it may be useful to provide
> keystrokes or navigation structures to allow users of screen readers
> to
move between
> messages so that they may review what's been said. A review of how
> screen readers work with programs like Skype, Lync, and AIM may be useful.
>
> Sounds (earcons) may also be useful to provide other auditory feedback.
>
> Jonathan
>
> -----Original Message-----
> From: = EMAIL ADDRESS REMOVED = [mailto:
> = EMAIL ADDRESS REMOVED = ] On Behalf Of
> = EMAIL ADDRESS REMOVED =
> Sent: Thursday, November 13, 2014 3:45 PM
> To: = EMAIL ADDRESS REMOVED =
> Subject: [WebAIM] Live Chat - ARIA recommendations and/or good examples?
>
> I'm being asked to review, for accessibility considerations, the
> design requirements for a pretty standard live chat interface on
> desktop. Tablet and smartphone are not in scope at this time.
>
> I'm clear about specifying the need for focus when the chat initially
> opens, the form fields, etc.
>
> My concerns are around how a blind customer using a screen reader
> would interact with the input field for their message, how this person
> would know that the service representative is responding, and then
> when the rep responds. So, it seems like there is a need to inform the
> customer when these events happen in a way that is clear, not confusing.
>
> (This could also be reversed, saying that the service representative
> would be the screen reader user, however the interface I'm reviewing
> is
> customer-facing.)
>
> Is this a good use of aria live regions?
>
> Also, I'd appreciate any examples of where this has been delivered
> successfully with accessibility in mind.
>
>
> Thanks,
>
>
> Judith Blankman
>
> Accessibility Strategist
> Customer Experience
>
>
>
> Wells Fargo Digital Channels Group | 550 California Street, 2nd
> floor
> | San Francisco, CA 94104
>
> MAC A0122-020
>
> Tel 415-947-6583 | Cell 415-601-1114 | Fax 415-974-7452
>
>
> = EMAIL ADDRESS REMOVED =
>
>
>
> > > list messages to = EMAIL ADDRESS REMOVED =
> > > list messages to = EMAIL ADDRESS REMOVED =
>

From: Jennifer Sutton
Date: Sat, Nov 15 2014 1:26PM
Subject: Re: Live Chat - ARIA recommendations and/or good examples?
← Previous message | No next message

When I recently brought up this question (perhaps with a slightly
different spin), here's an example that was brought to my attention offlist:

http://www.liveperson.com/

A sample implementation is here:

http://support.microsoft.com/answerdesk/accessibility


For reference, here's a link to the thread I started on this topic:
http://webaim.org/discussion/mail_thread?thread=6641

And because I often hope/trust others turn to the Archives as often
as I do, I'm going to respond to my earlier thread to link it to this one.

Jennifer