Improved Portuguese translation (#29040)
Standardized translation for "Skip navigation link" and made minor changes to improve comprehension
This commit is contained in:
@ -4,24 +4,24 @@ localeTitle: Exemplos de acessibilidade
|
||||
---
|
||||
## Exemplos de acessibilidade em aplicativos práticos
|
||||
|
||||
Estou escrevendo este breve guia para fornecer exemplos práticos de como implementar acessibilidade em sites. A acessibilidade não foi enfatizada durante a escola nem está sendo enfatizada o suficiente no mundo real do desenvolvimento web. Espero que este artigo, juntamente com muitos outros, incentive os desenvolvedores a criar sites acessíveis a partir de agora. Sempre me ajudou a obter exemplos práticos de como fazer as coisas. Portanto, este guia se concentrará nos exemplos do mundo real que encontrei no meu dia a dia como desenvolvedor da Web.
|
||||
Estou escrevendo este breve guia para fornecer exemplos práticos de como implementar acessibilidade em sites. A acessibilidade não foi enfatizada durante a escola nem está sendo enfatizada o suficiente no mundo real do desenvolvimento web. Espero que este artigo, juntamente com muitos outros, incentive os desenvolvedores a criar sites acessíveis a partir de agora. Algo que sempre me ajudou foi obter exemplos práticos de como fazer as coisas. Portanto, este guia se concentrará nos exemplos do mundo real que encontrei no meu dia a dia como desenvolvedor Web.
|
||||
|
||||
### Ignorando a Navegação
|
||||
|
||||
Para que os usuários não com visão tenham uma experiência agradável em seu website, eles precisam acessar o conteúdo de maneira rápida e eficiente. Se você nunca experimentou um site através de um leitor de tela, eu recomendo fazê-lo. É a melhor maneira de testar a facilidade com que um site pode ser navegado para usuários sem visão. O NVDA é um aplicativo de leitura de tela muito bom que é fornecido gratuitamente. Mas se você usar o leitor de tela e achar útil considerar fazer uma doação para a equipe de desenvolvimento. O leitor de tela pode ser baixado do [nvaccess.org](https://www.nvaccess.org/download/) .
|
||||
Para que usuários sem visão tenham uma experiência agradável em seu website, eles precisam acessar o conteúdo de maneira rápida e eficiente. Se você nunca experimentou um site através de um leitor de tela, eu recomendo fazê-lo. É a melhor maneira de testar a facilidade com que um site pode ser navegado para usuários sem visão. O NVDA é um aplicativo de leitura de tela muito bom que é fornecido gratuitamente. Mas se você usar o leitor de tela e achá-lo útil, considere fazer uma doação para a equipe de desenvolvimento. O leitor de tela pode ser baixado do [nvaccess.org](https://www.nvaccess.org/download/) .
|
||||
|
||||
Para permitir que usuários sem visão pule para o conteúdo principal de um site e evite navegar por todos os links de navegação principais:
|
||||
Para permitir que usuários sem visão possam pular para o conteúdo principal de um site, evitando navegar por todos os links de navegação principais:
|
||||
|
||||
1. Crie um "link de navegação de salto" que fica diretamente abaixo da tag de `body` abertura.
|
||||
1. Crie um link "Pular navegação" que fique diretamente abaixo da tag de `body` abertura.
|
||||
|
||||
```html
|
||||
|
||||
<a tabindex="0" class="skip-link" href="#main-content">Skip to Main Content</a>
|
||||
```
|
||||
|
||||
`tabindex="0"` é adicionado para garantir que o link seja focado no teclado em todos os navegadores. Mais informações sobre a acessibilidade do teclado podem ser encontradas em [webaim.org](https://webaim.org/techniques/keyboard/tabindex) .
|
||||
`tabindex="0"` é adicionado para garantir que o link possa ser focado com o teclado em qualquer navegador. Mais informações sobre acessibilidade com teclado podem ser encontradas em [webaim.org](https://webaim.org/techniques/keyboard/tabindex) .
|
||||
|
||||
2. O link "ignorar navegação" precisa estar associado à tag html principal em seu documento da página da Web usando a tag de ID.
|
||||
2. O link "Pular navegação" precisa estar associado à tag html principal em seu documento da página da Web usando a tag de ID.
|
||||
|
||||
```html
|
||||
|
||||
@ -30,9 +30,9 @@ Para permitir que usuários sem visão pule para o conteúdo principal de um sit
|
||||
</main>
|
||||
```
|
||||
|
||||
3. Ocultar o link "ignorar navegação" por padrão. Isso garante que o link fique visível apenas para os usuários com visão quando o link estiver em foco.
|
||||
3. Ocultar o link "Pular navegação" por padrão. Isso garante que o link fique visível para os usuários com visão apenas quando o link estiver em foco.
|
||||
|
||||
* Crie uma classe para o link que pode ser estilizado com CSS. No meu exemplo, adicionei o `skip-link` da classe.
|
||||
* Crie uma classe para o link que pode ser estilizada com CSS. No meu exemplo, adicionei o `skip-link` da classe.
|
||||
|
||||
```css
|
||||
.skip-link {
|
||||
@ -63,4 +63,4 @@ Esses estilos CSS ocultam o link por padrão e exibem apenas o link quando ele e
|
||||
|
||||
### Tabelas Acessíveis
|
||||
|
||||
### Guias Acessíveis
|
||||
### Guias Acessíveis
|
||||
|
Reference in New Issue
Block a user