0

In regard to this topic ("How to prevent webkit text rendering during css transitions"), I was wondering why it isn't advised to have all elements anti-aliased?

For example take my website. Hover on the 'bekijk dit project' button (Dutch for 'Look at this project') and see the text above .. 'blink', move or any ugly effect.

That, as I learned by the topic, requires anti-aliasing.

So my main question is: Why don't we anti-alias everything?

* {
  -webkit-font-smoothing: antialiased;
}

Update:
Apparently the above method does not disable the blink effect. However, the code below does.

* {
  -webkit-transform: translateZ(0px);
}

It disables a bit of the legibility, if you ask me. Therefor I'd combine it with -webkit-font-smoothing: subpixel-antialiased

Community
  • 1
  • 1
Sander Schaeffer
  • 2,757
  • 7
  • 28
  • 58

1 Answers1

3

anti-aliasing is not the perfect method for font-smoothing.

According to this article,

Feel free to use it on light text on dark backgrounds, feel free to use it to fix custom font rendering on Windows or to style specific bits of text on the page to make it look more slender, but for main portions of text where readability is paramount please leave the default setting alone and let the operating system handle the smoothing.

Avijit Kumar
  • 538
  • 2
  • 9