Нет нужного шрифта, что делать?
Мой Телеграмм-канал "Умный Лендинг"
Во всех примерах, которые мы приводили выше, были использованы шрифты, которые есть в базовом наборе. Чтобы их поменять, нужно перейти в настройки сайта и выбрать шрифт из списка. Но кроме этого, на Тильде можно подключить абсолютно любой шрифт.
# Где купить шрифты или найти бесплатные
На Тильде можно подключить шрифт пятью способами:
- Выбрать из тех, которые есть в настройках. Там присутствует 13 хороших шрифтов из открытых источников.
- Если ни один шрифт вас не устраивает, то можно загрузить свой файл шрифта. В этом случае его нужно где-то взять, например, купить на:
Цена примерно $19/29/49 за одно начертание, встречаются дешевые по $2, есть такие, которые стоят $89. В некоторых наборах иногда есть бесплатные. Любой шрифт для веба можно протестировать на своем сайте в течение 30 дней.
Система подписки. Есть бесплатный план (3 000 шрифтов), платные тарифы от $5 до $100 в месяц.
Цена 2100-3500 руб.
3. Подключить через Adobe Typekit. Это библиотека шрифтов.
- Бесплатный тарифный план: 940 шрифтов.
- Платный стоит $49 в год и дает доступ к 5 660 шрифтам.
- Доступ к тем же 5 660 шрифтам имеют подписчики Adobe Creative Cloud. Если вы платите за Creative Cloud, платить за Typekit дополнительно не нужно.
4. Использовать Google Fonts. Шрифты бесплатные.
5. Загрузить свой CSS файл.
# Список хороших шрифтов, в которых есть кириллица
Futura PT
Proxima Nova
Franklin Gothic
Graphic
# Где это все купить?
- Futura. Где купить: myfonts.com/fonts/paratype/futura-book
- Proxima Nova. Где купить: myfonts.com/fonts/marksimonson/proxima-nova
- Franklin Gothic. Где купить: myfonts.com/fonts/itc/franklin-gothic
- Graphik. Где купить: type.today/ru/Graphik
- Museo. Где купить: myfonts.com/fonts/exljbris/museo-sans
- Gotham. Где купить: typography.com/fonts/gotham
- GT Walsheim. Где купить: grillitype.com/typefaces/gt-walsheim
- Helvetica Neue. Где купить: myfonts.com/fonts/linotype/helvetica-neue
- 21 Cent. Где купить: myfonts.com/fonts/letterheadrussia/21-cent
- 20 Копеек. Где купить: yurigordon.com/ru/shop/fonts/20kopeek
# Как обеспечить читабельность текста
Какой бы шрифт вы не выбрали, он должен хорошо читаться. Особенно, если вы используете фоновую фотографию. Если поставить тонкое начертание на фотографию с мелкими деталями, текст читаться не будет. Всегда обращайте на это внимание.
Что можно сделать? Во-первых, использовать фото, подходящее для фона: с крупными, однородными элементами. Во-вторых, приглушить фотографию с помощью фильтра, она станет ровнее и текст будет читаться лучше. В-третьих, можно у конкретного блока увеличить насыщенность, применяя «инлайновый стиль». Это значит, что вы задаете настройки не для всего сайта, а только для части текста. Нужно выделить текст и задать параметры через редактор.
Стиль, который применятся таким образом, поверх глобальных настроек, всегда будет приоритетным. Поэтому, если вдруг вы меняете параметры шрифта в настройках сайта, а изменения не видны, значит в этом месте применен «инлайновый стиль». Чтобы его убрать, нужно выделить текст и нажать иконку «очистить».
На этой обложке текст почти не читается. Чтобы это исправить, нужно взять фотографию, на которой не так много мелких деталей. В данном случае (на фото ниже) еще добавлен синий фильтр 40% и увеличена насыщенность шрифта.
Если тема выбора шрифта вам интересна, найдите хорошие сайты, близкие к вашему проекту, и посмотрите какие шрифты они используют. Определить это поможет расширение для браузера What Font.
Также можно заглянуть на независимый архив типографики http://fontsinuse.com/ — ресурс на котором собраны и рассортированы образцы вебсайтов и печатных изданий по типу использованного шрифта.
Удачи вам в поиске классных шрифтов для ваших проектов!
Что будет завтра? Я расскажу о том, как понять, что ваш сайт устарел.
А если у вас есть горячее желание пообщаться со мной, задать вопросы, попросить посмотреть ваш лендос или Телеграмм-канал, а также рассказать, какая тема вам интересна и вы хотели бы почитать что-то по ней, то милости прошу к нам в чат.
До завтра!