Красивый шрифт для: Красивые шрифты онлайн | Написать текст и скопировать

Семейство Helvetica Now доступно в 48 весах от Light Micro до Extra Black Display с соответствующим курсивом.

Многие известные бренды используют Helvetica, от системы метро Нью-Йорка до корпоративных гигантов.

Известные бренды, использующие Helvetica в своих логотипах:

• Panasonic
• Jeep
• American Airlines

Helvetica Now был разработан Максом Мидингером, Чарльзом Никсом, Monotype Studio, Яном Хендриком Вебером и опубликован Monotype.

Кстати, если вы ищете шрифты, похожие на Helvetica, ознакомьтесь с этой статьей .

‍ Скачать шрифт Helvetica Now

Выпущенный в 2005 году шрифт Proxima Nova содержит 144 начертания и представляет собой полную переработку знаменитого шрифта Proxima Sans.

Proxima Nova сочетает в себе геометрический внешний вид с современными пропорциями.

Этот чрезвычайно популярный шрифт часто называют гибридом Futura и Akzidenz Grotesk.

‍ Вот пример Proxima Nova в дизайне логотипа Стивена Ричи-Смита.

Семейство шрифтов расширилось с 6 до 48 полнофункциональных шрифтов OpenType.

Proxima Nova представляет собой смесь гуманистических пропорций с несколько геометрическим внешним видом.

Известные бренды, использующие Proxima Nova в своих логотипах:

• Spotify
• Bosh

Proxima Nova был разработан и опубликован Марком Симонсоном.

Этот шрифт также доступен в Adobe Fonts.

‍ Скачать шрифт Proxima Nova

TT Norms Pro считается одним из самых продаваемых гротов, когда-либо выпущенных.

TT Norms Pro — геометрический шрифт без засечек с классическими пропорциями символов.

TT Norms одинаково хорошо работает как в больших текстовых массивах, так и в заголовках и является «тот самым», незаменимым универсальным шрифтом для дизайна логотипов.

‍ Вот пример TT Norms Pro в дизайне логотипа от Vanderbrand.

Семейство шрифтов включает 18 переработанных шрифтов, 1392 глифа в каждом шрифте, 24 функции OpenType и поддерживает более 216 языков.

TT Norms Pro был разработан Иваном Гладких, командой TypeType, Павлом Емельяновым и опубликован TypeType.

‍ Скачать шрифт TT Norms Pro

FF DIN был создан между 1995 и 2009 г. и, несмотря на примитивный технический вид, шрифт быстро стал явлением.

Многие считают FF DIN лучшим сжатым техническим шрифтом из когда-либо созданных.

Шрифт хорошо подходит для упаковки, редакционных материалов, плакатов, рекламных щитов, указателей и вывесок, а также логотипов и брендинга.

‍ Вот пример FF DIN в дизайне логотипа от Ruiz+Company.

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

FF DIN был разработан голландским дизайнером Альбертом-Яном Пулом и опубликован FontFont.

‍ Загрузить шрифт FF DIN®

Avenir Next Pro — это новый взгляд на классическое начертание, обновленный таким образом, что его технические стандарты превосходят существующее положение.

Avenir® Next — линейный гротеск в традициях Erbar и Futura.

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

‍ Вот пример шрифта Avenir Next в дизайне логотипа от Павла Лавриновича.

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

Слово Avenir по-французски означает «будущее», но, в отличие от Futura, Avenir не является чисто геометрическим.

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

Эти нюансы помогают удобочитаемости и придают Avenir гармоничный и разумный вид как для текстов, так и для заголовков.

Avenir Next был разработан Адрианом Фрутигером и Акирой Кобаяши и опубликован Linotype.

Акира привнес свою утонченность и идеи в первоначальный замысел Frutiger — сделать не просто современный шрифт, а опережающий свое время.

‍ Скачать шрифт Avenir® Next

Nexa — один из самых узнаваемых шрифтов нашего времени.

Пресловутый геометрический гротеск в сочетании с богатым разнообразием.

