A renderização de fontes no navegador do Google é algo digno de pena, mesmo quando as fontes utilizadas são do serviço do mesmo, o Google Webfonts. Uma solução rápida para isso é usar Font-face, que é um recurso de CSS para incluir qualquer fonte no seu site.

Antes da alteração, com o bug

Antes da alteração, com o bug

Mas para que a aparência da fonte fique perfeita, é necessário carregar o arquivo .svg antes dos demais na sua folha de estilo:

@font-face {
font-family: 'chunk-webfont';
src: url('fonts/chunk-webfont.eot');
src: url('fonts/chunk-webfont.eot?#iefix') format('eot'),
url('fonts/chunk-webfont.svg') format('svg'),
url('fonts/chunk-webfont.woff') format('woff'),
url('fonts/chunk-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
Com a alteração na ordem de carregamento do SVG

Com a alteração na ordem de carregamento do SVG

Para achar os arquivos da fonte que você usa, procure por “sua fonte” webfont. Ou então procure no Font Squirrel.

Dica vinda do AdTrak

Quer mais conteúdo como este?

Dicas para blog, SEO, marketing, redes sociais e mutio mais...

Invalid email address
Sem spam e você cancela quando quiser.

Comente

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *