В предыдущей статье мы обсудили основные концепции выбора шрифта по практическим соображениям и для удобства чтения. В этой статье мы рассмотрим некоторые нюансы выбора и использования отличных шрифтов для вашего веб-дизайна.
(Кстати, если у вас не было шанса, вы можете проверить первую статью, поскольку она охватывает основы выбора шрифтов вашего сайта.)
В этой статье мы рассмотрим некоторые нюансы, которые являются частью хорошего выбора шрифтов.
Иерархия шрифтов
Некоторые элементы на странице важнее других. В веб-дизайне самые важные элементы на странице имеют самую высокую «иерархию», что означает то, что вы хотите, чтобы зритель увидел первым.
Заголовки и заголовки обычно являются наиболее важной частью. При копирайтинге название часто называют «рекламным объявлением». В веб-дизайне это тоже правда. Заголовок или заголовок говорит зрителю, чего ожидать дальше.
По этой причине заголовки и заголовки (иногда называемые заголовками) больше.
Размер – это способ привлечь к ним внимание. Но вы также можете использовать цвет, вес и местоположение на странице, чтобы создать четкую визуальная иерархия на ваши страницы
лидер
Ведущий (произносится ledding) это пространство между строки текста Это тонкий вид, но бесценный инструмент для удобочитаемого дизайна сайта. Хвост (иногда называемый нисходящим) или основание (называемое восходящим) буквы – это те, которые влияют на шрифт.
Плохой заголовок может испортить копию на вашей странице, так как все кажется напряженным. Слишком близкие линии действительно мешают людям читать то, что написано, так как слишком сложно ориентироваться.
(Посмотрите, как заголовок перекрывает текст? Это снижает читабельность.)
Для больших блоков текста, 1,5 раза размер текста является хорошим начальным размером. Меньший текст должен иметь более жесткий заголовок, а огромный текст должен иметь много. Вы должны использовать свое суждение, но в целом правило состоит в том, что чем больше шрифт, тем больше он необходим.
Отслеживание и кернинг
Отслеживание и Кернинг сосредоточены на космосе. между символы в тексте Между этими двумя понятиями существует некоторая путаница, поэтому их стоит объяснить.
Логотип FedEx является примером типографского домена и использует как отслеживание, так и кернинг.
(Вы замечаете стрелу, спрятанную в отрицательном пространстве? Очень хорошо, а?)
Отслеживание используется для заполнения пространства, которое больше или меньше текущего размера шрифта. На приведенном выше логотипе FedEx большинство букв равномерно распределены по трекингу. Тем не менее, буквы DE и сжатые вместе. Это пример кернинга.
Кернинг регулирует расстояние между двумя буквами. Если они расположены слишком близко друг к другу, слова трудно читать и слишком далеко друг от друга, и они превращаются в несвязные буквы вместо слов.
Обратите внимание, что изменение отслеживания может иногда вызывать затруднения при чтении текста, но оно также может использоваться для эстетики дизайна при преднамеренном изменении.
Обратите внимание, что в некоторых шрифтах разные буквы будут иметь более широкое пространство, а другие – уже. Поэтому вы должны проверить, как они выглядят, когда они отображаются на странице.
Цвет и читаемость
Не являясь частью типографского дизайна, цвет является очень важной частью типа веб-сайта. Мы будем исследовать цветовые схемы в другой статье, но сейчас давайте сосредоточимся на основах цвета и шрифтов.
Контраст необходим для обеспечения читабельности вашего сайта. Черный текст на белом фоне (или светлый фон) считается наиболее читаемым цветом для текста.
Это не значит, что все должно быть черно-белым, но вы должны знать о контрасте вашего текста.
Как правило, чем темнее цвет текста, тем более заметным он будет. Чем светлее цвет, тем больше он сливается с фоном.
Однако именно здесь вступают в игру фоны: чем больше контраст, тем лучше, чтобы текст в верхней части фона не терялся и не смешивался. Некоторые цвета даже вибрируют друг от друга, когда они перекрываются (например, красный и синий). Поэтому очень важно выбрать цвет текста на цветном фоне.
Сетка может быть вашим гидом
На мой взгляд, использование сетки очень важно для создания впечатляющей типографии в сети. У вас могут быть отличные шрифты, точный интервал и цвета, но если у вас нет хорошего дизайна, все развалится.
Использование сетки при проектировании с типом обеспечивает четкий баланс и геометрическую структуру вашего дизайна. Существует четыре основных типа сетки, которые вы можете использовать:
– Рукописные сетки
– Колонные сетки
– Модульные решетки
– Иерархические сетки
Если вы разрабатываете сетку с самого начала, вы можете быть уверены, что ваш дизайн будет надежным.
Сетка воплощает в себе все основные идеалы великолепного дизайна: геометрические, последовательные, удобные в использовании. Настройка текста с помощью сетки – лучший способ создания иерархии шрифтов, и полезно определить, насколько большими или маленькими должны быть ваши шрифты.
Обоснование и выравнивание
Также важно отметить выравнивание шрифта, иногда называемое выравниванием текста, выравниванием текста или выравниванием типа. Корректировка выравнивания особенно важна для основного текста, над которым вы работаете. В редких случаях тип, который вы добавляете, будет идеально подходить, вам нужно будет настроить его вручную.
Для удобства можно выделить четыре основных типографских выравнивания:
- Левый уровень: когда текст выровнен вдоль левого поля или желоба (также известный как выравнивание по левому краю, выравнивание по левому краю)
- Промыть справа: когда текст выровнен вдоль правого поля или поля (также известного как выравнивание по правому краю и выравнивание по правому краю)
- Оправдано: когда текст выровнен вдоль левого поля, но пространство между буквами и словами отрегулировано так, чтобы текст был заподлицо между обоими полями (также известный как полное выравнивание, полное выравнивание, полное выравнивание)
- Основное внимание: когда текст не выровнен по левому или правому полю и вместо этого имеется равномерное пространство с каждой стороны каждой строки.
Не думай об этом слишком много!
При принятии решения, какой шрифт использовать на вашем сайте, важно помнить: не думай об этом слишком много, но и помни об этом, Вы можете так застрять в фазе выбора, что весь ваш дизайн останавливается. Гораздо лучше выбрать несколько шрифтов и попробовать их на странице. Помните, что читабельность очень важна.
Как мы уже говорили в первой части, онлайн-мир на 95% состоит из текста, поэтому тщательная разработка шрифтов означает, что посетители вашего сайта получат лучший опыт.
Brandastic – компания по цифровому маркетингу и дизайну веб-сайтов, расположенная в округе Ориндж, штат Калифорния. Мы помогаем создавать бренды, которые будут запоминающимися и эффектными. Путем ребрендинга, изменения дизайна и улучшения идеи вашей компании мы помогаем вам повысить свой потенциал.
