Isso pode ser bem útil e economizar muito tempo. Imagine a situação: o designer resolve fazer um site com uma fonte que ele achou no google. Resultado? programadores front end se ferram. Até hoje existia uma única solução cross browser pra renderizar a fonte, usando flash. Mas existe um projeto chamado typeface.js, open source e cross-browser para importar as fontes via javascript! Além disso a página continua acessível, inclusive para buscadores.
O projeto está em desenvolvimento mas ja é possível utilizá-lo.
Como funciona?
É só invocar o typeface e o script da fonte. Existe um arquivo javascript para cada fonte, caso você tenha uma fonte que não exista no arquivo deles, você pode subir ela e converter a fonte num arquivo javascript. Esse arquivo gera uma imagem pra cada palavra, subistituindo o texto original pela fonte desejada.
Veja detalhadamente como fazer:
Dentro da sua tag head, inclua os arquivos:
<script type="text/javascript" src="_scripts/typeface-0.10.js"></script> <script type="text/javascript" src="_scripts/helvetiker_regular.typeface.js"></script>
Escreva o html e adicione a classe typeface-js nos elementos onde for atribuir alguma fonte que não seja de sistema.
<div class="titulo typeface-js"> Exemplo de texto com helvetiker </div> <p class="texto typeface-js"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc urna justo, dapibus nec, porttitor a, rutrum id, velit. Nulla et nulla. Nulla vitae pede. Morbi tincidunt massa eu lacus. </p>
Depois é só atribuir a fonte no seu css, do mesmo jeito como se fosse arial:
div.titulo {
font-family: Helvetiker;
font-size: 30px;
}
p.texto {
font: 20px Helvetiker;
color:#444;
}
Veja o script em ação no exemplo abaixo:
Você pode fazer download desse exemplo, com todos os arquivos e também pode ver outros exemplos no site do typeface.
Vale a pena dar uma olhada se você tiver um projeto que tenha fontes não sistêmicas a kilo, ou então títulos dinâmicos onde não dá pra fazer image replacement.
Danilo é programador interface da AgênciaClick, corinthiano, vegan e geek. Gasta suas horas com xadrez, poker, vendo futebol e esporadicamente dedica 5 minutos semanais à Belinha - mas é mto provável que esse tempo agora seja dividido com o TidBits... Danilo sabe php, rails, javascript, xhtml, css, jquery, webstandards, seo, sql, opensocial, etc. E já fez sites para espn, fiat, fila, umbro, fgv, gatorade, petrobras, etc. Veja o 
Belinha agora é arquiteta de informação na RMG Connect, está cozinhando melhor, mas postando cada dia menos... ainda assim, sempre que dá aparece aqui no TidBits para dar seus pitacos sobre desenvolvimento... (Belinha é casada com o Danilo)
October 28th, 2008 at 8:35 am
E como fica o carregamento da página? Vc notou se fez diferença?
October 28th, 2008 at 11:05 am
Acho não entendi a pergunta amigo. Você quer dizer, o peso?
[]s
March 27th, 2009 at 8:14 pm
Olá,
sei que to meio atrasado, mas estava pesquisando exatamente este assunto e cai aqui.
Você sabe me dizer como fica a indexação por buscadores dos textos que utilizam este script? Sabe se atrapalha ou se o robô lê igualmente ao texto normal?
Obrigado.
Thomaz Dantas
March 29th, 2009 at 10:30 pm
Olá Thomaz, a indexação é normal.. o robo lê o html puro.
March 2nd, 2010 at 11:28 am
No meu caso, funcionou no Firefox e no Google Chrome, mas no Internet Explorer 8 ficou em branco. O que pode ser?