ImageView Name
note
Requires the accessibility layer for accurate results. Learn how to load the accessibility layer here.
Any image that portrays information or is VoiceOver focusable should have a name.
Impact
People using VoiceOver are most impacted. Informative images should have their context, information or purpose read when focused by VoiceOver.
Confirmation
- Turn on VoiceOver
- Attempt to focus the image
- One of the following will occur:
- Inaccessible: Image is focusable but does not announce a Name in VoiceOver.
- Accessible: Image is not focusable because it does not portray unique information.
- Accessible: Image is focusable and has a Name.
How to Fix
UIKit
An issue found by this rule is caused by not using accessibilityLabel
, or by inaccurately marking an image as an accessibility element.
In storyboard:
- Navigate to the image
- Confirm that the Inspectors Panel is visible
- Select the Identity Inspector
- If the image portrays unique information, under "Accessibility", write the information in the "Label" text field.
- If the image does not portray unique information, under "Accessibility", unselect the "Enabled" checkbox.
In code:
- If the image portrays information the user needs, give it a descriptive
accessibilityLabel
to relay that information:
image.accessibilityLabel = "Puppy staring at you with big, brown eyes."
- If the image does not portray unique information, such as a background or decorative image, make it not focusable:
image.isAccessibilityElement = false
SwiftUI
- If an image provides information the user needs, you can either set
.accessibility(label: Text("Accessibility Label Here"))
view modifier on the image, or you can utilize the Image initializer, which includes the label parameter.
Image("format_info", label: Text("Please utilize an outline format."))
- If the image does not portray unique information, such as a background or decorative image, hide it with the below view modifier:
Image("background_blue")
.accessibility(hidden: true)