Типографика является одной из самых больших проблем, с которой приходится справляться графическому дизайнеру. Хорошо выполненная типографика сделает ваш сайт более привлекательным для пользователей, поэтому, при подготовке продукта, вы всегда должны помнить несколько ключевых моментов.
Читабельность
Если пользователь не получает ваше сообщение легко и доступно, типографика не работает. Слишком большой шрифт отвлечет читателя, маленький текст может быть не замечен или пользователь просто посчитает его неважным.
Как правило, топовые веб-блогеры выбирают легко узнаваемый шрифт без засечек, стараются избегать курсива, так как он может отображаться плохо. Для максимальной читаемости нельзя без необходимости комбинировать несколько стилей выравнивания.
Если мы попытаемся разместить около 70 символов в строке на сайтах для ПК, мы должны вдвое сократить число для мобильных сайтов.
Контраст
Сегодня люди используют свои смартфоны практически везде, в разных условиях освещения, поэтому вы должны выбрать соответствующую контрастность отдельных элементов. Попробуйте создать свой сайт в черно-белом / чисто белом цвете для максимального контраста, а затем добавьте цвета, но все же в соответствии с этим шаблоном.
Функциональность
В то время как большая часть текста на сайтах для ПК предназначена для простого нажатия и перехода на следующую страницу, мобильная типографика часто выполняет больший набор функций. Например, текст может начать набор номера, другой может содержать ссылку, а другие могут позволить нам купить конкретный продукт. Поэтому всегда проектируйте так, чтобы пользователю сразу было понятно, какую функцию они выполняют те или иные элементы. Текстовые поля должны быть достаточно большими и удаленными от других, чтобы одновременно выполнялось только одно действие.
Важный совет в заключение
Тестируйте, тестируйте и ещё раз тестируйте. Это даст вам представление о том, как ваш сайт будет выглядеть на разных устройствах и поможет избежать многих ошибок.
Понравился материал? Поддержи автора: подпишись на канал и поставь лайк!
