Considerando licenças como:
como posso usar a família de fontes Ubuntu em qualquer site sem precisar instalar o usuário?
Qualquer chance de usá-lo com ferramentas como: http://code.google.com/intl/en-US/apis/webfonts/
Considerando licenças como:
como posso usar a família de fontes Ubuntu em qualquer site sem precisar instalar o usuário?
Qualquer chance de usá-lo com ferramentas como: http://code.google.com/intl/en-US/apis/webfonts/
Existem 2 métodos com os quais você pode incorporar a fonte Ubuntu no seu site - usando o Diretório de fontes do Google (preferencial) ou a @font-face
declaração CSS e convertendo suas fontes manualmente.
Agora você pode usar a fonte Ubuntu como fonte da web do Google. Isso tornará o processo muito mais simples. A maior parte do conteúdo desta parte da resposta vem da resposta de sladen .
Por que usar a API da fonte do Google é o método preferido?
O uso da API do Google Font é uma excelente sugestão, pois permite que as páginas da web funcionem automaticamente em todos os navegadores modernos sem precisar se preocupar com os detalhes. O uso da API da fonte significa que os visitantes sempre verão a versão mais recente do tipo de letra automaticamente.
Como posso usar a API de fontes do Google?
Desde 21 de dezembro de 2010, a família de fontes Ubuntu agora está incluída e implantável a partir da API de fontes do Google, visite:
Você pode ler a postagem da fonte da web do Google sobre as notícias e depois:
Marque a combinação de pesos e estilos em Regular, Itálico, Negrito e Negrito-Itálico que você precisa para sua página da web.
Se o padrão estiver incorreto, selecione a combinação de idioma / script que você precisa: um site russo com exemplos em inglês pode usar "cirílico, latim".
Adicione a <link>
tag especificada entre <head> ... </head>
na sua página ou modelos HTML e adicione o código CSS apropriado entre as <style> ... </style>
tags na sua <head>
.
Por exemplo, se você estivesse criando o site híbrido russo / inglês e desejasse usar a fonte como padrão para todo o texto, poderia adicionar o seguinte código entre suas <head>
tags:
<link href='http://fonts.googleapis.com/css?family=Ubuntu&subset=cyrillic,latin' rel='stylesheet' type='text/css' />
<style type="text/css" >
body {
font-family : 'Ubuntu', sans-serif;
}
</style>
Notas :
"Latim" é o script em que o inglês e muitas outras línguas européias e africanas são escritos.
"Sub-definição" otimiza os arquivos de fonte enviando apenas caracteres para determinados idiomas; as fontes têm cerca de 44 kB cada. A figura de 168 kB mostrada no momento é para todos os mais de 1.200 glifos como um único download de fonte da Web - e a maioria não é necessária para um único site.
Os arquivos de fonte Ubuntu são convertidos automaticamente no formato correto para diferentes navegadores; dependendo da marca e versão do formato exigido é WOFF
, EOT
, SVG
ouTTF
. A combinação certa de CSS é específica para cada solicitação de página e resolve magicamente esse problema difícil.
Você pode incorporar as fontes do Ubuntu convertendo-as em fontes WOFF . Você pode incorporá-los usando a declaração CSS @ font-face. As fontes (arquivos .ttf) podem ser encontradas em /usr/share/fonts/truetype/ubuntu-font-family
.
Por exemplo, para usar a fonte Ubuntu Regular, convertida em um arquivo WOFF, Ubuntu-R.woff, use este código CSS:
@font-face
{
font-family : "Ubuntu-R";
src: url('Ubuntu-R.woff');
}
Da mesma forma para o Ubuntu Bold:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-B.woff');
font-weight : bold;
}
Ubuntu Italic:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-I.woff');
font-style : italic;
}
Ubuntu Negrito Itálico:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-BI.woff');
font-weight : bold;
font-style : italic;
}
Isso é suportado por todos os navegadores recentes .
Lembre-se de que alguns usuários configuram seus navegadores para usar um conjunto específico de fontes e podem ficar irritados se fontes personalizadas forem usadas. Leia também a Licença de fonte do Ubuntu para obter os termos exatos de como a fonte pode ser distribuída.
O uso da API do Google Font é uma excelente sugestão, pois permite que as páginas da web funcionem automaticamente em todos os navegadores modernos sem precisar se preocupar com os detalhes. O uso da API da fonte significa que os visitantes sempre verão a versão mais recente do tipo de letra automaticamente.
Desde 21 de dezembro de 2010, a família de fontes Ubuntu agora está incluída e implantável a partir da API de fontes do Google, visite:
Você pode ler a postagem da fonte da web do Google sobre as notícias e depois:
<head> ... </head>
e<style>...</style>
da sua página ou modelos HTML.Notas:
"Latim" é o script em que o inglês e muitas outras línguas européias e africanas são escritos.
"Sub-definição" otimiza os arquivos de fonte enviando apenas caracteres para determinados idiomas; as fontes têm cerca de 44 kB cada. A figura de 168 kB mostrada no momento é para todos os mais de 1.200 glifos como um único download de fonte da Web - e a maioria não é necessária para um único site.
Os arquivos de fonte Ubuntu são convertidos automaticamente no formato correto para diferentes navegadores; dependendo da marca e versão do formato exigido é
WOFF
,EOT
,SVG
ouTTF
. A combinação certa de CSS é específica para cada solicitação de página e resolve magicamente esse problema difícil.fonte
A renderização de fontes no servidor (talvez a melhor "renderização dinâmica de fontes") é uma questão interessante há bastante tempo.
Tecnicamente, parece lógico que, para uma máquina exibir uma fonte específica, ela já esteja instalada localmente.
Por outro lado, o web design perde muito ao ter que se ater às 'fontes da web' básicas / conhecidas.
O CSS2.1 fez algumas melhorias usando a declaração de regra @ font-face .
Ainda não se tornou um padrão, mas, eventualmente, com CSS3.
Além disso, existem alguns métodos alternativos, como:
Espero que os links fornecidos lhe dê uma idéia melhor do que pode ser feito ;-)
fonte