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

в 11:33, , рубрики: антиква, Блог компании Tinkoff.ru, графический дизайн, гротеск, дизайн, типографика, шрифты

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

А потом узнала, что ученые уже сто лет как выяснили то, про что до сих пор спорят дизайнеры.

Мы в Тинькофф сравнили мнение знаменитых дизайнеров и ученых о том, какие шрифты легче читать: антикву(с засечками) или гротески(без засечек).

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 1

Почему я вообще этим занялась

Однажды мне нужно было написать инструкцию для джунов о том, как выбрать шрифт. Я написала, что для больших текстов лучше использовать шрифты с засечками, потому что глаза меньше устают от такого шрифта и засечки помогают держать строку.
Потом пришел редактор и откомментил: «Пруфы?»

«Да это же очевидно»,  —  подумала я и открыла «Википедию»:

Согласно общепринятому мнению [источник не указан 1902 дня], засечки направляют движение глаз вдоль строк при чтении крупных массивов печатного текста. Oни способствуют связи букв в единую линию, облегчая визуальное восприятие и удобочитаемость текста.

В «Википедии» пруфов не было, и я пошла к книжному шкафу.

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 2

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

Юрий Гордон «Книга про буквы от Аа до Яя», Откуда взялись и зачем нужны засечки, стр. 51

Вообще, личный взгляд Юрия Гордона  —  это довольно веский довод, но все-таки. Я поискала в статьях Яна Чихольда:

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

Ян Чихольд «Облик книги», О типографике, стр. 21

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 3
Ян Чихольд

Ну ладно, старинные мастера опирались на чутье, но, может, кто-то посовременнее объяснит с пруфами?
Сергей Сурганов, арт-директор «Медузы», дизайнер Notion:

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

Инструкция арт-директора «Медузы» Сергея Сурганова «Как выбрать шрифт»

Короче, у нас три довода:
«согласно общепринятому мнению»,
«на мой взгляд»,
«считается»,

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

Понятия: разборчивость vs читаемость

Разборчивость (legibility) шрифта зависит от точности начертания его элементов, что обычно означает возможность распознавать отдельные буквы или слова.
Читаемость (readability) напрямую связана с оптимальной компоновкой и планом всего тела текста.

Засечки направляют взгляд по строке

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

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 4
Видео про саккады

Более того, глаза совершают саккады, даже когда человек пытается сфокусироваться строго на одной точке.
Джаред Скрюз (Jaret Screws) провел эксперимент: попросил 10 человек прочитать несколько текстов и следил за движением их глаз с помощью специального оборудования.
Вот что получилось:

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 5

Измерили продолжительность фиксации взгляда, среднее количество слов между ними, амплитуду саккад и число раз, когда человек задерживался на одном и том же слове.

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 6

Все различия оказались незначительными. Ой.

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

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 7
Шрифты с засечками и без засечек одинаково «держат» строку

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

Quantitative Analysis of Font Type’s Effect on Reading Comprehension Jaret Screws Clemson University Clemson, United States

Детям, в отличие от взрослых, легче читать шрифт без засечек

Даже если это и не так, в это точно верят производители азбук. Попробуйте найти хоть одну азбуку с антиквой.

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 8
Детские азбуки с первой страницы Гугла

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

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

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

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 10

Performance differences between Times and Helvetica in a reading task Rudi W. De Lange, Henry L. Esterhuizen and Derek Beatty

А что насчет ребят с плохим зрением?

Исследований про слабовидящих людей и шрифт довольно много.
В Journal of Visual Impairment and Blindness было опубликован обзор 18 исследований, в которых общее количество испытуемых было более 1500 человек.
Вывод исследователей: для людей с плохим зрением шрифты без засечек, такие как Arial, Helvetica, Verdana или Adsans, более читаемые, чем шрифты с засечками.

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 11

The Legibility of Typefaces for Readers with Low Vision: A Research Review Elizabeth Russell-Minda, Jeffrey W. Jutai, J. Graham Strong, Kent A. Campbell, Deborah Gold, Lisa Pretty, and Lesley Wilmot.

Шрифты и дислексики

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

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 12
Страница, которая показывает текст так, как его видят люди с дислексией, на dyslexiarf.com

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

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 13

На первое место по читаемости и у обычных людей, и у дислексиков вышел шрифт без засечек Arial (интересно, что схожая с ним до неразличимости Helvetica — на четвертом месте). Зато на втором месте неожиданно оказался моноширинный брусковый Courier.

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

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 15

The Effect of Font Type on Screen Readability by People with Dyslexia
LUZ RELLO and RICARDO BAEZA-YATES

Эмоции и шрифты

Может, дело не в скорости чтения и разборчивости, а в особом настроении, которое создают шрифты с засечками?
В Лаборатории исследований юзабилити ПО в Wichita State University попробовали разобраться, как люди воспринимают шрифты.
Участники заполняли опросник, где указывали, какими, по их мнению, характеристиками обладают разные шрифты.

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 16

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

Perception of Fonts: Perceived Personality Traits and Uses By A. Dawn Shaikh, Barbara S. Chaparro, & Doug Fox

Для другого исследования взяли два сатирических отрывка из «Нью-Йорк Таймс»: один — о проблемах правительства, другой — о политике в образовании. Их напечатали в шрифтах Times New Roman и Arial одинакового размера и показали в случайном порядке 102 студентам университета, которые оценили их с помощью заранее заданных прилагательных.
Сатирические статьи, напечатанные Times New Roman, воспринимались как более смешные и злые, чем напечатанные Arial.

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 17

Emotional and Persuasive perception of fonts Samuel Juni, Julie S. Gross

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

Значит ли это, что все шрифты без засечек — безликие? Вообще, нет, но нейтральный шрифт с засечками менее нейтральный, чем нейтральный шрифт без засечек.

Читаемость шрифтов на электронных экранах

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

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 18
Разные типы сглаживания

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

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 19

Интересно, что самым читаемым оказался экранный шрифт со сглаживанием (а не напечатанный), и это шрифт без засечек — Arial. Второй после него  —  Verdana, тоже без засечек.
Зато без сглаживания лучше всего читалась Georgia  —  шрифт с засечками.

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 20

A STUDY OF THE READABILITY OF ON-SCREEN TEXT By Eric Michael Weisenmiller

Выводы

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

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

Знаменитые дизайнеры vs научные исследования про читаемость шрифтов - 21

Если вас заинтересовала эта тема, можете провести собственное исследование: поискать на scholar.google.ru по запросу типа Font readability research. Там можно найти исследования и про оптимальный межстрочный интервал, и про восприятие разных начертаний шрифта, и про различия читаемости в зависимости от размера.

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

Автор: Юля Кондратьева

Источник


* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js