Из-за тощих шрифтов интернет становится нечитабельным

Original author: Sarah Knapton
  • Translation
image

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

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

В то время как раньше текст был рельефным и тёмным, и хорошо контрастировал с преимущественно белым фоном, теперь многие веб-сайты переходят на светло-серые или голубые шрифты.

Отмеченный наградами блоггер Кевин Маркс, основатель Microformats и бывший вице-президент веб-сервисов в BT, решил изучить проблему после того, как заметил, что стал испытывать всё больше трудностей при чтении текста на экране.

Я призываю дизайнеров и разработчиков программного обеспечения: оставьте ваши изыски и вернитесь к типографским принципам печати.
Кевин Маркс

Кевин обнаружил «широко распространённое движение», направленное на уменьшение контраста между текстом и фоном, в ходе которого все технологические гиганты — Apple, Google и Twitter — изменяют свои типографские принципы.

Чисто чёрный на белом фоне текст имеет максимально достижимую контрастность 21:1. Большинство технологических компаний считает хорошей практикой для шрифта иметь контрастность в отношении не менее 7:1, что позволяет видеть текст людям с ослабленным зрением.

Однако г-н Маркс обнаружил, что даже собственные типографские директивы компании Apple, рекомендующие контрастность 7:1, написаны при отношении 5.5:1.

image

Многие пожилые люди используют интернет, чтобы оставаться на связи с родственниками

Рекомендации Google также рекомендуют контрастность 7:1 — и при этом 54% непрозрачности на дисплее, что понижает отношение до 4.6:1.

Г-н Маркс, который изданием The Telegraph был назван одним из 50-ти самых влиятельных британцев в вопросах современных технологий, заявил, что эти изменения рискуют подорвать универсальную доступность интернета. «Выбор типографики такими компаниями как Apple и Google устанавливает, фактически, дизайн по умолчанию для большой части сети, и эти два драйвера дизайна действуют уже на границе читаемости текста», — предупреждает он в заметке на Backchannel.

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

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

image

В 2008 году организация «Инициатива по обеспечению универсального доступа к Интернету» (WAI = Web Accessibility Initiative) ввела отношение контрастности, которое должно помочь веб-дизайнерам создавать хорошо читаемые сайты.

Если текст и фон одного цвета, например, белый на белом, то это отношение составляет 1:1.
Для чёрного текста на белом фоне или белого текста на чёрном фоне оно максимально — 21:1.
Чёрный текст на сером фоне и наоборот имеет отношение 13:1; очень светлый серый на белом — 3:1.
Однако когда шрифт становится тоньше или более «легковесным», чтения текста затрудняется.


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

Развитие ЖК технологий и экранов с высоким разрешением также позволило дизайнерам использовать всё более тонкие шрифты, которые нормально работают на настольных компьютерах, но которые нередко, фактически, невозможно прочитать на смартфонах или планшетах.

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

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

Но базирующаяся в США организация «Инициатива по обеспечению универсального доступа к Интернету» (WAI = Web Accessibility Initiative), которая и предложила формулу исходного отношения, в 2008 году в порядке наставления дизайнерам заявила, что слишком низкий контраст интернет-страниц «мешает людям и разочаровывает их».

image

Более светлые шрифты могут хорошо работать на настольных компьютерах с высоким разрешением, но не смартфонах или в условиях сравнительно высокой освещённости.

«Выбор цветовой гаммы с низким контрастом делает навигацию, чтение и взаимодействие реально мучительным процессом», — сказал представитель организации.

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

Но г-н Маркс считает, что снижение контраста может оттолкнуть некоторых пользователей.

«Произвольное снижение контраста в погоне за модой, приводящее к хорошей картинке на моём прекрасном дисплее в моём отлично освещённом офисе, означает отказ дизайнера от обязательств перед множеством людей, для которых он творит», — говорит он.

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

Д-р Саймон Харпер, опытный специалист по информатике, занимающийся взаимодействием человека с компьютером и информационными системами в университете г. Манчестер: «Чёрный текст на белом фоне может создать ощущение определённой жёсткости; в то же время, серый текст может породить более мягкое, более дружественное ощущение.»

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

«Если требуется напрягаться, чтобы видеть текст, то взаимодействие прекращается. В новом мире продвинутого цифрового дизайна все мы становимся в каком-то аспекте уязвимыми.»

«Обеспечение средств, позволяющих пользователю настроить конкретный дизайн под себя, а не такой подход, при котором пользователь вынужден приспосабливаться (что иногда просто невозможно), является единственным жизнеспособным вариантом.» — заканчивает Кевин Маркс.

