Содержание
Будучи интернет-маркетологом, вы знаете, что конверсия вас кормит. Думаю, у вас уходит множество времени и усилий на оптимизацию посадочных страниц как раз в погоне за конверсией. Но в вопросах конверсии не только графический дизайн и грамотно составленный текст играют роль.
Предлагаю поговорить сегодня о типографике, о том, как правильно выбирать шрифты и почему удачный выбор шрифтов способен помочь вам в продажах ничуть не меньше, чем хороший копирайтер или профессиональный дизайнер. Если ваши тексты составлены хорошо, сайт выглядит современно, но желаемый уровень конверсии до сих пор не достигнут, — тогда прочтите эту статью.
Что такое типографика?
Простыми словами — типографика символизирует пересечение обычного текста с искусством. Появилась она где-то в XV столетии, когда была изобретена наборная гарнитура для серийной печати. Именно тогда люди и стали экспериментировать с тем, как можно добавить персональный стиль и «почерк» к печатному тексту.
Сегодня, когда посетители вашего сайта открывают посадочную страницу или секцию для заказа товаров и услуг, они не просто читают информацию, но и обращают внимание на форму и размер букв, длину строк, визуальное разделение на абзацы. Поиск решения их проблемы на странице сайта лежит в плоскости восприятия этих же людей. Решение при этом принимаются за какие-то пару секунд.
Понимание того, как работает типографика и как правильно ее использовать, даст ключ к тому, как презентовать свою информацию целевой аудитории, от которой вы хотите добиться принятия выгодного вам решения.
Ключевые компоненты типографики
Выбор и применение шрифта зависит от совокупности нескольких факторов и элементов:
- Тип начертания — ошибочно мы называем эту характеристику «шрифтом», но начертание относится к группам символов, букв и цифр, которые объединены общим дизайном. Например, начертание — это Garamond, Times, Arial; мы же привычно по ошибке называем их «шрифтами».
- Шрифт — конкретный тип размера, длины, ширины и жирности букв. На практике это выглядит так: Georgia — это начертание, а 9pt Georgia Bold — шрифт.
- Длина строк — характеристика, которая обозначает расстояние между левым и правым крайним полем и число символов и слов, которые умещаются на этом отрезке.
- Расстояние между строками — пространство между основными линиями, по которым размещены буквы, выражается в количестве точек.
- Кернинг — обозначает незаполненное пространство между отдельными символами или буквами. У большинства шрифтов кернинг задается автоматически так, чтобы выбранное начертание и размер выглядели естественно и приятно для глаз.
- Пробелы и плотность символов — отвечают за плотность и однородность размещения символов в словах и строках по тексту.
Почему типографика настолько важна?
Если ваш текст трудно воспринимается читателем, потому что отдельные буквы в словах расположены слишком близко друг к другу, размер шрифта слишком маленький или слова расположены слишком плотно, тогда у посетителей вашего сайта есть два вероятных сценария поведения.
Они либо покинут ваш сайт, что приведет к падению конверсии, либо попробуют все же разобрать текст, но посколько это будет довольно утомительным занятием, то не дойдут даже до половины. В итоге посетителю сайта запомнится больше борьба с текстом, чем основное послание, которое в этом тексте заключено.
Типографика для понимания и восприятия информации критически важна. Правильно выбранные начертание, шрифт, кернинг и другие компоненты типографики помогут вам быстро и удобно донести мысль до получателя.
Если вы поинтересуетесь тем, как люди читают тексты в интернете, то увидите, что читательский поведенческий шаблон совершенно очевиден. Этот шаблон может меняться, но только путем применения различной визуальной иерархии в тексте. Именно такую иерархию и структуру можно организовать путем выбора подходящих шрифтов. Помимо начертания, можно использовать маркированные списки и другие способы визуального разграничения.
Чтобы достичь совершенства в структурировании текста, надо сначала понять, как организовать информацию, для чего стоит почитать, например, Gestalt’s Principles of Perception («Гештальт-принципы восприятия»).
Люди вообще любят все организовывать. Привычка эта укоренилась в человеческой природе. Согласно гештальт-теории восприятия, организация визуальных элементов в группы базируется на следующих пяти контекстных факторах:
- схожесть (внешне схожие объекты — по размеру, форме, цвету — воспринимаются вместе);
- смежность (близость объектов в пространстве и визуальный переход от одного к другому, когда одно событие как будто вызывает другое);
- замкнутость (несколько объектов образуют вместе фигуру завершенной формы);
- близость (объекты, расположенные рядом, воспринимаются вместе);
- фигура и пространство вокруг (когда пространство вокруг фигуры воспринимается как ее фон).
Используя по отношению к вашим текстам принципы схожести и визуальной однородности, вы сможете сделать весь текст одинаковым визуально, но при этом выделить шрифтом и начертанием, например, призыв к действию.
Работа с текстом в итоге должна привести к тому, чтобы вашу информацию было легко воспринимать. И потому надо, чтобы части текста можно было связать в единое целое, но при этом выделить главное с первого взгляда.
О чем говорят исследования?
В июле 2012 года в The New York Times был проведен эксперимент под названием «Вы оптимист или пессимист?». Читателям предлагался абзац из книги The Beginning of Infinity, за которым шли два вопроса, подразумевавших ответы «да» или «нет». Интересно, что сами ответы не так сильно интересовали исследователей, как реакции людей на выбранное начертание шрифтов и эмоциональный фон, который несет в себе тот или иной шрифт. Может ли шрифт влиять на доверие к тексту? Это и хотели узнать авторы эксперимента.
Все 40 тыс. участников видели один и тот же абзац в шести разных начертаниях: Baskerville, Helvetica, Comic Sans (профессиональные дизайнеры критикуют Comic Sans или, точнее, просто ненавидят его из-за корявого начертания и широкого распространения в работах любителей. —Прим. ред.), Computer Modern, Georgia, Trebuchet.
В результате выяснилось следующее. Утверждения и вопросы, напечатанные шрифтом Comic Sans, вызвали наибольшее несогласие. Недалеко ушла и Helvetica: утверждения, написанные этим шрифтом, тоже особо не убедили участников опроса. Зато наибольшее согласие и доверие вызвали утверждения, написанные начертанием Baskerville.
Урок для интернет-маркетологов
Вот почему, по мнению психолога, победил шрифт Baskerville: он более формален и надежен на вид.
А теперь посмотрите на свою страницу, на которой продаются ваши товары. Отражает ли выбранный вами шрифт ваши реальные намерения и то послание, которое вы хотите донести до целевой аудитории?
Подумайте о своей нише. Требуется ли вашей аудитории определенный тон или настроение, которое можно сформировать за счет правильно выбранного шрифта?
Размер имеет значение?
Касательно размера шрифта также был проведен интересный эксперимент в Usability News. В ходе этого исследования сравнили восемь популярных в интернете шрифтов: Courier New, Georgia, Arial, Century Schoolbook, Times New Roman, Comic Sans, Tahoma, Verdana. Разобрали при этом шрифты размером 10, 12, 14 пунктов. В исследовании принимали участие 60 участников.
Вот что выяснилось: Verdana, Arial, Comic Sans лучше всего читаются при размере шрифта 10, 12 и 14 пт.
Быстрее всего люди читали тексты, набранные Times New Roman и Arial.
Также Arial и Courier влияли наилучшим образом на степень восприятия текста, в то время как текст, набранный Comic Sans, доверия не вызывал (показал наихудший результат). Наибольший уровень положительного восприятия вызвали в числе прочих шрифты Tahoma 10 пт, Courier 12 пт и Arial 14 пт.
Дискуссия о Serif и Sans Serif
Несмотря на такие вполне отчетливые результаты, не было четкого ответа на вопрос о том, что лучше использовать: Serif (шрифт с засечками) или Sans Serif (рубленый шрифт, то есть без засечек). Но последний легче воспринимается при чтении, потому что отчетлив и удобен даже при очень маленьком размере букв и символов. А значит, люди могут больше сосредоточиться на содержании текста, чем на его форме и начертании.
Поэтому Sans Serif рекомендуют для основной части текста, а Serif — для заголовков и подзаголовков (как видите, именно такое решение мы выбрали для оформления текста в «Ловим сетью». — Прим. ред.).
Как шрифты влияют на настроение и когнитивную производительность
Еще одно исследование (PDF), проведенное совместно доктором Кевином Ларсоном (Kevin Larson) из Microsoft и доктором Розалиндой Пикар (Rosalind Picard) из MIT, выявило взаимосвязь между настроением и когнитивной производительностью. Были проведены в два этапа измерения трех различных характеристик: сравнительная продолжительность, шкала Лайкерта и задания на распознавание.
Двадцать добровольцев получили текст с хорошей и плохой типографикой, по десять человек в каждой группе. В первой части исследования выяснилось, что при хорошей верстке и типографике в целом люди склонны воспринимать время для его прочтения меньшим, чем оно было на самом деле: они посчитали, что потратили намного меньше времени на прочтение всего текста, чем это было на самом деле, даже если делали перерывы в прочтении.
Объяснение здесь достаточно простое: хорошо и грамотно оформленный и сверстанный текст настолько увлекает своим содержанием (а не формой), что читатель будто «проглатывает» его.
Эксперименты по измерению эффективности текстов со шкалой Лайкерта выявили лишь со второй попытки преимущество хорошей типографики.
В третьей части, где происходило выполнение когнитивных заданий, испытуемым дали задачу со свечой и тест на поиск ассоциаций. Первое задание решили четыре человека в группе с хорошей типографикой, и ни одного — в группе, где текст был набран неудачным шрифтом. Со вторым заданием справились 52% респондентов в группе с хорошей типографикой, и 48% — в группе с плохой (при этом группа с хорошей типографикой еще и затратила на выполнение теста немного меньше времени, чем их коллеги).
Хорошее настроение и положительное восприятие подаваемой информации не в последнюю очередь зависит от выбранного шрифта. Решение задач или получение определенной информации становятся проще и доступнее, если для этого выбран удачный шрифт.
Как выбрать правильный шрифт для повышения конверсии?
- Не позволяйте выразительности повредить полезности. Выбирая один из множества доступных шрифтов в текстовом редакторе или панели управления сайтом, мы всегда сталкиваемся с тем же соблазном, что и ребенок, внезапно без взрослых зашедший в кондитерскую. Но важно помнить, что шрифты с самым странным или красивым дизайном — далеко не самые лучшие в плане прочтения и удобства. Красивый шрифт еще не означает, что его просто читать и что он даст вам хорошие продажи товаров или информации с вашего сайта.
- Помните, что выбранная вами типографика должна дополнять текст, а не подавлять заложенный в нем смысл своей формой. Прочитав текст, люди должны запомнить не шрифт, а призыв к действию или информационный посыл, которые в этом тексте заложены.
- Всегда помните о двух принципах: взаимосвязь и контраст разных шрифтов в одном тексте. Сочетание двух разных шрифтов в одном тексте должно быть таким, чтобы при переключении между ними у читателя не появлялось ощущение, что его от текста внезапно отвлекли. Рассматривайте пары вроде Helvetica и Arial. А контрастность должна делать шрифты разными, но при этом сохранять в них хотя бы одну общую черту.
- Не забывайте, что ключ к успеху — в простоте. Не стоит превращать ваш текст в выставку ваших любимых шрифтов.
- Для поиска идеально подходящего шрифта изучите нишу, которую занимает ваш проект и его аудитория. Нужен ли вам формальный, строгий шрифт? Нужен ли вам крупный шрифт? Изучите рынок и его запросы, факторы, которые побуждают ваших покупателей внимательнее читать надписи и тексты.
- Выберите типографику такую, чтобы текст внушал доверие, выглядел удобно и при этом легко читался. Внимательно отнеситесь также к пробелам между буквами и словами — они должны быть в меру широкими.
- Не используйте заглавные буквы в начале каждого слова. 90% всех текстов, которые люди читают в интернете, набраны строчными буквами.
- Длина строки не должна быть слишком короткой, чтобы не приходилось перескакивать постоянно взглядом на начало строки — это утомляет читателя. И она не должна быть слишком длинной. (Оптимальной шириной текста можно считать 600 пикселей. В «Ловим сетью» установлена именно такая ширина. — Прим. ред.)
- Плотность слов и строк должна быть такой, чтобы пользователю не казалось, будто весь текст свален в одну кучу.
Хорошая типографика очень важна — в этом был убежден знаменитый перфекционист Стив Джобс
Как можно обойтись в вопросе типографики без мнения того, кто привык с тщательностью фанатика относиться к любым деталям, включая шрифты?
Выступая перед выпускниками и студентами Стэнфордского университета в 2005 году, основатель и в то время генеральный директор компании Apple Стив Джобс рассказывал, что в университете не очень интересовался обычными дисциплинами, зато записался на курсы каллиграфии, где изучал шрифты и особенности комбинирования Serif и Sans Serif. Делал он это исключительно для собственного удовольствия — и даже не предполагал, что десять лет спустя, в работе над шрифтами для революционного компьютера Macintosh ему пригодятся именно эти знания и опыт (кстати, есть легенда, что Стив Джобс уволил своего сотрудника за одну-единственную фразу «Шрифт — это не главное». — Прим. ред.).
Подводя итоги
Интернет-маркетологам важно помнить, что тщательно выбранная типографика способна дополнить и улучшить ваш текст. Правильное оформление и выбор шрифта сделают текст богаче и лучше, в то время как неудобный для прочтения текст не спасет даже гений копирайтинга.
Наилучшим способом определить подходящие шрифты для сайтов, рассылок и стартапов по-прежнему остается А/В-тестирование. Если же у вас уже есть посадочная страница, которая дает хорошие показатели конверсии благодаря правильному дизайну и типографике, отталкивайтесь в будущем от этого образца, улучшайте типографику, чтобы улучшить показатель конверсии.
