Я видел, что некоторые веб-сайты используют @font-face, но они выглядят жутко и без сглаживания. Но некоторые другие веб-сайты используют некоторые шрифты с очень высоким качеством, я не знаю, используют ли они OTF или TTF или SVG или что именно, Это пример.
Я изучил их источник, но есть 4 типа шрифтов, и я не могу понять, какой из них используется.
Спасибо
На качество отображения шрифта влияют три фактора:
В заключение: веб-шрифты по-прежнему являются темным и загадочным искусством. Неизменно, будут незначительные различия. Найти хорошо построенный шрифт и протестировать его в целевых браузерах. Я думаю, что мы все еще очень много в фазе проб и ошибок с @font-face, но есть хорошие ресурсы, чтобы помочь на этом пути.
Если вы хотите использовать специальный шрифт в Интернете, выбор формата в значительной степени сделан для вас браузерами, и вам понадобятся EOT, WOFF, TTF и SVG.
Сайт, подобный FontSquirrel, предоставит руководство, а также сами файлы шрифтов.
Когда дело доходит до Windows, встроенные шрифты с использованием @font-face визуализируются с помощью ClearType ON.
Попробуйте этот радикальный эксперимент: поверните ClearType OFF и перепроверьте рендеринг шрифтов.
Хотя это кажется бессмысленным (должно произойти обратное), вы должны найти шрифты теперь выглядят гладкими и естественными.
Это происходит для меня, и я могу предоставить доказательства, если это необходимо. Одна и та же веб-страница будет отлично работать в Linux, Mac и т.д., Не выполняя никаких таких операций на уровне ОС. Yay Windows.
Я все еще пытаюсь определить, как это работает, потому что, очевидно, вы не можете спросить всех, кто смотрит на ваш сайт, который использует Windows, чтобы отключить ClearType, чтобы ваши шрифты выглядели хорошо.
Качество шрифта во многом зависит от того, как преобразуются шрифты. Вы можете удалить вещи, которые влияют на сглаживание и качество, например, кернинг, чтобы сохранить размер файла, который многие люди делают. Чем лучше внешний вид, тем больше размер. Другим фактором, который входит в шрифты, является ОС хоста. У них есть определенные способы сделать то, что может повлиять на способ отображения шрифтов.
Кроме того, это просто случайный случай, но вы можете выбросить его в свой код:
text-shadow: transparent 0 0 1px;
Это улучшит сглаживание, хотя и только в Google Chrome.
Я делал некоторые эксперименты со сложным шрифтом в разных браузерах при создании веб-сайта. Я обнаружил, что без исключения Firefox и Chrome просто не отображают шрифт хорошо, независимо от формата. В любом случае IE был ограничен. И удивительно, что Opera делает лучшую работу. Честно говоря, изменение формата просто не имело большого значения. В целом, я думаю, что браузеры имеют значительный путь, когда дело доходит до создания сложных, запутанных шрифтов.