С чем связано отключение эффекта субпиксельного сглаживания шрифтов на сайте?

Question

[Александр]

Вопрос о рендеринге шрифта.
Дело в том, что на всех сайтах, если сделать скриншот, вставить в фоторедактор и приблизить, то будет видно что сглаживание шрифтов делается цветными пикселями.
Но у нас на сайте, когда приближаешь, сглаживание черно-белое. Из за этого появляется эффект блюра.
Мы ни с кем не можем понять почему так. Берем все свойства и настройки сайта, где все как надо, а у нас все равно черно-белое.

Answer 1

[Moskus]

"Цветные пиксели" - последствие использования в Windows технологии ClearType, она же - "субпиксельное сглаживание", subpixel antialiasing.
На втором скриншоте используется обычное сглаживание, не субпиксельное. Чтобы понять, как вы этого добились, нужно больше информации:
- смотрите ли вы свой сайт и другие сайты в одном и том же browser-е (на одном и том же компьютере),
- используете ли вы для своего сайта подключаемые web-шрифты,
- не используете ли какие-либо CSS-эффекты типа прозрачности или тени для вывода текста или самих блоков (а то я вот вижу что у вас в надписи "BMXАШКА" нет чистого черного #000000, вместо него - #010101)?

Ну и совет чуть в сторону - не используйте шрифты с засечками вроде Times для мелкого текста, он в любом случае будет плохо выглядеть.

Answer 2

[Adamos]

Видимо, тот шрифт, который у вас назначен этому тексту, браузер (кстати, вы только Хром пробовали?) растеризует, не используя виндовское радужное размыливание.
Кстати, почему сразу "блюр"? У меня шрифты настроены на растеризацию без графики, где тут блюр?


Хм. Скриншот почему-то заметно темнее того, что я вижу на экране... и даже при просмотре этой картинки. Движок сайта ее "улучшает", что ли?

Answer 3

[Александр]

Смотреть в разных браузерах пробовал, но субпиксельное сглаживание не появилось.
Шрифты не подгружаю.
CSS-эффекты не использую, цвет rgb(101, 101, 101).

явно указывать css -webkit-font-smoothing не помогает добиться эффекта.

Comments

[Moskus]

Для комментариев на ответы есть кнопка "Комментировать".
Посмотрите все же инспектором, что за стили назначены блокам с текстом. Нет ли там какой-нибудь CSS3-ерунды.

Answer 4

[Valery]

Может, к блоку с текстом где-нибудь применяется transform: translate3d?