#css #google-chrome #fonts #google-fonts
Вопрос:
3 дня назад из ниоткуда я заметил, что некоторые сайты, которые я создавал до использования шрифта «Open sans» из шрифтов Google в качестве основного шрифта, выглядят странно, прерывисто и неровно в Chrome.
Я попробовал несколько исправлений, начиная с настройки ClearType в Windows и заканчивая отключением флагов (ускоренный 2d холст) и отключением аппаратного ускорения в Chrome, в значительной степени перепробовал все, что смог найти в Интернете, и ничего не работает.
Я также попытался удалить «Open sans» из папки шрифтов Windows, но шрифт по-прежнему выглядит неровным на моих сайтах. Это было прекрасно в Photoshop до того, как я его удалил.
Это скриншот того, что я сейчас вижу.
открыто без странного поведения
p Тег использует простой CSS для тестирования
font-family: 'Open sans';
font-size: 12px; / 20px (on the bellow paragraph)
font-weight: 700; / 400 (on the bellow paragraph)
-webkit-font-smoothing: antialiased;
В стиле у меня есть значение по умолчанию @import url(‘https://fonts.googleapis.com/css2?family=Open Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800amp;display=swap’); из шрифтов Gooogle.
Может ли кто-нибудь пролить свет? Любая помощь будет признательна. Я действительно не хочу форматировать свой компьютер только из-за этого проклятого глючного шрифта. Также тестировался на Edge и Opera GX, и на них это тоже происходит.
Комментарии:
1. Я могу подтвердить, что я тоже это вижу. Некоторые размеры хуже, чем другие — при 20 пикселей изогнутые заглавные буквы, такие как D, C и G, представляют собой полный беспорядок. Я не могу предоставить веб-сайт клиенту, который выглядит так плохо.
2. да, цифры тоже выглядят странно, я понятия не имею, что делать
3. Если это поможет, мы пока остановимся на Roboto, он был достаточно похож для наших целей.
4. я хотел бы что-то изменить, но у нас почти 700 сайтов, использующих стандарт open sans, выбор шрифтов для переключения нежизнеспособен, но так как это моя проблема с компьютерами (у моих коллег нет проблем с рендерингом), я просто забуду об этом it…it это чертовски раздражает, но я ничего не могу поделать, перепробовал все
5. Это определенно происходит. Я удивлен, что в Интернете больше ничего об этом нет, но это единственное упоминание, которое я смог найти (так что, по крайней мере, я знаю, что это касается не только нас). Кажется маловероятным, что Google не знает об этом, но, возможно, на самом деле они этого не знают. Есть ли какой-нибудь способ сообщить им об этом? Я не могу представить, что это сделано намеренно или что-то такое, что должно потребовать обходного пути.
Ответ №1:
Вы должны быть уверены, что он открыт без. Вы можете проверить это с помощью плагина whatfont
Комментарии:
1. установил плагин, и да, он распознает шрифт как Open Sans, кстати, хороший плагин
2. можете ли вы дать мне ссылку или демо-версию? Может быть, я найду ошибку. также вы можете попробовать добавить 1-2 пикселя. У меня была аналогичная ошибка с размером шрифта: 13 пикселей, но с размером шрифта: 14 пикселей все было в порядке.
3. это тест, который я связал как изображение в посте vivarte.com.br/teste.html дело в размере шрифта, у меня есть почти 700 модельных сайтов plataforms, которые мы используем для клиентов на онлайн-аукционах, а размер текста меню составляет 12 пикселей, я действительно не могу позволить себе его изменить… но я думаю, что проблемы возникают только на моем компьютере, все остальные говорят, что сайты нормальные, я вроде как хотел исправить свою проблему, но я так много сделал, и ничего не работает, я сдаюсь
Ответ №2:
Я также столкнулся с той же проблемой, используя открытые Sans шрифтов Google, как с помощью @import метода, так и <link> с помощью метода. Протестировал это против Brave (версия 1.30.89 Chromium: 94.0.4606.81), Chrome (94.0.4606.71) и Firefox (93.0). Он проявляет эту зернистость на fonts.google.com демонстрационный сайт размером 18-20 пикселей, но при 16 или 21 пикселей проблема отсутствует.
Интересно, что версия Open Sans для шрифтов Adobe не демонстрирует этой проблемы, она четкая и сглаженная во всех размерах. Вместо этого я поменял свою реализацию Google <link> на реализацию Adobe и столкнулся с той же проблемой.
Однако проверка демо-версии Adobe показала, что они также добавили свойство CSS: font-feature-settings: 'calt', 'clig', 'kern', 'liga', 'locl', 'rlig'; . Это функции OpenType, и добавление этого в мои стили, похоже, решает проблему, но только для реализации Adobe; это не решило проблему с версией Google. Возможно, в версии Open Sans от Google отсутствуют эти дополнительные функции.
Комментарии:
1. омг, спасибо, даже если для меня все еще доступны открытые шрифты от google, использование ссылки от adobe совершенно нормально, я просто переключусь на adobe, пока шрифты Google не будут в порядке, чтобы я мог использовать их снова. Спасибо!
Ответ №3:
У меня была похожая проблема, а именно. Открытые Sans выглядели нервно на нашем веб-сайте (точно так, как показано на скриншоте)
Проблема была (в некотором роде) решена, когда я использовал версию Adobe Open-Sans, как было предложено в комментариях.
Наконец, я обнаружил, что в нашем CSS мы использовали вес шрифта (300), который мы не импортировали из шрифтов Google.
При добавлении все работало гладко, поэтому мы вернулись к шрифтам Google.