Як вбудувати веб-шрифти на свій сайт за допомогою Typekit

Автор: Peter Berry
Дата Створення: 14 Липня 2021
Дата Оновлення: 13 Травень 2024
Anonim
Як вбудувати веб-шрифти на свій сайт за допомогою Typekit - Творчий
Як вбудувати веб-шрифти на свій сайт за допомогою Typekit - Творчий

Зміст

Для професійного дизайнера немає порівняння з використанням майстерно розроблених шрифтів, знайдених на Typekit. Ви маєте доступ до найвищого рівня веб-шрифтів від ливарних цехів, включаючи Adobe, FontFont, P22, Typodermic та Veer - і, звичайно, він тісно інтегрований у ваш робочий процес Creative Cloud. Ось як розпочати роботу за дев’ять простих кроків.

01. Увійдіть

Якщо ви підписалися на Creative Cloud, ви вже отримали підписку на Typekit на рівні плану портфоліо. Просто відвідайте www.typekit.com і ввійдіть, використовуючи Adobe ID, який ви використовуєте для входу в Creative Cloud. Тоді ви можете розпочати доступ до послуги та використовувати веб-шрифти.

02. Перегляньте бібліотеку


Бібліотека Typekit включає майже тисячу різних шрифтів, кожен класифікований відповідно до їх характеристик, використання та ваги. Швидко перегляньте, щоб переглянути повний вибір доступних шрифтів. Коли ви готові розпочати підбір шрифтів для свого сайту, перейдіть до наступного кроку.

03. Створіть новий комплект

Клацніть на спадне меню у верхньому правому куті сторінки та виберіть кнопку Додати новий комплект, щоб створити комплект, який працюватиме з вибраним доменним іменем. Далі введіть деталі домену, який ви збираєтеся використовувати, і натисніть кнопку Продовжити, щоб створити комплект.

04. Встановіть JavaScript

Typekit надає два рядки JavaScript, які потрібно встановити на кожну сторінку вашого веб-сайту, яка використовуватиме веб-шрифти. Додайте їх у розділ "голова"> на вашій сторінці, а не в область "тіло" - JavaScript потрібно завантажувати якомога раніше при завантаженні сторінки.


05. Виберіть шрифт

Вибравши шрифт, який ви хотіли б використовувати на своєму веб-сайті, наведіть курсор на попередній перегляд, щоб побачити різні способи використання вибраного шрифту. Деякі шрифти також доступні для використання на настільному ПК після того, як ви підписалися на бета-версію. Клацніть на посилання Використовувати шрифти, щоб продовжити.

06. Додайте до свого набору

У спливаючому модальному діалоговому вікні виберіть набір, до якого ви хочете додати шрифт. Ви також можете встановити прапорець, щоб надсилати сумісні шрифти на робочий стіл для використання в InDesign, Photoshop та Illustrator, а також інших робочих програмах. Вибір існуючого набору відкриє нове вікно.

07. Виберіть підмножину


Коли ви використовуєте шрифт в Інтернеті, ви надсилаєте вміст цього шрифту кожному відвідувачу веб-сайту. Це може стати досить важким, якщо у вас є повний набір ваг та символів. Typekit дозволяє вибрати підмножину ваг та символів, зменшуючи завантаження для кожного користувача.

08. Додайте класи та стеки шрифтів

За замовчуванням Typekit встановить для вас назву класу CSS, яку ви можете застосувати до елементів, щоб вони відображали тип у вибраному вами шрифті. Ви можете додати власні класи, використовуючи поле у ​​верхньому лівому куті редактора набору. Ви також можете вказати запасні шрифти в стеці шрифтів CSS, заповнивши форму внизу ліворуч.

09. Публікуй і йди

Після того, як ви зрадієте і додасте додаткові шрифти, які хотіли б використовувати на своєму веб-сайті, натисніть кнопку Опублікувати, щоб надіслати свій комплект в Інтернет для використання. Можливо, знадобиться кілька хвилин, поки ваш комплект стане доступним, після чого ви побачите, як ваш сайт робить чудовий текст на базі Typekit.

Ця стаття була спочатку опублікована в The Ultimate Guide To Adobe Creative Cloud.

А тепер прочитайте:

  • Дизайнери говорять про Creative Cloud від Adobe
  • Нові інструменти в Adobe Creative Cloud: 12 демонструючих відео
  • Безкоштовні дії Photoshop для створення приголомшливих ефектів
Захоплюючий
9 дизайнерських напрямків, що визначили рік повстання
Читати Далі

9 дизайнерських напрямків, що визначили рік повстання

Рік протесту, який розширив повноваження, побачив, що повстання у багатьох його формах впливає на мистецтво та дизайн, починаючи від моди та товарів, закінчуючи послугами та способом споживання. Він п...
Чудові ілюстрації роздягають персонажів фільмів до їх основних засобів
Читати Далі

Чудові ілюстрації роздягають персонажів фільмів до їх основних засобів

Культові фільми часто відзначаються своїми знаковими персонажами, декораціями та реквізитом. З цими фільмами поставляється безліч товарів та знакових предметів, які колись носили, належали або носили ...
Як створити лінійку, яка світиться
Читати Далі

Як створити лінійку, яка світиться

Як і більшість цифрових прийомів, це надзвичайно просто зробити, коли ти знаєш, як це зробити. Сподіваюся, я не вб'ю магію цим визнанням. Lineart можна зробити так, щоб він світився за допомогою ф...