2

My company supports a legacy application which uses a data form containing a Recipient section and a Sender section. Each section, upon first load, contains three text inputs (horizontally aligned) with labels above them that read Last Name, First Name, and Organization. There is a button which causes a new set of inputs to appear beneath the first; this allows the user to enter multiple names.

My question, what is the optimal combination of ARIA roles and labels to ensure accessibility and 508 compliance? A user relying on assistive technology needs to be able to distinguish, for example, the "First Name" input in the Recipient section and the "First Name" input in the Sender section. The former should have ARIA label "To First Name" and the latter should have ARIA label "From First Name".

Below is a sample of what one section of the form looks like with two records filled in.

Last Name First Name Organization
Jones Robert Sunnyside Corp.
Smith Peter ABC Co.
[button Add New]
Improve this question
4
  • This leans towards an implementation question. Can you share the results of any screen reader tests so far and add the actual problem to the question? Commented Sep 28, 2023 at 11:53
  • @jazZRo Sorry, I'm not sure what you mean by "the actual problem". I expressed my problem to the best of my abilities - I don't know how to ensure accessibility to the form in its current design. In saying "this leans towards an implementation question" you are perhaps implying that the question is off-topic for this forum? If that's the case, I'm sorry, can you suggest another forum that would be more appropriate? Commented Sep 28, 2023 at 14:54
  • 1
    With actual problem I mean; why wouldn't it already be accessible? Following standards and using the right semantic elements you should not need any extra role attributes. But if you know accessibility is an actual problem here, then what is that problem? If this is just a question about how to code it, then this is better asked on Stack Overflow. Commented Sep 29, 2023 at 10:41
  • 1
    I strongly suggest leaving role-related questions on UX StackExchange. If I’m not mistaken, this forum targets UI designers. And it’s within their responsibility to define UI elements’ exposed names and roles. Commented Oct 10, 2023 at 12:41

1 Answer 1

Reset to default
0

The answer is in your question: You should solve the issue with on of the section roles.

A section carries an accessible name to divide contents. It makes sure the name of the section is announced when the user enters the section, leaves it, or asks for announcement of the current position.

It is not necessary to add the name of the section to each input field, the same as it is not necessary to add the name of the document to everything.

In forms, the most straight forward way to do this, is a fieldset, which is the standard form component to group inputs. Its role is group, which inherits from section.

Recipients

Last Name First Name Organization
Jones Robert Sunnyside Corp.
Smith Peter ABC Co.
[button Add New Recipient]

When entering the section for the first time, focusing on the first input, NVDA would announce

Recipients grouping, Last Name, input.

Improve this answer

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.