kit-selo

voltar ao índice

Procedimento de teste para o
Requisito 1 - Crie designs para ecrãs de dimensão reduzida

Na experiência com dispositivos móveis os ecrãs são, em regra, muito mais pequenos do que nos computadores de secretária ou mesmo nos portáteis. A leitura e a interação num ecrã de dimensões reduzidas obriga a cuidados adicionais no tratamento da apresentação da informação - formas mais concisas de apresentação - e no dimensionamento das áreas de toque - no limite é importante responder aos requisitos mínimos recomendados nas WCAG.

1.1 Quantidade razoável de conteúdo exibida de cada vez

Aspeto A - Tamanho da linha

  1. Determine o tamanho da linha do corpo de texto em número de caracteres incluindo espaços.
  2. Verifique se o número de caracteres determinado no passo 1 é inferior ou igual a 70.

Passa, se:

Referências:

Aspeto B - Espaçamento entre linhas

  1. Determine o espaçamento entre linhas utilizado no corpo do texto. Use como unidade de medida o número de vezes tamanho da fonte (line-height).
  2. Verifique se o espaçamento determinado no passo anterior é, no mínimo, de 1.5x tamanho da fonte.

Passa, se:

Referências:

Aspeto C - Espaçamento entre parágrafos

  1. Determine o espaçamento entre parágrafos utilizado no corpo do texto. Use como unidade de medida o número de vezes espaçamento entre linhas.
  2. Verifique se o espaçamento determinado no passo anterior é, no mínimo, de 1.5x espaçamento entre linhas (i.e. 1.5 x 1.5 x tamanho fonte = 2.25 x tamanho fonte).

Passa, se:

Aspeto D - Agrupar conteúdo de forma lógica

Elementos que formam uma unidade contextual única são agrupados de forma a que possam ser processados pelas tecnologias de apoio como um elemento único.

  1. Verifique se ao navegar com um leitor de ecrã ou tecnologia de apoio similar, os elementos são agregados de forma a formar uma unidade (e.g., um botão, o seu texto, o seu ícone ou uma imagem e a sua legenda) e são anunciados como uma unidade e que nenhuma das suas partes é anunciada separadamente.
  2. Verifique que os elementos semânticos (e.g. títulos, parágrafos, listas, elementos de lista, links, botões) são lidos pelos leitores de ecrã de forma separada.

Passa, se:

Referências:

1.2 Botões e controlos suficientemente grandes para serem percecionados pela visão e selecionáveis pelo toque

  1. Identifique na página todos os botões, caixas de seleção, botões de rádio e campos de edição.
  2. Verifique se as respetivas áreas de toque acionáveis de cada elemento identificado no passo anterior tem, no mínimo, 44 por 44 pixéis CSS.

Passa, se

Nota 1 - estão excepcionadas do cumprimento do CS 2.5.5 das WCAG 2.1 as seguintes situações:

1.3 Campos de formulário posicionados abaixo dos seus rótulos

Para cada campo de formulário na página:

  1. Verifique se o campo do formulário possui um rótulo visível.
  2. Se o campo do formulário for uma caixa de seleção ou um botão de rádio, verifique se o rótulo está imediatamente após o campo.
  3. Se o campo do formulário não for uma caixa de seleção ou botão de rádio, verifique se o rótulo está imediatamente antes do campo.

Passa, se:

Referências: