Офтоп
Дарья Хохлова

«Шрифт определяет то, как пользователь потребляет контент»: Веб-дизайнер о роли текста на сайте Статьи редакции

Издание WebDesignLedger опубликовало материал блогера и дизайнера Джейка Рошле, в котором автор рассказал о том, как шрифт может изменить дизайн сайта. По мнению Рошле, выбор конкретного шрифта для страницы может как улучшить её вид, так и полностью испортить его.

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

Методы выбора шрифта

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

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

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

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

Найдите любимые шрифты

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

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

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

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

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

Важность заголовков

«Далеко не каждый посетитель сможет продержаться на сайте так долго, чтобы дойти до содержания. Ваша задача — заинтересовать его в первые несколько секунд», — объясняет Джейк Рошле. Яркий и броский заголовок — это то, что поможет захватить внимание пользователя. Для таких задач существуют специальные шрифты, которые «цепляют» посетителя. «Заголовок — это самостоятельный элемент интерфейса, который нужно рассматривать отдельно от текста и остального контента. Он определяет содержимое страницы и заставляет пользователя обратить внимание и на другой контент».

Сервис Pen Heaven, говорит Рошле, представляет собой хороший пример использования такого «притягательного» заголовка. Сам по себе он не очень крупный, но две линии, которые проходят «сквозь» него, привлекают к нему больше внимания. Они показывают, что этот заголовок — важная составляющая страницы:

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

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

Комбинируйте типографические концепты

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

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

Ещё один хороший способ научиться комбинировать шрифты, по мнению автора, — скопировать какую-то часть интерфейса другого сайта и попробовать как-то её изменить или разнообразить. «Чем больше вы практикуетесь, тем легче вам будет выбирать шрифты в дальнейшем. Со временем решения будут приходить к вам легко», — говорит Джейк Рошле.

Ресурсы, где можно найти бесплатные шрифты

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

Автор материала рекомендует следующие ресурсы, которые, по его мнению, подойдут начинающим специалистам:

0
4 комментария
Популярные
По порядку

Комментарий удален

Текст это смысл говоримого, шрифт это голос которым проговаривается. Отсюда вывод: либо бери стандартный шрифт из туториалов, либо учись несколько лет сценической речи (это образно)

0

Текст на красном фон отсюда
http://hellohappy.org/beautiful-web-type/
Чувак показывает, как можно комбинировать шрифты из google fonts. Очень круто

0

Черный текст на красном фоне ужасно смотрится

0
Читать все 4 комментария
«Циан» запретил сдавать квартиры «только славянам»: теперь на сайте нельзя указывать расовые предпочтения Статьи редакции

Отредактировать объявления необходимо до 1 февраля 2022 года.

Главное за неделю: перемены в VK, свисток Tesla, итоги года Apple Music и Spotify

Это очередной подкаст Telegram-канала ForGeeks с Сергеем Кузнецовым и Павлом Бесединым. Расскажем, что поменялось в VK за последнюю неделю, зачем Илон Маск сделал свисток и квадроцикл, а также, почему в России популярен рэп и можно ли с этим что-то сделать. Слушайте свежий выпуск, читайте и подписывайтесь.

Точка добавила вебхуки в API

Клиенты смогут получать моментальные уведомления о своём бизнесе.

vc.ru превратился в книгу жалоб

Вам не кажется, что vc.ru превращается в сайт для жалоб на разные сервисы и компании?

Pinterest купила белорусский сервис для редактирования видео Vochi Статьи редакции

Покупка поможет Pinterest развивать видеонаправление.

OPS-инструкция для стартапа по доставке: как выжить и наладить операционку

В преддверии первой годовщины запуска сервиса гиперлокальной доставки Прямиком, который развивает наша компания, вспомнили с ребятами из операционного отдела, как всё начиналось. Андрей Резник, региональный менеджер Master Delivery, и Анатолий Голованец, старший менеджер по франчайзингу, собрали ТОП-5 советов для тех, кто сейчас в самом начале.

Как столярная мастерская из Рязани начала продавать товары по всему миру

И прошла путь от мебели ручной работы к деревянным игрушкам.

«У одного человека — половина спутников в мире»: Европейское космическое агенство обвинило SpaceX в монополии в космосе Статьи редакции

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

Глава СберМаркета Асан Курмангужин запустил подкаст Asan Talks в YouTube

В выпусках Асан берет интервью у топ-менеджеров крупных компаний и обсуждает вопросы саморазвития и лидерства

9 декабря банк «Открытие» и Яндекс.Бизнес проводят очередное бизнес-шоу «Цифровая эволюция бизнеса»

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

«Перекрёсток» начал тестировать мини-магазины «Джем» с самыми популярными товарами, кафе и Wi-Fi Статьи редакции

X5 Group уже тестировала мини-магазины «Перекрёсток Экспресс», но в 2018 году начала закрывать их из-за низких продаж.

null