# Make your extension accessible

For many users, accessibility literally is the user interface, and its features can often be useful to those who don't need accessibility as a primary means of interacting with your extension. The techniques are varied. At the very least, text should be high-contrast. Videos should captioned. Images should include `alt` attributes.

But, as stated, this is just the minimum. Additional techniques are described in what follows.

There are a few ways to implement accessibility, but the easiest is to use a standard HTML control, particularly the input elements. The following image shows these controls.
![Screenshots and code for button, checkbox, radio, text, select/option, and link](https://developer.chrome.com/static/docs/extensions/develop/ui/a11y/images/html-controls.png) Screenshots and code for button, checkbox, radio, text, select/option, and link.

To make other elements accessible, use [ARIA](https://developer.mozilla.org/docs/Web/Accessibility/ARIA) attributes. These attributes provide information to the screen reader about the function and current state of controls on a web page. Here is an example.  

    <div role="toolbar" tabindex="0" aria-activedescendant="button1">
      <img src="buttoncut.png" role="button" alt="cut" id="button1">
      <img src="buttoncopy.png" role="button" alt="copy" id="button2">
      <img src="buttonpaste.png" role="button" alt="paste" id="button3">
    </div>

By default, the only elements in the HTML DOM that can receive keyboard focus are anchors, buttons, and form controls. Fortunately, setting the `tabIndex` attribute on an HTML element lets it receive keyboard focus. For example:  

    <div tabindex="0">I can receive focus with the tab key.</div>

For instructions on implementing these techniques and more, see [Support accessibility](https://developer.chrome.com/docs/extensions/how-to/ui/a11y).