diff --git a/UNRELEASED.md b/UNRELEASED.md index c9497d31f21..a10f709bc44 100644 --- a/UNRELEASED.md +++ b/UNRELEASED.md @@ -18,6 +18,8 @@ Use [the changelog guidelines](https://git.io/polaris-changelog-guidelines) to f ### Documentation +- Added accessibility documentation for the empty state component ([#2244](https://github.com/Shopify/polaris-react/pull/2244)) + ### Development workflow ### Dependency upgrades diff --git a/src/components/EmptyState/README.md b/src/components/EmptyState/README.md index 86f62d75975..5be65a197dc 100644 --- a/src/components/EmptyState/README.md +++ b/src/components/EmptyState/README.md @@ -204,3 +204,31 @@ Use to provide additional but non-critical context for a new product or feature. - To learn more about illustrations for empty states, [read the illustration guidelines](https://polaris.shopify.com/design/illustrations) - To create page-level layout, [use the layout component](https://polaris.shopify.com/components/structure/layout) - To highlight a Shopify feature, [use the callout card component](https://polaris.shopify.com/components/structure/callout-card) + +--- + +## Accessibility + + + +See Material Design and development documentation about accessibility for Android: + +- [Accessible design on Android](https://material.io/design/usability/accessibility.html) +- [Accessible development on Android](https://developer.android.com/guide/topics/ui/accessibility/) + + + + + +See Apple’s Human Interface Guidelines and API documentation about accessibility for iOS: + +- [Accessible design on iOS](https://developer.apple.com/design/human-interface-guidelines/ios/app-architecture/accessibility/) +- [Accessible development on iOS](https://developer.apple.com/accessibility/ios/) + + + + + +Empty state illustrations are implemented as decorative images, so they use an empty `alt` attribute and are skipped by technologies like screen readers. + +