Como criar manchetes suaves com HTML e CSS?

Question

Vi muitas páginas da web recentemente, que têm manchetes muito suaves, como este site, por exemplo: http://boagworld.com/

Como eles fazem isso? Existem pistas ocultas?

A certa altura, ouvi de uma técnica em que eles usavam flash (eu acho) para incorporar fontes personalizadas em um site e depois substituir as manchetes normais por essa alternativa flash.

Que outras maneiras existem além do flash?

Answer 1

Supondo que você não queira usar as imagens como substituição de texto, existem várias técnicas, que adaptam o aprimoramento da fonte de maneira muito discreta:

• usando instantâneo - Sifr
• puro CSS = @font-face e incorporar fontes diretamente em ttf ou otf
• JavaScript Técnica de aprimoramento, o script é chamado Cufon

Pessoalmente, eu gosto de usar fontes seguras da web com combinação de menos conhecida e fazer retrato adequado

Answer 2

Eles estão apenas usando imagens como fundo CSS para certas coisas, neste caso:

http://boagworld.com/wp-content/themes/boagworldv2/images/logo.gif

Você pode fazer o que quiser com algumas imagens e CSS, algo como:

#header { background: #FFFFFF url(myLogoImg.png) center no-repeat; }

Answer 3

Se você não quiser usar a substituição de imagem ou o SIFR, mas deseja fontes personalizadas, você deve dar uma olhada no TypeKit - http://typekit.com/. Eles permitem ligar para fontes personalizadas (que licenciaram você) diretamente da sua folha de estilo com a família de fontes e usam JavaScript incorporado na sua página para servir as fontes de seus servidores. Estou usando o serviço deles em um projeto agora e até agora parece funcionar bem. Eles ainda não têm uma enorme biblioteca de fontes disponíveis, mas ainda é maior que Arial, Verdana, Georgia e Times New Roman.

Answer 4

eu recomendaria Cufón por esta. É não flash (JavaScript), muito fácil de configurar e se degrada graciosamente.