Пожилым людям трудно читать веб-страницы из-за изменений, произошедших со шрифтом в последние годы
Эксперты выяснили, что интернет становится нечитабельным из-за тенденции эволюции в сторону «тощих» шрифтов, которые ухудшают видимость слов на экране для пожилых людей или людей с ослабленным зрением.
В то время как раньше текст был рельефным и тёмным, и хорошо контрастировал с преимущественно белым фоном, теперь многие веб-сайты переходят на светло-серые или голубые шрифты.
Отмеченный наградами блоггер Кевин Маркс, основатель Microformats и бывший вице-президент веб-сервисов в BT, решил изучить проблему после того, как заметил, что стал испытывать всё больше трудностей при чтении текста на экране.
Я призываю дизайнеров и разработчиков программного обеспечения: оставьте ваши изыски и вернитесь к типографским принципам печати.
Кевин Маркс
Кевин обнаружил «широко распространённое движение», направленное на уменьшение контраста между текстом и фоном, в ходе которого все технологические гиганты — Apple, Google и Twitter — изменяют свои типографские принципы.
Чисто чёрный на белом фоне текст имеет максимально достижимую контрастность 21:1. Большинство технологических компаний считает хорошей практикой для шрифта иметь контрастность в отношении не менее 7:1, что позволяет видеть текст людям с ослабленным зрением.
Однако г-н Маркс обнаружил, что даже собственные типографские директивы компании Apple, рекомендующие контрастность 7:1, написаны при отношении 5.5:1.
Многие пожилые люди используют интернет, чтобы оставаться на связи с родственниками
Рекомендации Google также рекомендуют контрастность 7:1 — и при этом 54% непрозрачности на дисплее, что понижает отношение до 4.6:1.
Г-н Маркс, который изданием The Telegraph был назван одним из 50-ти самых влиятельных британцев в вопросах современных технологий, заявил, что эти изменения рискуют подорвать универсальную доступность интернета. «Выбор типографики такими компаниями как Apple и Google устанавливает, фактически, дизайн по умолчанию для большой части сети, и эти два драйвера дизайна действуют уже на границе читаемости текста», — предупреждает он в заметке на Backchannel.
«Если в сети преобладает текст, который трудно читать — это ограничивает доступ к ней, исключает большое число людей, таких как пожилые люди, люди с нарушениями зрения или тех, кто использует экраны низкого качества изготовления.
»Поскольку мы полагаемся на компьютеры не только для извлечения какой-то хранимой информации, но и для получения доступа к услугам, которые порой крайне важны для наших жизней, а также для создания каких-то сервисов, то обеспечение доступности происходящего буквально для всех становится всё более и более важным."
В 2008 году организация «Инициатива по обеспечению универсального доступа к Интернету» (WAI = Web Accessibility Initiative) ввела отношение контрастности, которое должно помочь веб-дизайнерам создавать хорошо читаемые сайты.
Если текст и фон одного цвета, например, белый на белом, то это отношение составляет 1:1.
Для чёрного текста на белом фоне или белого текста на чёрном фоне оно максимально — 21:1.
Чёрный текст на сером фоне и наоборот имеет отношение 13:1; очень светлый серый на белом — 3:1.
Однако когда шрифт становится тоньше или более «легковесным», чтения текста затрудняется.
Изменения в типографике пришли потому, что по мере эволюционирования веб-дизайна шрифты, цвета и то, что служит фоном, стали отклоняться от исходного набора ''безопасных стандартов", которые были признаны разборчивыми для всех пользователей.
Развитие ЖК технологий и экранов с высоким разрешением также позволило дизайнерам использовать всё более тонкие шрифты, которые нормально работают на настольных компьютерах, но которые нередко, фактически, невозможно прочитать на смартфонах или планшетах.
В последние годы справочники, такие как «Руководство по типографике», также рекомендовали дизайнерам не использовать большой контраст, утверждая, что традиционное расположение «чёрный на белом» чрезмерно напрягает глаза и, в частности, мешает людям с дислексией.
Вдобавок многие компьютеры теперь используют снижение яркости при уменьшении освещённости, чтобы не излучать сильный свет, мешающий людям засыпать.
Но базирующаяся в США организация «Инициатива по обеспечению универсального доступа к Интернету» (WAI = Web Accessibility Initiative), которая и предложила формулу исходного отношения, в 2008 году в порядке наставления дизайнерам заявила, что слишком низкий контраст интернет-страниц «мешает людям и разочаровывает их».
Более светлые шрифты могут хорошо работать на настольных компьютерах с высоким разрешением, но не смартфонах или в условиях сравнительно высокой освещённости.
«Выбор цветовой гаммы с низким контрастом делает навигацию, чтение и взаимодействие реально мучительным процессом», — сказал представитель организации.
«Хороший дизайн означает достаточный контраст между элементами переднего плана и фона. Это особенно существенно для людей со сниженной чувствительностью к контрасту, что больше проявляется с возрастом.»
Но г-н Маркс считает, что снижение контраста может оттолкнуть некоторых пользователей.
«Произвольное снижение контраста в погоне за модой, приводящее к хорошей картинке на моём прекрасном дисплее в моём отлично освещённом офисе, означает отказ дизайнера от обязательств перед множеством людей, для которых он творит», — говорит он.
«Вы должны делать разработки лучше для людей, читающих на небольших, неярких, дисплеях немолодыми глазами. Это, может быть, не модно, но надо посмотреть, кто же остаётся в стороне из-за вашего представления об эстетике.»
Д-р Саймон Харпер, опытный специалист по информатике, занимающийся взаимодействием человека с компьютером и информационными системами в университете г. Манчестер: «Чёрный текст на белом фоне может создать ощущение определённой жёсткости; в то же время, серый текст может породить более мягкое, более дружественное ощущение.»
«Но для некоторых людей такие варианты дизайна несут с собой ухудшение разборчивости, понимания и рост усталости от использования. Мы называем это ситуационным нарушением — при нём ухудшается работоспособность пользователя из-за действия устройства, дизайна, окружающей среды или контекста использования.»
«Если требуется напрягаться, чтобы видеть текст, то взаимодействие прекращается. В новом мире продвинутого цифрового дизайна все мы становимся в каком-то аспекте уязвимыми.»
«Обеспечение средств, позволяющих пользователю настроить конкретный дизайн под себя, а не такой подход, при котором пользователь вынужден приспосабливаться (что иногда просто невозможно), является единственным жизнеспособным вариантом.» — заканчивает Кевин Маркс.
Комментарии (42)
rockin
17.11.2016 23:55-14Высосанная из пальца проблема.
Человеку, который плохо видит, абсолютно фиолетово — он плохо видит, что «тощие», что «толстые» шрифты.
Для таких специально придуманы режимы «высокой контрастности»
Плохо видящих я знаю довольно много, и у всех их любой ваш «суперсовременный» сайт будет выглядеть как большие чёрные буквы на белом фоне.
Вместе с этим, я знаю людей, у которых зрение немного ухудшено в силу возраста, и у них рядом с монитором лежит лупа. Обычная такая лупа, на ручке. Люди просто не хотят терять связь с внешним миром и хотят его видеть так, как все остальные.jok40
18.11.2016 07:38+3Во-первых, проблема не высосана из пальца. Слабовидящих людей очень много. Причём не только старых, но и молодых. Полагаю, Вы не входите в их число, поэтому так весело поёте.
Во-вторых, проведите эксперимент — уменьшите фонт на Хабре, возьмите лупу и попробуйте денёк почитать сайт таким образом. Оцените степень удобства.
В-третьих, режим высокой контрастности, к примеру, на Андроиде реализован простым инвертированием цветов на экране. Всех. Да, бледненький текст при этом становится значительно более читабельным, но при этом инвертируются также и все картинки — что делает их совершенно уродскими. В результате при чтении приходится то и дело включать/выключать этот режим, что удовольствия вовсе не добавляет.
Areso
18.11.2016 09:02+4Чтобы мне сейчас прочитать ваш комментарий, мне приходится или менять положение относительно монитора (садится ближе или сутулиться) или напрягать глаза до того состояния, что они начинают слезиться. И хорошо, что ваш комментарий всего 3 абзаца текста с измененным цветом шрифта, а если вся страница светлое на светлом, то хочется причинить боль её дизайнеру, в тех же масштабах, что его страница причиняет моим глазам.
ivan386
17.11.2016 23:57+1Я вспомнил что есть режим инвентирования. Стало интересно какой же контраст у белого текста на чёрном фоне. По идее белые буквы за счёт своего свечения на чёрном фоне должны казаться чуть жирнее чем чёрные которые наоборот будет поглащать фон.
Когда переключился на инверсию даже показалось что глазам легче.
CaptainFlint
18.11.2016 00:13+2Это всё индивидуально. У меня, например, наоборот, при чтении белых букв на чёрном фоне уже через несколько десятков секунд начинает резать глаза, и ещё пару минут после этого полоски перед взглядом плавают. Если попадается сайт с таким оформлением, где надо прочитать много текста, приходится применять юзерстиль, возвращающий белый фон и чёрный текст.
yul
18.11.2016 12:24Самый адъ — это когда в обычный темный текст на светлом фоне вставляют низкоконтрастные скриншоты исходного кода с темным фоном и светлыми буквами.
Wolf4D
17.11.2016 23:59+1Сейчас для браузеров существуют разные расширения, позволяющие рисовать шрифты более толстыми и приятными глазу. Например, в своём Chrome пользуюсь Font Rendering Enhancer.
Одно из тех практически незаметных, но безумно полезных расширений, которые и не уродуют дизайн страниц своими шрифтами, и спасают глаза (а то после очередного апдейта Хрома около года назад шрифты на некоторых сайтах стали смотреться совсем уж нечитабельными).
Но это немного в сторону от основной мысли статьи.
ProRunner
18.11.2016 00:17У меня стоит stylebot для хрома, поставил 145% для всех текстов на Хабре (разница). Можно читать, откинувшись на спинку. Очки не ношу, но вроде по глазам 0 и -2. При обычном размере хочется наклониться к монитору.
pudovMaxim
18.11.2016 00:42+1Можно проще — масштаб в 125%. Заодно и пустые поля по бокам пропадают.
khim
18.11.2016 00:52chrome --force-device-scale-factor=1.25
Ну или сколько там вам понравится…
dvsx86
18.11.2016 07:53+4окей, вместо того чтобы дизайнеры делали свои дизайны в нормальном, читаемом виде, мы скатываемся в какие-то жуткие костыли… давайте тогда уж сёрфить через Lynx, чего уж там!
имхо, проблема нормального отображения контента сейчас становится все более острой…
ProRunner
18.11.2016 08:27Нет, не проще. Повышение масштаба затрагивает всё, в том числе картинки. Мне не надо увеличивать отображение других элементов. Мне нужно увеличить только текст.
hdfan2
18.11.2016 09:48+1К сожалению, из-за этого на множестве сайтов разъезжается вёрстка. Много где размеры элементов прибиты гвоздями. Для таких сайтов единственный выход — масштабировать всё.
pudovMaxim
18.11.2016 10:21С масштабом удобней, т.к. для каждого сайта можно подобрать свое значение. Например Хабр и ГТ у меня 125%, а МойКруг и ВК на 110%. А еще удобно, когда хочется откинуться на стуле и почитать не напрягаясь, тогда можно и все 200% поставить)
Massacre
18.11.2016 00:25-1У меня стоит uBlock Origin. В нём можно просто выключить к чёрту все эти навороченные нестандартные шрифты. И дополнительного расширения не надо…
Hando
18.11.2016 07:54-6Надуманная проблема, версию для слабовидящих и масштабирование никто не отменял. Сайты с действительно нечитабельными «тощими» шрифтами можно отнести к неадаптированным сайтам с плохим дизайном. Это не показатель и не тенденция. Для этого достаточно посмотреть на сайты к примеру банков и интернет-магазинов. Там где сайт — это инструмент извлечения прибыли, вы такого не увидите.
vintage
18.11.2016 08:58+2версию для слабовидящих и масштабирование никто не отменял.
Её почти никто и не заказывает, так что было бы чего отменять.
lookid
18.11.2016 10:22Что мешает браузерам увеличивать шрифт скролбарчиком? На контент пофигу, пусть плывет.
arty
18.11.2016 11:37+1иронично, что Хабр рисует части этой статьи как раз светло-сереньким по белому :)
dimm_ddr
18.11.2016 13:40И в тексте статьи о важности контраста — не контрастные подписи светло серым по белому под изображениями. Браво. Самое забавное, что это относится и к оригиналу.
Kenya-West
18.11.2016 14:39В этом плане Windows 10 и Windows Phone всегда двигались навстречу людям, так что к ним у меня претензий нет абсолютно. С читаемостью и контрастностью цветов всё отлично, да и дизайн хорош! Черный на белом, либо белый на черном.
http://imgur.com/a/ZN7A5
navion
19.11.2016 19:42Это сделали за счёт пользователей большой винды, где вытекают глаза без HiDPI.
tUUtiKKi13
19.11.2016 08:37Тонкая гельветика в яблочных девайсах появилась благодаря ретине. Как ещё показать, что экран стал выше по разрешению? Сделать сверхтонкие линии в интерфейсе, чтобы пользователь видел, что они без лесенок.
jahr
19.11.2016 08:37Еще один аспект проблемы, который не исправляется настройками, специальными режимами просмотра, и т.п.: большая часть современных программ имеет интерфейс, написанный на html, и этот интерфейс уже не поправишь описываемыми в комментариях способами. Боюсь, что нормально видящий человек даже не представляет всего многообразия ситуаций, когда взаимодействие слабовидящего пользователя с компьютером становится ощутимо мучительным.
Creatis
19.11.2016 08:37Мы живем в информационную эру. Практически в каждом доме есть ноутбук, компьютер, смартфоны, и ля-ля-ля всякие гаджеты. Ни для кого не секрет что эти все чудо-устройства портят глаза. Дети начинают в них зависать чуть ли не с пилёнок, в результате много детей до своего совершеннолетия уже будут или испытывают проблемы со зрением. Выходит парадокс, все эти компы, ноуты и смарты, не добавляют нам зрячести, а тексты в дизайнах наоборот становятся всё более лайтовые, и вместо того чтобы тексты становились более жирными учитывая зрительный вред от устройств, буквы тем не менее становятся чуть ли не с волосину в толщину, я встречал такие сайты где тексты ну прям очень тонкие, трудности с чтением даже у меня возникали при виде такого текста, чего уж говорить о стариках. Красота требует жертв — ох, и какие же жертвы нам приносят такие ходы со шрифтами, а жертва такая что с подобных сайтов уходит кое-какая аудитория, и вместо того чтобы человек смог купить какой-то товар, он просто уходит потому что тонкий текст не кричит, но НЕ КРИЧИТ — «Купи меня, я ведь тут, разве не видно?», нет, не видно. Я в дизайнах тоже употребляю лайт-начертания, каюсь, но уж такая сейчас мода, тренды и т.д., но я пытаюсь подобрать не слишком тонкий лайт, и положить стараюсь на контрастный фон, чтобы текст бросался в глаза.
hdfan2
19.11.2016 16:40+1Я в дизайнах тоже употребляю лайт-начертания, каюсь, но уж такая сейчас мода, тренды и т.д.
Вот все так и говорят.
Mordva_givi
19.11.2016 08:38+1Вам не нравятся сайты с голубыми шрифтами по лазурному и сиреневому фону, перелистываемые постранично?
Вы ретроград!
А когда подложка ещё и переливается, как масляная пленка на луже, это же креатифф!
Теперь эта мода пошла и в официальные сайты ведомств и министерств. И так они были не самые удобные в плане поиска информации, теперь же приходится продираться через «плиточки», «тапчики», «сладеры».
TheShock
Заголовок «Из-за тощих шрифтов интернет становится нечитабельным», а текст в основном про контрастность цветов. Да, тонкие шрифты должны быть более контрастны, но, например с любой контрастностью шрифты с засечками читаются на экранах значительно хуже, так зачем подменять понятия? Плюс, слабовидящие люди могут форсированно указать браузеру использовать только тот шрифт, который они хотят, но не могут сделать это с цветом.
sumanai
Юзерстили никто не отменял, как и режимы чтения, встроенные во все современные браузеры.
Radiocity
Да, только не все могут эти стили прописывать по ряду причин.
alexkunin
Люди из фото в стетье много чего около-компьютерного сами не осилят. И по настройке браузера можно отличить хорошего внучка, который действительно заботится о бабушке, от того, который сделал кое-как.
alex4321
Но внук тоже может быть не в курсе о возможности стилизации.
VioletGiraffe
Я, например, не в курсе, даром что программист.
alexkunin
Может, о конкретной фиче в конкретном браузере вы не в курсе, но о юзер стилях-то слышали? Или гуглом (программист все же) можете воспользоваться? Или хотя бы о режиме повышенной контрастности на уровне ОС (который лично у меня частенько сам включался — неаккуратно в играх нажимал кнопки).
В, общем, если бы вам поставили задачу повысить читабельность всех сайтов на отдельно взятом компьютере — неужели бы вы не нашли решение?
Radiocity
Это в любом случае костыль и отговорка, чтобы не отказываться от тонких шрифтов. К тому же не везде можно прописать эти самые стили. Например, Flyme OS с пятой версии использует тонкие шрифты, которые поменять нельзя, а это обновление было навязано пользователю без предупреждения. Перепрошивать телефон или ставить кастомные шрифты через шнурок? Но пользователь так не умеет.
alexkunin
Я говорил исключительно о десктопах и ноутах. С трудом представляю себе смартфон в руках пожилого человека. И тем более с трудом представляю себе пожилого человека, который в интернет со смартфона выходит. Скорее уж планшет — экран побольше, пальцем легче попасть по элементам интерфейса.
Flyme OS — вроде можно, некое приложение ifont позволяет это сделать. Но это просто я нагуглил, сам не пробовал. Так-то не очень верится, что какой-то производитель сделать такую глупость может — убрать настройки шрифтов. (Кстати, если я правильно понял то, что прочитал про ifont, в этой операционке нельзя было менять шрифт до 5-й версии, т.е. как раз с пятой — можно. Ну, в руках не держал, может и неправда.)
alexkunin
Процент внуков, не знающих о таких возможностях (или неспособных погуголить в ответ на бабушкино «внучек, ничего не видно что-то, можешь поярче сделать?»), все же значительно ниже процента бабушек, которые вообще не смогут себе настроить компьютер. Примерно как 10-20% против 100%.