Start adding accessibility section to control panel page

docs/5.x/system/control-panel.md

@@ -257,3 +257,50 @@ In some situations, dragging can be combined with [group selections](#group-sele
 ### Search
 
 Craft has a powerful [search](searching.md) system that complements the [condition builder](elements.md#filters-and-columns) on every element index.
+
+## Accessibility
+
+### Navigating the control panel
+
+Skip links and landmarks have been incorporated throughout the control panel to make keyboard and screen reader navigation more straightforward.
+
+#### Skip Links
+Global skip links are found at the beginning of each control panel screen.
+
+![A link to 'Skip to main section' has visible focus at the beginning of the Dashboard page](../images/skip-links.png)
+
+These include:
+- **Skip to main section:** Skips to the `main` container. This container includes the page header, which contains the page title and controls for the current screen.
+- **Skip to left sidebar:** <Since ver="5.7.0" /> Skips to the sub-navigation container (when using an LTR orientation). For example:
+  - On element index pages, this moves keyboard focus to the "Sources" menu.
+  - On account pages, this moves keyboard focus to the "Account" navigation.
+- **Skip to content:** <Since ver="5.7.0" /> Skips to the primary content pane on the page.
+- **Skip to right sidebar:** <Since ver="5.7.0" /> Skips to the details container (when using an LTR orientation), which includes page metadata.
+
+In addition to global skip links, other parts of the control panel may include skip links. For example:
+- On element index pages, a **Skip to footer** link allows you to skip to the pagination and actions in the footer bar
+
+#### Landmarks
+Landmarks have been incorporated into the control panel. These include:
+- **`main`:** This landmark contains the bulk of the page content. (See the **Tour** section on this page for more details.)
+- **`nav`:** Depending on the page, there may be several navigaton landmarks. These include:
+  - **Primary navigation:** Available throughout the control panel, this navigation list contains links for the primary sections of the control panel (i.e., Settings, Entries, Dashboard, etc.)
+  - **Breadcrumb navigation:** This is only available when working with nested content or settings.
+  - **Secondary navigation:** This navigation list is only available on pages with nested content. Located inside the `main` landmark, its accessible name will change based on where you are in the control panel. For example, in the My Account area, it will be called "Account," while on the Entries or Assets pages it will be called "Sources."
+
+### User Preferences
+
+#### Display Settings
+- **Use shapes to represent statuses:** The control panel generally uses color-based badges to indicate statuses. Enabling this setting will change the badge shape depending on status, so status isn’t indicated using color _alone_.
+- **Underline links:** This setting adds underlines to all links inside the control panel.
+
+#### General Settings
+- **Disable autofocus:** Some inputs inside the control panel use the `autofocus` attribute, so keyboard focus may move unexpectedly; these include search inputs on element index pages, and the first input on Edit screens or inside of slideouts. Enabling this setting will prevent this autofocus behavior.
+
+#### Notification Settings
+Both **Duration** and **Position** of notification toasts can be managed.
+- **Notification Duration**: By default, notifications are only shown for 5 seconds before they disappear automatically. However, the duration can be increased to 10 seconds, or be shown indefinitely (with the option to close them manally).
+- **Notification Position**: Notifications toasts show on the bottom-left of the screen by default (when using an LTR orientation). This setting allows you to customize which corner of the screen they are placed.
+
+#### Slideout Position
+Slideout position can be changed to show on the left- or right-hand side of the screen.