WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: How to Make a Facebook Chat Widget AutomaticallyAccessible


From: Kevin Chao
Date: Nov 15, 2011 1:36PM

Hi Bryan,

As always, excellent job, and this is working great with Firefox 11
Nightly and NVDA 2011.3 RC1.


On 11/15/11, Bryan Garaventa < <EMAIL REMOVED> > wrote:
> Thanks, I just gave it a spin, and it's working for me, anyone else noticing
> this? Granted I have IE8 with JAWS12/13 installed, so feedback would be
> helpful.
> ----- Original Message -----
> From: "Birkir R. Gunnarsson" < <EMAIL REMOVED> >
> To: "WebAIM Discussion List" < <EMAIL REMOVED> >
> Sent: Tuesday, November 15, 2011 6:06 AM
> Subject: Re: [WebAIM] How to Make a Facebook Chat Widget
> AutomaticallyAccessible
>> Mr Bryan
>> Great idea as always. I would say great implementation as well,
>> however, there is a bit of a problem, I am knit picky I know.
>> I go to the demo page (with Jaws 13 and IE9) .. type in my name as
>> instructed and hit "start Chat".
>> I get the message "loading, please wait" .. and I wait .... and I wait
>> .... and I wait ..., and I am still waiting. ;)
>> Seems like this is not working at the moment, at least with this
>> software combination.
>> Cheers
>> -B
>> On 11/15/11, Bryan Garaventa < <EMAIL REMOVED> > wrote:
>>> This is something I've been thinking about off and on over the last
>>> couple
>>> years. My family uses Facebook chat, so I figured it would be pretty cool
>>> to
>>> be able to do the same using the website. Not really as it turned out.
>>> Conceptually it wouldn't take too much to make it work though, so about
>>> six
>>> months ago, I wrote detailed instructions, lovingly crafted with fabulous
>>> pros, showing the Facebook folks how this could be accomplished with
>>> minimal
>>> effort and maximum impact for everyone.
>>> I thought it was brilliant; a true masterpiece;
>>> they ignored me of course...
>>> So, I decided to do it myself anyway, and here it is! Just as
>>> described...
>>> The Accessible Chat Dialog Module is a Facebook-style UI component that
>>> renders an automatically accessible chat dialog for screen reader and
>>> keyboard only users.
>>> Instructions:
>>> 1) Type your name and activate the Start Chat button to open the chat
>>> dialog,
>>> then type into the Message field and press Enter to submit a chat
>>> message.
>>> 2) Mouse users can drag the chat window to a new fixed location by
>>> holding
>>> down the left-mouse button on any textual area of the chat dialog.
>>> 3) New messages will automatically be announced to screen reader users
>>> when
>>> they arrive.
>>> 4) Screen reader users can press Ctrl+` to hear the last 5 messages
>>> announced when the Message text field has focus.
>>> The ability to drag the chat dialog to a new location on the viewport
>>> isn't
>>> something Facebook provides, but I thought it would be a nice touch
>>> anyway... :)
>>> Now, this is important, the chat dialog is a live server application, so
>>> anything you type will be seen by every person around the world who
>>> happens
>>> to have the dialog open at the same time, regardless whether it is
>>> running
>>> from the website or locally using the download, so please play nicely...
>>> Demo: http://whatsock.com/modules/accessible_chat_dialog_module/demo.htm
>>> All the best,
>>> Bryan