Близорукий дальтоник следит за тобой : Бизнес Дизайн
/* Begin Contact Form CSS */
.contactform {
position: static;
overflow: hidden;
}
.contactleft {
width: 25%;
text-align: right;
clear: both;
float: left;
display: inline;
padding: 4px;
margin: 5px 0;
}
.contactright {
width: 70%;
text-align: left;
float: right;
display: inline;
padding: 4px;
margin: 5px 0;
}
.contacterror {
border: 1px solid #ff0000;
}
.contactsubmit {
}
/* End Contact Form CSS */
Бизнес ДизайнДенис Судилковский про бизнес и дизайн для тех, кому пришлось этим заниматься.
Близорукий дальтоник следит за тобой
Опубликовано 29.02.2008 - В рубриках: Теория дизайна
Сегодняшний пост будет полезен всем, у кого есть свой сайт, но нет практики в шрифтовой работе. Я расскажу, как проверить, на сколько удобно посетителям читать текст на вашем сайте. Когда-то на страницах этого блога уже упоминалось про близорукого дальтоника, так вот сегодня вы будете смотреть его глазами.
Для начала небольшой ликбез о близорукости и прочих неприятностях со зрением. Оказывается, не все знают, как это «плохо видеть», и думают, что таких людей не так уж и много.
У меня плохое зрение. Достаточно плохое, что бы с трудом находить очки на столе. Я родился с диагнозом врожденная близорукость. К тому же лет 8-10 назад я получил проникающее повреждение роговицы глаза, что так же пагубно отразилось на зрительных функциях.
Люди со 100% (или около того) зрением думают, что вот надел очки или линзы, и видишь точно так же, как и нормальный человек, а вот фигушки вам. Такое утверждение справедливо лишь при достаточно небольших отклонениях зрения от нормы, в противном случае (к примеру, с близорукостью при диоптре более -4) человек испытывает дискомфорт от фокусировки на близко размещенных предметах, когда он в очках, в которых он походу дела должен был быть «нормальным».
На практике нам (кротам) приходится ставить монитор подальше, и увеличивать размер шрифта в браузере. Иначе к концу рабочего дня глазки ничегошеньки не видят.
Таблица мыслей.
Походу дела просьба для кодеров и верстальщиков — задавайте размер шрифта в относительных величинах (не в пикселях), а то иначе не во всех браузерах можно увеличить его размер. Немного практики, и вы наловчитесь вместо px ставить in (дюймы).
Не у всех стоят хорошие ЖК мониторы, многие сидят на тусклых «трубках», а еще хуже, когда разрешение на них стоит больше нормированного, от этого все «блюрит» (размывается).
Сверху текст на хорошем мониторе, снизу — на устаревшем бюджетном варианте.
Обратная сторона медали хороших мониторов заключается в том, что у них слишком высокая контрастность. Это означает, что чисто черный текст на белом, отстиранном порошком Тайд с альпийской свежестью, фоне читать НЕПРИЯТНО.
Решением является сероватый цвет текста на не ярко белом фоне (тупо уменьшаем контраст).
Слишком большой контраст — тоже плохо.
Так, с пунктом близорукости разобрались, но ведь наш любимый пользователь родился еще и дальтоником (хорошо хоть не коммунистом). Что это означает для сайта?
На самом деле видов дальтонизма существует несколько, самый распространенный это когда человек не различает синий и красный цвета. Соответственно он не особо различает и их оттенки.
Кстати, а вы знали, что художник, придумавший символ Олимпиады 80 — мишку с медальками, тоже дальтоник. Ему жена подписывала краски, и ничего, хорошо творить получалось…
Так, отвлеклись, возвращаемся в веб. Где и для чего здесь используются цвета? Для декора и прочей чепухи, о которой сейчас не вспоминаем, тогда еще где? Правильный ответ — в ссылках. Вот именно поэтому ссылки должны быть подчеркнуты, ведь если человек не может отличить ее по цвету, то он найдет ее по форме!
Грубая интерпретация того, как видит дальтоник цветной текст.
И в вдогонку еще один совет — проверяйте, как смотрится ваш сайт, если на нем увеличить шрифты. Иногда это приводит к развалу макета и слезам верстальщика, но что поделать, если людей страдающих плохим зрением становится все больше и больше?
Подытожив можно сказать, что текст на сайте должен быть достаточно крупным (по крайней мере, оставляйте возможность посетителю увеличить размер шрифта средствами браузера), достаточно контрастным (но не слишком), а ссылки — достаточно подчеркнутыми, и тогда радости нашего близорукого дальтоника будет все больше и больше! (:
Дальше по теме:
А давайте я научу вас красиво красить?
P.S. С этого сайта можно уйти на: интервью с Жуковским, самое интересное у fdiver'a, записулька из жизни, Тавли хорошо о базе знаний, замечательная попытка прикрутить статистику от гугла (студия, в которой я работаю уже продолжает эту идею на практике) и о Гугл.Сайтс.
P.P.S. Понравилась статья? Подпишись на ленту RSS, или получай новые посты на свою электронную почту!
Комментарии
Отзывов (16) на «Близорукий дальтоник следит за тобой»
Dune 29.02.2008 2:49 pm
Одна из самых полезных статей, что читал за последнее время.
В дополнение:
К сожалению чаще всего веб-дизайнеры таковыми на являются. Им больше подходит определение “графические дизайнеры сайтов”.
Рисуют, согласовывают с заказчиком, а потом верстальщику как аксиому - чтоб ни шагу вбок.
А сверстать в итоге это можно только задавая жёсткие размеры шрифта. Иначе будет развал.
P.S. Главное, чтоб заказчику понравилось, а что там с юзабилити - никого не волнует.
Денис Судилковский 29.02.2008 2:55 pm
Dune,
я вас очень хорошо понимаю (наверное, даже более, чем хотелось бы).
Действительно существует такая проблема - веб-дизайнеры таковыми не являются. Пускай они способны творить чудеса графики от которых заказчик говорит свое удовлетворенное “За*бись!”, но это не веб-дизайн, это просто рисование.
Ваш комментарий натолкнул меня на еще одну умную мысль, скоро напишу пост. (:
Спасибо.
Alt-Shift 29.02.2008 3:44 pm
Ну оочень полезная, просто шикарная статья! Спасибо вам огромное за этот труд!
Денис Судилковский 29.02.2008 3:49 pm
Alt-Shift,
рад, что старался не зря. Спасибо за позитив.
IHHI 01.03.2008 2:29 am
Замечание: относительный размер шрифта указывается не в дюймах, т.к. число точек на дюйм для мониторов величина фиксированная. Да и не фотошоп это.
http://www.htmlbook.ru/css/font-size.html
Антон 01.03.2008 2:55 pm
Спасибо за замечательную статью!
Очень рад.
gene 01.03.2008 7:04 pm
не совсем согласен с картинкой “Сверху текст на хорошем мониторе, снизу — на устаревшем бюджетном варианте”, но в целом все написано правильно, давно уже соорудил себе три кнопки для увеличения/уменьшения шрифта, но все никак не внедрю в какой-нибудь сайт )
VLAD 01.03.2008 11:51 pm
Да, если чесно на компьютере зрение падает хорошо ! и потому может появится близорукость !
Денис Судилковский 02.03.2008 2:31 pm
IHHI,
Да, относительные размеры шрифта можно ставить и в процентах, и в em, я хотел лишь сказать, что бы не ставили в пикселях, а то потом в ИЕ (для тех, кто пользуется) невозможно изменить их размер.
gene,
дкмаю что всетаки лучше отсавить возможность изменения размера шрифта средствами браузера, хотя если нет другого выхода и альтернативы, то… (:
Сделаем это быстро » Blog Archive » Дезигнерам 02.03.2008 10:45 pm
[…] Вот оно! Прочитайте это: Близорукий дальтоник следит за тобой! Не только люди с идеальным зрением есть на свете. C […]
Mondeo 05.03.2008 12:31 pm
Значит я не один такой подслеповатый. )))
Правда при моих -2.5 еще ничего.
Действительно некоторые сайты ну просто невозможно смотреть.
Апокалипсис 17.03.2008 9:17 pm
Люди, успокойтесь! Всех ламо-дизайнёров вам все равно не переубедить. Это пустая трата времени.
В файрфоксе есть волшебное меню View - Page Style, которое помогает практически всегда. Именно так я и читаю данный сайт (иначе пришлось бы читать узкую колоночку на 1/4 ширины экрана, а это неудобно!).
Для поделок особо тяжелых шизо-дизайнёров (напр. горизонтальная прокрутка): копируем текст, создаем текстовый файл, вставляем текст, заменяем все переносы на тег br, меняем расширение файла на .html, открываем в браузере и спокойно читаем.
Никаких проблем!
Тут Хумора.NET 28.03.2008 4:35 pm
[…] easy, it’s free, and you never have to leave the Wordpress dashboard while you are working. Близорукий дальтоник следит за тобой. Как потомственный очкарик со всей ответственностью […]
BOLK 28.03.2008 7:28 pm
Меня удивляет, почему бы не использовать просто нормальные браузеры.
Скажем, «Опера». Умеет масштабировать, не ломая дизайн и переключаться с высоконстрастные схемы.
Денис Судилковский 28.03.2008 7:32 pm
BOLK,
Опера - далеко не самый популярный браузер, хотя я как раз ею и пользуюсь.
Но все же, лучше изначально делать нормальные сайты.
Их окружают розовые слоники : Бизнес Дизайн 29.04.2008 6:35 pm
[…] фоне продаст больше синего. Да, и не забывайте о близоруких дальтониках, которым по барабану ваши краски, для них они все […]
Оставьте отзыв
Имя (обязательно)
Почта (обязaтельно)
Сайт
Для избранных
Введи свой email:
Всякое разное
На меня ссылаются:
Почему Одни Платят, а Другие Делают На Этом Деньги? Продолжаем Тему "Писек"Аида - опера или модель? [Блог Дмитрия Лукомского]КрЕаТиВиМ рекламу для интернет-магазина. Как увеличить конверсию трафика и ... Тайна Безголовых "Продажников"А Вы знаете где интернет-магазины берут товары? А я знаю.Что надо сделать, чтобы смотреть Flash-Video на Вашем компе!?Как Защитить Партнерскую Ссылку от Обрезания?Радости и печали корпоративного блога
Страницы
Обо мне
Контактная информация
Рубрики
Интервью
Конкурсы
Контент
Красивый маркетинг
Мысли разумного
Оффтоп
Теория дизайна
Юзабилити
Последние записи
Их окружают розовые слоники
Слово ***
Разыскивается дизайнер v1.0
Про смелость веб-мастера
Конкурс. Без шуток
Даже гламурные очки не дают права нарушать закон об авторском праве 2007 Бизнес Дизайн
знакомства. Хороший огнетушитель в Киеве
intex
kaasi
outlook
master
elmos
ziplock
russia music awards
dvd-box
locus
ielts
k610
r-600
master
478
omega