-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Showing
37 changed files
with
982 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,57 @@ | ||
--- | ||
title: 1.1 Quantidade razoável de conteúdo exibida de cada vez | ||
--- | ||
|
||
## Considerações sobre acessibilidade móvel relacionadas principalmente ao Princípio 1: Perceptível | ||
|
||
### 2.1 Tamanho de tela pequeno | ||
> | ||
> <em>O tamanho pequeno da tela é uma das características mais comuns dos dispositivos móveis. Embora a resolução excepcional destas telas permita, teoricamente, a renderização de grandes quantidades de informações, o pequeno tamanho da tela impõe limites práticos à quantidade de informações que as pessoas podem realmente visualizar de uma só vez, especialmente quando a ampliação é usada por pessoas com baixa visão.</em> | ||
> | ||
>[Considerações sobre acessibilidade mobile relacionadas ao Princípio 1: Perceptível](https://www.w3.org/TR/mobile-accessibility-mapping/#small-screen-size) | ||
|
||
|
||
### Algumas práticas recomendadas para ajudar os usuários a aproveitar ao máximo as telas pequenas | ||
|
||
- Minimizar a quantidade de informações colocadas em cada página em comparação com as versões para desktop/laptop, fornecendo uma versão móvel dedicada ou um design responsivo: | ||
- uma versão móvel dedicada contém conteúdo adaptado para uso móvel. Por exemplo, o conteúdo pode conter menos módulos de conteúdo, menos imagens ou focar em cenários importantes de uso móvel. | ||
- um design responsivo contém conteúdo que permanece o mesmo, mas folhas de estilo CSS são usadas para renderizá-lo de maneira diferente, dependendo da largura da janela de visualização. Por exemplo, em telas estreitas, os menus de navegação podem ficar ocultos até que o usuário toque em um botão de menu. | ||
- Fornecer um tamanho padrão razoável para o conteúdo e controles de toque (consulte "B.2 Tamanho e espaçamento do alvo de toque") para minimizar a necessidade de aumentar e diminuir o zoom para usuários com baixa visão. | ||
- Adaptando o comprimento do texto do link à largura da janela de visualização. | ||
- Posicionar os campos do formulário abaixo, em vez de ao lado, de seus rótulos (no layout retrato) | ||
|
||
## Critérios de Sucesso WCAG 2.1 aplicáveis | ||
|
||
### SC 1.4.8:Apresentação Visual (Nível AAA) | ||
> | ||
> *A intenção deste Critério de Sucesso é garantir que o texto apresentado visualmente seja apresentado de uma forma que possa ser percebido sem que o seu layout interfira na sua legibilidade... Para pessoas com alguma deficiência de leitura ou visão, longas linhas de texto podem se tornar uma barreira significativa. Eles têm dificuldade em manter seu lugar e seguir o fluxo do texto.* | ||
> | ||
> [Critério 1.4.8:Apresentação Visual (Nível AAA)](https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation) | ||
> | ||
> [Desenvolvimento de sites para usuários com deficiências cognitivas e dificuldades de aprendizagem](https://juicystudio.com/article/cognitive-impairment.php) | ||
### Procedimento de teste mobile | ||
|
||
1. Verificar se o layout da aplicação está responsivo no modo horizontal e vertical; | ||
|
||
2. Verificar se existe mais de um botão principal proeminente da tela; | ||
|
||
3. Analisar o conteúdo exibido na aplicação e verificar se o texto está claro, ou seja, as informações devem estar em blocos pequenos, com uma ideia-chave por parágrafo; | ||
|
||
4. O tamanho do corpo do texto não deverá ser maior que 80 caracteres; | ||
|
||
|
||
|
||
### Referências | ||
|
||
W3C/WAI. (2015) [Mobile Accessibility: How WCAG 2.0 and Other W3C/WAI Guidelines Apply to Mobile](https://www.w3.org/TR/mobile-accessibility-mapping/#small-screen-size). W3C First Public Working Draft 26 February 2015. | ||
|
||
W3C/WAI. (2023) [WCAG Sucess Criteria 1.4.8: Visual Presentation (Level AAA)](https://www.w3.org/TR/mobile-accessibility-mapping/#small-screen-size) | ||
|
||
Juicy studio. (2005) [Developing sites for users with Cognitive disabilities and learning difficulties](https://www.w3.org/TR/mobile-accessibility-mapping/#small-screen-size) | ||
|
||
Apple Developer Documentation (2014)[ Human Interface Guidelines - Buttons](https://developer.apple.com/design/human-interface-guidelines/buttons) | ||
|
||
Apple Developer Documentation (2014)[ Human Interface Guidelines - Layout](https://developer.apple.com/design/human-interface-guidelines/buttons) | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,38 @@ | ||
--- | ||
title: 1.2 Botões e controlos suficientemente grandes para serem percecionados pela visão e selecionáveis pelo toque | ||
--- | ||
|
||
## Critérios de Sucesso WCAG 2.1 aplicáveis | ||
|
||
### SC 2.5.5: Tamanho alvo (Nível AAA) | ||
> | ||
> *O tamanho do alvo para entradas de ponteiro é de pelo menos 44 por 44 pixels CSS* | ||
> | ||
> [Critério 2.5.5: Tamanho alvo (Nível AAA)](https://www.w3.org/WAI/WCAG21/Understanding/target-size) | ||
|
||
### Procedimento de teste WCAG 2.1 | ||
|
||
#### Técnicas suficientes | ||
- Garantir que os alvos de toque tenham pelo menos 44 por 44 pixels CSS. | ||
- Fornecer um mecanismo para alterar o tamanho do alvo independente da ampliação. | ||
|
||
#### Falhas | ||
A seguir estão os erros comuns que são considerados falhas deste Critério de Sucesso pelo Grupo de Trabalho das WCAG. | ||
- Falha no critério de sucesso 2.5.5 devido ao tamanho do alvo ser inferior a 44 por 44 pixels CSS. | ||
- Falha no critério de sucesso 2.5.5 devido ao tamanho alvo de um parágrafo que também é um link ser menor que 44 por 44 pixels CSS. | ||
|
||
### Ferramentas úteis | ||
- [Acessibility Scanner - Android](https://developer.android.com/guide/topics/ui/accessibility/testing#accessibility-scanner) | ||
- [Acessibility Inspector - IOS](https://developer.apple.com/documentation/accessibility/accessibility-inspector) | ||
|
||
|
||
### Referências | ||
|
||
Google Material [ Accessibility - Usability Material Design - Style](https://m1.material.io/usability/accessibility.html#accessibility-style). Data de acesso: 18 de Abril de 2024 | ||
|
||
Apple Developer Documentation (2023)[ Human Interface Guidelines - Interactions](https://developer.apple.com/design/human-interface-guidelines/buttons) | ||
|
||
W3C/WAI. (2023) [WCAG Sucess Criteria 2.5.5: Target Size (Level AAA)](https://www.w3.org/WAI/WCAG21/Understanding/target-size). Updated 20 June 2023 | ||
|
||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,62 @@ | ||
--- | ||
title: 1.4 Campos de formulário posicionados abaixo dos seus rótulos | ||
--- | ||
|
||
## Critérios de Sucesso WCAG 2.1 aplicáveis | ||
|
||
### SC 3.3.2: Etiquetas ou instruções (Nível A) | ||
> | ||
> *Rótulos ou instruções são fornecidos quando o conteúdo requer entrada do usuário.* | ||
> | ||
> [Critério 3.3.2: Etiquetas ou instruções (Nível A)](https://www.w3.org/WAI/WCAG22/Understanding/labels-or-instructions.html) | ||
|
||
### Procedimento de teste WCAG 2.1 | ||
|
||
#### Técnicas suficientes | ||
- [G131: Fornecimento de rótulos descritivos](https://www.w3.org/WAI/WCAG22/Understanding/labels-or-instructions.html) **E** um dos seguintes: | ||
- [ARIA1: Usando a propriedade aria-describedby para fornecer um rótulo descritivo para controles da interface do usuário](/tecnicas-procedimentos-de-teste/ARIA1.md) | ||
- [ARIA9: Usando aria-labelledby para concatenar um rótulo de vários nós de texto](/tecnicas-procedimentos-de-teste/ARIA9.md) | ||
- [ARIA17: Usando funções de agrupamento para identificar controles de formulário relacionados](/tecnicas-procedimentos-de-teste/ARIA17.md) | ||
- [G89: Fornecendo formato e exemplo de dados esperados](/tecnicas-procedimentos-de-teste/G89.md) | ||
- [G184: Fornecer instruções de texto no início de um formulário ou conjunto de campos que descrevam a entrada necessária](/tecnicas-procedimentos-de-teste/G184.md) | ||
- [G162: Posicionamento de rótulos para maximizar a previsibilidade dos relacionamentos](/tecnicas-procedimentos-de-teste/G162.md) | ||
- [G83: Fornecimento de descrições de texto para identificar campos obrigatórios que não foram preenchidos](/tecnicas-procedimentos-de-teste/G83.md) | ||
- [H90: Indicação de controles de formulário obrigatórios usando rótulo ou legenda](/tecnicas-procedimentos-de-teste/H90.md) | ||
- [PDF5: Indicando controles de formulário obrigatórios em formulários PDF](/tecnicas-procedimentos-de-teste/PDF5.md) | ||
- [H44: Usando elementos de rótulo para associar rótulos de texto a controles de formulário](/tecnicas-procedimentos-de-teste/H44.md) | ||
- [PDF10: Fornecendo rótulos para controles de formulário interativos em documentos PDF](/tecnicas-procedimentos-de-teste/PDF10.md) | ||
- [H71: Fornecendo uma descrição para grupos de controles de formulário usando elementos fieldset e legenda](/tecnicas-procedimentos-de-teste/H71.md) | ||
- [G167: Usando um botão adjacente para rotular a finalidade de um campo](/tecnicas-procedimentos-de-teste/G167.md) | ||
|
||
<font color="D53434">**Observação (Dúvida AMA) | ||
|
||
As técnicas no final da lista acima devem ser consideradas “último recurso” e utilizadas somente quando as outras técnicas não puderem ser aplicadas à página. As técnicas anteriores são preferidas porque aumentam a acessibilidade a um grupo mais amplo de usuários.**</font> | ||
|
||
#### Falhas | ||
- [F82: Falha no Critério de Sucesso 3.3.2 ao formatar visualmente um conjunto de campos de números de telefone, mas não incluir uma etiqueta de texto](/falhas/F82.md) | ||
|
||
### Procedimento de teste mobile | ||
|
||
1) Identificar campos de formulários na aplicação; | ||
|
||
2) Verificar se as etiquetas estão visíveis; | ||
|
||
3) Verificar se as etiquetas informam exatamente o tipo de dado que deve ser inserido; | ||
|
||
4) Se existir campos de edição, verificar se as etiquetas estão posicionadas imediatamente antes do campo; | ||
|
||
5) Se existir botões radio ou checkbox, verificar se as etiquetas estão posicionadas imediatamente depois do elemento; | ||
|
||
6) Selecionar cada etiqueta manualmente pelo toque e verificar se o campo está associado a ele. A etiqueta está associada ao campo quando é exibido uma mudança no estilo do campo, como por exemplo, um contorno; | ||
|
||
7) Verificar se o leitor de ecrã identifica as informações da etiqueta. | ||
|
||
### Referências | ||
|
||
W3C/WAI. (2024) [WCAG Sucess Criteria 3.3.2: Labels or Instructions (Level A)](https://www.w3.org/WAI/WCAG22/Understanding/labels-or-instructions.html). Updated 4 April 2024. | ||
|
||
APPT. [ Web Content Accessibility Guidelines (WCAG) - Labels or Instructions ](https://appt.org/en/guidelines/wcag/success-criterion-3-3-2). Data de acesso: 19 abril 2024. | ||
|
||
|
||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,49 @@ | ||
--- | ||
title: 2.1 Controlos de toque são ativados após deixar de exercer pressão (_up event_) e não após o toque inicial (_down event_) | ||
--- | ||
|
||
## Critérios de Sucesso WCAG 2.1 aplicáveis | ||
|
||
### SC 2.5.2 Cancelamento de ponteiro (Nível A) | ||
> | ||
> *A intenção deste critério de sucesso é facilitar aos usuários a prevenção de entradas acidentais ou errôneas do ponteiro* | ||
> | ||
> #### Ativação ou conclusão do Up-Event | ||
> | ||
> *(...) Em uma interação com tela sensível ao toque, quando o dedo toca um alvo, a ativação do evento ascendente ocorre apenas quando o dedo é levantado enquanto ainda está dentro do limite do alvo (...)* | ||
> | ||
> #### Abortar ou desfazer evento ativo | ||
> | ||
> *(...) Os usuários que têm dificuldade em usar o mouse ou a tela sensível ao toque com precisão se beneficiam muito desse comportamento básico. Eles normalmente recebem feedback visual quando um item é pressionado. Se descobrirem que selecionaram o item errado, podem cancelar a ação movendo o ponteiro ou o dedo para longe do alvo antes de soltar (...)* | ||
> | ||
> #### Reversão para cima | ||
> | ||
>*Em outras interações, o evento down pode desencadear um comportamento que pode ser revertido quando o evento up terminar. Exemplos disso incluem ações de pressionar e segurar (...)* | ||
> | ||
> #### Evento down | ||
> | ||
> *Completar a função no evento down só é permitido quando for essencial que o evento up não seja utilizado (...)* | ||
> | ||
> [Critério 2.5.2 Cancelamento de ponteiro (Nível A)](https://www.w3.org/WAI/WCAG21/Understanding/pointer-cancellation) | ||
|
||
### Procedimento de teste WCAG 2.1 | ||
|
||
#### Técnicas suficientes | ||
- [G210: Garantir que as ações de arrastar e soltar possam ser canceladas](/tecnicas-procedimentos-de-teste/G210.md) | ||
- [G212: Utilização de controles nativos para garantir que a funcionalidade seja acionada no evento ativo](/tecnicas-procedimentos-de-teste/G212.md) | ||
- <font color="D53434">Os eventos de toque só são acionados quando o toque é removido de um controle (potencial técnica futura) Dúvida AMA: é o nosso procedimento de teste mobile </font> | ||
|
||
#### Falhas | ||
- [F101: Falha no Critério de Sucesso 2.5.2 devido à ativação de um controle no evento de inatividade](/falhas/F101.md) | ||
|
||
### Procedimento de teste mobile | ||
1. Localizar elementos interativos na aplicação; | ||
2. Selecionar o elemento para verificar se a ação é feita assim que remover o toque da tela; | ||
3. Verificar se é possível cancelar a ação. Isso pode ser feito quando selecionamos um elemento, movemos o dedo para fora antes de solta-lo e nenhuma ação é realizada | ||
|
||
### Referências | ||
|
||
APPT. [ Web Content Accessibility Guidelines (WCAG) - Labels or Instructions ](https://appt.org/en/guidelines/wcag/success-criterion-3-3-2). Data de acesso: 19 abril 2024. | ||
|
||
W3C/WAI. (2023) [WCAG Sucess Criteria 2.5.2: Pointer Cancellation (Level A)](https://www.w3.org/WAI/WCAG21/Understanding/pointer-cancellation). Updated 20 June 2023 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
--- | ||
title: 2.2 Funcionalidades ativadas através do movimento, inclinação, ou do sacudir físico do dispositivo podem ser desativadas | ||
--- | ||
|
||
## Critérios de Sucesso WCAG 2.1 aplicáveis | ||
|
||
### SC 2.5.4 Atuação de Movimento (Nível A) | ||
> | ||
> *A funcionalidade que pode ser operada pelo movimento do dispositivo ou do usuário também pode ser operada pelos componentes da interface do usuário e a resposta ao movimento pode ser desativada para evitar atuação acidental (...)* | ||
> | ||
> [Critério 2.5.4: Atuação de Movimento (Nível A)](https://www.w3.org/WAI/WCAG21/Understanding/motion-actuation) | ||
|
||
### Procedimento de teste WCAG 2.1 | ||
|
||
#### Técnicas suficientes | ||
- [G213: Fornece controles convencionais e uma configuração de aplicativo para entrada ativada por movimento](/tecnicas-procedimentos-de-teste/G213.md) | ||
- <font color="D53434"> GXXX: Suporte a recursos de nível de sistema que permitem ao usuário desabilitar a atuação por movimento</font> | ||
|
||
#### Falhas | ||
- [F106: Falha por impossibilidade de desativar acionamento por movimento](/falhas/F106.md) | ||
- <font color="D53434">FXXX: Falha no Critério de Sucesso 2.5.4 devido à interrupção ou desativação de recursos de nível de sistema que permitem ao usuário desativar a atuação por movimento</font> | ||
|
||
### Referências | ||
|
||
APPT. [ Web Content Accessibility Guidelines (WCAG) - Motion Actuation](https://appt.org/en/guidelines/wcag/success-criterion-2-5-4). Data de acesso: 19 abril 2024. | ||
|
||
W3C/WAI. (2023) [WCAG Sucess Criteria 2.5.4: Motion Actuation (Level A)](https://www.w3.org/WAI/WCAG21/Understanding/motion-actuation). Updated 20 June 2023 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
--- | ||
title: 2.3 Funcionalidades ativadas através do movimento físico do dispositivo podem ser operadas através de componentes de interface | ||
--- | ||
|
||
## Critérios de Sucesso WCAG 2.1 aplicáveis | ||
|
||
### SC 2.5.4 Atuação de Movimento (Nível A) | ||
> | ||
> *A funcionalidade que pode ser operada pelo movimento do dispositivo ou do usuário também pode ser operada pelos componentes da interface do usuário e a resposta ao movimento pode ser desativada para evitar atuação acidental (...)* | ||
> | ||
> [Critério 2.5.4: Atuação de Movimento (Nível A)](https://www.w3.org/WAI/WCAG21/Understanding/motion-actuation) | ||
|
||
### Procedimento de teste WCAG 2.1 | ||
|
||
#### Técnicas suficientes | ||
- [G213: Fornece controles convencionais e uma configuração de aplicativo para entrada ativada por movimento](/tecnicas-procedimentos-de-teste/G213.md) | ||
- <font color="D53434"> GXXX: Suporte a recursos de nível de sistema que permitem ao usuário desabilitar a atuação por movimento</font> | ||
|
||
#### Falhas | ||
- [F106: Falha por impossibilidade de desativar acionamento por movimento](/falhas/F106.md) | ||
- <font color="D53434">FXXX: Falha no Critério de Sucesso 2.5.4 devido à interrupção ou desativação de recursos de nível de sistema que permitem ao usuário desativar a atuação por movimento</font> | ||
|
||
### Referências | ||
|
||
APPT. [ Web Content Accessibility Guidelines (WCAG) - Motion Actuation](https://appt.org/en/guidelines/wcag/success-criterion-2-5-4). Data de acesso: 19 abril 2024. | ||
|
||
W3C/WAI. (2023) [WCAG Sucess Criteria 2.5.4: Motion Actuation (Level A)](https://www.w3.org/WAI/WCAG21/Understanding/motion-actuation). Updated 20 June 2023 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
--- | ||
title: 2.4 Gestos Multiponto (uso simultâneo de vários dedos) ou gestos baseados no desenho de uma trajetória estão também disponíveis com gestos que fazem uso do toque de um só ponto ou que não obrigam a desenhar uma trajetória | ||
--- | ||
|
||
## Critérios de Sucesso WCAG 2.1 aplicáveis | ||
|
||
### SC 2.5.1: Gestos de ponteiro (Nível A) | ||
> | ||
> *Todas as funcionalidades que usam gestos multiponto ou baseados em caminho para operação podem ser operadas com um único ponteiro sem um gesto baseado em caminho, a menos que um gesto multiponto ou baseado em caminho seja essencial .* | ||
> | ||
> [Critério 2.5.1: Gestos de ponteiro (Nível A)](https://www.w3.org/WAI/WCAG21/Understanding/pointer-gestures) | ||
|
||
### Procedimento de teste WCAG 2.1 | ||
|
||
#### Técnicas suficientes | ||
|
||
- [G215: Fornecendo controles para obter o mesmo resultado que gestos baseados em caminho ou multiponto](/tecnicas-procedimentos-de-teste/G215.md) | ||
- [G216: Fornece ativação de ponto único para um controle deslizante](/tecnicas-procedimentos-de-teste/G216.md) | ||
|
||
#### Falhas | ||
|
||
- [F105: Falha no Critério de Sucesso 2.5.1 devido ao fornecimento de funcionalidade através de um gesto baseado em caminho sem uma simples alternativa de ponteiro](/falhas/F105.md) | ||
|
||
### Referências | ||
|
||
APPT. [ Web Content Accessibility Guidelines (WCAG) - Pointer Gestures](https://appt.org/en/guidelines/wcag/success-criterion-2-5-1). Data de acesso: 19 abril 2024. | ||
|
||
W3C/WAI. (2023) [WCAG Sucess Criteria 2.5.1: Pointer Gestures (Level A)](https://www.w3.org/WAI/WCAG21/Understanding/pointer-gestures). Updated 20 June 2023 |
Oops, something went wrong.