5

Como resolver este problema no Firefox em relação a fontes ?
Infelizmente no Chrome fica suave e no Firefox serrilhado.

inserir a descrição da imagem aqui

3
  • Você não está sendo perfeccionista demais? Eu nem diria que o problema é do Firefox, e sim de resolução. Se abrir o site num smartphone, independente se no Chrome ou Firefox, a fonte ficará perfeita, já que a resolução seria "maior" no celular. O usuário final nem vai reparar nesse serrilhado. E outra, a forma de renderizar fonte no Chrome é diferente do Firefox, então não espere resultados iguais em tecnologias diferentes. "Anti-Aliasing" é uma gambi criada para compensar a baixa resolução. Abraço. Commented 1/04/2015 às 22:12
  • 1
    O font-smooth, para funcionar, só para sistema operacional Mac OSX: caniuse.com/#feat=font-smooth
    – user44090
    Commented 12/04/2016 às 18:11
  • 1
    Só pra constar, o "Antialiasing" tradicional é tecnologia obsoleta. Hoje se usa subpixel, considerando que praticamente todo mundo usa LCD. (chamado de Cleartype no windows). No screenshot está evidente que o Firefox está fazendo Antialias tradicional, e o Chrome subpixel, por isso a diferença. Pode ser um problema de configuração ou implementação. (pra quem não sabe o que é, basta ampliar a imagem da postagem e ver a diferença entre os dois lados. O Antialias é P&B, o cleartype é colorido)
    – Largato
    Commented 12/04/2016 às 18:17

2 Respostas 2

5

Entendendo a diferença do antialias tradicional para o ClearType

Veja sua imagem ampliada:

ampliacao do screenshot

Note que a imagem da direita tem pixels coloridos. Como o LCD não é formado por pixels de todas as cores, mas sim pequenos retângulos vermelhos, verde e azuis um do lado do outro, esta diferença de posição é usada para simular mais pixels horizontais (a maior parte dos LCDs para monitores é organizada horizontalmente).

O Antialias, por sua vez, faz apenas uma interpolação de pixel inteiro, tendo 3 vezes menos resolução que ClearType (entretanto, não fica com artefatos coloridos nas letras).


Habilitando ClearType no FireFox:

O FireFox por padrão usa Antialias, em vez do ClearType (subpixel rendering).

Esta extensão permite você habilitar o recurso:

https://addons.mozilla.org/en-US/firefox/addon/anti-aliasing-tuner/

Se preferir, pode digitar about:config no campo de endereços e configurar manualmente as opções de ClearType, que fazem parte deste grupo:

gfx.font_rendering.cleartype_params

Porém, está sujeito a bagunçar mais o navegador do que resolver o problema.

4

É comum, que alguns browsers não exibam a fonte com anti-aliasing.

Conheço 3 alternativas com CSS3. Declarações:

transform: rotate (-0.0000000001deg);

text-shadow: 0 0 1px rgba(0,0,0,0.3);

font-smooth: always;

Fonte (Em inglês): https://gist.github.com/dalethedeveloper/1846552

2
  • Cara eu tentei os 3 modos mas não ficou legal :( Commented 1/04/2015 às 17:59
  • O font-smooth: always; não funciou Commented 1/04/2015 às 18:00

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .