Про старые IE, EOT и CSS3111

  • 18.05.16
  • 18:22
  • 6833
  • 0

Проблема: шрифт, преобразованный в формат EOT, не воспринимается браузерами IE6-8, а IE9+ выдают ошибку вида "CSS3111: В @font-face обнаружена неизвестная ошибка.":

CSS3111: В @font-face обнаружена неизвестная ошибка.

В некоторых случаях проблема обусловлена конфликтом названий шрифта и гарнитуры, и решить её удаётся их коррекцией.

IE11 в режиме совместимости 8: CSS3111 с "ABC Font Bold"

Суть в следующем: название EOT-шрифта должно начинаться с имени гарнитуры (семейства шрифта). Т. е. если гарнитура имеет вид 'ABCFont', то название 'ABCFont Bold' будет корректным, а 'ABC Font Bold' — нет. Во втором случае IE выдаст ошибку.

Обе строки находятся в заголовке EOT-шрифта, куда копируются конвертирующей программой из исходного файла. Исходный шрифт часто имеет два названия: техническое и человекочитаемое. Какое именно возьмёт конвертер и будет ли он проводить какую-либо коррекцию — зависит от конвертера. Применяемый ниже ttf2eot использует человекочитаемое название и никаких коррекций не выполняет.

Для коррекции названий можно воспользоваться fontforge. Последовательность действий такова:

  1. так должны выглядеть имена шрифта и гарнитуры открыть исходный шрифт (не EOT) в fontforge;
  2. выбрать в меню «Элемент» пункт «Информация о шрифте» (или нажать Ctrl+Shift+F); на вкладке «PS Names» отредактировать графы «Гарнитура» и «Читаемое название» — название должно начинаться с точного имени гарнитуры;

    Замечание: это срабатывает с ttf2eot. Для какого-либо другого преобразователя может потребоваться исправить графу «Название шрифта».

  3. диалог экспорта в TTF экспортировать шрифт в TTF — в меню «Файл» выбрать «Создать шрифты» (или нажать Ctrl+Shift+G);

    Замечание: не следует заменять существующий TTF — этот формат не является для fontforge нативным, поэтому шрифт может как-нибудь пострадать.

  4. преобразовать полученный TTF в EOT:
Полезные ссылки:
  1. Конвертер ttf2eot. Для его сборки может потребоваться в OpenTypeUtilities.cpp вписать #include <stddef.h> рядом с подключением string.h, если возникнут ошибки в отношении макроопределения offsetof(3).
  2. Редактор шрифтов fontforge. С его помощью можно также преобразовать шрифт в TTF, OTF, WOFF, SVG и некоторые другие форматы. В EOT — нельзя.
  3. Полезный пруф про именование в шрифтах OpenType, в частности раздел «Name IDs»: «имя ID 4 (полное имя шрифта) есть комбинация строк ID 1 (гарнитура) и ID 2 (стиль) _или_ аналогичного человекочитаемого варианта» — думаю, что «или» тут относится только к ID 2, хотя понять можно и иначе (и получить CSS3111).
  4. Спецификация формата EOT.
  5. Онлайн-конвертер, умеющий преобразовывать в том числе и в EOT. Выдаваемый им EOT полностью — байт в байт — соответствует выдаче ttf2eot (на момент публикации данной заметки).

P.S.: имена всех упомянутых шрифтов изменены; любые совпадения с названиями реальных шрифтов ненамеренны и являются случайностью. Для экспериментов должен подойти любой [кириллический] шрифт, воспринимаемый fontforge и скорректированный описанным способом.

Оставить комментарий

Добавить комментарий