Вот пример шрифта Nexa в дизайне логотипа от Studio Dumbar.

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

Полное семейство шрифтов Nexa включает 9 начертаний и 36 шрифтов.

В целом дизайн семейства четкий, простой и прекрасно подходит как для логотипа, так и для заголовков.

Nexa был разработан Светославом Симовым, Пламеном Мотевым, Мирелой Беловой, Станом Парталевым, Николаем Петроусенко, Венциславом Джоковым и опубликован Fontfabric.

‍ Загрузить шрифт TT Norms Pro

Cera Pro содержит 12 начертаний и вариант семейного пакета

Общеевропейский шрифт, основанный на чистой геометрии.

Шрифт состоит из элементарных форм и привносит простоту, элегантность и определенный современный вид. ‍

Вот пример Cera Pro в дизайне логотипа от Studio Risch.

Cera Pro выпускается в шести вариантах толщины, от тонкого до черного, что дает вам полный спектр возможностей для выражения интерфейсов и корпоративного дизайна; в печати, на экране и на нескольких языках.

Аккуратно наклоненный курсив под углом 10º придает эффектный эффект при использовании в акцидентном типографике.

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

Cera Pro был разработан Якобом Рунге и опубликован TypeMates.

‍ Загрузить шрифт Cera Pro

Mont имеет 10 насыщенностей от Hairline до Black с соответствующим курсивом.

Mont — сбалансированный, но характерный шрифт с уникальными деталями.

Одной из таких деталей является заостренная буква «t» и выдающийся x-height, что делает его идеальным для ярких заголовков и выдающихся логотипов.

‍ Вот пример шрифта Mont в дизайне логотипа от FourPlus Studio.

Шрифт поддерживает более 130 языков.

Семейство Mont fon включает в себя табличные цифры, расширенные типографские функции, такие как лигатуры, дроби, формы с учетом регистра, верхние и нижние индексы и т. д. .

Mont был разработан Светославом Симовым, Мирелой Беловой и опубликован Fontfabric.

‍ Скачать шрифт TT Norms Pro

Intro — это классный гротеск с некоторыми особыми элементами, такими как засечки здесь и там.

Современный вид с легкой утонченной игривостью.

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

‍ Вот пример шрифта Intro™ в дизайне логотипа от BNA.

Это большое семейство содержит 72 начертания шрифта 8 весов с соответствующими курсивом и сокращенной версией.

Поток этого шрифта хорошо подходит для создания чистых и минималистичных словесных знаков. Шрифт

Intro был разработан Светославом Симовым и Станом Парталевым и опубликован Fontfabric.

‍ Скачать шрифт Intro

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

Gilroy — это современный шрифт без засечек с определенным геометрическим оттенком.

Шрифт является младшим братом оригинального семейства шрифтов Qanelas, основанного на геометрических формах, почти идеальных кругах и квадратах.

‍ Вот пример шрифта Gilroy в дизайне логотипа от меня.

Шрифт был разработан с учетом мощных функций открытого типа, что делает его идеально подходящим для современного графического дизайна.

Он может легко работать для вашего логотипа, веб-сайта, а также для редакционного дизайна.

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

Гилрой был разработан Радомиром Тиньковым.

‍ Скачать шрифт Gilroy

Выводы

Кому-то эти шрифты очень понравятся, кому-то нет.

Лично мне нравятся эти современные шрифты — выглядят свежо и футуристично.

Но когда вы ожидаете минимализма, это очень простой и простой вид.

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

Также ознакомьтесь с некоторыми шрифтами известных брендов.

Вы заметили некоторое сходство?

Большинство из них простая, но хорошо продуманная, современная типографика.

Я пропустил какой-нибудь из ваших любимых шрифтов? — Дайте мне знать в комментариях ниже.

Также ознакомьтесь с моими руководствами о том, как разработать логотип, а затем представить этот логотип вашему клиенту и, наконец, доставить пакет логотипов.

Хотите нанять дизайнера логотипов? Просто напишите мне по электронной почте

