docs: Add concepts page #9099
docs: Add concepts page #9099
Conversation
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
|
||
| React Aria provides built-in support for screen readers and keyboard navigation, following the [WAI-ARIA](https://www.w3.org/TR/wai-aria-1.2/) and [ARIA Authoring Practices](https://www.w3.org/WAI/ARIA/apg/) guidelines. It supplies the correct semantics via ARIA roles and attributes, handles keyboard and pointer events, manages focus, and provides screen reader announcements. React Aria components are tested across a wide variety of devices, browsers, and screen readers. | ||
|
|
||
| You’re responsible for providing meaningful labels and ensuring your visual design supports all users. This includes designing with sufficient [color contrast](https://www.w3.org/WAI/WCAG22/Understanding/non-text-contrast) and [hit target sizes](https://www.w3.org/WAI/WCAG22/Understanding/target-size-enhanced), including visible [focus rings](https://www.w3.org/WAI/WCAG22/Understanding/focus-appearance), respecting [motion preferences](https://www.w3.org/WAI/WCAG21/Understanding/animation-from-interactions), and more. The [WCAG guidelines](https://www.w3.org/WAI/WCAG22/Understanding/) are a good resource to reference when designing and building components with React Aria. |
There was a problem hiding this comment.
Maybe a less harsh intro to this paragraph, such as "While we can handle a lot, there are still steps you must take to complete an accessible experience..."
There was a problem hiding this comment.
Or maybe a slight change to how the paragraphs are introduced, like
We:
do x, y, z
You:
do a, b, c
Added this option because I think this is the flow I think you're going for, but it took reading a few sections to understand that. I'd love it if we knew in the first paragraph so that I know to keep an eye out for what's expected of me.
So even if you don't change how the paragraphs are introduced, maybe a sentence at the top saying, "This page will cover what we do as well as what is expected of you for each concept" (needs work, but general gist)
There was a problem hiding this comment.
I was trying to keep it concise without a lot of extra fluff. And yes, that's what I was going for: covering what we do, and what you're supposed to handle.
| rules: [ | ||
| { | ||
| id: 'aria-hidden-focus', | ||
| selector: 'body *:not([data-a11y-ignore="aria-hidden-focus"])' |
There was a problem hiding this comment.
do we still want to highlight this one? #8868
Adds a new Concepts page which includes summarized content from the previous Accessibility, Interactions, and Internationalization pages.
If you see something important from the old pages that I didn't include, let me know. The "Optimizing Bundle size" section on the internationalization page will move to the new "Built tool setup" page that we will be writing soon. Trying to keep the Concepts page pretty high-level.