---
description: Nesta seção, você encontrará dicas e informações sobre acessibilidade
---

# Acessibilidade

### Componentes da SDK

***

A SDK implementa componentes preparados com atributos HTML para acessibilidade, como aria-label, tabindex, role, entre outros, que habilitam a navegação por teclado entre elementos, ativa orientações por áudio e são utilizados por softwares de leitura de tela.



### Boas práticas

***

Ao integrar a SDK Web em uma página, é possível que existam outros elementos interativos na página que não ficam visíveis durante o fluxo de abertura da câmera e captura de imagem. Esses elementos podem acabar gerando conflitos com as informações do fluxo de captura, atrapalhando a experiência do usuário, portanto, é importante remover ou inativar a interação com outros elementos enquanto a captura estiver sendo realizada.

Isso é possível de diversas formas e depende dos elementos existentes e frameworks utilizados na página, segue abaixo, um exemplo utilizando o atributo **aria-hidden:**

{% code title="Exemplo" %}
```javascript
// page html
// <div id="main-content">
//  <header>...</header>
//  <button id="my-button">Interactive Button</click>
//  <footer>...</footer>
// </div>


const unicoSdk = new UnicoCheckBuilder().build();

unicoSdk
  .prepareSelfieCamera(...)
  .then((cameraOpener) => {
    const pageElement = document.getElementById('main-content');
    pageElement.setAttribute('aria-hidden', true);
    
    cameraOpener.open({
      on: {
        success: (obj) => {
          pageElement.setAttribute('aria-hidden', false);
        },
        error: (error) => {
          pageElement.setAttribute('aria-hidden', false);
        },
      },
    });
  });
```
{% endcode %}

{% hint style="warning" %}
**aria-hidden**

É importante usar com cuidado este atributo, pois ele pode prejudicar a acessibilidade de elementos na página se for aplicado incorretamente, ou não for removido quando o fluxo de captura terminar.
{% endhint %}

#### Referências

* [<mark style="color:blue;">https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-hidden</mark>](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-hidden).

***



#### Dúvidas?​ <a href="#duvidas" id="duvidas"></a>

Não encontrou algo ou ainda precisa de ajuda? Se já é um cliente ou parceiro, pode entrar em contato através da [<mark style="color:blue;">Central de Ajuda</mark>](https://empresas.unico.io/hc/pt-br/p/atendimentoparaempresas).
