Mobile Accessibility Guidelines - Scripts & dynamic content

Page refreshes must

Automatic page refreshes must not be used without warning.

Assistive technology, such as a screen reader, may lose its place in the content and announce the wrong information when an entire page reloads automatically. This can be confusing and disorienting for the user.

Techniques that would trigger an entire page to be reloaded must not be used unless the user has been notified.

iOS

Use UIAccessibilityLayoutChangedNotification to indicate updates in screen content. Only use UIAccessibilityScreenChangedNotification if the entire screen changes. For content that changes frequently (such as a stock ticker), use UIAccessibilityTraitUpdatesFrequently.

Android

Typical accessibility events are sent via the sendAccessibilityEvent() method and the event type TYPE_WINDOW_STATE_CHANGED is not sent unless a window or dialog opens.

HTML

Avoid the use of the setTimeout property to update the page’s href attribute. Do not include meta elements that contain an http-equiv attribute with a value of refresh.

HTML Pass Example

<head>
    <title>This is appropriate</title>
</head>
<body>
    <p>Please reload this page!</p>
    <a href="...">Reload Page</a>
</body>

Testing

Procedures

  1. Activate a screen reader.
  2. Navigate through all content.
  3. Verify that the entire screen does not refresh or update:
    • Automatically, or
    • Based on navigation.

Outcome

The following check is true:

  • Entire screen does not refresh or change automatically or when focus moves between objects, elements, or controls.