• 10 лучших шрифтов для элегантного дизайна логотипов
• Лучшие шрифты для логотипов: Serif, Sans и Script
• Топ 70 лучших шрифтов для графических дизайнеров

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

10 лучших шрифтов для веб-сайтов

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

Шрифты имеют решающее значение для создания потрясающего пользовательского опыта, передачи ценностей бренда и завершения вашего веб-дизайна.

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

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

Merriweather чрезвычайно популярен для онлайн-использования, потому что он был разработан для чтения на экранах.

Alegreya выглядит более традиционно, со ссылками на литературу и печатный текст — идеально подходит для сайтов с большим количеством текста.

Ваш шрифт многое говорит о вашем бренде

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

Онлайн-пользователи быстро соображают – это занимает всего 0,5 секунды чтобы составить мнение о веб-сайте, и 94% этого суждения связано с дизайном . Это означает, что шрифты жизненно необходимы для того, чтобы убедить посетителей в том, что эта — правильная страница для них, потому что шрифты — большая часть веб-дизайна сайта.

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

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

В этом примере используется рукописный шрифт для создания знакомой атмосферы.

Этот пример выполнен в дружелюбном стиле ретро.

Совет эксперта

Существует четыре основных типа шрифта:

• Serif — обычно выглядят более традиционно и надежно
• Sans serif — эти шрифты передают модернизм, силу и стиль
• Рукописный шрифт – обычно ассоциируется с элегантностью, творчеством и «индивидуальным подходом»
• Дисплей – уникальный, более разнообразный дизайн, предназначенный для использования в качестве заголовков

Мы также говорим о «современном» шрифты в инфографике ниже — это более свободная категория, основанная на внешнем виде, а не на форме.

Правильный шрифт может улучшить взаимодействие с пользователем

Пользовательский опыт заключается в том, чтобы сделать посетителей максимально удобными и счастливыми.

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

Хорошее взаимодействие с пользователем может привести к большему количеству кликов, конверсий, репостов или повторных посещений вашего сайта, что поможет вам добиться успеха в Интернете. И ключевая часть пользовательского опыта? Вы уже догадались — выбрав читабельный фирменный шрифт!

Почему важны шрифты для веб-сайтов? Резюме: 

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

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

Приведенная ниже инфографика дает четкое представление о том, как различные рисунки шрифтов имеют определенные коннотации и значения. Быстро становится очевидным, что шрифты не являются взаимозаменяемыми — представьте, например, что вы пытаетесь продвигать сильный современный бренд, используя «элегантный» шрифт Bickham Script.

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

Ваша очередь!

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

Наш шорт-лист включает:

• Шрифт Script: Edwardian Script — для традиционного шрифта с завитушками
• Шрифт с засечками: Trajan — для заявления или впечатляющего первого впечатления
• 08 Современный шрифт: Didot Italic – для более тонкого, современного эффекта

Скорее всего, вы бы сразу отказались от шрифтов Helvetica Bold и Cooper, если только у вас нет очень нишевой целевой аудитории!

Ваша целевая аудитория будет определять ваш окончательный выбор – выберете ли вы что-то причудливое и классическое или что-то чистое, стильное и современное.

5 типов индивидуальности шрифтов

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

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

Примеры:

• Merriweather
• Trajan
• Playfair Display

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

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

Примеры:

• Open Sans
• Myriad Italic
• Josefin Sans

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

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

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

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

Примеры:

• Helvetica Bold
• Futura
• Franklin Gothic

Совет эксперта!

Жирные, блочные шрифты могут потерять свой эффект, если вы используете их по всему веб-сайту — попробуйте вместо этого использовать их для заголовков, логотипов или цитат! Вы можете сочетать жирный шрифт заголовка с чистым, более легким шрифтом, таким как Open Sans, для основного текста, чтобы добиться максимального эффекта без ущерба для удобочитаемости.

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

Примеры включают в себя:

• Bickham Script
• Edwardian Script
• Parisienne

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

Совет эксперта!

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

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

Примеры:

• Метрополис
• Уличная одежда
• Искаженная мода

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

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

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

Продуманный дизайн шрифта — это быстрый и простой способ улучшить индивидуальность вашего бренда и создать прочную связь с вашей целевой аудиторией.

Что означают разные шрифты для веб-сайтов? Резюме:

• Разные шрифты несут разное значение и вызывают у читателей разные эмоции
• Подумайте о своем бренде и решите, какую индивидуальность вы хотите передать
• Шрифты с засечками могут передать: традиции, респектабельность, надежность, комфорт
• Шрифты Script могут передать: элегантность, привязанность, креативность
• Демонстрационные шрифты могут передать: дружелюбие, веселье, уникальность, выразительность
• Современные шрифты могут передать: силу, стиль, шик, прогрессивность
San шрифты с засечками могут передать: стабильность, объективность, чистый и современный минимализм
• Люди судят о ваших шрифтах, прежде чем они прочитают ваш контент — убедитесь, что ваш шрифт соответствует вашему фирменному стилю!

1: Начните с вашего бренда

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

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

2: Подберите шрифты для читателей

Попробуйте найти баланс между вашим личным вкусом и потребностями вашей аудитории. Например, вы можете быть по уши влюблены в шрифт Hanalei, но подумайте о своих читателях — соответствует ли этот шрифт их потребностям?

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

При попытке понять вашу аудиторию необходимо задать следующие вопросы:

• Какова идеальная возрастная группа?
• Предпочтительный пол?
• Какая у него профессия?
• Имеет ли он/она больше/меньше располагаемого дохода?

3.

Хотя важно, чтобы шрифты хорошо выглядели, важно также, чтобы они были удобочитаемыми. Часто нам нравится шрифт , потому что он удобочитаемый, а не только потому, что он красиво выглядит — постарайтесь выбрать шрифт, который не только отражает ценности вашего бренда, но и доставляет удовольствие при чтении.

Держитесь подальше от совершенно нечитаемых шрифтов, какими бы визуально ошеломляющими они ни были:

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

4: Проверьте свой шрифт на прочность

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

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

Например, стиль шрифта Cedarville Cursive — это красивый рукописный шрифт, но заглавная буква «G» может вам не нравиться, или вы можете предпочесть традиционный амперсанд, а не простой значок плюса. Такие мелкие детали всегда стоит проверять!

5: Используйте веб-безопасные шрифты

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

Представьте, что вы специалист по финансовому планированию. Ваша идеальная группа клиентов — миллениалы с хорошо оплачиваемой работой, которые только начинают инвестировать и планировать свое будущее.

Когда они посещают ваш веб-сайт, какое первое впечатление вы хотите произвести?

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

Вместо этого вы хотите спроецировать идею о том, что вы можете общаться с более молодыми и состоятельными клиентами — вашим идеальным целевым рынком.

Итак, как выбрать дизайн шрифта, отражающий эти характеристики?

• Ответственный и надежный: Вы хотите выбрать шрифты с традиционным наследием, такие как Trajan или Times New Roman, которые создают ощущение истории.
• Progressive & Modern: Вы хотите выбрать шрифт с четкими линиями, более тонким шрифтом и более минималистичным дизайном. Это создает ощущение модернизма и прогрессивности (см. шрифты в правой части инфографики выше).

Какие шрифты лучше всего подходят для соответствия этим критериям?

Мы выбрали Aller (от Font Squirrel) в качестве надежного шрифта для этого нового поколения финансового планирования, ориентированного на миллениалов.

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

Шрифт выглядит профессионально и может посылать правильные подсознательные сигналы миллениалам, которые ищут финансовый совет.

Используя приведенное выше руководство по инфографике, какие шрифты, по вашему мнению, подходят для вашего веб-сайта?

Как подобрать шрифт для своего сайта. Резюме:

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

1: Не используйте броские шрифты

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

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

Например, шрифт «Papyrus» наводит на мысли о древних цивилизациях. Это шрифт, который вы ожидаете увидеть в названии фильма о египетских мумиях, а не в качестве украшения веб-сайта финансового планирования.

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

