Бизнес Дизайн

Денис Судилковский про бизнес и дизайн для тех, кому пришлось этим заниматься.

RSS

Близорукий дальтоник следит за тобой

Опубликовано 29.02.2008 - В рубриках: Теория дизайна

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

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

У меня плохое зрение. Достаточно плохое, что бы с трудом находить очки на столе. Я родился с диагнозом врожденная близорукость. К тому же лет 8-10 назад я получил проникающее повреждение роговицы глаза, что так же пагубно отразилось на зрительных функциях.

Люди со 100% (или около того) зрением думают, что вот надел очки или линзы, и видишь точно так же, как и нормальный человек, а вот фигушки вам. Такое утверждение справедливо лишь при достаточно небольших отклонениях зрения от нормы, в противном случае (к примеру, с близорукостью при диоптре более -4) человек испытывает дискомфорт от фокусировки на близко размещенных предметах, когда он в очках, в которых он походу дела должен был быть «нормальным».

На практике нам (кротам) приходится ставить монитор подальше, и увеличивать размер шрифта в браузере. Иначе к концу рабочего дня глазки ничегошеньки не видят.

Таблица мыслей.
Таблица мыслей.

Походу дела просьба для кодеров и верстальщиков — задавайте размер шрифта в относительных величинах (не в пикселях), а то иначе не во всех браузерах можно увеличить его размер. Немного практики, и вы наловчитесь вместо px ставить in (дюймы).

Не у всех стоят хорошие ЖК мониторы, многие сидят на тусклых «трубках», а еще хуже, когда разрешение на них стоит больше нормированного, от этого все «блюрит» (размывается).

Сверху текст на хорошем мониторе, снизу – на устаревшем бюджетном варианте.
Сверху текст на хорошем мониторе, снизу — на устаревшем бюджетном варианте.

Обратная сторона медали хороших мониторов заключается в том, что у них слишком высокая контрастность. Это означает, что чисто черный текст на белом, отстиранном порошком Тайд с альпийской свежестью, фоне читать НЕПРИЯТНО.

Решением является сероватый цвет текста на не ярко белом фоне (тупо уменьшаем контраст).

Слишком большой контраст – тоже плохо.
Слишком большой контраст — тоже плохо.

Так, с пунктом близорукости разобрались, но ведь наш любимый пользователь родился еще и дальтоником (хорошо хоть не коммунистом). Что это означает для сайта?

На самом деле видов дальтонизма существует несколько, самый распространенный это когда человек не различает синий и красный цвета. Соответственно он не особо различает и их оттенки.

Кстати, а вы знали, что художник, придумавший символ Олимпиады 80 — мишку с медальками, тоже дальтоник. Ему жена подписывала краски, и ничего, хорошо творить получалось…

Так, отвлеклись, возвращаемся в веб. Где и для чего здесь используются цвета? Для декора и прочей чепухи, о которой сейчас не вспоминаем, тогда еще где? Правильный ответ — в ссылках. Вот именно поэтому ссылки должны быть подчеркнуты, ведь если человек не может отличить ее по цвету, то он найдет ее по форме!

Грубая интерпретация того, как видит дальтоник цветной текст.
Грубая интерпретация того, как видит дальтоник цветной текст.

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

