Что может заставить веб-шрифт выглядеть по-разному в Windows и Mac?

Question

Я использую IBM Plex, загруженный из Google Fonts с:

<link href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans:100,100i,400,400i,700,700i" rel="stylesheet">

Я использую Bootstrap 4, и моя таблица стилей настройки (загруженная после bootstrap.min.css) говорит:

body {
  font-family: 'IBM Plex Sans', sans-serif;
}

Тем не менее, у меня постоянно меняется внешний вид, независимо от того, какой браузер я использую, между Mac:

и Windows 10:

Вес кажется другим, а высота символов не одинакова, даже если шрифт один и тот же.Как я могу убедиться, что версия для Windows больше похожа на версию для Mac?

Answer 1

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

Обычно наиболее безопасными шрифтами являются: Arial, Times New Roman, Helvetica.

Иногда для некоторых шрифтов я использовал эти свойства css для нормализации шрифтов, и они выглядят одинаково, но это зависит от шрифта:

-webkit-font-smoothing: antialiased; font-weight: normal;

Надеюсь, это поможет.