Tipografia na Web, agora existe sim

[ad#texto]
Muitos designers, geralmente os que possuem pouca experiência, trocam blocos de texto por imagens, pelo simples fato que não podem garantir que o usuário que acessar o site terá determinado tipo de fonte utilizado.

Agora esse problema está praticamente solucionado, com suporte para o Internet Explorer versões 7, 8 e 9 com fontes EOT e Firefox, Opera, Chrome e Safari para fontes TTF e OTF agora é possível definir uma fonte remota para ser utilizada no site.

A funcionalidade @font-face do CSS é empregada para esse fim, porém em conexões lentas o designer do site se primeiro renderizado para depois a fonte ser carregada (lembre-se que a fonte agora é remota) o que pode frustar um pouco, mas também podemos contornar esse problema (e economizar banda) definindo para que primeiro a fonte seja utilizada local e somente se não existir que seja utilizada a fonte remota.

Observe o código abaixo:

@font-face {
  font-family: nome_familia_fonte;
  src: local(sua_fonte.otf), url(sua_fonte.otf);
}

Note que primeiro definimos a fonte local, para depois definirmos a fonte remota.

Veja também um exemplo de como utilizar o @font-face criado:

p {
  font:36px helveticaneue, Arial, Tahoma, Sans-serif;
}

Fonte: Tableless

Petter Rafael

Desenvolvedor Web atua com as tecnologias Java e PHP apoiadas pelos bancos de dados Oracle e MySQL. Além dos ambientes de desenvolvimento acima possuiu amplo conhecimento em servidores Apache/Tomcat, Photoshop, Arte & Foto, Flash e mais uma dezena de ferramentas e tecnologias emergentes. Atualmente colabora com o Viablog escrevendo sobre programação e tecnologia.