2: Не используйте грязные, трудночитаемые шрифты

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

Если вы сомневаетесь, вы всегда можете обратиться к этим шрифтам:

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

3: Не Увеличивайте межстрочный интервал

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

Магическое число идеальной высоты строки составляет 150% размера шрифта, который вы используете.

Например, если вы используете размер шрифта 24 пикселя, высота строки будет 36 пикселей (что составляет 150% от 24 пикселей):

Сразу видно, что левый столбец выглядит лучше всего.

4: Не используйте слишком много разных дизайнов шрифтов

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

1. Стиль шрифта для заголовков и заголовков страниц
2. Стиль шрифта для основных областей содержимого
3. Стиль шрифта для цитат или подзаголовков (необязательно )

Еще немного, и ваш веб-дизайн может начать казаться загроможденным и запутанным — и вы подорвете ту идентичность бренда, над которой вы так усердно работали!

Попробуйте найти два шрифта, которые дополняют друг друга — это называется сочетание шрифтов .

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

5: Не используйте слишком много цветов шрифта

Цвет — мощный инструмент брендинга. Например, когда вы думаете о Starbucks, какие цвета приходят вам на ум? Скорее всего, это зеленый цвет, который вы видите на их логотипе и на их сайте.

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

Убедитесь, что цвет шрифта четко выделяется на фоне цвета фона , чтобы его было легко читать. В Интернете есть бесплатные инструменты, такие как средство проверки контрастности WebAIM, которое вы можете использовать, чтобы убедиться, что цвет вашего шрифта соответствует стандартам удобочитаемости!

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

6: Не выбирайте размер шрифта случайным образом

Размер шрифта с модульным масштабированием придаст вашему тексту более гармоничный вид. Это серия размеров шрифта, обладающих идеальной пропорцией, которую широкая публика считает «красивой».

Рекомендуемые размеры шрифта: 8, 16, 24, 32, 48, 64, 95

16px — идеальный размер шрифта для основного текста. Он не слишком маленький и не слишком большой, поэтому он действительно помогает улучшить читабельность абзаца. Фактически, размер шрифта, который мы используем в основных областях содержания наших статей, составляет 16 пикселей.

8 пикселей действительно слишком малы для основной копии — вместо этого вы должны использовать этот размер только для второстепенного текста, такого как штампы с датами. Для заголовков не стесняйтесь играть с более крупными размерами шрифта, как вы считаете нужным!

Полезный ресурс:

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

7: Не стоит недооценивать пустое пространство

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

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

Некоторые бренды, которые лучше всего используют свободное пространство, включают Apple, Squarespace и Medium — поэкспериментируйте с пустым пространством на своем веб-сайте и посмотрите, какие результаты вы получите!

Яркий современный шрифт Squarespace выделяется тем, что окружен большим количеством пустого пространства. Представьте, если бы он был переполнен текстом и изображениями — он потерял бы свое влияние!

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

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

7 смертных грехов выбора шрифта. Резюме: 

• Избегайте безвкусных шрифтов, таких как Comic Sans
• Не используйте грязные шрифты, которые трудно читать
• Используйте высоту строки, равную 150% размера шрифта, который вы используете много дизайнов шрифтов – выберите максимум два или три
• Не используйте слишком много цветов шрифта – выберите один или два фирменных цвета
• Не выбирайте размер шрифта наугад – мы рекомендуем 16 пикселей для основного текста
• Не забудьте включить пробел

Существует так много шрифтов, что мы знаем, что может быть трудно понять, с чего начать, не говоря уже о том, где найти идеальное соответствие. Вот почему мы составили список из 10 наших любимых шрифтов для веб-сайтов, чтобы дать вам отправную точку — все десять можно бесплатно загрузить с Google Fonts:

1. Lato
2. Merriweather
3. Alegreya
4. Arvo
5. Amatic SC
6. Josefin Slab
7. Bowlby One SC
8. Dancing Script
9. Playfair Display SC
10. Poppins