Como resolver quando a fonte do site não está presente no computador do usuário
Fontes especiais dão uma aparência muito mais agradável e diferenciada para um site, porém a maioria das fontes especiais não estão presentes na máquina do usuário, sendo assim o quando o usuário acessa um site com fonte especial, o browser não consegue renderizar a fonte, e acaba abrindo o site com uma fonte padrão tipo Arial ou Times.
Existem várias formas de resolver isso, porém estarei falando da forma que uso habitualmente.
Atributo @font-face
Método interno
É a forma recomendada para quem quer uma fonte diferente, mas deseja fazer o font-face no seu próprio site, sem chamar sites externos. O problema da utilização do font-face é que alguns navegadores não renderizam alguns tipos de extensões de fontes, assim é necessário um hack ou múltiplas declarações para que a técnica seja crossbrowser (funcione em todos os navegadores).
Esse método começou a ganhar mais atenção no meio devido ao artigo do Paul Irish divulgando o Bulletproof @font-face. Hoje em dia, o bloco de código crossbrowser mais indicado é:
@font-face {
font-family: Graublauweb;
src: url(‘Graublauweb.eot’); /* IE9 Compatibility Modes */
src: url(‘Graublauweb.eot?’) format(‘eot’), /* IE6-IE8 */
url(‘Graublauweb.woff’) format(‘woff’), /* Modern Browsers */
url(‘Graublauweb.ttf’) format(‘truetype’), /* Safari, Android, iOS */
url(‘Graublauweb.svg#svgGraublauweb’) format(‘svg’); /* Legacy iOS */
}
Caso você prefira, o Font Squirrel criou um font-face generator, que tal?
Recomendo também um artigo do Smashing Magazine sobre font-face.
Caso deseje saber sobre família de fontes, acesso o artigo Família de Fontes do site Maujor
Com informações de Bernard de Luna
Olá! Sou Fábio Bmed — fundador da Metapax, consultoria estratégica de posicionamento e crescimento para negócios, e criador da MapexMind, um método de neuropsicologia aplicada voltado à compreensão prática da mente humana. Também sou o criador do blog FabioBmed.com.br.
Desde 2006 trabalho com tecnologia, marketing digital e análise de sistemas complexos. Mas os sistemas que mais me fascinam hoje são os que carregamos dentro da cabeça.
Estou entrando na psicologia, com foco em neuropsicologia — a ciência que explica por que você pensa, decide e se comporta do jeito que faz. Essa transição não é um desvio de rota: é a evolução natural de quem passou décadas entendendo como sistemas funcionam — e percebeu que o mais complexo de todos ainda estava por ser mapeado.
Ao longo dessa trajetória, criei dois projetos que sintetizam essa visão.
A Metapax nasceu da percepção de que negócios não crescem por acaso. Crescem quando existe uma estrutura clara de autoridade, presença e experiência do cliente. Depois de mais de duas décadas liderando operações digitais e analisando padrões de crescimento empresarial, transformei esse entendimento no Método APA — Autoridade, Presença e Atendimento — aplicado a empresas e profissionais que querem crescer com previsibilidade e posicionamento sólido.
Já a MapexMind surgiu de outro tipo de investigação: entender a arquitetura da mente humana. O projeto aplica neuropsicologia à vida real para ajudar pessoas a compreenderem padrões emocionais, cognitivos e comportamentais — próprios ou de quem amam — traduzindo conceitos complexos em clareza prática e utilizável.
No fundo, os dois projetos partem da mesma pergunta:
Como sistemas funcionam por trás da superfície?
Negócios, comportamento, decisões, relações humanas, tecnologia, marketing e mente — tudo aqui é analisado pelo mesmo prisma: estrutura, padrões e a ciência por trás de como as coisas realmente funcionam.
Este blog é o ponto de encontro dessas áreas. Um espaço onde tecnologia, psicologia, neurociência, comportamento humano, marketing e filosofia prática deixam de ser assuntos separados e passam a conversar entre si.
Publicação Criada em: abril 5, 2012
Atualizado em: março 16, 2025 9:34 pm
Atualizado em: março 19, 2025 1:24 pm
