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.