> For the complete documentation index, see [llms.txt](https://learn.cozmos.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://learn.cozmos.com/guides/accessibility.md).

# Accessibility

Visual accessibility is a complex issue to solve when dealing with a webgl environment which renders complex textures as a single image and while we continue to develop solutions for this we have focused primarily on Audio accessibility.

### Screen reader Accessibility and the sphere HTML DOM

We see Cozmos and spheres as a great tool for narrative (storytelling) driven design and experiences.

With this in mind, when we set out to restructure our DOM (Document Object Model) for accessibility, we focused on a logical story-like hierarchy for the data which is interpreted by a screen reader.

At a basic level, screen readers see a sphere in the following way:

* Acceptance of cookies/terms
* Title of Sphere
* Description of Sphere (important for setting the 'scene')
* Sphere clusters (High level content and groups)
  * If a cluster is 'focused' then the content within will be read back to the end user
* Sphere independent objects (images, products, videos)

At every point, the end user is offered the option to interact, move to the next object, back to the last, or back to the start of the experience.

Our tree structure allows a screen reader to get a quick overview of all content across a sphere, as well as describing the visual aspect of the environment.

### How do you ensure your sphere is accessible to screen readers

There are various areas within Cozmos and Curator where you can input accessibility descriptions to help create a more robust experience for any visitors who utilize screen reader technologies

#### Images: Add an Image Description

<figure><img src="/files/usRrbOsuqSIfbVxyx1ow" alt="Edit image information"><figcaption></figcaption></figure>

#### Sphere: When editing SEO data, add a separate Description which is more descriptive

<figure><img src="/files/SmrGudRoXpgaOQY6R5VS" alt="Edit sphere SEO"><figcaption></figcaption></figure>

#### Clusters: Add an accessibility description

<figure><img src="/files/cYNoUvGVbBXiL2A51UGp" alt="Add an accessibility description"><figcaption></figcaption></figure>
