Создание и разработка доступного контента — это больше, чем просто выбор легко читаемого шрифта. Даже при использовании доступных шрифтов людям с ослабленным зрением, когнитивными, языковыми и учебными нарушениями может быть трудно воспринимать текст из-за других факторов, таких как вариации шрифта, размер, межстрочный интервал и кернинг — и это лишь некоторые из них.
В этом модуле рассматриваются основные аспекты дизайна, позволяющие сделать ваш контент более инклюзивным и охватить еще больше людей.
Шрифт
Одним из важнейших факторов, существенно влияющих на доступность текста, является шрифт. Выбор шрифта и стиля может как улучшить, так и испортить дизайн любой страницы.
Люди с нарушениями чтения, обучения и внимания, такими как дислексия и синдром дефицита внимания и гиперактивности (СДВГ), а также люди со слабым зрением могут получить пользу от использования доступных шрифтов.
Выберите распространённые шрифты.
Самый быстрый способ создать доступный дизайн — выбрать распространенный шрифт (например, Arial, Times New Roman, Calibri, Verdana и многие другие).
Многочисленные исследования шрифтов, в которых участвовали люди с ограниченными возможностями, показывают, что распространенные шрифты приводят к более высокой скорости чтения и более глубокому пониманию текста по сравнению с редкими шрифтами. Хотя распространенные шрифты сами по себе не являются более доступными, чем другие, некоторым людям с ограниченными возможностями легче их читать, потому что у них есть большой опыт работы с этими шрифтами (или взаимодействия с ними).
Помимо выбора распространенного шрифта, обязательно избегайте витиеватых или рукописных шрифтов, а также шрифтов, в которых доступен только один регистр символов (например, только заглавные буквы). Эти специальные шрифты с курсивным оформлением, необычными формами или художественными особенностями, такими как тонкие линии, могут выглядеть красиво, но некоторым людям с ограниченными возможностями гораздо сложнее их читать, чем обычные шрифты.
Характеристики букв и кернинг
Исследования, посвященные вопросу о том, какие шрифты легче читать — с засечками или без засечек, не дали однозначных результатов, но некоторые цифры, буквы или их сочетания могут сбивать с толку людей с нарушениями обучения, связанными с языком, и когнитивными расстройствами . Для людей с такими расстройствами каждая буква и цифра должны быть четко определены и иметь уникальные характеристики, чтобы буквы не путались с цифрами.
К числу распространенных ошибок, нарушающих читаемость, относятся заглавная буква I (Индия), строчная l (салат) и цифра 1 Аналогично, пары букв, такие как b и d , p и q , f и t , i и j , m и w , а также n и u могут казаться некоторым читателям перевернутыми слева направо или сверху вниз.
Читабельность текста также снижается, если межбуквенное расстояние или кернинг слишком малы. Обратите особое внимание на кернинг, особенно между проблемной парой букв r/n. В противном случае слова типа «yarn» могут измениться на «yam» или «stern» на «stem», полностью изменив смысл текста.
Открытые коллекции шрифтов, такие как Google Fonts, могут помочь вам выбрать наиболее подходящий шрифт для вашего следующего проекта. Если вы используете продукты Adobe, вы можете встраивать доступные семейства шрифтов от партнеров-шрифтостроительных компаний непосредственно в свои проекты — это включает в себя некоторые шрифты Google Fonts .
При выборе следующего шрифта обратите особое внимание на следующее:
- По возможности используйте распространённые шрифты.
- Избегайте использования сложных или рукописных шрифтов, а также шрифтов, в которых используется только один регистр символов.
- Выберите шрифт с уникальными характеристиками, обратив особое внимание на заглавную букву I, строчную букву l и цифру 1.
- Проверьте определенные сочетания букв, чтобы убедиться, что они не являются точным зеркальным отражением друг друга.
- Проверьте кернинг, особенно между парой букв r и n .
Размер шрифта и типографическое оформление
Часто считается, что для создания инклюзивного контента достаточно просто выбрать подходящий шрифт, но также важно учитывать размер шрифта и стиль оформления текста на странице.
Например, люди с ослабленным зрением или дальтонизмом могут не суметь прочитать часть текста, если он слишком мелкий, и им придётся использовать для этого вспомогательные технологии, такие как масштабирование в браузере. Другие пользователи, например, люди с дислексией или нарушениями чтения, могут испытывать трудности с чтением курсивного текста. Программы чтения с экрана часто игнорируют методы стилизации, такие как выделение жирным шрифтом и курсивом, поэтому смысл этих стилей не передаётся слепым или слабовидящим пользователям.
h2 {font-size: 16px;}h2 {font-size: 1rem;}Поскольку невозможно предсказать потребности каждого пользователя, при добавлении шрифтов на ваши веб-сайты и веб-приложения обязательно учитывайте следующие рекомендации:
- Базовые размеры шрифта следует задавать с помощью относительного значения (%, rem или em), чтобы обеспечить возможность изменения размера.
- Ограничьте количество вариантов шрифта, таких как цвет, жирный шрифт , ЗАГЛАВНЫЕ БУКВЫ и курсив , чтобы повысить читаемость. Вместо этого используйте методы выделения слов в тексте, такие как звездочки, тире или выделение отдельного слова.
- По возможности используйте разметку вместо текста на изображениях. Программы чтения с экрана не могут считывать встроенный текст с изображений (без добавления дополнительного кода), а встроенный текст может становиться пикселизированным при увеличении пользователями со слабым зрением.
Структура и планировка
Хотя шрифт, размер шрифта и типографический стиль важны для обеспечения доступности текста, структура и расположение текста на странице могут быть не менее важны для понимания пользователем.
Сложные макеты могут стать настоящим препятствием для людей со слабым зрением, трудностями чтения и для 6,1 миллиона человек в США, страдающих СДВГ . Эти виды нарушений затрудняют людям отслеживание места в тексте и понимание его структуры из-за отсутствия четких линейных путей, отсутствующих заголовков и несгруппированных элементов.
Важным аспектом доступного дизайна является разграничение ключевых элементов и группировка схожих элементов. Если элементы расположены слишком близко друг к другу, бывает трудно определить, где начинается и заканчивается тот или иной элемент, особенно если они имеют схожий стиль.
Представьте свой текст как набор отдельных пунктов в плане. Это поможет вам спланировать общую структуру страницы и позволит использовать заголовки, подзаголовки и списки там, где это уместно.
Расстояние
Межстрочный интервал, расстояние между предложениями и словами помогает читателям сосредоточиться на тексте и улучшает общее визуальное восприятие страницы. Длинные строки текста могут стать препятствием для читателей с ограниченными возможностями, поскольку им трудно следить за ходом текста и понимать его структуру.
Узкий блок текста облегчает читателям переход к следующей строке.
выравнивание контента
Еще одна проблема, с которой сталкиваются многие люди с ограниченными возможностями, — это чтение текста, выровненного по ширине. Неравномерное расстояние между словами в выровненном по ширине тексте может приводить к образованию «потоков» на странице, что затрудняет чтение.
Выравнивание текста также может приводить к тому, что слова располагаются слишком близко друг к другу или растягиваются неестественным образом, из-за чего читателям может быть трудно определить границы слов.
К счастью, существуют четкие рекомендации по межстрочному интервалу и такие инструменты, как «Правильная межстрочная высота» и «Калькулятор золотого сечения», которые помогают сделать наш текст более доступным. Применение этих рекомендаций помогает людям с синдромом дефицита внимания, нарушениями чтения и зрения больше сосредоточиться на тексте и меньше — на макете.
Рекомендации по структуре и планировке
При проектировании структуры и планировки обязательно учитывайте следующее:
- Используйте такие элементы, как заголовки, подзаголовки, списки, номера, блоки цитат и другие визуальные группы, чтобы разбить страницу на разделы.
- Используйте четко определенные абзацы, предложения и межсловные интервалы.
- Создавайте столбцы текста шириной менее 80 символов (40 символов для логограмм).
- Избегайте выравнивания абзацев по ширине, так как это создает «пробелы» в тексте.
Основные принципы доступной типографики
Доступная типографика сводится к логичным дизайнерским решениям, основанным на знании потребностей пользователей. Учитывая этот аспект при разработке и создании контента, вы сможете эффективно и понятно донести свою информацию до как можно большего числа людей.