картинка к статье про подключение шрифтов в Adobe Muse

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

Типы шрифтов и добавление Typekit

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

Чтобы добавить шрифт, кликаем «Добавить веб-шрифты», открывается палитра Typekit (библиотека Adobe Muse, которая подключает нестандартные шрифты, отображающиеся в виде текста). Находим нужный шрифт здесь, и он автоматически подгружается. Теперь выбираем его в библиотеке со шрифтами, он загружается к проекту. Теперь выбираем его в разделе «Веб-шрифты». Многие шрифты не поддерживают кириллические символы. Внизу я прикрепил таблицу со шрифтами, которые поддерживают кириллицу. Используйте ее и ни в коем случае не используйте шрифты, которые экспортируются в виде картинки. Они никак не индексируются поисковиками.

Как подключить Google Fonts

На сайте Google fonts,  отфильтруйте шрифты по скрипту, выберите только кириллическое начертание. Если вы хотите использовать нестандартный шрифт, добавьте его в коллекцию «add to collection» нажмите « use», выберите нужные начертания. Из пункта «3. Add this code to your website»  скопируйте код и вставьте в Adobe Muse в свойства страницы в html для head. Перейдите на новую строчку, нажмите Enter и напишите следующее: <style> Н1 {в скобках копируем всё из раздела «4»}< /style>.  Нажимаем ОК и выделяем текст, который редактируем и пишем что это H1 (заголовок). Таким образом мы указали соответствие между двумя заголовками.

Как подключить свой шрифт

Что бы установить в Adobe Muse шрифт со своего компьютера сначала скачайте его. Я рекомендую паблик Вконтакте. Здесь в меню выбираете кириллицу, выбираете подходящий шрифт и скачиваете.У большинства шрифтов есть правообладатель, но существуют и бесплатные, которые можно использовать в том числе и в коммерческих целях. Советую внимательно подходить к авторскому праву.

После загрузки, установите шрифт. На Mac и PC нажимите на кнопку «Установить шрифт». Нам нужно, что бы он установился в нескольких форматах. Для этого используй Online font converter Перенесите сюда шрифт в  ttf формате. Нужно сделать формат eot, svg ,woff. Кликните на эти форматы, они конвертируются,  после чего кликните на соответствующие кнопки. Сохраните. У вас получится 3 архива, каждый распаковываете и забираете нужные файлы. Открываете Adobe muse и, выбрав инструмент «текст», набираете текст и идете в раздел «добавить веб-шрифты». В данном случае нам нужны локальные веб-шрифты. Нажимаете «добавить шрифты». Появляется окошко, где можно либо выбрать папку, либо перетащить файл. Я предпочитаю перетаскивать файлы. Выделяем нужные и перетаскиваем сюда. Нажимаю «Данные шрифты лицензированы» и «Продолжить». Появилась галочка, значит шрифт установился.

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

Задание

  1. Скачайте исходный файл проекта.
  2. Попробуйте протестировать работу с Google Fonts
  3. Подключите свой шрифт к сайту и научитесь на его основе делать конвертацию шрифтов в Adobe Muse.

Выкладывайте в комментарии, что у вас получилось.