Tamanhos e acessibilidades


Nos cursos sempre aprendemos(ou deveríamos aprender) unidades de medidas em CSS. Tais unidades, tem como importância o auxílio na acessibilidade do site e evidentemente que na formatação do mesmo.

O valor de uma propriedade, por exemplo, font-size, pode-se expressar em unidades de comprimento, ou em unidades de porcentagem.

Unidades de Comprimento

Unidades absolutas

* in (polegadas)

* cm (centímetros)

* mm (milímetros)

* pt (pontos)

* pc (picas)

* px (pixels)

Unidades relativas

* em

* ex

Unidades de Porcentagem

* %

De todas, as unidades recomendadas são as relativas.

Com esse tipo de medida, o autor mantém um controle relativo em relação ao tamanho da fonte padrão do usuário, onde pode especificar quanto maior ou menor se vê o texto na página.

Mas por que não utilizar medidas absolutas? As unidades absolutas como px (pixel), cm (centímetros), pt (pontos), permitem um controle exato da aparência da página, sempre e quando, que seja visualizada com o fim que ela foi projetada (onde se acaba a acessibilidade da página). Por exemplo, a unidade px tem um valor diferente dependendo da resolução da tela e do tipo de computador usuário. Assim, um sistema Windows mantém uma equivalência de 96px por polegada, e o Macintosh, 72 px por polegada. Se utilizarmos pt (pontos), no lugar de px (pixels) o tamanho dos pontos dependem da resolução do usuário.

Abaixo a tabela equivalente as medidas e seus valores aproximados, pois tudo depende do Navegador utilizado e também do Sistema Operacional:

Pontos Pixels Em’s %
6pt 8px 0.5em 50%
7pt 9px 0.55em 55%
7.5pt 10px 0.625em 62.5%
8pt 11px 0.7em 70%
9pt 12px 0.75em 75%
10pt 13px 0.8em 80%
10.5pt 14px 0.875em 87.5%
11pt 15px 0.95em 95%
12pt 16px 1em 100%
13pt 17px 1.05em 105%
13.5pt 18px 1.125em 112.5%
14pt 19px 1.2em 120%
14.5pt 20px 1.25em 125%
15pt 21px 1.3em 130%
16pt 22px 1.4em 140%
17pt 23px 1.45em 145%
18pt 24px 1.5em 150%
20pt 26px 1.6em 160%
22pt 29px 1.8em 180%
24pt 32px 2em 200%
26pt 35px 2.2em 220%
27pt 36px 2.25em 225%
28pt 37px 2.3em 230%
29pt 38px 2.35em 235%
30pt 40px 2.45em 245%
32pt 42px 2.55em 255%
34pt 45px 2.75em 275%
36pt 48px 3em 300%

Fonte: Não lembro(Peço desculpas mas realmente não lembro as fontes consultadas)

Abraço,
Ederson Melo

Deixe uma Resposta

Preencha os seus detalhes abaixo ou clique num ícone para iniciar sessão:

Logótipo da WordPress.com

Está a comentar usando a sua conta WordPress.com Terminar Sessão / Alterar )

Imagem do Twitter

Está a comentar usando a sua conta Twitter Terminar Sessão / Alterar )

Facebook photo

Está a comentar usando a sua conta Facebook Terminar Sessão / Alterar )

Google+ photo

Está a comentar usando a sua conta Google+ Terminar Sessão / Alterar )

Connecting to %s