Similar posts

AdBlock has stolen the banner, but banners are not teeth — they will be back

More
Ads

Comments 42

    0
    Заголовок «Из-за тощих шрифтов интернет становится нечитабельным», а текст в основном про контрастность цветов. Да, тонкие шрифты должны быть более контрастны, но, например с любой контрастностью шрифты с засечками читаются на экранах значительно хуже, так зачем подменять понятия? Плюс, слабовидящие люди могут форсированно указать браузеру использовать только тот шрифт, который они хотят, но не могут сделать это с цветом.
      –6
      Плюс, слабовидящие люди могут форсированно указать браузеру использовать только тот шрифт, который они хотят, но не могут сделать это с цветом.

      Юзерстили никто не отменял, как и режимы чтения, встроенные во все современные браузеры.
      • UFO just landed and posted this here
        • UFO just landed and posted this here
            0
            Но внук тоже может быть не в курсе о возможности стилизации.
              +1
              Я, например, не в курсе, даром что программист.
              • UFO just landed and posted this here
                • UFO just landed and posted this here
                  • UFO just landed and posted this here
              • UFO just landed and posted this here
      • UFO just landed and posted this here
          +3
          Во-первых, проблема не высосана из пальца. Слабовидящих людей очень много. Причём не только старых, но и молодых. Полагаю, Вы не входите в их число, поэтому так весело поёте.

          Во-вторых, проведите эксперимент — уменьшите фонт на Хабре, возьмите лупу и попробуйте денёк почитать сайт таким образом. Оцените степень удобства.

          В-третьих, режим высокой контрастности, к примеру, на Андроиде реализован простым инвертированием цветов на экране. Всех. Да, бледненький текст при этом становится значительно более читабельным, но при этом инвертируются также и все картинки — что делает их совершенно уродскими. В результате при чтении приходится то и дело включать/выключать этот режим, что удовольствия вовсе не добавляет.
            +4
            Чтобы мне сейчас прочитать ваш комментарий, мне приходится или менять положение относительно монитора (садится ближе или сутулиться) или напрягать глаза до того состояния, что они начинают слезиться. И хорошо, что ваш комментарий всего 3 абзаца текста с измененным цветом шрифта, а если вся страница светлое на светлом, то хочется причинить боль её дизайнеру, в тех же масштабах, что его страница причиняет моим глазам.
              +2
              Наведите на него курсор мыши. Если, конечно, читаете не с планшета/телефона.
                +1

                На iOS можно тапнуть для имитации положения курсора, ЕМНИП?

            +1
            Я вспомнил что есть режим инвентирования. Стало интересно какой же контраст у белого текста на чёрном фоне. По идее белые буквы за счёт своего свечения на чёрном фоне должны казаться чуть жирнее чем чёрные которые наоборот будет поглащать фон.

            Когда переключился на инверсию даже показалось что глазам легче.
              +2
              Это всё индивидуально. У меня, например, наоборот, при чтении белых букв на чёрном фоне уже через несколько десятков секунд начинает резать глаза, и ещё пару минут после этого полоски перед взглядом плавают. Если попадается сайт с таким оформлением, где надо прочитать много текста, приходится применять юзерстиль, возвращающий белый фон и чёрный текст.
                0
                Самый адъ — это когда в обычный темный текст на светлом фоне вставляют низкоконтрастные скриншоты исходного кода с темным фоном и светлыми буквами.
              +1
              Сейчас для браузеров существуют разные расширения, позволяющие рисовать шрифты более толстыми и приятными глазу. Например, в своём Chrome пользуюсь Font Rendering Enhancer.
              Одно из тех практически незаметных, но безумно полезных расширений, которые и не уродуют дизайн страниц своими шрифтами, и спасают глаза (а то после очередного апдейта Хрома около года назад шрифты на некоторых сайтах стали смотреться совсем уж нечитабельными).
              Но это немного в сторону от основной мысли статьи.
                0
                У меня стоит stylebot для хрома, поставил 145% для всех текстов на Хабре (разница). Можно читать, откинувшись на спинку. Очки не ношу, но вроде по глазам 0 и -2. При обычном размере хочется наклониться к монитору.
                  +1
                  Можно проще — масштаб в 125%. Заодно и пустые поля по бокам пропадают.
                    0
                    chrome --force-device-scale-factor=1.25

                    Ну или сколько там вам понравится…
                      +4
                      окей, вместо того чтобы дизайнеры делали свои дизайны в нормальном, читаемом виде, мы скатываемся в какие-то жуткие костыли… давайте тогда уж сёрфить через Lynx, чего уж там!
                      имхо, проблема нормального отображения контента сейчас становится все более острой…
                        0
                        Нет, не проще. Повышение масштаба затрагивает всё, в том числе картинки. Мне не надо увеличивать отображение других элементов. Мне нужно увеличить только текст.
                          +1
                          К сожалению, из-за этого на множестве сайтов разъезжается вёрстка. Много где размеры элементов прибиты гвоздями. Для таких сайтов единственный выход — масштабировать всё.
                          0
                          С масштабом удобней, т.к. для каждого сайта можно подобрать свое значение. Например Хабр и ГТ у меня 125%, а МойКруг и ВК на 110%. А еще удобно, когда хочется откинуться на стуле и почитать не напрягаясь, тогда можно и все 200% поставить)
                      0
                      Это можно сделать толко на компе. Мобильный хром не поддерживает расширения.
                      +3
                      Ещё разок: http://contrastrebellion.com/
                        –1
                        У меня стоит uBlock Origin. В нём можно просто выключить к чёрту все эти навороченные нестандартные шрифты. И дополнительного расширения не надо…
                          –6
                          Надуманная проблема, версию для слабовидящих и масштабирование никто не отменял. Сайты с действительно нечитабельными «тощими» шрифтами можно отнести к неадаптированным сайтам с плохим дизайном. Это не показатель и не тенденция. Для этого достаточно посмотреть на сайты к примеру банков и интернет-магазинов. Там где сайт — это инструмент извлечения прибыли, вы такого не увидите.
                            +2
                            версию для слабовидящих и масштабирование никто не отменял.

                            Её почти никто и не заказывает, так что было бы чего отменять.

                              0
                              Что мешает браузерам увеличивать шрифт скролбарчиком? На контент пофигу, пусть плывет.
                                +1
                                иронично, что Хабр рисует части этой статьи как раз светло-сереньким по белому :)
                                  0
                                  И в тексте статьи о важности контраста — не контрастные подписи светло серым по белому под изображениями. Браво. Самое забавное, что это относится и к оригиналу.
                                    0
                                    В этом плане Windows 10 и Windows Phone всегда двигались навстречу людям, так что к ним у меня претензий нет абсолютно. С читаемостью и контрастностью цветов всё отлично, да и дизайн хорош! Черный на белом, либо белый на черном.

                                    http://imgur.com/a/ZN7A5
                                      0
                                      Это сделали за счёт пользователей большой винды, где вытекают глаза без HiDPI.
                                        0
                                        А с HiDPI без лупы половину приложений не рассмотреть ))
                                      0
                                      Тонкая гельветика в яблочных девайсах появилась благодаря ретине. Как ещё показать, что экран стал выше по разрешению? Сделать сверхтонкие линии в интерфейсе, чтобы пользователь видел, что они без лесенок.
                                      • UFO just landed and posted this here
                                          0
                                          Мы живем в информационную эру. Практически в каждом доме есть ноутбук, компьютер, смартфоны, и ля-ля-ля всякие гаджеты. Ни для кого не секрет что эти все чудо-устройства портят глаза. Дети начинают в них зависать чуть ли не с пилёнок, в результате много детей до своего совершеннолетия уже будут или испытывают проблемы со зрением. Выходит парадокс, все эти компы, ноуты и смарты, не добавляют нам зрячести, а тексты в дизайнах наоборот становятся всё более лайтовые, и вместо того чтобы тексты становились более жирными учитывая зрительный вред от устройств, буквы тем не менее становятся чуть ли не с волосину в толщину, я встречал такие сайты где тексты ну прям очень тонкие, трудности с чтением даже у меня возникали при виде такого текста, чего уж говорить о стариках. Красота требует жертв — ох, и какие же жертвы нам приносят такие ходы со шрифтами, а жертва такая что с подобных сайтов уходит кое-какая аудитория, и вместо того чтобы человек смог купить какой-то товар, он просто уходит потому что тонкий текст не кричит, но НЕ КРИЧИТ — «Купи меня, я ведь тут, разве не видно?», нет, не видно. Я в дизайнах тоже употребляю лайт-начертания, каюсь, но уж такая сейчас мода, тренды и т.д., но я пытаюсь подобрать не слишком тонкий лайт, и положить стараюсь на контрастный фон, чтобы текст бросался в глаза.
                                          image
                                            +1
                                            Я в дизайнах тоже употребляю лайт-начертания, каюсь, но уж такая сейчас мода, тренды и т.д.

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

                                            Only users with full accounts can post comments. Log in, please.