Chatbot usage for blind users

[cengizmurat]

Hello,

Problem description
I have a blind developer in our team and he has some difficulties to use Botpress chatbot.
He works with two screen readers JAWS and NVDA, and there are different issues for interacting with Botpress chatbot :

1. To access the chatbot's widget: the button is not labeled and the screen reader says : not labeled button. He is not aware of what he's opening and goes into the unknown.
2. When he sends a message to your chatbot he does not have the focus to the new message(s) for reading it/them. He has to search the chatbot's new answer(s) among all the ongoing discussion, from the very first message to the newest ones (for each message sent by him).

Solution/Alternatives

• A labelled widget button according the Web Content Accessibility Guidelines in order for disabled users to know what this button is for
• An option for navigating easily (ex: with tab key) between user input field and only chatbot's new messages.

Thank you very much,
Best regards

[EFF]

@cengizmurat Thank you for sharing your feedback. While we were aware that Botpress' interface is not accessible, we had no idea where to start as you might imagine there's quite a lot to tackle. Thanks for sharing your thoughts, we'll take this into account and do our best to make the interface more accessible for blind people (starting with the webchat).

However, if you are willing to contribute this would help a lot.

[patlachance]

@EFF / @slvnperron : @cengizmurat is in my team, you can count on us to help you improving botpress accessibility by submitting PR. We may need your help to pinpoint appropriate sections to improve.

[SEPOL14]

Hello,

I am the blind developer who use your chatbot.

How would you like that we work together ?

Do you wish that we send any accessible code examples to you, or do you first prefer to search the informations by yourself ?

Best regards.

[asashour]

@cengizmurat, @patlachance, please don't hesitate to ask, also in Forum if you need further assistance

@SEPOL14 I would suggest that we try to resolve the most important things first

• The chat Button seems to be here
• The handler for keyboard events is here, however I am not sure what the requirements would be, considering there is an option of enableArrowNavigation which also changes the behavior of the keyboard events.

[SEPOL14]

Hello,

I tested the chatbot again, and I have seen that the buttons were accessible with a screen reader :)

However, in order to help even more a blind user it would be nice to have "heading levels" with tags within the frame, like this :

<h1> ... </h1>
<h2> ... </h2>

For example, we could have :

<h1>Chatbot Window</h1>

After typing a message and clicking on the send button, we could have :

<h2>Access to the answer</h2>

Moreover, a big struggle still remains and it is about reading new messages from the bot. A blind user has to navigate all the way from the first message of the conversation until the newest.
Putting new messages in a non-visible HTML tag can do the job.

I have not faced to images yet, but except for logos, please keep in mind that they should have a alt attribute with a short description (provided within the Admin panel).
If no description has been provided, keep the attribute empty like this <img alt="" />

Best regards.

[SEPOL14]

Hello,

I tested the chatbot again, and I have seen that the buttons were accessible with a screen reader :)

However, in order to help even more a blind user it would be nice to have "heading levels" with tags within the frame, like this :

<h1> ... </h1>
<h2> ... </h2>

For example, we could have :

<h1>Chatbot Window</h1>

After typing a message and clicking on the send button, we could have :

<h2>Access to the answer</h2>

Moreover, a big struggle still remains and it is about reading new messages from the bot. A blind user has to navigate all the way from the first message of the conversation until the newest.
Putting new messages in a non-visible HTML tag can do the job.

I have not faced to images yet, but except for logos, please keep in mind that they should have a alt attribute with a short description (provided within the Admin panel).
If no description has been provided, keep the attribute empty like this <img alt="" />

Best regards.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[J-FMartin]

We will close this issue.