tutoriais mais recente desenvolvimento web
 

web WAI


WAI define diretrizes para desenvolvedores web.


WAI - A Web Accessibility Initiative

WAI (W3C, 1997) é um conjunto de orientações destinadas a desenvolvedores web e designers, sobre como tornar a web acessível a pessoas com deficiência.

O objetivo dessas diretrizes é a acessibilidade, mas também vai ajudar a tornar o conteúdo web disponível para mais navegadores (browsers de voz, telefones celulares, dispositivos portáteis) e mais usuários que trabalham em ambientes difíceis (mãos-livres, forte luz, escuridão, má visão, ruído pesado).

Nota Se o seu site não tem características de WAI (bom contraste, texto redimensionável, imagens com descrições), as pessoas com deficiência não serão capazes de acessar suas informações.

Razões para tornar o site mais acessível:

  • Vai melhorar sua reputação e sua satisfação do cliente
  • Irá aumentar o seu número de visitantes
  • Ele permitirá que os visitantes ficar mais tempo em seu site
  • Isso fará com que seu site mais útil para as pessoas com equipamentos mais antigos

Lembre-se de "alt"

O atributo alt permite que você forneça um texto alternativo para uma imagem:

<img src="images/banana.jpg" alt="Banana">

Às vezes, um navegador web não irá exibir as imagens. A razão pode ser um dos muitos:

  • O usuário desativou a exibição de imagens
  • O navegador é um mini navegador sem exibição de imagem
  • O navegador é um navegador de voz

Se você usar o atributo "alt", a maioria dos navegadores serão, pelo menos, display (ou ler) o texto "alt".


Não use Small Fonts

Alguns sites usam um tamanho de texto pequenos apenas para "espremer" mais texto em cada página, ou para tornar a página mais "elegante".

Mais uma vez, os visitantes com diferentes equipamentos, condições de visualização, ou deficiência pode ter dificuldades de leitura do texto.

Nota Não force seus visitantes para ampliar o tamanho do texto toda vez que eles visitam seu site.

Escolheu o Melhor Letra e espaçamento entre linhas

Texto espaçamento de letra extra é fácil de ler.

Texto espaçamento entre letras reduzida é difícil de ler.

Texto boa
espaçamento entre linhas
é fácil de ler.

Texto reduzida
espaçamento entre linhas
é difícil de ler.


Evite Fantasia Fontes

fontes normais são fáceis de ler.

Fontes em itálico não são tão fáceis de ler.

Serif fontes são mais difíceis de ler.


Evite contrastes cor fraca

O texto preto em um fundo branco ou texto branco sobre um fundo preto, é melhor para as pessoas com deficiência de visão, e para exibição em equipamentos ruim.

O texto a cinzento em um fundo claro pode dar um contraste pobre:

#aaaaaa Cor do texto no fundo branco
cor do texto # 666666 no fundo branco
cor do texto # 333333 no fundo branco
cor do texto # 000000 no fundo branco

O texto a cinzento em um fundo escuro também pode dar um contraste pobre:

cor do texto # 666666 no fundo preto
#aaaaaa Cor do texto no fundo preto
# CCCCCC cor do texto no fundo preto
#FFFFFF Cor do texto no fundo preto

Algumas combinações - como preto e vermelho, preto e azul, amarelo e verde - sempre esticar o olho:

O texto preto em um fundo vermelho
texto preto em um fundo azul
Texto amarelo sobre um fundo verde

E algumas combinações não são tão ruins:

O texto preto em um fundo cinzento
texto preto em uma luz azul
texto preto em branco antigo
texto branco em azul escuro

Sempre Definir cor de fundo

A maioria das páginas web utilizam cores para diferentes elementos de texto. Ambos os cabeçalhos e links são muitas vezes em uma cor diferente do corpo do texto.

Como um web designer, você deve estar ciente do fato de que os visitantes são capazes de mudar suas preferências de cores padrão.

Se você definir cores para seus elementos de web (como o cabeçalho e links), você também deve definir a cor de fundo.

Nota Se você não definir uma cor de fundo, o site pode acabar com alguns muito mau combinação de cores (como cabeçalhos de luz vermelha sobre um fundo vermelho, ou ainda pior, texto preto sobre um fundo preto).