user1765369
user1765369

Reputation: 1405

Can aria-describedby be placed before the input element?

I have a form with aria-describedby attributes on the input alements, followed by a span tag with a description/example of the desired input. It also has class to only display for screenreaders (sighted people can make use of the placeholder information instead).

The issue here is that, according to Fangs at least, the screenreader reads the label, then prompts for input, then reads the aria-describedby text.

Can I move the text above the input in the code, e.g.

<label for="givenName">Given name</label>

<span id="givenNameHelp" class="help-block sr-only">e.g. Liam</span>

<input class="form-control" type="text" id="givenName" placeholder="Liam" aria-describedby="givenNameHelp">

Upvotes: 1

Views: 124

Answers (1)

unobf
unobf

Reputation: 7254

Yes, this is perfectly legitimate and will work with all screen readers

Upvotes: 1

Related Questions