13 советов по выбору правильного шрифта для небольших экранов
- Типографика
- 6 мин на чтение
- 2462
Привлекательная и эффективная типографика — это ключ к эффективному дизайну веб-сайтов. Это особенно важно, если говорить о мобильных устройствах.
Можно ли предположить, что удачно выбранные шрифты для экрана ПК будут работать также и на мобильном устройстве? Есть много типографских стилей и методик, которые идеально подходят для больших экранов, но не работают и создают проблемы на небольших, мобильных экранах.
Это означает, что для обеспечения наилучшего опыта посетителей с мобильных девайсов, мы должны рассмотреть мобильную типографику веб-сайта и убедиться, что независимо от того, какой вид устройств люди используют, сайты будут выглядеть с привлекательным дизайном, которым легко пользоваться и приятно читать.
Короче говоря, типографика должна рассматриваться в качестве важного элемента для создания отзывчивого сайта. Чтобы достичь этого, мы должны понять, как люди читают с мобильных устройств.
Как люди читают с мобильных устройств
Придите в местное кафе, ресторан или в любое другое место, где много посетителей, использующих мобильные устройства и ноутбуки. Наблюдайте их в действии. Вы заметите значительную разницу в расстоянии между пользователем и устройством. Расстояние будет зависеть от типа устройства, которое используют для чтения.
Приглядевшись, одна из первых вещей, которую вы заметите при наблюдении за читателями с мобильными устройствами — это их близость к экрану. Люди имеют гораздо более близкие отношения со своими мобильными устройствами, чем с их офисными или домашними компьютерами. С мобильного экрана текст читается на расстоянии 12,6 дюймов, а с монитора ПК — на расстоянии 20-23 дюйма от экрана.
Так как экран мобильного устройства меньше, его нужно подносить ближе, чтобы легко и эффективно читать слова с такого экрана.
Это означает, что пользователи мобильных физически гораздо ближе к устройству, как и к дизайну вашего сайта. Ключ мобильной типографии в читаемости. Если пользователь не может прочитать, значит ваш дизайн не работает.
Освещение и движение
Другой фактор, который вам нужно соблюдать при наблюдении за людьми читающими с мобильных телефонов — внешние условия, в которых они это делают. Освещение, движение и доступ в интернет — все эти факторы важны. Освещение — очень важный фактор, который на прямую связан с тем, как легко зритель сможет читать с экрана.
Что касается движения, вспомните о движении по шоссе проезжая мимо рекламных щитов. В типографии концепция все та же: уловить и удержать внимание читателя.
Интересными также являются физические барьеры, с которыми люди должны бороться при использовании мобильного устройства, а именно держа их руками и край самого экрана. Когда люди используют настольный компьютер для чтения онлайн-контента, они используют мышь или клавиатуру.
На мобильных сенсорных экранах палец выступает в качестве навигации и он обязательно блокирует часть экрана.
Основы отзывчивой типографики
Типография сайта не должна быть «одного размера, подходящего под все». У вас должен быть адаптивный дизайн. Это означает, что вы можете на сайте использовать один набор типографских стилей для больших экранов, а затем скорректировать эти стили так, чтобы они подходили под небольшие экраны.
Цель заключается не в создании единого стиля для всех размеров экрана, а, скорее, в создании постоянного положительного опыта чтения, независимо от размера экрана.
При разработке отзывчивой веб-типографики, есть некоторые ключевые области, на которые следует обращать внимание, для обеспечения читабельности:
— Шрифт
— Стили CSS (выравнивание, размер, длина линии и т.д.)
— Время загрузки
Предпочтительные мобильные шрифты
Шрифты, которые вы используете в вашем дизайне будут играть важную роль в том, насколько легко сайт будет читаться на мобильных устройствах.
Слишком сложные и тонкие буквы не только трудно читать, особенно тем, у кого нарушения зрения, но также такие буквы имеют тенденцию искажаться при меньших размерах. Это означает, что при масштабировании шрифта для мобильных экранов возникают проблемы с читабельностью.
Во избежание этой проблемы, многие дизайнеры решили использовать шрифты без засечек для мобильных веб-сайтов и приложений. Простые, прямые формы букв, как правило, лучше масштабируются.
Различные шрифты для разных экранах?
При выборе шрифтов для вашего сайта, решите, хотите ли вы, чтобы ваш сайт использовал тот же шрифт на всех размерах экранов или вам удобнее использовать разный шрифт для различных экранов.
Если вы хотите использовать тот же шрифт на всех экранах, вы должны обращать внимание на те шрифты, которые способны подстраиваться к масштабу.
Если вы готовы настроить выбор шрифтов по мере необходимости, вы можете использовать шрифты с засечками или более сложные шрифты для больших дисплеев, а затем заменять их более простыми шрифтами для небольших экранов.
Стили типографики
С помощью нескольких строк CSS, вы можете кардинально изменить внешний вид содержимого текстового сайта, в том числе размер, высоту строки, длину строки и многое другое. Все эти стили играют важную роль в читабельности сайта и имеют большое значение для мобильных экранов.
Два наиболее важных решения при выборе подходящего мобильного шрифта — это размер и пространство.
Размер
С тех пор, как разные шрифты интерпретируются в различных размерах, по умолчанию нет размер шрифта, который необходимо использовать для экранов мобильных телефонов. Хотя все, что меньше 16 пикселей, становится сложным для чтения на любом экране.
А слишком большой текст будет создавать неудобные перерывы (то же самое касается переносов, которые веб-дизайнеры редко используют.) Для мобильных макетов размеры шрифтов, как правило, устанавливаются в em, а не в пикселях, так что размер шрифта является относительным, готовым реагировать на различные параметры экрана.
Интервалы
Когда дело доходит до небольших экранов — особенно на вертикальных устройствах — интервалы крайне важны. Подумайте об условиях с которыми пользователи борются: освещение, закрывание экрана пальцами и т.д. Внесение дополнительного пространства между буквами и вокруг текста имеет решающее значение.
Маленькие экраны мобильных устройств уже затрудняют чтение строк текста, расположенных слишком близко друг к другу. Высота строки, работающая на настольных экранах может быть сложной для чтения на мобильных телефонах.
Такие вещи очень динамичны, так что различные шрифты требуют различных настроек. Начните с высоты линии 1,5. Это даст читателям ощущение воздушности и легкой читаемости текста.
Длина строки
Не только размер и пространство, но также и расположение текста может оказать огромное влияние на общий опыт чтения на мобильном телефоне. Текст с очень короткой строкой уменьшает нормальный поток чтения.
В идеале длина строки для больших экранов должна быть около 65 слов или близко к тому.
На небольших устройствах это число должно быть гораздо меньше. Газеты уже давно стремились к длине строчки около 39 слов в узких столбцах. Это хороший пример для мобильных устройств с узкими колонками на сайте.
Выравнивание
По умолчанию веб-страницы выравнивают текст по левому краю. Многие дизайнеры в их дизайне любят настроить выравнивание по ширине. В некоторых случаях такие стили могут работать очень хорошо, но они часто не работают на мобильных телефонах.
Для мобильных экранов, которые по умолчанию выравнивают по левому краю — это часто лучший выбор. За текстом, выравненным по левому краю, легче следить. Но из-за малой ширины в большинстве случаев колонки текста на мобильных устройствах могут создавать необычные пробелы в содержании.
Даже если вы используете разные выравнивания в вашем дизайне на больших дисплеях, вы, возможно, захотите вернуться к выравниванию по левому краю на мобильных экранах для улучшения читабельности.
Производительность и функциональность
Последним фактором в мобильной типографике вашего сайта является общая производительность и функциональность самого сайта.
То, как быстро сайт загружается для посетителей и как он на самом деле работает.
Насчет производительности, мобильные пользователи с ненадежным соединением сети будут страдать от медленных загрузок. Если ваш сайт использует множество веб-шрифтов — это может негативно влиять на его производительность.
Веб безопасные шрифты
Веб-безопасные шрифты могут быть не такими привлекательными, как многие из доступных сегодня вариантов веб-шрифтов, но выбор таких шрифтов улучшает производительность, так что не сбрасывайте их со счетов. Особенно это полезно для мобильных сайтов.
Дизайн к которому можно прикоснуться
Многие из принципов хорошей типографии применяются также к мобильной типографии. Использование шрифтов, которые легко читать, с надлежащим интервалом и четкими буквами — это необходимо для любого экрана. Вы должны также рассмотреть уникальные характеристики этих устройств, то, как люди взаимодействуют с ними и в различных средах.
При рассмотрении типографики на мобильных устройствах, нужно понять, что пользователи будут касаться этого текста своими пальцами.
Надеемся эти советы помогут вам в создании успешной мобильной типографики.
Источник: say-hi
Фото на обложке и в статье: ShutterStock
- #веб
- #веб-дизайн
- #сайт
- #статья
- #шрифт
- 1
Какой шрифт лучше для зрения?
Статьи › ИНВИТРО › Какой шрифт у ИНВИТРО?
Verdana является самым безопасным для зрения экранным шрифтом — к такому выводу пришли ученые из Лаборатории зрительной эргономики в США в 2010 году.
- Какой шрифт не портит зрение?
- Какой цвет шрифта лучше для глаз?
- Какой шрифт самый приятный для чтения?
- Какой размер шрифта лучше для чтения?
- Как отличить хороший шрифт от плохого?
- Какой шрифт лучше для чтения с бумаги?
- Какой цвет не вреден для глаз?
- Что лучше для глаз IPS или VA?
- На каком фоне лучше читать ночью?
- Какой шрифт нравится людям?
- Какой шрифт лучше с засечками или без?
- Какой текст удобнее читать?
- Какой шрифт самый популярный?
- Какой стандартный размер шрифта?
- Какой шрифт должен быть в книге?
- Как нужно читать чтобы не портить зрение?
- Что будет если читать мелкий шрифт?
- Как читать с плохим зрением?
- Какой цвет самый приятный для чтения?
- Какой цвет комфортен для глаз?
- Какой шрифт лучше всего запоминается?
- Какой шрифт нельзя использовать?
- Как правильно выбрать шрифт?
- Какой шрифт лучше всего к субтитрам?
- Какой шрифт легче читать с засечками или без?
- Какой цвет бумаги лучше для глаз?
Какой шрифт не портит зрение?
Лучший шрифт для зрения
По результатам исследований специалисты особо выделили шрифт Verdana.
Шрифт Verdana был разработан в 1996 году художником Мэттью Картером по заказу корпорации Microsoft.
Какой цвет шрифта лучше для глаз?
Для глаз комфортнее оттенки, а не чистые цвета: серый, светло-зеленый, голубой. При большой контрастности глазам тяжело, поэтому в темной комнате лучше использовать темную тему или ночной режим. Когда светло, черный текст на белом фоне читать легче.
Какой шрифт самый приятный для чтения?
Читаемость шрифтов на электронных экранах
Ученые попробовали разобраться, как влияет сглаживание на читаемость. Интересно, что самым читаемым оказался экранный шрифт со сглаживанием (а не напечатанный), и это шрифт без засечек — Arial. Второй после него — Verdana, тоже без засечек.
Какой размер шрифта лучше для чтения?
Для каждого типа книжного издания определен наиболее читаемый размер кегля. Так, для художественной литературы подходит 10-12-ый кегль. Для остальной печатной продукции оптимальным считается 9-14-ый кегль.
Как отличить хороший шрифт от плохого?
Для текста формы знаков должны быть легко считываемыми, глаз не должен спотыкаться о формы букв.
Шрифт с плохим кернингом или его отсутствием может сработать в логотипе, где дизайнер сам настроит расстояния между буквами.
Какой шрифт лучше для чтения с бумаги?
Если лучший шрифт для чтения с бумаги — Baskerville или Times, то на экране компьютера хотелось бы видеть больше текстов, набранных Verdana (оптимальный кегль — 10-12 пунктов). Ученые установили, что при чтении с монитора эти гарнитура и размер наиболее удобны для глаз.
Какой цвет не вреден для глаз?
1. Полезно часто смотреть на зеленый цвет. Он, как выяснили офтальмологи, действует успокаивающе на зрительные анализаторы и умиротворяюще на нервную систему в целом. Ничто так хорошо не снимает утомление глаз, как созерцание травы или деревьев с распустившимися листьями.
Что лучше для глаз IPS или VA?
Бюджетный вариант — матрица TN, хороший вариант для геймеров; IPS и VA обладают лучшей цветопередачей и более высокой контрастностью, но при этом они обновляются медленнее. VA самые щадящие для человека, но стоят они дороже, подойдут тем, кто много работает с видео- и фотоматериалами.
На каком фоне лучше читать ночью?
Правило №1 Освещение
В идеале читать нужно только при хорошем освещении. Можно при немного тусклом (лампочка Ильича, в транспорте), но в этом случае должна быть активная подсветка дисплея. В темноте читать нельзя ни при каких условиях (даже блеклый белый цвет на черном фоне) — посадите, сами того не замечания, зрение.
Какой шрифт нравится людям?
Шрифт, который лучше воспринимается клиентами
Наиболее распространенный, а также самый лучший для понимания шрифт — Helvetica. Он встречается в 21% созданных логотипов.
Какой шрифт лучше с засечками или без?
Для основного текста лучше использовать шрифты с засечками — serif. Объем материала не будет выглядеть тяжелым благодаря засечкам: они добавляют воздух в большие блоки. Текст читается удобнее и быстрее, не нагружает глаз. Примеры (удачных) шрифтов с засечками:Lora, PT Serif, Noto Serif, Antic SLab и др.
Какой текст удобнее читать?
Лучше всего читается текст чёрного цвета, набранный на бумаге кремового или сероватого оттенка.
Ослепительно белая бумага, особенно мелованная или глянцевая, слишком сильно отражает свет, поэтому длительное чтение с неё может быть утомительным.
Какой шрифт самый популярный?
Helvetica
Он предназначался для того, чтобы заполнить отсутствие нейтрального шрифта, подходящего для вывесок. Где вы могли его видеть: Считается самым распространенным шрифтом в мире.
Какой стандартный размер шрифта?
Размер шрифта основного текста (кегль) — 14 (Формат → Шрифт → Размер 14). Размер шрифта в подстрочных ссылках — 12. Размер шрифта в затекстовых ссылках и списках литературы — 14.
Какой шрифт должен быть в книге?
Шрифт — лучше всего стандартный, Times New Roman, 12-14 кегль, 1-1,5 межстрочный интервал. Писать черновик можно каким угодно шрифтом, но редактору нужно отправлять уже стандарт.
Как нужно читать чтобы не портить зрение?
Как сохранить зрение:
- Ни в коем случае не читайте лежа!
- При чтении расстояние от глаз до книги должно быть не менее 30 см.
- Свет должен падать на страницы сверху и слева.
- Во время чтения не забывайте делать перерывы от трех до пяти минут.
Что будет если читать мелкий шрифт?
Продолжительное чтение — даже мелкого текста — может вызвать разве что утомление и усталость глаз, ощущение дискомфорта и «сухости». Но нет никаких доказательств того, что это наносит какой‑либо вред нашему зрению и повышает риск каких‑либо органических заболеваний глаз в старости.
Как читать с плохим зрением?
В случаях сильной близорукости, возможно, появится необходимость читать одним глазом, так как расстояние для чтения может быть слишком коротким, чтобы читать одновременно обоими глазами. В этих случаях лучше прикрыть один глаз каким-либо щитком на время чтения, пока другой глаз не устанет, затем прикрыть другой.
Какой цвет самый приятный для чтения?
Цвет текста должен контрастировать с фоном
По статистике лучшей читабельностью отличается традиционный черный шрифт на белом или неярком желтом фоне.
Хуже всего воспринимается сочетание светлого текста и темного фона.
Какой цвет комфортен для глаз?
Освещение теплого белого цвета с привычным желтоватым оттенком комфортно и приятно для человеческих глаз, его свечение такое же, как у желтого солнечного света ранним утром или ближе к закату. Его могут обеспечить как обычные лампы накаливания, так и галогенные.
Какой шрифт лучше всего запоминается?
Осенью 2018 года австралийские дизайнеры вместе с исследователями из Мельбурнского королевского технологического университета представили Sans Forgetica — шрифт, разработанный для лучшего запоминания информации.
Какой шрифт нельзя использовать?
Times New Roman и Arial им больше недоступны Каталог шрифтов Monotype, в числе которых Times New Roman и Arial больше недоступен с российских IP. Официальных заявлений по этому поводу компания не делала. Вероятно, это часть международных антироссийских санкций — Monotype не в первый раз вводит ограничения для россиян.
Как правильно выбрать шрифт?
Выбирайте шрифт, который подходит цели по общепринятым меркам и легко читается. Избегайте слишком вычурных шрифтов в пользу простых и практичных. Также помните о том, зачем вам нужен шрифт. Например, некоторые шрифты лучше подходят для заголовков, другие — для основного текста.
Какой шрифт лучше всего к субтитрам?
6) Шрифт — всем приевшийся, но хорошо читаемый Arial. Это основной шрифт в мировой практике создания субтитров. Применяют и другие, например, Times new roman, Tahoma… Шрифт должен быть простой, не слишком жирный, буквы не должны сливаться.
Какой шрифт легче читать с засечками или без?
Тексты, предназначенные для чтения с экрана, лучше всего набирать шрифтом без засечек: он лучше сглаживается и потому легче воспринимается при беглом чтении. Наиболее безопасной для глаз гарнитурой, пригодной для набора текстов в электронном формате, признана Verdana: это выяснили американские учёные в 2011 году.
Какой цвет бумаги лучше для глаз?
Как ни странно, один из наиболее комфортных для зрения вариантов — не презентабельная на первый взгляд газетная бумага желтоватого или сероватого оттенка.
Она не «ослепляет» даже при ярком освещении, создаёт нормальный контраст с текстом и не утомляет глаза так сильно, как отбеленные или глянцевые варианты.
Мои восемь любимых бесплатных шрифтов для людей с ограниченными возможностями печати
В начале каждого учебного года у меня часто есть возможность научить людей тому, как создавать доступные материалы для слабовидящих, и всегда подчеркиваю важность выбора шрифта. В мире существуют миллионы шрифтов, и во многих случаях более креативные варианты шрифтов трудно читать или они выглядят странно, когда они напечатаны крупным шрифтом. Сегодня я поделюсь своими восемью любимыми бесплатными шрифтами для людей с ограниченными возможностями печати, слабовидящих и доступных материалов (крупный шрифт).
Ариал
Как однажды объяснил мой TVI, Arial — один из лучших шрифтов для людей с нарушениями зрения, потому что каждая буква проста и отличается от других букв, а также фантастически выглядит жирным шрифтом. Мне особенно нравится использовать Arial с цифровыми материалами, так как я могу читать его в течение длительного периода времени, но он долгое время оставался одним из моих лучших шрифтов.
Гельветика
Helvetica очень популярен среди дизайнеров, так как он может быть разного веса и красиво увеличиваться. По внешнему виду он очень похож на Arial, однако я предпочитаю использовать Helvetica, когда читаю на перевернутом дисплее (светлый текст на темном фоне), потому что более тяжелый шрифт помогает моим глазам легче сфокусироваться на странице. Как и Arial, Helvetica предустанавливается на компьютеры. Узнайте больше об упрощении чтения с помощью технологий здесь и о том, как упростить просмотр информации на доске здесь.
Бебас Нойе
В Bebas Neue используются все заглавные буквы и четкие линии, а также четкая форма, которая облегчает чтение. Мне нравится использовать его для заголовков, так как его легко распознать на странице, и я использую его в качестве предпочтительного шрифта для логотипа и заголовков в своем блоге.
Загрузите Bebas Neue здесь и узнайте больше о том, что делает веб-сайт доступным здесь.
Калибри
Calibri — это шрифт по умолчанию в Microsoft Word, и на то есть веские причины. Он имеет высокую читаемость при большом размере шрифта, и мне стало легче отличить букву а от буквы u, а также букву g от y с этим шрифтом. Мне нравится использовать этот шрифт при наборе текста, чтобы я мог легко видеть, что пишу, но я часто меняю шрифт, если у меня устают глаза, потому что на более тонких буквах трудно сосредоточиться. Calibri предварительно устанавливается на компьютеры. Подробнее о том, как справиться с усталостью глаз, читайте здесь.
APHont
Ищете шрифт, специально разработанный для пользователей с плохим зрением? APHont может быть идеальным шрифтом для вас. Созданный Американской типографией для слепых, он предназначен для быстрого и четкого чтения при любом размере и весе шрифта, с более длинными концами букв Q, G, J и Y. Чтобы загрузить этот шрифт, пользователям необходимо пройти сертификацию.
Комикс Санс
Хорошо, я знаю многих людей, которые не любят Comic Sans и думают, что это самый бесполезный шрифт из существующих. Тем не менее, это один из немногих шрифтов, удобных для людей с дислексией и нарушением зрения, который доступен повсюду, поскольку на буквы легко сфокусироваться, и они выглядят уникальными. Хотя этот шрифт отлично подходит для учащихся начальных классов, стоит отметить, что старшеклассников могут дразнить за то, что все их доступные материалы написаны этим шрифтом. Comic Sans предварительно установлен на большинстве компьютеров и не требует загрузки. Прочтите мое письмо учителям начальных классов с точки зрения слабовидящего ученика здесь.
Лавандерия
Хотя курсивных шрифтов следует избегать, когда это возможно, большинству учащихся в какой-то момент придется выучить курсив и попрактиковаться в начертании букв.
OpenDyslexic
Помните, как я упоминал, что старшеклассников могут дразнить за то, что все их доступные материалы написаны Comic Sans, несмотря на то, что это отличный шрифт? Фантастическая альтернатива — OpenDyslexic, которая имеет утяжеленное дно и легко различает буквы для людей с ограниченными возможностями восприятия печатной информации. Когда дело доходит до продуктов для специальных возможностей, кажется, что он везде — я впервые познакомился с ним на Bookshare, где это был вариант шрифта для одной из их программ для чтения электронных книг, и с тех пор я видел его во многих других продуктах. Загрузите OpenDyslexic здесь и узнайте больше о Bookshare здесь.
Все учащиеся разные, поэтому важно экспериментировать с разными шрифтами, размерами и насыщенностью, чтобы определить, какой шрифт лучше всего подходит для каждого учащегося и каждого предмета.
Я надеюсь, вам понравилось читать о моих восьми любимых бесплатных шрифтах для людей с ограниченными возможностями печати, таких как плохое зрение, и что вы нашли шрифт, который вам понравится.
Вероника Льюис/Вероника с четырьмя глазами, www.veroniiiica.com
Вернуться на домашнюю страницу Paths to Technology
ПОДЕЛИТЕСЬ ЭТОЙ СТАТЬЕЙ
Доступные шрифты: руководство по созданию специальных возможностей
Создание доступного дизайна означает, что ваш контент максимально удобен для людей со слепотой, нарушениями зрения, нейроразнообразием или другими проблемами.
Вполне понятно, что поначалу вас могут смутить правила доступности. Поэтому я рекомендую вам начать с доступного инструмента дизайна, где вы можете опробовать тысячи профессионально разработанных, полностью совместимых доступных шаблонов.
При тестировании доступности каждый выбор, вплоть до выбранного вами шрифта, имеет значение.
Итак, давайте посмотрим на доступные шрифты и на то, как правильно подобрать их для своих проектов.
- Что такое доступные шрифты?
- Какие шрифты подходят для людей с дислексией?
- Размер шрифта, совместимый с ADA
- Размер текста WCAG
- Что лучше для специальных возможностей: с засечками или без засечек?
- Являются ли скриптовые шрифты плохо доступными?
- Как сделать шрифт доступным?
- Лучшие шрифты для специальных возможностей
Доступные шрифты — это шрифты, которые легко увидеть, прочитать и понять всем людям.
Хотя необходимость сделать ваш визуальный контент доступным для всех в основном касается людей с ограниченными возможностями, правда в том, что доступные шрифты применимы ко всем. Некоторые шрифты трудно читать многим людям, даже если они не имеют таких проблем, как плохое зрение или дислексия.
Доступные шрифты не должны усложнять чтение контента, замедлять чтение, затруднять различение одной буквы от другой или включать ненужные визуальные элементы, которые умаляют полезность шрифта.
В этой инфографике используются доступные шрифты. Шрифт разборчив, имеет четкие буквы и не содержит ненужных визуальных помех, отвлекающих от понимания.
Связанный : Как создать доступную инфографику с помощью Venngage
Вернуться к оглавлению
Какие шрифты подходят для людей с дислексией?Дислексия — это нарушение способности к обучению, также называемое нарушением чтения. Людям с дислексией трудно распознавать звуки речи и узнавать, как они связаны с буквами и словами, поэтому им трудно читать.
Этот проект Дэниела Бриттона воссоздает ощущение чтения с дислексией для человека, не страдающего дислексией:
Источник Компании создали шрифты, удобные для людей с дислексией, чтобы облегчить людям с дислексией чтение. Эти шрифты часто используют более толстые линии в частях букв, буквы могут быть наклонными, а буквы имеют палочки и хвостики ( b , d и p ) различаются по длине.
Одним из примеров является семейство шрифтов Lexend (которое доступно в Venngage!):
Обратите внимание, что исследователи не нашли доказательств того, что дислексические шрифты действительно заставляют людей с дислексией читать быстрее, однако многим людям с дислексией нравятся дополнительные функции этих шрифтов. и найти их полезными.
Если на вашем веб-сайте нет шрифтов, совместимых с дислексией, можно использовать традиционные шрифты без засечек. Исследования показывают, что шрифты без засечек, моноширинные и прямые шрифты повышают эффективность чтения у людей с дислексией, а курсивные шрифты ухудшают читаемость.
Некоторые хорошие шрифты для людей с дислексией: Helvetica, Courier, Arial, Verdana и CMU (Computer Modern Unicode).
Вернуться к оглавлению
Какой размер шрифта соответствует требованиям ADA?Обычно лучше не опускаться ниже 12 пикселей с 16 пикселей в качестве отправной точки.
Закон об американцах-инвалидах (ADA) запрещает дискриминацию людей с ограниченными возможностями и налагает определенные требования на доступность общественных зданий.
И хотя ADA прямо не указывает размеры шрифтов, которые она считает соответствующими, в последние годы появились некоторые общепринятые стандарты в веб-дизайне, чтобы обеспечить доступность контента для всех.
Руководство по обеспечению доступности веб-контента (WCAG) рекомендует убедиться, что пользователи могут увеличивать масштаб, чтобы увеличить текст на 200%, хотя эта рекомендация относится к веб-сайтам и другим веб-дизайнам, а не к инструментам визуальной коммуникации, таким как инфографика, отчеты и брошюры.
Этот шаблон афиши мероприятия был разработан для обеспечения доступности — вы можете сказать, что ни один текст не находится ниже отметки 12 пикселей. Это отличный способ убедиться, что люди с разным уровнем остроты зрения или ограниченными возможностями чувствуют, что ваш контент создан для них.
Даже в длинных многостраничных документах важно поддерживать минимальный читаемый размер шрифта с помощью доступных шрифтов.
Если это означает, что вам нужно добавить страницы, чтобы вместить весь ваш контент, Venngage упрощает вставку новых страниц и максимизирует читабельность вашего материала, как в этом шаблоне годового отчета.
Связано: Стандарты ADA для доступного дизайна: как им соответствовать
Вернуться к оглавлению
Размер текста WCAGРуководство по обеспечению доступности веб-контента (WCAG) не устанавливает минимальный размер текста, хотя в последние годы появился неофициальный стандарт 16 пикселей и не меньше 12 пикселей.
В чем WCAG действительно дает твердые рекомендации, так это в том, что на веб-сайтах пользователи могут увеличить масштаб на 200%, чтобы увеличить текст.
Эти рекомендации охватывают гораздо больше, чем выбор или размер шрифта, включая использование цветов, цветовой контраст, структуру страницы и многое другое. Все эти факторы влияют на то, насколько доступным будет ваш дизайн.
Связанные :
- Рекомендации по дизайну для дальтоников: как донести смысл до всех [с примерами и шаблонами]
- Как использовать удобные палитры для дальтоников, чтобы сделать ваши диаграммы доступными
- Альтернативный текст изображения: определение и рекомендации for Accessible Designs
Сохранение больших размеров шрифта в ваших доступных визуальных коммуникациях также делает контент более привлекательным для всех читателей, а не только для тех, у кого проблемы с доступностью. Оптимизация доступности — отличный способ удалить ненужные слова из вашего контента.
Эта инфографика о дизайне для разнообразия — еще один хороший пример. Он использует только шрифты без засечек, размер шрифта которых достаточно велик, чтобы у читателей не было проблем с чтением или даже беглым просмотром:
Как показано в этом контрольном списке для ориентации сотрудников, можно использовать меньший размер шрифта для основного текста, если шрифты доступны и вы применяете принципы доступного дизайна.
В этом случае цветовое кодирование, линии и флажки помогают читателям понять поток информации.
Вы также заметите, что в этом шаблоне используется шрифт без засечек как для заголовка, так и для основного текста, поскольку шрифты без засечек обычно легче читать:
Точно так же этот контрольный список ориентации использует сдержанный фон и многоцветную цветовую палитру, оставаясь доступным для всех.
Вернуться к оглавлению
Шрифты с засечками или без засечек лучше для доступности?Если вы все еще путаете шрифты с засечками и без засечек, вот небольшой совет: шрифты без засечек — это шрифты без маленьких «засечек» — украшений вверху и внизу букв (отсюда и «без засечек» в его названии):
Поскольку шрифты с засечками включают дополнительные завитки, в зависимости от размера шрифта, эти шрифты могут быть трудночитаемыми.
Буквы могут идти вместе, даже соприкасаться друг с другом в меньших размерах. По этой причине шрифты с засечками чаще используются для заголовков из-за большего размера шрифта, как в этом шаблоне:
Знаете ли вы, что шрифты с засечками станут одной из тенденций графического дизайна в 2022 году? Проверьте это: 8 тенденций графического дизайна, которые будут определять 2022
Это не обязательно означает, что все шрифты без засечек доступны. Поскольку в некоторых шрифтах без засечек нет декоративных штрихов, символы могут выглядеть очень знакомыми, что затрудняет их чтение.
Вот несколько советов по выбору лучшего шрифта для визуальной коммуникации. Помните об этом при выборе доступного шрифта, независимо от того, выбираете ли вы шрифт с засечками или без засечек.
Вернуться к оглавлению
Являются ли скриптовые шрифты плохо доступными? Рукописные шрифты могут быть трудны для чтения людям с дислексией, слабым зрением или другими нарушениями, поскольку по своей природе буквы неотличимы друг от друга.
Шрифты Script предназначены для имитации рукописного письма, в котором все буквы связаны друг с другом.
Вы не можете изменить свойства шрифта, но увеличение размера текста часто может помочь сделать шрифт доступным. Увеличивая сам текст, иногда можно сделать так, чтобы буквы казались более различимыми друг от друга, что важно при выборе доступных шрифтов.
Кроме того, как мы уже говорили, сами шрифты являются лишь частью уравнения. То, как представлена информация, также может повысить или ухудшить доступность дизайна. Вот несколько советов, как сделать визуальный контент доступным:
- Используйте короткие простые предложения и маркированные списки (например, этот)
- Используйте простые для понимания значки
- Избегайте ненужных визуальных помех, таких как сложный фон или конфликтующие цветовые палитры
- Избегайте мелкого шрифта , легко читаемые заголовки
Как правило, при проектировании для доступности лучше всего ограничиться одним шрифтом или, по крайней мере, как можно меньшим количеством шрифтов.
Таким образом, читатели, у которых есть проблемы с текстом, смогут легко обрабатывать вашу информацию, не задумываясь о том, как выглядят буквы. Но это не значит, что ваш дизайн должен быть скучным; используйте приведенный выше пример в качестве вдохновения.
Вот еще один пример. Эта инфографика иллюстрирует, как сам дизайн может повысить доступность за счет использования четких значков и цветовой схемы, представляющей ключевые элементы информации.
Если ваш дизайн требует, чтобы информация размещалась в вертикальных, а не горизонтальных разделах, рассмотрите возможность добавления линий (как в этом примере) или других разделителей, чтобы читатели могли легко понять, где заканчивается связанная информация.
Создаете контент для своих сообщений в социальных сетях? Вот пример того, как вы можете использовать простые значки для иллюстрации содержимого карусели в Instagram, при этом гарантируя, что вы используете доступные шрифты.
Вернуться к оглавлению
Лучшие шрифты с точки зрения доступностиНесмотря на то, что использование шрифтов связано с множеством доступных деталей дизайна, есть несколько распространенных шрифтов, которые будут работать с широким спектром типов дизайна, оставаясь при этом быть подходящим для проблем доступности, включая варианты с засечками и без засечек.
Нашими любимыми шрифтами являются Helvetica, Calibri, Arial, Times New Roman, Tahoma, Museo Slab, Source Sans Pro, Rockwell и Roboto Slab. Важным аспектом выбора доступных шрифтов является избегание шрифтов с вводящими в заблуждение формами или символами, которые могут быть ошибочно приняты за другие (например, заглавная буква I, цифра 1 и строчная буква L).
Как показано в этом посте, существует множество чрезвычайно популярных шрифтов, в том числе Google Fonts, которые могут помочь вам обеспечить доступность ваших проектов для всех.
При проектировании с учетом специальных возможностей лучше избегать таких шрифтов, как Raleway. Несмотря на то, что он красивый, его отличительный вид на самом деле может затруднить чтение. Например, в шрифте используется буква W, в которой кончик центра буквы перекрывается. Это ухудшает читабельность, особенно в небольших приложениях.
Связанный : 20+ лучших пар шрифтов Google на 2021 год [БЕСПЛАТНАЯ ЗАГРУЗКА]
Если вы будете использовать данные или финансовую информацию в своих доступных дизайнах, например, для презентаций или годовых отчетов, рекомендуется потянуть ключ указывает и отображает их крупными, визуально приятными способами, как в этом примере.
При использовании значков для доступных дизайнов они должны оставаться более простыми, а не детализированными. Часто эти детали могут отвлекать читателей, и если у вашей аудитории есть нарушения, затрудняющие обработку визуальных материалов, они могут быть отключены.
