Поддержка сайта

Высокие позиции в поисковой системе, на прямую зависят от развития вашего сайта.

Продвижение сайтов

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

Создание сайтов

Мы делаем сайты быстро, недорого и профессионально. От работы с нами, у вас останутся только положительные эмоции.

Создание шрифтовых файлов раличных форматов: Pont Squirrel

.

Создание шрифтовых файлов раличных форматов: Pont Squirrel

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

Один из простейших способов — воспользоваться услугами автоматизированного сервиса Font Squirrel1. Он позволяет несколькими щелчками мыши выбрать шрифты на вашем компьютере и конвертировать их в TTF, EOT, WOFF, SVG, SVGZ и даже в кодировку Base642.

По умолчанию при генерации шрифтов для @ font -face предлагается вариант Optimal; однако, во многих случаях вы можете сильно уменьшить размер получаемых файлов, выбрав опцию

Expert и создав собственный набор символов. Вместо того чтобы включать в шрифт все мыслимые знаки, ограничьтесь теми, которые реально собираетесь использовать на сайте.

К примеру, на сайте HTML5 Herald шрифт Acknowledgement Medium используется только в рекламных баннерах и заголовках, и это дает нам возможность сократить набор символов. Весь текст, набранный этим шрифтом, идет в верхнем регистре, поэтому давайте уменьшим наш набор, оставив только заглавные буквы, знаки пунктуации и цифры, как показано на рис. 9.3.

Создание шрифтовых файлов раличных форматов: Pont Squirrel

Рис. 9.3. Создание собственного набора символов в интерфейсе генератора шрифтов Font Squirrel

Из рисунка 9.4 видно, насколько уменьшился размер по сравнению с исходным. Шрифт, состоящий только из заглавных букв, цифр и знаков пунктуации оказался на 25-30% меньше исходного набора символов. Font Squirrel даже позволяет включать в набор отдельные знаки, так что вам не потребуется загружать все буквы алфавита, если вы используете лишь некоторые из них.

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

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

Создание шрифтовых файлов раличных форматов: Pont Squirrel

Рис. 9.4. Размеры файлов шрифтов с сокращенными наборами символов заметно меньше

Для шрифта League Gothic набор символов нужен побольше. Этот шрифт используется для заголовков статей, которые тоже полностью в верхнем регистре, так что строчные буквы опять-таки можно опустить; однако мы должны принять во внимание, что для заголовков может потребоваться более широкий набор символов. Кроме того, пользователи могут использовать различные инструменты, например Google Translate, для перевода контента на разные языки — и в этом случае потребуется другой набор букв. Поэтому для League Gothic мы выберем Basic Subsetting — это набор символов, используемых в большинстве западных языков.

Основное правило при использовании @font-fасе — так минимизировать набор символов, чтобы версия, полученная в результате машинного перевода на основные языки, оставалась читаемой.

Поскольку вы выгружали ваш шрифт для обработки, то теперь, выбрав нужные установки, вы смело можете нажать на кнопку Download Your Kit. Обратно вы получите архив, состоящий из файлов шрифтов с требуемыми расширениями, демонстрационный файл HTML, где будет шрифт во всех начертаниях, а также таблицу стилей, из которой вы сможете скопировать нужный фрагмент и вставить его прямо в ваш файл CSS.

.

Читайте так же:
Not found