# Basic accessibility

Access to the web is a basic human right, meaning that anyone should be able to use and access sites on the web such as those we are building. There are common, low-hanging things you can do to make your website accessible:

* **Use a color-blind friendly color palette** (or have options to enable a color-blind friendly mode). If you have access to people in your group that are colorblind, they may be a good litmus test for how colorblind-friendly your color palettes are.
* **Have alt-text on images** to that those using screen readers, like the blind, will have images described to them

It's good to keep these things in mind from the beginning as it means you can hopefully avoid having to go back and make massive changes later after discovering something is completely unusable for a certain group.

## More Resources

The two points above are just the tip of the iceberg in terms of accessibility and there are many more things you can do to make your web application as accessible as possible. Below are more resources where you can learn more.

### Quick Start UCSC resource:

{% embed url="<https://www.ucop.edu/information-technology-services/_files/word-pdf-accessibility-guide.pdf>" %}

### General guidelines

{% embed url="<https://developer.mozilla.org/en-US/docs/Web/Accessibility/Understanding_WCAG>" %}

{% embed url="<https://www.w3.org/standards/webdesign/accessibility>" %}

### Accessibility tools

Here are some tools you can use to check basic accessibility and find low-hanging issues:

{% embed url="<https://developer.mozilla.org/en-US/docs/Tools/Accessibility_inspector/Simulation>" %}

{% embed url="<https://wave.webaim.org/>" %}

{% embed url="<https://www.assist.vt.edu/web-accessibility/testing-tools/browser-extensions.html>" %}

### Tools for choosing colors

{% embed url="<https://www.toptal.com/designers/colorfilter/>" %}

{% embed url="<https://coolors.co/>" %}

{% embed url="<https://paletton.com/#uid=1000u0kllllaFw0g0qFqFg0w0aF>" %}

## Command line tools

Most of this page is about making websites accessible. While command-line tools are generally accessible (plain text and don't depend heavily on colors), there are some things to avoid that are detailed in [this Stackoverflow thread](https://stackoverflow.com/questions/59945753/what-are-the-accessibility-a11y-guidelines-for-command-line-applications). In short, avoid only encoding important information via color and avoid ASCII art as it can interfere with screen readers.

{% embed url="<https://www.assist.vt.edu/web-accessibility/testing-tools/command-line-developer-tools.html>" %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ucsc-xena.gitbook.io/ux-resource-for-ucsc-genomics-institute/best-practices/basic-accessibility.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
