Técnicas para as WCAG 2.0

Ir para o conteúdo (Pressione a tecla Enter)

-

C12: Utilizar percentagem para tamanhos de letra

Aplicabilidade

CSS.

Esta técnica está relacionada com:

Notas de Apoio para o Agente de Utilizador e para a Tecnologia de Apoio

Quando o tamanho de letra é especificado em qualquer unidade de medida absoluta, tais como pontos ou pixéis, os comandos de menu 'Tamanho de Texto' no Internet Explorer 7 e versões anteriores não redimensionam o texto.

Quando o 'Modo Alto Contraste' é definido a partir do 'Painel de Controlo de Acessibilidade' do Windows, o IE6 aumenta o tamanho do texto da página como se uma alteração, via CSS, na percentagem tivesse sido definida para a janela mais periférica. O comportamento normal de um layout via CSS faz com que o redimensionamento relativo tenha um efeito multiplicador, ocorrendo subtis diferenças de alteração do tamanho do texto nos vários elementos. O Firefox e o IE7 não redimensionam o conteúdo com base nas definições do sistema de forma a afectar um layout construído por CSS, pelo que este efeito não ocorre nestes browsers.

Descrição

O objectivo desta técnica é especificar o tamanho do texto proporcionalmente, para que os agentes de utilizador possam ajustar o conteúdo de forma eficaz. Se for especificado um font-size para o elemento body, todos os outros elementos herdam esse valor, a não ser que sejam sobrepostos por um selector mais específico.

Exemplos

Exemplo 1: Percentagem para tamanhos de letra em CSS

Este exemplo define o tamanho de letra para o elemento strong, para que o seu texto seja sempre maior do que o texto circundante, em qualquer contexto utilizado. Assumindo que os cabeçalhos e parágrafos utilizam diferentes tamanhos de letra, cada palavra realçada neste exemplo será maior do que o texto circundante.

Código Exemplo:

strong {font-size: 120%}

 ...

<h1>Deixem o <strong>utilizador</strong> controlar o tamanho do texto</h1>
<p>Uma vez que só o utilizador pode saber qual o tamanho de letra que melhor o serve, 
é <strong>muito</strong> importante que o deixemos configurar o tamanho do texto.  
…

Recursos

Os recursos são indicados apenas a título informativo, não implica que tenham sido aprovados.

Testes

Procedimento

  1. Examine todas as propriedades CSS que definam o tamanho de letra para cada conjunto de regras.

  2. Verifique se o valor é uma percentagem.

Resultados Esperados