Специалисты из Adobe провели исследование скорости онлайн-чтения с участием 352 человек. Участников попросили прочитать несколько коротких отрывков текста, каждый из которых включал 300–500 слов (для сравнения: средняя веб-страница содержит 593 слова).
Тексты были примерно на уровне чтения 8-го класса (рекомендовано для веб-контента, ориентированного на широкую потребительскую аудиторию).
Забегая вперед, скажем, что это исследование не отвечает на самый животрепещущий вопрос: какой шрифт следует выбрать для своего сайта. Тем не менее оно содержит много интересных выводов, о которых и пойдет речь в этой статье.
ИсследованиеШрифты имеют значениеОсновной вывод: не существует одного лучшего шрифта для всех пользователейНельзя спросить пользователейВозрастные различияВозможное решение по оптимизации шрифтовЗаключение
Исследование
Тексты были оформлены 16 разными шрифтами. Среди них были:
- классические шрифты (Times, Helvetica, Garamond);
- шрифты, разработанные для использования на компьютере (Calibri, Arial); и
- шрифты, специально разработанные для удобочитаемости (Noto Sans, Montserrat).
Никаких «диких» шрифтов (например, Edwardian Script ITC) представлено не было. Однако на каждом пользователе тестировали только по 5 шрифтов.
В Интернете пользователи преимущественно «сканируют» страницы в поисках полезной информации, а не читают весь текст слово в слово. По этой причине пользователи читают лишь 28% слов на веб-странице, или около 166 слов.
Участники же исследования читали все тексты линейно. (В конце каждого отрывка пользователям задавали несколько вопросов на понимание прочитанного.)
Эта разница в читательском поведении веб-пользователей и участников исследования ставит под сомнение результаты этого исследования. Тем не менее выводы о взаимосвязи между шрифтами и скоростью чтения все же вызывают интерес.
Авторы выделяют 3 вида чтения:
- Беглое прочтение нескольких слов (в уведомлениях или на крошечных экранах, например, смарт-часов).
- Короткое чтение: чтение коротких отрывков прозы, подобных тем, которые использовались в исследовании и которые можно найти на большинстве сайтов.
- Длительное чтение: например, чтение книги.
Были выбраны три основных метрики:
- Субъективное предпочтение пользователя: какой шрифт понравился ему больше всего.
- Скорость чтения, измеряемая количеством слов в минуту.
- Оценка понимания: процент правильных ответов на вопросы после прочтения отрывка.
Последний показатель был не так интересен, поскольку результат был очень близок к 90% при любых условиях. Высокий уровень понимания указывает на то, что (а) содержание было легким относительно навыков чтения пользователей, и (б) люди внимательно читали тексты. Первый из этих выводов не всегда верен для веб-контента, а второй редко верен для интернет-пользователей.
Шрифты имеют значение
В среднем каждый участник читал на 35% быстрее, используя свой, индивидуальный в каждом случае, самый «быстрый» шрифт (314 слов в минуту). В случае же с самым «медленным» шрифтом скорость чтения составляла в среднем 232 слова в минуту.
Это огромная разница, учитывая, что на каждом пользователе экспериментировали лишь 5 шрифтов. Если бы скорость чтения в каждом случае измерялась для всех 16 шрифтов, разница между самым «быстрым» и самым «медленным» шрифтом, вероятно, была бы еще больше.
16 шрифтов, участвовавших в исследовании. Для каждого шрифта в скобках указана средняя скорость чтения пользователей (количество слов в минуту).
По результатам исследования наиболее высокую скорость чтения продемонстрировал шрифт Garamond — 312 слов в минуту. Самым же «медленным» шрифтом из 16 протестированных оказался Open Sans — 254 слов в минуту.
Но следует уточнить, что Garamond был лучшим шрифтом в среднем. Многие пользователи показали лучшую скорость чтения с другим шрифтом.
Авторы также вычислили, как часто шрифт оказывался самым быстрым только из тех 5 шрифтов, которые видел конкретный пользователь. У Garamond этот показатель достиг лишь 48%, а это значит, что в (немногим) более чем половине случаев другой шрифт оказывался лучше для конкретного пользователя.
Чаще всего — в 59% случаев — самым быстрым шрифтом признавался Franklin Gothic. Опять же стоит уточнить, что для оставшихся 41% пользователей лучшим был другой шрифт из 5.
Интересно, что средняя скорость чтения Franklin Gothic была всего 271 слов в минуту, что намного ниже того же показателя Garamond (312 слов в минуту). Другими словами, Franklin Gothic подходит большему количеству людей, чем Garamond, но средняя скорость чтения у Garamond выше.
Как объяснить такое несоответствие? Вполне возможно, что Franklin Gothic больше подходит слабым читателям, а Garamond — сильным. Если это так, сильные читатели могут действительно увеличить скорость своего чтения с Garamond и повысить его общее среднее значение.
Какова бы ни была истинная причина, различие между Franklin Gothic и Garamond — это просто еще одно доказательство того, что разным людям подходят разные шрифты, а возможный фактор, влияющий на выбор шрифта, — это навыки чтения.
Нельзя спросить пользователей
Если разным людям подходят разные шрифты, возможным решением могла бы стать настройка предпочтений, позволяющая каждому пользователю выбрать наиболее удобный для него шрифт.
Это решение не будет работать по двум причинам:
- Во-первых, предыдущие исследования настройки пользовательского интерфейса показали, что большинство людей не выполняют индивидуальные настройки, а просто обходятся настройками по умолчанию.
- Во-вторых, что еще хуже, пользователи не знают, что для них лучше. Даже если бы им была предоставлена возможность настройки шрифта, они не смогли бы выбрать лучший.
В этом исследовании участники читали на 14% быстрее, используя самый «быстрый» шрифт (в среднем 314 слов в минуту), по сравнению с наиболее предпочтительным для них шрифтом (в среднем 275 слов в минуту).
Опять же каждый пользователь в этом исследовании оценивался лишь по 5 шрифтам, тогда как в большинстве систем их гораздо больше. Чем больше шрифтов, тем выше вероятность неправильного выбора и тем больше разница в скорости чтения между оптимальным шрифтом и выбором пользователя.
Возрастные различия
Возраст пользователей оказал сильное влияние на их скорость чтения. За каждый год жизни она снижалась на 1,5 слова в минуту. Важно отметить, что это не вопрос молодых и пожилых пользователей. Средний возраст участников исследования составил 33 года.
В среднем возрасте скорость чтения падает. За 20 лет жизни (например, от 20 до 40 или от 30 до 50 лет) скорость чтения в среднем снижается на 30 слов в минуту. Таким образом, 50-летнему пользователю потребуется примерно на 11% больше времени, чем 30-летнему пользователю, чтобы прочитать один и тот же текст.
Второй интересный вывод, связанный с возрастом, заключается в том, что разные шрифты по-разному работают для молодежи (до 35 лет) и взрослых пользователей.
3 шрифта (Garamond, Montserrat и Poynter Gothic) показали гораздо лучшие результаты у взрослых пользователей, чем у молодежи. Остальные же 13 шрифтов, как и ожидалось, проявили себя лучше у молодежи.
Кроме того, у молодежи разница в скорости чтения разных шрифтов была минимальной. Что же касается взрослых пользователей, то здесь разница между самым «быстрым» шрифтом (Garamond) и самым «медленным» шрифтом (Open Sans) была существенной. Другими словами, выбор неправильного шрифта навредит взрослым пользователям больше, чем молодым.
И последнее, что стоит отметить здесь: в исследовании участвовало не так много действительно пожилых людей. Максимальный возраст самого старшего участника составил 71 год.
В первом исследовании пользователей в 2002 году «пожилыми» были определены пользователи в возрасте 65 лет и старше. Но в последнем исследовании (2019 г.) было обнаружено, что люди старше 60 лет пользуются компьютерами практически так же, как и люди в возрасте 50 лет. Им не требуются специальные рекомендации по юзабилити, и авторы исследования исключили их из категории пожилых.
К пожилым людям они относят теперь пользователей в возрасте 70 лет и старше. Эта группа уже нуждается в специальных рекомендациях по юзабилити, и, вполне вероятно, что снижение скорости чтения в этой возрастной группе будет прогрессировать более быстрыми темпами.
Поскольку новое исследование обнаружило, что лучшими шрифтами для людей до 35 лет и людей после 35 лет оказались разные шрифты, весьма вероятно, что в будущем будет выявлено еще больше различий в шрифтах, наиболее подходящих для пользователей в возрасте 70 лет и старше.
Возможное решение по оптимизации шрифтов
Что можно сделать, чтобы увеличить скорость чтения пользователей?
Используйте персонализацию, чтобы пользователи могли видеть тексты, оформленные лучшим для них шрифтом. Изначально шрифт будет выбран случайным образом.
По прошествии какого-то времени, когда будет получена надежная оценка скорости чтения пользователя с этим шрифтом, система переключится на другой шрифт и будет тестировать его эффективность. Таким образом можно протестировать несколько шрифтов и выбрать среди них «победителя».
Каждые несколько лет необходимо повторять процесс оптимизации шрифтов, поскольку прежний шрифт уже может перестать «работать» для повзрослевшего пользователя.
Заключение
Несмотря на то, что новое исследование шрифтов не дает нам никаких практических рекомендаций, оно все же содержит несколько полезных для нас выводов:
- Даже среди легко читаемых шрифтов скорость чтения существенно различается, поэтому очень важно подобрать правильный шрифт.
- К сожалению, нет такого шрифта, который бы подходил всем пользователям.
- Мы не можем просить пользователей самостоятельно выбрать шрифт, поскольку они не выберут тот шрифт, который действительно им больше всего подходит.
- С возрастом скорость чтения существенно снижается, даже среди пользователей среднего возраста. Если большая часть вашей аудитории старше 50 лет, рекомендуется сокращать количество слов на 11%.
- Пользователям до 35 лет и пользователям после 35 лет подходят разные шрифты.
- Наконец, стоит помнить, что даже при хорошем шрифте мелкий размер и низкая контрастность способны нанести большой вред.
Высоких вам конверсий!
Почему хороший шрифт так важен?
Выбор хорошего шрифта
имеет решающее значение для UI/UX-дизайнеров при создании успешного мобильного
приложения по следующим причинам:
- Хороший шрифт обеспечивает читабельность и разборчивость. Текст помогает пользователям интуитивно понимать контент и эффективно взаимодействовать с приложением. Четкий и аккуратный шрифт упрощает использование и повышает производительность мобильных страниц.
- Чтобы выделиться среди конкурентов, важно произвести достойное первое впечатление. Можно персонализировать логотип и активно производить впечатление на аудиторию.
- Правильно подобранный шрифт оказывает непосредственное влияние на ваши мобильные приложения и помогает легко улучшить жизнь пользователя – командам разработчиков следует уделять достаточно внимания данному вопросу.
А теперь перейдем непосредственно
к виновникам торжества.
Roboto (бесплатный шрифт Google для Android)
Это нео-гротескное
семейство шрифтов без засечек, отличающееся приятными и открытыми кривыми.
Google разработала его в качестве одного из основных системных шрифтов для
своей ОС. Он быстро запал в душу и стал популярным в наши дни, поэтому
рассматривайте данный вариант в качестве основного для разработки.
Roboto (Free
Google font for Android)
San Francisco (Бесплатный шрифт для iOS)
Еще одно нео-гротескное
семейство шрифтов без засечек, которое может помочь вам создать удобное и так
полюбившееся яблоководам визуальное представление макета. Поскольку ребята из
Apple выбрали его в качестве системного шрифта для своих iOS-устройств, вы не промахнетесь
в выборе. Семейство лучше всего подходит для логотипов и брендирования.
Open Sans (Бесплатный шрифт Google)
Это известный шрифт без
засечек, разработанный Стивеном Меттисоном. Он отличается нейтральными формами,
дружелюбным внешним видом, и считается вторым по популярности шрифтом Google. Идеально
подойдет для использования как в приложениях Android, так и iOS.
Open Sans (Free
Google font)
Lato (Бесплатный шрифт Google)
Разработанное Дзедзицем
Лукашем семейство шрифтов без засечек обладает полукруглыми деталями на буквах, а
структура обеспечивает стабильность и серьезность. Отличный вариант, как для
личного, так и для коммерческого использования.
Lato (Free
Google font)
Montserrat (Бесплатный шрифт Google)
Montserrat – это
знаменитый шрифт Google в стиле ретро. Он имеет два родственных семейства шрифтов
с похожим стилем: Alternates и Subrayada. Если вы ищете шрифты для создания
ретро-приложений – выбирайте этот вариант, он будет очень кстати.
Montserrat (Free
Google font)
Proxima Nova
Proxima Nova – шрифт
без засечек с 48 стилями. Это полная реконструкция Proxima Sans 1994 года, устраняющая
разрыв между такими шрифтами, как Futura и Akzidenz Grotesk, а также замена
Helvetica в качестве одного из самых популярных шрифтов для мобильных устройств
Nexa
Это простое и
современное семейство шрифтов включает в себя 16 уникальных стилей. Они будут хорошо смотреться в заголовках, текстовых блоках и страницах с четкой компоновкой.
Ubuntu
Семейство Ubuntu – это
набор libre/open шрифтов, поддерживаемое широким сообществом Open Source и
проекта Ubuntu.
Область применения –
языки, используемые юзерами Ubuntu по всему миру в соответствии с философией,
которая гласит, что каждый пользователь должен иметь возможность использовать
свое программное обеспечение на выбранном им языке.
Nunito
Nunito – это хорошо
сбалансированный шрифт без засечек с
закругленными краями, который был разработан в основном для использования в
качестве “экранного”, но он также может применяться и в качестве текстового
шрифта. Отлично смотрится в браузерах, на десктопах, ноутбуках и мобильных
устройствах.
Source Sans Pro
Source Sans Pro
Source Sans Pro
известно как первое семейство шрифтов с открытым исходным кодом от Adobe, и
предоставляет пользователям шесть шрифтов в вертикальном и курсивном стилях.
Это хороший вариант, чтобы помочь вам создать более приятные тексты для чтения ваших мобильных приложений.
Шрифты влияют на многие
аспекты ваших мобильных приложений, и их никогда нельзя игнорировать.
Библиотека
программиста надеется, что лучшие бесплатные примеры шрифтов, упомянутые выше,
помогут легко создавать удобные -приложения. Если вы не найдете интересных вариантов в этой подборке,
не отчаивайтесь – ссылки в каждом пункте, несомненно, помогут быстро выбрать
правильный шрифт. Удачи!
Исследование показало, что если прочитать текст, написанный шрифтом самой высокой четкости, потом сделать то же самое с использованием шрифта с самой низкой четкостью, то разница в скорости чтения составит 35%. По мере старения каждые 20 лет скорость чтения человека падает на 11%.
Большое новое исследование лучших шрифтов для чтения в интернете в конечном итоге разочаровывает. Оно не дает ответа на самый животрепещущий вопрос: какой шрифт следует выбрать для сайта? Тем не менее сделано много интересных выводов.
Шон Уоллес из Adobe и его коллеги провели исследование скорости чтения с участием 352 человек. Людей просили прочитать несколько коротких отрывков текста объемом 300–500 слов (для сравнения, эта статья содержит около 2600 слов, а страница сайта в среднем состоит из 593 слов). Уровень сложности тестовых материалов соответствовал уровню 8-го класса. Это является рекомендацией для применения контента на сайте, ориентированном на широкую аудиторию. (Эта статья написана на уровне 12-го класса, но она предназначена для профессионалов).
Тексты были напечатаны с использованием 16 различных шрифтов и распределены в определенном порядке.
Шрифты включали: классические (Times, Helvetica, Garamond), разработанные для использования на компьютере (Calibri, Arial), и удобные для восприятия (Noto Sans, Montserrat); «акцидентных» шрифтов (например, Edwardian Script ITC) не было. Однако во время проведения тестирования каждому участнику давали тексты, написанные с использованием только 5 шрифтов из 16.
Во время навигации в интернете пользователи, как правило, просматривают страницы в поисках полезной информации. Они не читают слово в слово. Таким образом, в реальной жизни люди воспринимают только 28% текста на странице, что составляет примерно 166 слов. Напротив, участники исследования читали все тексты полностью. (По итогу им задавали несколько вопросов на понимание сути каждого отрывка. Это побуждало их читать внимательно).
Разница в манере чтения между пользователями и участниками исследования наводит на мысль: будут ли результаты эксперимента отличаться от полученных в более реалистичных условиях использования интернета. Тем не менее, я все еще думаю, что выводы о взаимосвязи шрифтов со скоростью чтения представляют интерес.
Авторы исследования определяют 3 вида чтения, из которых только один стал предметом изучения:
- Чтение быстрым взглядом нескольких слов в уведомлениях или на крошечных экранах, таких как смарт-часы.
- «Краткое» чтение: чтение коротких отрывков прозы, подобных тем, которые использовались в исследовании и которые можно найти на большинстве веб-сайтов.
- Вдумчивое, подробное чтение, например, чтение книги.
Были собраны три основных показателя:
- Субъективное предпочтение пользователя: какой шрифт понравился каждому человеку больше всего?
- Скорость чтения в словах в минуту (WPM).
- Оценка понимания: процент правильных ответов на вопросы после того, как пользователь закончил чтение текста.
Однако последний показатель был не очень интересен, так как результат всегда составлял примерно 90%. Высокий уровень понимания указывает на то, что (а) содержание было легким для пользователей и (б) люди внимательно читали тексты. Первый вывод не всегда верен для контента на сайте. А второй редко отражает действительность, так как в реальной жизни люди не читают в интернете вдумчиво.
В среднем все участники читали на 35% быстрее, если в тексте использовался самый четкий шрифт (314 слов в минуту), по сравнению с применением шрифта самой плохой четкости (в среднем 232 слова в минуту). Это огромная разница, учитывая, что каждый пользователь читал тексты, которые были напечатаны с применением только 5 шрифтов. Если бы скорость чтения каждого участника измерялась использованием 16 шрифтов, разница между самым “быстрым” и самым “медленным” шрифтом, вероятно, была бы еще больше. Гипотетически при чтении текста, напечатанного всеми доступными шрифтами с достаточной четкостью разница в скорости чтения была бы самой значительной. (Это невозможно проверить, потому что, вероятно, существуют тысячи хороших шрифтов, и есть еще больше плохих шрифтов, которые мы, к сожалению, время от времени встречаем на сайтах).
Эти 16 шрифтов стали предметом исследования. В скобках указана средняя скорость чтения пользователей, выраженная в словах в минуту (WPM).
Нет лучшего шрифта для всех пользователей
С такой большой разницей в скорости чтения среди пользователей можно было бы ожидать, что в ходе исследования будет определен шрифт с наивысшим общим баллом. Что ж, так оно и было: при чтении с использованием шрифта Garamond самая высокая средняя скорость составила 312 слов в минуту. Этот показатель был на 6% лучше, чем у № 2 (Oswald, 295 слов в минуту) и на 23% лучше, чем у шрифта с самой низкой четкостью из 16 протестированных (Open Sans, 254 слова в минуту).
Но Garamond был лучшим только в среднем. Он не был лучшим для всех пользователей. Наблюдались существенные индивидуальные различия.
Многие пользователи читали быстрее при использовании в тексте другого шрифта (не Garamond). Авторы исследования также вычислили рейтинг скорости, который показывает, насколько часто шрифт был самым “быстрым” из тех 5 шрифтов, которые видел пользователь. Garamond достиг рейтинга скорости только в 48% случаев. А это означает, что (немногим) более чем в половине случаев другой шрифт будет лучше восприниматься конкретным пользователем. Если бы участнику дали прочитать текст с использованием всех 16 шрифтов, то рейтинг скорости других шрифтов был бы выше показателя Garamond.
Наивысший рейтинг скорости был достигнут шрифтом Franklin Gothic — 59%. Обратите внимание, что это по-прежнему означает, что 41% пользователей будут быстрее читать с применением в тексте другого шрифта из 5 предложенных. Интересно, что средняя скорость чтения отрывка с использованием Franklin Gothic составила всего 271 слово в минуту, что намного ниже скорости чтения при применении шрифта Garamond (312 слов в минуту). Другими словами, Franklin Gothic подходит большему количеству людей, чем Garamond, но средняя скорость чтения выше у Garamond. Как объяснить это несоответствие? Вполне возможно, что Franklin Gothic — хороший шрифт для слабых читателей, а Garamond — для тех, кто читает хорошо. Если это так, самые сильные читатели могут действительно ускориться при чтении текста с использованием Garamond и увеличить его общий рейтинг. (Помните, что среднее значение 2 и 4 равно 3, тогда как среднее значение 2 и 10 равно 6. Таким образом, если в наборе данных можно увеличить верхний предел, то среднее значение увеличится, даже если нижний предел останется прежним).
Какова бы ни была истинная причина, различие между Franklin Gothic и Garamond является просто еще одним доказательством общего вывода о том, что разные шрифты лучше всего подходят разным людям, а навыки чтения являются возможным фактором, влияющим на рейтинг шрифта.
Не нужно спрашивать мнения пользователей
Если разные шрифты соответствуют разным людям, то возможным решением проблемы будет настройка предпочтения. Она позволит каждому выбрать шрифт, который лучше всего подходит именно ему.
Это решение не будет работать по двум причинам. Во-первых, предыдущие исследования по персонализации пользовательского интерфейса показали, что большинство пользователей обходятся настройками по умолчанию.
Во-вторых, что еще хуже, пользователи не знают, что для них лучше, поэтому они не могут выбрать подходящий шрифт, даже если им предоставлена возможность настроить параметры типографики. В этом исследовании участники читали на 14% быстрее, если в тексте использовался самый “быстрый” шрифт (в среднем 314 слов в минуту). Для сравнения с применением наиболее предпочтительного для них шрифта скорость их чтения составляла в среднем 275 слов в минуту. Опять же, каждый отдельный пользователь в этом исследовании оценивался при чтении текстов с применением только 5 шрифтов. Тогда как многие системы содержат гораздо больше вариантов. Например, на платформе, которую я использую для написания этой статьи, установлено более 200 шрифтов (в том числе и рукописные, которые не выберет ни один здравомыслящий человек в качестве основного текста). Чем больше шрифтов, тем больше вероятность неправильного выбора и большая разница в скорости чтения между оптимальным шрифтом и выбором пользователя.
Разница в возрасте
Возраст пользователей оказывает сильное влияние на их скорость чтения. Каждый год жизни снижает ее на 1,5 слова в минуту. Важно отметить, что речь идет не о сравнении молодых пользователей с пожилыми. Средний возраст участников исследования составил 33 года. Диапазон: от 18 до 71 года, но с небольшим перекосом в пользу более молодой аудитории.
Скорость чтения падает в среднем возрасте. 20-летняя разница в возрасте (например, от 20 до 40 или от 30 до 50 лет) в среднем будет соответствовать замедлению скорости чтения на 30 слов в минуту. Это означает, что 50-летнему пользователю, чтобы прочитать один и тот же текст, потребуется примерно на 11% больше времени, чем 30-летнему. (Рассчитано относительно общей средней скорости чтения в исследовании, которая составила 276 слов в минуту).
Для сравнения, в более раннем исследовании мы изучали производительность пользователей в возрасте от 25 до 60 лет при выполнении определенных задач на сайте. Оно показало, что их производительность снижалась на 0,8% в год. Ее падение соответствует тому, что на выполнение задач на сайтах люди тратят на 16% больше времени, если они старше на 20 лет.
Как объяснить, что снижение производительности, вызванное 20-летним старением, составило 16% в исследовании использования веб-сайтов и только 11% в исследовании чтения в интернете? Одним из объяснений является просто течение времени: между двумя исследованиями прошло примерно 14 лет, причем большая разница была определена в 2007 году, а меньшая — в 2021 году. За эти 14 лет пожилые люди стали более технически подкованными. Возможно, что их здоровье стало лучше благодаря достижениям в области медицины. Сегодняшние 40-летние, вероятно, больше тренируются и принимают больше рецептурных препаратов, из-за чего их мозг деградирует немного медленнее, чем мозг предыдущих поколений.
Другое объяснение (которое я лично считаю более правдоподобным) заключается в том, что оценивались два разных показателя. Да, выполнение задач на сайтах предполагает чтение, но также требует гораздо более продвинутых навыков, таких как использование навигации, поиск и способность оценивать и принимать решения на базе прочитанного. Вполне вероятно, что это более сложная задача относительно таких простых функций, как чтение.
Второй интересный вывод нового исследования, связанный с возрастом, заключается в том, что разные шрифты работают по-разному для молодых и для пожилых читателей.
Garamond, Montserrat и Poynter Gothic лучше воспринимались пожилыми пользователями, чем молодыми. Остальные 13 шрифтов были лучшим вариантом для молодых пользователей, чем для пожилых.
Вывод: если дизайнеры моложе 35 лет, а многие из пользователей старше 35 лет, то невозможно ожидать, что шрифты, которые выберут дизайнеры, будут подходящими для пользователей.
Кроме того, разница в скорости чтения молодых людей с использованием разных шрифтов не была слишком большой. А вот в случаях с пожилыми людьми разница в скорости в зависимости от используемых шрифтов была существенной. Другими словами, выбор неправильного шрифта усложняет жизнь в большей степени пожилым пользователям, чем молодым. Тот же вывод: если дизайнеры молоды, они могут не увидеть больших различий в скорости чтения между разными шрифтами. Это заставляет их принимать дизайнерские решения, основанные в основном на эстетических критериях и предполагать, что легкость восприятия менее важна. Но те шрифты, которые кажутся молодым людям одинаково четкими, могут совершенно по-разному восприниматься пожилыми людьми. (И помните, что в этом исследовании «пожилой» определялся как человек в возрасте 35 лет и старше.)
И последнее замечание о возрастных различиях в чтении: в исследовании участвовало не так много реальных пожилых людей, максимальный возраст самого старшего участника составил 71 год. В нашем первом исследовании пользователей с участием пожилых людей в 2002 году мы определили «пожилых» как пользователей в возрасте 65 лет и старше. Но в нашем последнем исследовании (2019 г.) мы обнаружили, что пользователи в возрасте старше 60 лет используют компьютеры почти так же, как и люди в возрасте 50 лет. Таким образом, им не нужны специальные рекомендации по юзабилити, и мы больше не считаем их пожилыми. Теперь наше определение пожилых людей — это пользователи в возрасте 70 лет и старше. Эта группа нуждается в специальных рекомендациях по юзабилити. Хотя мы намеренно не измеряли их скорость чтения, вполне вероятно, что её снижение будет прогрессировать более быстрыми темпами в более старших возрастных группах.
Возможное решение для оптимизации шрифтов
В качестве предположения я попытался изобрести систему, которая могла бы предоставить отдельным пользователям лучший шрифт, чтобы увеличить их скорость чтения до максимума.
Должна быть возможность использовать персонализацию, чтобы дать конкретному пользователю текст с использованием лучшего для него шрифта. Браузер или электронная книга изначально будут отображать текст с применением случайного шрифта. По прошествии достаточного количества времени система переключится на другой шрифт и будет использовать его до тех пор, пока не будет получена надежная оценка скорости чтения с использованием выбранного шрифта. Этот процесс будет повторяться множество раз. В итоге скорость чтения конкретного пользователя будет измерена при применении нескольких шрифтов. Тот из них, который обеспечит самую высокую скорость чтения будет использоваться в будущем.
Поскольку мы знаем, что восприятие шрифтов с возрастом меняется, следует повторять процесс их оптимизации каждые несколько лет. Это позволит определить новый лучший шрифт для пользователя более старшего возраста.
Было бы странно показывать пользователю текст с использованием постоянно меняющихся шрифтов в период длительной процедуры калибровки, а затем через несколько лет предлагать ему новый шрифт. (Конечно, это нарушение эвристики юзабилити № 4, которая требует последовательности). На самом деле я не предлагаю это решение всерьез. Но поскольку я продемонстрировал, что можно автоматизировать выбор индивидуально оптимизированного шрифта, возможно, однажды оно найдет свое практическое применение.
Вывод
Новое исследование в конечном итоге разочаровывает, потому что не дает практических рекомендаций. Но оно предлагает новый взгляд на чтение в интернете. Он будет способствовать тому, чтобы дизайнеры больше думали о том, как создавать текстовые веб-страницы:
- Даже среди шрифтов с высокой четкостью скорость чтения существенно различается, поэтому важно ответственно подойти к выбору шрифта.
- К сожалению, ни один шрифт не подходит всем пользователям.
- Мы не можем просить пользователей выбрать собственный шрифт, потому что они не знают, какой для них является лучшим.
- С возрастом скорость чтения существенно снижается, даже среди молодых пользователей. Мы всегда рекомендовали сокращать количество слов для цифрового контента. Но теперь, если большая часть вашей аудитории старше 50 лет, мы рекомендуем сокращать количество слов на 11%.
- Существуют возрастные различия в том, какие шрифты лучше для людей моложе 35 лет (большинство дизайнеров) и старше 35 лет (большинство пользователей). Вы — это не ваш пользователь, как мы всегда говорим.
Очевидно, как любят говорить ученые, необходимы дополнительные исследования. Учитывая результаты проведенного анализа, ответ будет непростым. Но мы все еще можем надеяться, что окажется возможным вывести формулу, которая могла бы определить лучший шрифт для конкретного пользователя с учетом нескольких критериев (не одного, к сожалению). Нам также нужен экспериментальный протокол, который более точно отражает типичное поведение веб-пользователей при сканировании сайта.
Наконец, несмотря на то, что исследование не включало ни одного акцидентного шрифта, есть некоторые плохие шрифты. Держитесь от них подальше, потому что они могут значительно снизить скорость чтения текста на сайте. И даже с использованием хороших шрифтов избегайте мелкого текста и низкой контрастности, которые сильно ухудшают восприятие контента.
Введение
Один из читателей нашего блога недавно отправил электронное письмо, в котором спросил, проводились ли исследования, доказывающие превосходство строчных букв, поскольку его компания рассматривает возможность перехода к полностью строчным буквам на своем веб-сайте.
Его случай не уникален. На самом деле, это является последствием более крупной тенденции дизайна к “упрощенным” шрифтам, которые включают в себя:
- узкие;
- низкие;
- легкого начертания;
- тонкого начертания.
Ярким примером являются шрифты, используемые в новых версиях iOS от Apple.
Эта тенденция к упрощению шрифтов наиболее выражена в более коротких сеансах на таких устройствах, как смартфоны и смарт часы. 40% сеансов на телефоне — это микросессии, продолжительность которых составляет менее 15 секунд и представляют собой использование мобильного устройства для минимального взаимодействия с экраном (например, быстрый просмотр уведомления). Подобно этому, сеансы смарт часов такие же короткие и предполагают быстрое потребление информации.
А такие технологии, как дополненная и виртуальная реальность, часто показывают текст, наложенный на сложную сцену — возможность быстро взглянуть на текст и воздействовать на окружающую среду имеет решающее значение для многих задач, выполняемых на этих устройствах.
Определение: Под “беглым взглядом” понимается быстрое чтение короткого текста (часто всего 1 или 2 слова).
Люди обычно используют чтение беглым взглядом, когда параллельно занимаются другими сложными задачами: человек бросает беглый взгляд на смарт-часы, чтобы узнать прогноз погоды на следующий час (например, “осадки 50%, 20ºC”) и захватить соответствующую куртку при выходе из дома. Важно отметить, что при чтении беглым взглядом 1-2 слов в отдельности используется совсем иное поведение, нежели при просмотре беглым взглядом более длинного отрывка текста.
Прогноз погоды на Apple Watch — это пример контента, который обычно читают с первого взгляда. В этой ситуации использование текста, написанного заглавными буквами, помогает при сканировании. Однако контекст имеет значение: в длинном заголовке или отрывке текста один и тот же шрифт с заглавными буквами, скорее всего, ухудшит читаемость.
Для поддержки сеансов микрочтения, которые подразумевают под собой быстрый просмотр короткого текста, нам необходимо создать контент, соответствующий следующим критериям:
- хорошо читаемый в различных условиях освещения;
- легко различимый;
- понятный.
Данная статья посвящена обсуждению следующего вопроса: “Какие шрифты лучше всего использовать?”.
Изучение беглого чтения и типографики
Недавнее исследование группы ученых из Agelab/Clear-IP Массачусетского технологического института под руководством доктора Бена Д. Сойера (Ben D. Sawyer) позволило выяснить, влияет ли размер, регистр и ширина шрифта на скорость распознавания слов. Исследование было завязано на задаче под названием “лексическое решение”, которая широко используется в когнитивной психологии. Суть в следующем: участникам предоставили строки символов, отображаемые разными шрифтами, и измерили, насколько быстро они распознают, являются эти строки словами (например, “веретено”) или не являются (например, “втрно”).
Независимыми переменными в их исследовании были:
- Размер текста: либо маленький (3 мм), либо большой (4 мм).
- Текстовый регистр: либо все заглавные, либо все строчные.
- Начертание текста: узкий или обычный.
Зависимая переменная — время, потраченное на распознавание того, являются предоставленные строки словами или нет.
Во всех случаях в качестве шрифта использовался шрифт Frutiger, так как он очень хорошо показал себя в предыдущих типографских работах и исследованиях разборчивости, которые проводила их команда.
Пример шрифта Frutiger, использованного в исследовании, показывает псевдослово во всех исследуемых условиях (сжатый, обычный, все заглавные, все строчные и два разных размера шрифта высотой 3 и 4 мм на экранах участников). В предыдущих исследованиях Frutiger превосходил многие другие шрифты по разборчивости. Примечание: каждый участник сталкивался с каждым (псевдо)словом только в одном из этих условий, но в течение всего исследования подвергался воздействию всех этих условий.
Более крупный, широкий и заглавный текст превзошел мелкий, узкий и строчный текст
Команда обнаружила, что для удобного чтения лучше использовать более крупный текст, независимо от увеличения количества параметров:
- Большие размеры превосходили меньшие;
- Обычная ширина превосходила сжатую ширину;
- Прописные буквы лучше строчных.
Все эти эффекты были статистически значимыми (на уровне p <0,01) — вероятность случайного возникновения этих величин крайне мала. Хотя в течении некоторого времени уже было известно, что текст большего размера более разборчив, результаты этого исследование показали, что вес и регистр также имеют значение:
- Для чтения строчных букв требовалось на 26% больше времени, чем для прописных;
- Для чтения сжатого текста требовалось на 11,2% больше времени, чем для обычного.
Более того, наблюдались взаимосвязи между регистром и размером: предполагается, что чтение строчных букв усугубляется при использовании небольшого размера шрифта.
Результаты исследования показали, что текст большего размера, текст в верхнем регистре и обычный (по сравнению с узким) начертанием читаются быстрее.
Эти результаты показывают, что символы, занимающие большую площадь (будь то размер шрифта, ширина или регистр), более разборчивы для быстрого просмотра одного или двух слов по отдельности. Но это не значит, что данные результаты обязательно должны быть применимы к сканированию или чтению длинного текста.
Как правило, мы не рекомендуем использовать заглавные буквы в длинных отрывках, где пользователи считывают несколько слов. Текст, полностью написанный заглавными буквами может способствовать снижению разборчивости и большей путанице с буквами, при просмотре более длинных открывков или чтении предложений целиком.
Применение этих результатов к вашему дизайну
Мы, как дизайнеры, не должны забывать, что люди не уделяют всё внимание нашим продуктам, и не используют их в нейтральной и тихой обстановке. Они часто отвлекаются, напряжены или параллельно работают. Дизайн типографики, разборчивый даже в неудобных условиях, может очень помочь пользователям. Например, все мы знаем, что пользоваться смартфоном во время вождения опасно, но мы также знаем, что пользователи все равно это делают. Беспилотные автомобили могут однажды избавить нас от необходимости следить за дорогой и позволить беспрепятственно сидеть в смартфоне во время вождения, но мы еще не достигли этого.
Мы потенциально можем спасти жизни, если разработаем мобильные приложения (например, маршруты движения по GPS), с помощью которых сможем быстро и без усилий читать важный текст с первого взгляда. Кроме того, в дополненной и виртуальной реальности, где обстановка быстро меняется, для представления текстовой информации потребуется легко читаемый текст, который можно быстро просматривать, позволяя пользователям сосредотачить свое внимание на окружающем их мире.
Вот несколько ключевых способов применения этого исследования:
- Используйте более крупные размеры шрифтов там, где нужно выделить более важную информацию;
- Избегайте написания строчными буквами текста, который предназначен для считывания беглым взглядом.
- Используйте текст для больших заголовков в более широких вариантах. Избегайте новой тенденции использовать строчные буквы для заголовков и названий.
- Избегайте сжатых или узких шрифтов, особенно для приложений, которые могут использоваться в отвлекающих условиях (например, GPS-навигация).
- Для уведомлений, форм обратной связи используйте более крупные шрифты в несжатых вариантах, чтобы обеспечить быструю читаемость. Избегайте строчных букв.
- Не совмещайте небольшие размеры (и семейства шрифтов, которые изначально имеют небольшую высоту), с использованием строчных букв, поскольку это усугубит проблемы, присущие любому варианту.
Читаемость заглавных букв и ограничения этого исследования
У вас может возникнуть логичный вопрос: “Если результаты исследования показали, что использование заглавных букв лучше, чем строчных, почему мы не порекомендовали вам использовать заглавные буквы?”. На самом деле, это исследование показывает, что крупный текст более разборчив, когда вы смотрите на одно слово по отдельности, вне контекста предложения. Более крупный строчный текст (на 4 мм, где буквенные формы имеют примерно такую же высоту, как и 3-мм текст с заглавными буквами) становится очень похожим на текст с заглавными буквами.
Эти выводы свидетельствуют о том, что для удобства чтения с первого взгляда более крупный текст лучше, независимо от его размера. Кстати, в шрифте Frutiger, используемом в данном исследовании, размер строчных букв приблизительно равен ¾ их заглавных эквивалентов, в результате чего 4-миллиметровые строчные буквы примерно такого же размера, как и 3-миллиметровые прописные.
Большая часть традиционной теории типографики сосредоточена на том, как верхние и нижние части строчных букв направляют взгляд и улучшают разборчивость, облегчая различение букв. Фактически, авторы этого исследования признали, что «прописные буквы более склонны к путанице». Традиционные исследования (особенно новаторская работа Майлза Тинкера 60-х годов о разборчивости печатного шрифта) показывают, что слова, состоящие только из заглавных букв, труднее читаются и менее разборчивы, чем слова из букв в смешанном регистре, поэтому на первый взгляд это исследование противоречит более старым находкам.
Однако это не первое исследование, предполагающее, что чтение текстов с использованием заглавных буквами более удобно, но только при определенных условиях. Например, очень маленькие размеры шрифта или семейства шрифтов с небольшой высотой. На данный момент эти исследования не обязательно перевернут десятилетия теории типографики и когнитивных исследований. Они просто показывают, что для шрифтов меньшего размера использование прописных букв может уменьшить дефицит разборчивости, который возникает с текстом небольшого размера, когда слова представлены изолированно.
Одна из самых распространенных проблем данного исследования — в нем не рассматриваются смешанные слова, в которых первая буква написана заглавными буквами. В настоящем исследовании также не рассматривались слова в контексте предложения, а только изолированные слова. Понимание предложения является одним из важнейших компонентов удобности чтения, и последствия плохой разборчивости в теории могут уменьшаться по мере накопления контекста в предложении.
Необходимы дополнительные исследования
Хорошее исследование отвечает на некоторые вопросы, но также создает много новых. Конечно, ни одно исследование не рассказывает всех тайн, поэтому необходимы дальнейшие исследования. Совершенно очевидно, что следующим шагом исследования будет проверка условий смешанного регистра.
В идеале, будущие исследования должны рассмотреть другие гарнитуры, в том числе с засечками и без засечек, а также варьировать такие характеристики шрифта, как трекинг, кернинг и вес. Наконец, исследования должны изучить вариации использования шрифтов в контексте (например, в реалистичных сценариях чтения), которые позволят нам понять, насколько эти эффекты разборчивости влияют на удобство использования.
Для быстрого и хорошо различимого чтения короткого текста (всего несколько отдельных слов) лучше использовать следующие характеристики шрифта:
- более крупный шрифт;
- заглавный регистр;
- шрифт обычной ширины, а не сжатый.
Однако использование заглавных букв для более длинных отрывков текста (таких как заголовки, подзаголовки и полные абзацы) не рекомендуется, так как все еще может существовать дефицит удобства чтения.
Привлекательная и эффективная типографика – это ключ к эффективному дизайну веб-сайтов. Это особенно важно, если говорить о мобильных устройствах.
Можно ли предположить, что удачно выбранные шрифты для экрана ПК будут работать также и на мобильном устройстве? Есть много типографских стилей и методик, которые идеально подходят для больших экранов, но не работают и создают проблемы на небольших, мобильных экранах.
Это означает, что для обеспечения наилучшего опыта посетителей с мобильных девайсов, мы должны рассмотреть мобильную типографику веб-сайта и убедиться, что независимо от того, какой вид устройств люди используют, сайты будут выглядеть с привлекательным дизайном, которым легко пользоваться и приятно читать.
Короче говоря, типографика должна рассматриваться в качестве важного элемента для создания отзывчивого сайта. Чтобы достичь этого, мы должны понять, как люди читают с мобильных устройств.
Как люди читают с мобильных устройств
Придите в местное кафе, ресторан или в любое другое место, где много посетителей, использующих мобильные устройства и ноутбуки. Наблюдайте их в действии. Вы заметите значительную разницу в расстоянии между пользователем и устройством. Расстояние будет зависеть от типа устройства, которое используют для чтения.
Приглядевшись, одна из первых вещей, которую вы заметите при наблюдении за читателями с мобильными устройствами – это их близость к экрану. Люди имеют гораздо более близкие отношения со своими мобильными устройствами, чем с их офисными или домашними компьютерами. С мобильного экрана текст читается на расстоянии 12,6 дюймов, а с монитора ПК – на расстоянии 20-23 дюйма от экрана.
Так как экран мобильного устройства меньше, его нужно подносить ближе, чтобы легко и эффективно читать слова с такого экрана. Это означает, что пользователи мобильных физически гораздо ближе к устройству, как и к дизайну вашего сайта. Ключ мобильной типографии в читаемости. Если пользователь не может прочитать, значит ваш дизайн не работает.
Освещение и движение
Другой фактор, который вам нужно соблюдать при наблюдении за людьми читающими с мобильных телефонов – внешние условия, в которых они это делают. Освещение, движение и доступ в интернет – все эти факторы важны. Освещение – очень важный фактор, который на прямую связан с тем, как легко зритель сможет читать с экрана.
Что касается движения, вспомните о движении по шоссе проезжая мимо рекламных щитов. В типографии концепция все та же: уловить и удержать внимание читателя.
Интересными также являются физические барьеры, с которыми люди должны бороться при использовании мобильного устройства, а именно держа их руками и край самого экрана. Когда люди используют настольный компьютер для чтения онлайн-контента, они используют мышь или клавиатуру. На мобильных сенсорных экранах палец выступает в качестве навигации и он обязательно блокирует часть экрана.
Основы отзывчивой типографики
Типография сайта не должна быть “одного размера, подходящего под все”. У вас должен быть адаптивный дизайн. Это означает, что вы можете на сайте использовать один набор типографских стилей для больших экранов, а затем скорректировать эти стили так, чтобы они подходили под небольшие экраны.
Цель заключается не в создании единого стиля для всех размеров экрана, а, скорее, в создании постоянного положительного опыта чтения, независимо от размера экрана.
При разработке отзывчивой веб-типографики, есть некоторые ключевые области, на которые следует обращать внимание, для обеспечения читабельности:
- Шрифт
- Стили CSS (выравнивание, размер, длина линии и т.д.)
- Время загрузки
Предпочтительные мобильные шрифты
Шрифты, которые вы используете в вашем дизайне будут играть важную роль в том, насколько легко сайт будет читаться на мобильных устройствах.
Слишком сложные и тонкие буквы не только трудно читать, особенно тем, у кого нарушения зрения, но также такие буквы имеют тенденцию искажаться при меньших размерах. Это означает, что при масштабировании шрифта для мобильных экранов возникают проблемы с читабельностью.
Во избежание этой проблемы, многие дизайнеры решили использовать шрифты без засечек для мобильных веб-сайтов и приложений. Простые, прямые формы букв, как правило, лучше масштабируются.
Различные шрифты для разных экранах?
При выборе шрифтов для вашего сайта, решите, хотите ли вы, чтобы ваш сайт использовал тот же шрифт на всех размерах экранов или вам удобнее использовать разный шрифт для различных экранов.
Если вы хотите использовать тот же шрифт на всех экранах, вы должны обращать внимание на те шрифты, которые способны подстраиваться к масштабу.
Если вы готовы настроить выбор шрифтов по мере необходимости, вы можете использовать шрифты с засечками или более сложные шрифты для больших дисплеев, а затем заменять их более простыми шрифтами для небольших экранов.
Стили типографики
С помощью нескольких строк CSS, вы можете кардинально изменить внешний вид содержимого текстового сайта, в том числе размер, высоту строки, длину строки и многое другое. Все эти стили играют важную роль в читабельности сайта и имеют большое значение для мобильных экранов.
Два наиболее важных решения при выборе подходящего мобильного шрифта – это размер и пространство.
Размер
С тех пор, как разные шрифты интерпретируются в различных размерах, по умолчанию нет размер шрифта, который необходимо использовать для экранов мобильных телефонов. Хотя все, что меньше 16 пикселей, становится сложным для чтения на любом экране.
А слишком большой текст будет создавать неудобные перерывы (то же самое касается переносов, которые веб-дизайнеры редко используют.) Для мобильных макетов размеры шрифтов, как правило, устанавливаются в em, а не в пикселях, так что размер шрифта является относительным, готовым реагировать на различные параметры экрана.
Интервалы
Когда дело доходит до небольших экранов – особенно на вертикальных устройствах – интервалы крайне важны. Подумайте об условиях с которыми пользователи борются: освещение, закрывание экрана пальцами и т.д. Внесение дополнительного пространства между буквами и вокруг текста имеет решающее значение.
Маленькие экраны мобильных устройств уже затрудняют чтение строк текста, расположенных слишком близко друг к другу. Высота строки, работающая на настольных экранах может быть сложной для чтения на мобильных телефонах.
Такие вещи очень динамичны, так что различные шрифты требуют различных настроек. Начните с высоты линии 1,5. Это даст читателям ощущение воздушности и легкой читаемости текста.
Длина строки
Не только размер и пространство, но также и расположение текста может оказать огромное влияние на общий опыт чтения на мобильном телефоне. Текст с очень короткой строкой уменьшает нормальный поток чтения.
В идеале длина строки для больших экранов должна быть около 65 слов или близко к тому. На небольших устройствах это число должно быть гораздо меньше. Газеты уже давно стремились к длине строчки около 39 слов в узких столбцах. Это хороший пример для мобильных устройств с узкими колонками на сайте.
Выравнивание
По умолчанию веб-страницы выравнивают текст по левому краю. Многие дизайнеры в их дизайне любят настроить выравнивание по ширине. В некоторых случаях такие стили могут работать очень хорошо, но они часто не работают на мобильных телефонах.
Для мобильных экранов, которые по умолчанию выравнивают по левому краю – это часто лучший выбор. За текстом, выравненным по левому краю, легче следить. Но из-за малой ширины в большинстве случаев колонки текста на мобильных устройствах могут создавать необычные пробелы в содержании.
Даже если вы используете разные выравнивания в вашем дизайне на больших дисплеях, вы, возможно, захотите вернуться к выравниванию по левому краю на мобильных экранах для улучшения читабельности.
Производительность и функциональность
Последним фактором в мобильной типографике вашего сайта является общая производительность и функциональность самого сайта. То, как быстро сайт загружается для посетителей и как он на самом деле работает.
Насчет производительности, мобильные пользователи с ненадежным соединением сети будут страдать от медленных загрузок. Если ваш сайт использует множество веб-шрифтов – это может негативно влиять на его производительность.
Веб безопасные шрифты
Веб-безопасные шрифты могут быть не такими привлекательными, как многие из доступных сегодня вариантов веб-шрифтов, но выбор таких шрифтов улучшает производительность, так что не сбрасывайте их со счетов. Особенно это полезно для мобильных сайтов.
Дизайн к которому можно прикоснуться
Многие из принципов хорошей типографии применяются также к мобильной типографии. Использование шрифтов, которые легко читать, с надлежащим интервалом и четкими буквами – это необходимо для любого экрана. Вы должны также рассмотреть уникальные характеристики этих устройств, то, как люди взаимодействуют с ними и в различных средах.
При рассмотрении типографики на мобильных устройствах, нужно понять, что пользователи будут касаться этого текста своими пальцами.
Надеемся эти советы помогут вам в создании успешной мобильной типографики.
Главное фото взято с сайта Depositphotos
Насколько хорошо вы разбираетесь в типографике?
15 лучших книг по типографике и шрифтам, которые необходимо знать
