Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
3_USE_-_Urok_03_2015.pdf
Скачиваний:
9
Добавлен:
07.03.2016
Размер:
2.86 Mб
Скачать

Веб-сервисы по подключению шрифтов.

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

Сервис Google Web Fonts предназначен для быстрого и удобного подключения шрифтов на веб-страницу. Позволяет использовать несколько сотен бесплатных оптимизированных для веба шрифтов. Есть, кстати, и кириллические шрифты.

Работа с Google Web Fonts предельно проста. Слева, в боковой колонке, можно с помощью фильтров выбрать нужные категории шрифтов (доступны serif, sans-serif, display и handwriting), а также ограничить выбор по зна-

чениям толщины, наклона и ширины. Также огромное значение имеет выбор опции Script, т.е. набора символов.

Как видно на рисунке, я ограничил набор шрифтов довольно жесткими критериями (sans-serif, кириллица, наклонный) и получил всего 5 вариантов на выбор.

Для выбора одного из них нужно кликнуть по кнопке Quick use возле нужного шрифта (или Add to Collection, если вы собираетесь выбрать несколько шрифтов). На открывшейся странице вы сможете выбрать начертания, которые вас интересуют, а также ограничить

Использование электронных шрифтов в веб-дизайне Урок 3 Веб-типографика Юзабилити и эргономика веб-страниц

наборы символов для уменьшения веса, после чего получите три способа вставки этого шрифта на свою страницу:

1.Добавляете подключение дополнительной таблицы стилей к своему документу:

2.Можно импортировать эту таблицу стилей:

3.Продвинутый вариант — через Java Script Заметьте, что исходный файл шрифта вы

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

Что же делать, если у вас иная ситуация? У вас есть права на использование определенного шрифта (или вы его автор), но он у вас есть только в одном формате. Скорее всего, это, TrueType. Тут на помощь придет сервис http:// www.fontsquirrel.com/fontface/generator. Здесь можно конвертировать шрифт в те самые форматы, которые мы рассмотрели чуть выше.

Использование электронных шрифтов в веб-дизайне Урок 3 Веб-типографика Юзабилити и эргономика веб-страниц

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

1.Basic — если Вас интересует минимальный вес и скорость загрузки

2.Optimal — оптимальное соотношение веса и качества конвертации

3.Expert — если есть желание повозиться с настройками (см. рисунок). В этом режиме вы можете сформировать себе точный набор символов, а также много всего прочего.

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

Самое главное, что после того, как вы определитесь с настройками, вы скачаете не только набор с конвертированными шрифтами, но и готовый набор CSS-кода для вставки в проект. Таким образом, особо вникать в тонкости задания свойств в правиле @font-face не всегда нужно.

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

Настройки уровня Expert (для удобства на иллюстрации длинное окно разделено на две части)

Использование электронных шрифтов в веб-дизайне Урок 3 Веб-типографика Юзабилити и эргономика веб-страниц

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

Эти соображения, конечно же, волнуют верстальщика. А что нужно понимать дизайнеру?

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

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

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

Использование электронных шрифтов в веб-дизайне Урок 3 Веб-типографика Юзабилити и эргономика веб-страниц

Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]