Нужны ли eot, ttf и svg в объявлении шрифта?

Ответ 1

Октябрь 2018 года редактировать

tl;dr: используйте только WOFF2, каждый поддерживаемый браузер поддерживает его, конец.

Оригинальный ответ

Краткий ответ: нет.

EOT имеет отношение только к IE8 и ниже (хотя и как пустяки: вплоть до IE4. IE на самом деле был пионером веб-шрифтов) и SVG-шрифтов как технологии (не путать со шрифтами OpenType с SVG-контурами) были заброшены (в начале 2015 года), поскольку ограничения стали безумными, как только стали доступны реальные веб-шрифты. Начиная с 2016 года вам просто нужен ВОВФ. И WOFF2, если вы хотите воспользоваться более новой лучшей версией WOFF, которая только стала рекомендацией w3 (на момент этого ответа).

Чтобы упростить задачу, с 12 января 2016 года Microsoft прекратила поддержку IE8 и ниже с ограниченной поддержкой IE9: теперь они будут поддерживать только последний доступный браузер для каждой из поддерживаемых ОС, то есть IE9 больше не поддерживается для Windows XP, потому что сама XP больше не поддерживается, но технически все еще поддерживается, до тех пор, пока Vista SP2 и Server 2008 R2 не достигнут конца расширенной поддержки в 2017 и 2020 годах соответственно. Конечно, для Windows Server 2008 поддержка веб-шрифтов не имеет значения, и большинство компаний, которые все еще используют старую версию Windows, пропустили Vista, либо на Windows XP (на свой страх и риск), либо на Windows 7 (которую мы вполне можем ожидать стать Windows 10, выпущенная в июле 2016 года, 29-я из которых является последней датой, когда пользователи могут обновиться с 7/8.1 (но не с 8-го до 10-го бесплатно).

(Апрель 2017 г., редактирование: в этом месяце Windows Vista SP2 вышла из поддержки, и поэтому IE9 официально больше не поддерживается)

Что касается TTF/OTF, вы не хотите использовать их онлайн больше, чем хотите использовать изображения TIFF, а не JPG или PNG: даже если WOFF "просто" тонкая оболочка вокруг данных TTF/OTF, WOFF/WOFF2 позволяет сжимать данные, а обычный OpenType - нет.

Кроме того, TTF/OTF являются универсальными (для систем, которые поддерживают OpenType) шрифтов, и поэтому более тщательно проверяются на предмет корректности, особенно в версиях IE. Используя WOFF, который в качестве типа файла делает это явным, это W eb (O ручка) F ont (F ormat), менее строгая форма проверки означает, что некоторые шрифты, которые могут не пройти проверку системы OpenType, могут по-прежнему работать как веб-шрифты (из-за того, что не все необходимые для универсальности данные OpenType необходимы для того, чтобы шрифт работал просто веб-контекст).

Наконец, вы получаете выбор в форматах WOFF: Формат 1, который называется просто WOFF, является более старым форматом и использует сжатие на основе deflate, аналогично сжатию PNG; и Формат 2, называемый WOFF2, является более новым форматом со сжатием, основанным на алгоритме brotli, и также позволяет "разделять" шрифт на отдельные файлы для оптимизированной доставки при работе со шрифтами Юникода, которые поддерживают несколько языков. Вам не нужны все файлы одновременно, поэтому доставляйте только те файлы, которые охватывают диапазоны Юникода, необходимые для конкретной страницы, и вы уменьшаете размер страницы и время загрузки на немного больше.

В заключение: ура для продвижения вперед, просто используйте WOFF (или WOFF2).

И, конечно же, не забудьте указать формат ваших источников @font-face, используя значение format().

Ответ 2

Я решил опубликовать свой собственный ответ на этот вопрос по двум причинам: в настоящее время принятый ответ слегка переусердствует об использовании стека шрифтов WOFF2 и WOFF в современных веб-разработчиках без упоминания других факторов, а также в значительной степени указывает на официальный конец срока службы. даты, которые не отражают, какие версии браузера на самом деле используются в реальном мире. В этом ответе я буду использовать CanIUse.com, который является отраслевым стандартом для отслеживания подобных вещей.

Поддержка WOFF2

WOFF2 во всех отношениях улучшает WOFF, поддерживается большинством настольных браузеров, выпущенных после 2014 года, но только с 2018 года начал поддерживаться большинством мобильных браузеров. Поддерживается примерно 93% браузеров по всему миру.

Поддержка WOFF

WOFF начал поддерживаться Internet Explorer в IE9 (выпущен в 2011 г.), что делает формат EOT устаревшим для версий IE, выпущенных с 2011 г. Он поддерживается примерно 97% браузеров во всем мире.

Другие настольные браузеры начали поддерживать WOFF примерно в то же время, включая Firefox начиная с Firefox 3.6, Chrome начиная с Chrome 5 и Safari начиная с 5.1 (выпущенные в 2010, 2011 и 2011 годах соответственно), что делает форматы TTF и OTF ¹ устаревшими в предыдущие версии. Большинство мобильных браузеров поддерживают WOFF с 2013 года.

Предостережение и выводы

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

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

Если вы решите, что это так, и вам требуется поддержка настольных браузеров старше 2011 года или мобильных браузеров старше 2013 года, используйте полный стек шрифтов: WOFF2, WOFF, TTF (или OTF) и EOT.

Если вам не нужно поддерживать эти древние браузеры, и все же верно, что вы, скорее всего, этого не сделаете, просто используйте WOFF2 и WOFF в качестве стека шрифтов.

_{(1) TTF и OTF - это традиционные форматы шрифтов рабочего стола, и любой браузер, поддерживающий один, поддерживает другой, поэтому никогда не используйте оба}

Ответ 3

Это скорее дополнение к 2019 году. На данный момент 18.09.2009 все еще широко используется IE11, не говоря уже о других более устаревших программах.

Таким образом, принятый ответ с наибольшим количеством голосов является неправильным, в нем последнее изменение не менее года назад, что вам нужен только woff2. По крайней мере, вам нужны как woff2, так и woff, и вам может потребоваться более универсальный вариант резервного копирования, даже если он менее идеален, как svg.

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

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

Ответ 4

Я думаю, что использование ttf достаточно для всех современных браузеров и устройств... Я сам проверил, например, firefox, chrome, opera, android mobile (kitkat, mashmallow) и iPhone (от 6 до 7 Plus). Кажется, TTF поддерживается всеми вышеупомянутыми устройствами.