aria-placeholder (property)

Aria-placeholder property is new in ARIA 1.1 specifications. This property is used to provide a short hint for text input fields when it does not have any text. In other words the string supplied through aria-placeholder should be available whenever the value property of the text field is empty. The hint provided through this property can be a short description, sample text  or a format of the text expected in the input field.

The purpose of aria-label property and aria-placeholder property are different. Content authors should not use this property in place of aria-label.

Aria-placeholder property acts similar to HTML5 placeholder attribute. Here is an article about the accessibility concerns of placeholder attribute.

Screen readers read aloud the hint provided via aria-placeholder property only when the text box does not have a value in it. If a value or text is available in the text box screen reader announces the value instead of placeholder text.

In example one below, screen reader reads the value of text field while in example two it reads the date format (MM/DD/YYYY format) along with the label Birth Date.



Example 1

Example 2

In example 1,

Aria-placeholder used in roles

Aria-placeholder property is used in textbox role and inherits into search role.

Values of aria-placeholder

Aria-placeholder property holds a string whose value is equal to the hint provided for filling data into the text box.

Leave a Reply