Какие файлы шрифтов мне нужны для современных браузеров, Android и IOS?

У меня есть эти файлы шрифтов:

@font-face { font-family: 'FontAwesome'; src: url('@{fa-font-path}/fontawesome-webfont.eot') format('embedded-opentype'), url('@{fa-font-path}/fontawesome-webfont.woff2') format('woff2'), url('@{fa-font-path}/fontawesome-webfont.woff') format('woff'), url('@{fa-font-path}/fontawesome-webfont.ttf') format('truetype'), url('@{fa-font-path}/fontawesome-webfont.svg fontawesomeregular') format('svg'); // src: url('@{fa-font-path}/FontAwesome.otf') format('opentype'); // used when developing fonts font-weight: normal; font-style: normal; } 

Только они отвечают моим потребностям:

 @font-face { font-family: 'FontAwesome'; src: url('@{fa-font-path}/fontawesome-webfont.eot'); src: url('@{fa-font-path}/fontawesome-webfont.woff2') format('woff2'), url('@{fa-font-path}/fontawesome-webfont.woff') format('woff'), url('@{fa-font-path}/fontawesome-webfont.ttf') format('truetype'); font-weight: normal; font-style: normal; } 

Разве только woff и woff2 отвечают моим потребностям?

Solutions Collecting From Web of "Какие файлы шрифтов мне нужны для современных браузеров, Android и IOS?"

Вам просто нужно WOFF . И вот почему:

  • eot устарел на некоторое время, но на самом деле устарел сейчас, когда Microsoft поддерживает только «последнюю версию IE для поддерживаемых версий Windows» , поэтому это означает IE11 и EDGE. Они поддерживают WOFF просто отлично. И обратите внимание, что все, что старше Windows 7, уже не поддерживается (Windows Vista SP2 по-прежнему поддерживалась корпоративными корпоративными лицензиями во время этого ответа, но с тех пор также достигла конца жизни).
  • svg был оставлен много лет назад . Это была интересная идея, но на практике она оказалась плохой, потому что она была смехотворно огромна по сравнению с реальными шрифтами и не имела особенностей, которые имеют решающее значение для достойной типографии. Практически все браузеры, которые поддерживали его в какой-то момент в прошлом, с тех пор удалили эту поддержку снова (так плохо было). Единственные два браузера, которые все еще поддерживают шрифты svg также поддерживают WOFF, поэтому нет причин для обслуживания обоих.
  • otf и otf являются шрифтами OpenType (оба они отличаются расширением по историческим причинам, но если вы не создаете шрифты, различия между ними существенно неактуальны), которые предназначены для универсального использования системы. Как установка на компьютер или отправка на современный принтер для создания физических документов. Как таковой. У них есть много бит и бит, которые им нужно поддерживать (спецификация довольно большая), многие из которых на самом деле не так важны, если вы просто показываете веб-страницу на экране. WOFF позволяет уйти с некоторыми упрощениями в шрифте OpenType, и каждый браузер, поддерживающий общий Opentype, также поддерживает WOFF. Так снова: просто используйте WOFF.

Дело в том, что WOFF – это байтовая байтовая оболочка вокруг шрифтов OpenType, но с (необязательным) сжатием без потерь, чтобы шрифт был меньше, что ускоряло передачу с сервера клиенту и указывает, что шрифт Предназначен только для использования в Интернете, что означает, что некоторые требования, которые шрифт абсолютно необходимо встретить, чтобы считать законным шрифтом в универсальной системе типов, ослаблены, поэтому можно сэкономить несколько данных.

Я знаю, что Font Squirrel и другие сайты все еще генерируют «имеют каждый формат, который когда-либо существовал!» Вроде шрифтов CSS, но это 2017 год, и нам просто больше не нужны эти огромные наборы. Несмотря на то, что три года назад эти наборы были лучшими (с использованием «пуленепробиваемого» подхода к CSS в ландшафте браузера, который был сильно фрагментирован, когда дело касалось веб-сайтов), сегодня эти пакеты совершенно не нужны. Все поддерживает WOFF.

«Как насчет WOFF2?»

WOFF2 является пересмотром спецификации WOFF , с новым алгоритмом шифрования с более высоким без потерь для вида двоичных данных, которые вы найдете в Интернете (WOFF2 использует brotli , а не «deflate» WOFF), поэтому, если браузеры, на которые вы нацеливаете поддержку Это: отлично. Но сначала проверьте http://caniuse.com ; Есть много браузеров, которые пока не поддерживают его, особенно на популярных платформах (IE в IE и Safari от Apple не поддерживают WOFF2 прямо сейчас. IE в конечном итоге, но Safari … кто знает)

«Как насчет того, что шрифты Google, используемые подмножеством, когда я прошу WOFF2?»

Действительно, WOFF2 также позволяет загружать «один шрифт» в кусках, указывая, как должна работать загрузка подмножества символов, чтобы вы могли загружать столько же шрифта, сколько вам необходимо для поддержки локалей ваших пользователей. Однако, если вы не запустили веб-сайт, который должен быть доступен в нескольких разных локализованных версиях, предназначенный для определенных рынков на этой планете на их родном языке, или вы используете сайт, который учит различным языкам, все из которых должны быть оформлены с использованием того же (Что маловероятно), это почти не имеет к вам отношения.