Intro

The invisible text control provides a simple hidden text which can be used by assistive technologies such as screen readers to provide contextual information to sighted users.

Responsiveness

The invisible text control is not visible and therefore works on all devices.

Guidelines

• Provide short and meaningful texts. Adhere to the text guidelines of labels.
• Do not use an invisible text as a replacement for a label. (Property: text)
• Just adding the invisible text control would not work. As with labels, developers need to assign the invisible text to the corresponding control. Unlike with labels, this does not happen automatically in forms.

Properties

The properties “busy”, “busyIndicatorDelay”, and “visible” do not have an effect. Therefore, do not use them.

Usage

When to Use Invisible Text

• If you need to provide contextual information also for users of assistive technologies like screen readers.
• If you need to provide a title (such as for a form or table), which sighted users do not need.

• If you need to explain a visual element without any kind of label, such as a loading animation.

When Not to Use Invisible Text

• If you want to provide additional information for users of assistive technologies which is not available for sighted users. While you should not discriminate users of assistive technologies, you should also not provide “privileges” to them.
• If you want to hide information. It might still be available for users of assistive technologies.
• If you want to hide long texts. The information is probably important enough to be shown! Furthermore, short texts are far more convenient, even for users of assistive technologies.

Resources

Want to dive deeper? Follow the links below to find out more about related controls, the SAPUI5 implementation, and the visual design.