WebAIM - Web Accessibility In Mind

E-mail List Archives

Arrow key navigation in the conversation list of a chat application

for

From: Frederik Creemers
Date: Aug 30, 2021 12:24PM

Hi,

I work at TalkJS, where we offer a chat service that can be used to provide
user-to-user chat on websites+apps. I'm working on making our application
more accessible, and one of the ways I'd like to do this is by allowing the
user to navigate between conversations in a list using the arrow keys. On
wide screens, this list of conversations is shown ne"xt to the active
conversation. I see two approaches

1. Navigating with the arrow keys directly changes which conversation is
active (as WhatsApp web does it)
2. Navigating with the arrow keys moves the focus between conversations,
and hitting enter makes the focussed conversation active (as Facebook's
messenger.com does).

I've heard from proponents of both approaches, but I'd love to hear any
input that the WebAIM community can give for this.

Best regards,
Frederik Creemers