Подытожив можно сказать, что текст на сайте должен быть достаточно крупным (по крайней мере, оставляйте возможность посетителю увеличить размер шрифта средствами браузера), достаточно контрастным (но не слишком), а ссылки — достаточно подчеркнутыми, и тогда радости нашего близорукого дальтоника будет все больше и больше! (:

Дальше по теме:
А давайте я научу вас красиво красить?

P.S. С этого сайта можно уйти на: интервью с Жуковским, самое интересное у fdiver'a, записулька из жизни, Тавли хорошо о базе знаний, замечательная попытка прикрутить статистику от гугла (студия, в которой я работаю уже продолжает эту идею на практике) и о Гугл.Сайтс.

P.P.S. Понравилась статья? Подпишись на ленту RSS, или получай новые посты на свою электронную почту!

Комментарии

Отзывов (22) на «Близорукий дальтоник следит за тобой»

  1. Dune 29.02.2008 2:49 pm

    Одна из самых полезных статей, что читал за последнее время.

    В дополнение:
    К сожалению чаще всего веб-дизайнеры таковыми на являются. Им больше подходит определение “графические дизайнеры сайтов”.
    Рисуют, согласовывают с заказчиком, а потом верстальщику как аксиому - чтоб ни шагу вбок.

    А сверстать в итоге это можно только задавая жёсткие размеры шрифта. Иначе будет развал.

    P.S. Главное, чтоб заказчику понравилось, а что там с юзабилити - никого не волнует.

  2. Денис Судилковский 29.02.2008 2:55 pm

    Dune,
    я вас очень хорошо понимаю (наверное, даже более, чем хотелось бы).

    Действительно существует такая проблема - веб-дизайнеры таковыми не являются. Пускай они способны творить чудеса графики от которых заказчик говорит свое удовлетворенное “За*бись!”, но это не веб-дизайн, это просто рисование.

    Ваш комментарий натолкнул меня на еще одну умную мысль, скоро напишу пост. (:
    Спасибо.

  3. Alt-Shift 29.02.2008 3:44 pm

    Ну оочень полезная, просто шикарная статья! Спасибо вам огромное за этот труд!

  4. Денис Судилковский 29.02.2008 3:49 pm

    Alt-Shift,
    рад, что старался не зря. Спасибо за позитив.

  5. IHHI 01.03.2008 2:29 am

    Замечание: относительный размер шрифта указывается не в дюймах, т.к. число точек на дюйм для мониторов величина фиксированная. Да и не фотошоп это.
    http://www.htmlbook.ru/css/font-size.html

  6. Антон 01.03.2008 2:55 pm

    Спасибо за замечательную статью!
    Очень рад.

  7. gene 01.03.2008 7:04 pm

    не совсем согласен с картинкой “Сверху текст на хорошем мониторе, снизу — на устаревшем бюджетном варианте”, но в целом все написано правильно, давно уже соорудил себе три кнопки для увеличения/уменьшения шрифта, но все никак не внедрю в какой-нибудь сайт )

  8. VLAD 01.03.2008 11:51 pm

    Да, если чесно на компьютере зрение падает хорошо ! и потому может появится близорукость !

  9. Денис Судилковский 02.03.2008 2:31 pm

    IHHI,
    Да, относительные размеры шрифта можно ставить и в процентах, и в em, я хотел лишь сказать, что бы не ставили в пикселях, а то потом в ИЕ (для тех, кто пользуется) невозможно изменить их размер.

    gene,
    дкмаю что всетаки лучше отсавить возможность изменения размера шрифта средствами браузера, хотя если нет другого выхода и альтернативы, то… (:

  10. Сделаем это быстро » Blog Archive » Дезигнерам 02.03.2008 10:45 pm

    […] Вот оно! Прочитайте это: Близорукий дальтоник следит за тобой! Не только люди с идеальным зрением есть на свете. C […]

  11. Mondeo 05.03.2008 12:31 pm

    Значит я не один такой подслеповатый. )))
    Правда при моих -2.5 еще ничего.
    Действительно некоторые сайты ну просто невозможно смотреть.

  12. Апокалипсис 17.03.2008 9:17 pm

    Люди, успокойтесь! Всех ламо-дизайнёров вам все равно не переубедить. Это пустая трата времени.

    В файрфоксе есть волшебное меню View - Page Style, которое помогает практически всегда. Именно так я и читаю данный сайт (иначе пришлось бы читать узкую колоночку на 1/4 ширины экрана, а это неудобно!).

    Для поделок особо тяжелых шизо-дизайнёров (напр. горизонтальная прокрутка): копируем текст, создаем текстовый файл, вставляем текст, заменяем все переносы на тег br, меняем расширение файла на .html, открываем в браузере и спокойно читаем.

    Никаких проблем!

  13. Тут Хумора.NET 28.03.2008 4:35 pm

    […] easy, it’s free, and you never have to leave the Wordpress dashboard while you are working. Близорукий дальтоник следит за тобой. Как потомственный очкарик со всей ответственностью […]

  14. BOLK 28.03.2008 7:28 pm

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

    Скажем, «Опера». Умеет масштабировать, не ломая дизайн и переключаться с высоконстрастные схемы.

  15. Денис Судилковский 28.03.2008 7:32 pm

    BOLK,
    Опера - далеко не самый популярный браузер, хотя я как раз ею и пользуюсь.
    Но все же, лучше изначально делать нормальные сайты.

  16. Их окружают розовые слоники : Бизнес Дизайн 29.04.2008 6:35 pm

    […] фоне продаст больше синего. Да, и не забывайте о близоруких дальтониках, которым по барабану ваши краски, для них они все […]

  17. Обзор №4, Февраль 2008 | 0995 08.05.2008 12:04 pm

    […] Близорукий дальтоник следит за тобойНесмотря на то что у меня нормально зрение, бывает попадаются сайтыкоторые заставляют усомниться в этом, что уж и говорить о людях у которых есть проблемы со зрением. Надеюсь эта статья заставитьзадуматься хоть некоторых дизайнеров о размерах и цвете шрифтов которыеони используют. […]

  18. ksi 25.06.2008 3:07 pm

    Отличная статья. На самом деле, я до этого момента относился к тем 99%, которые думали, что у кого плохое зрение, одев очки будут видет mnfr;t как и хорошовидящие.

  19. Я читал в июле | Блог о людях 15.08.2008 4:47 am

    […] Близорукий дальтоник следит за тобой, так утверждает Денис Судилковский. А вообще, его статья для верстальщиков и дизайнеров о том, как улучшить читабельность текста с мониторов. […]

  20. NatVav 20.08.2008 4:52 pm

    Хорошая статья! у меня слабая форма дальтонизма, ссылки я действительно почти не отличаю от текста…только если сильно присмотреться, а на это не всегда хватает времени…так что советы даны отличные…пасиб за статью…воть)))

  21. Обзор №4, Февраль 2008 - Design For Masters 22.09.2008 6:52 pm

    […] Близорукий дальтоник следит за тобой Несмотря на то что у меня нормально зрение, бывает попадаются сайты которые заставляют усомниться в этом, что уж и говорить о людях у которых есть проблемы со зрением. Надеюсь эта статья заставить задуматься хоть некоторых дизайнеров о размерах и цвете шрифтов которые они используют. […]

  22. IvanovStepan30 17.04.2011 1:16 am

    Профессиональный тренинг, командообразование, недорого

Оставьте отзыв




Вы сможете каждый день заказать дешевые авиабилеты по акции в обе стороны в интернете. | У нас в ассортименте самые разнообразные платья из последних модных коллекций.