Восприятие информации Как создать вой сайт > Вебмастеру > Создание своего сайта > Восприятие информации

Восприятие информации по горизонтали и вертикали

— Слово для доклада предоставляется товарищу Гаврилину! — крикнул Гаврилин.
Принц Датский-Маховик и московский гость, не сговариваясь, записали в свои записные книжки:
«Торжественный митинг открылся докладом председателя Старкомхоза т. Гаврилина. Толпа обратилась в слух».
«12 стульев», Ильф и Петров.

    Почему мы воспринимаем информацию слева направо и сверху вниз (как говорят некоторые, буквой Z)? Правильно, потому что мы так пишем. Так пишет добрая половина человечества, а создатели компьютеров «навязали» такой стиль и восточным народам (хотя те и сопротивляются).

    А почему мы так пишем? Да потому что писать справа налево неудобно. Так же как писать левшам слева направо. Мы же себе строчку рукой закрывать будем!

«Лево-право, право-лево…» © Фунтик

    Т. е. вывод какой? Виновата физиология, а не мозги (у Востока — наоборот).

    Посмотрим правде в глаза… человека:


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

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

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

структура страницы сайта в глазах человека

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

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

восприятие информации вертикальными блоками

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

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

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

колонки со связанной информацией

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

    Ещё использование колонок для разделения контента и инструментов (сервисов, пользовательского меню и т. д.) тоже является хорошей практикой.

колонки с контентом и навигацией

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

в правой колонке — информационный шум

    Статью с картинки выше я прочитаю до конца (она ещё ниже заканчивается), а направо даже не посмотрю.

    А что вы думаете по этому поводу?

Автор: Никита Селецкий.

Комментарии:

  • lesha:
    Думаю что размещение по горизонтали информации не достаточно ещё освоено в интернет, и может когда-нибудь выстрелит ещё :)
    Единственная проблема, например с полногоризонтальными сайтами не привычно скролить.
  • mikolka:
    Фотографы давно свои сайты-портфолио делают горизонтальными. На широкоформатниках особенно хорошо смотрятся.
  • uggallery:
    Разбиение страницы на горизонтальные блоки это основной тренд в современном веб-дизайне, я счтаю. Внутри они содержат блоки меньшего размера, примерно квадратной формы, с небольшой длинной строк и т.п. Дизайн с вертикальными блоками (колонками) на всю высоту страницы уже воспринимается как анахронизм, привет девяностые.
    Только не надо путать со страницами с нарочито сверхширокими страницами, из-за чего возникает длинный горизонтальный скроллинг. Нет, речь о страницах нормальной ширины. Собственно иллюстрация номер три (Our Top Scuba Diving) всё прекрасно демонстрирует.
  • mikolka:
    Никита! Поздравляю тебя с днем рождения! Желаю всего тебе, чтобы все получалось-сбывалось и много-много здоровья.
  • Никита:
    Спасибо большое, Миколка! :)
  • andrew:
    очень познавательно и интересно!
  • Dmitry Dulepov:
    Хорошая и правильная статья. Никита, ты не думал книгу написать о правильном дизайне? У тебя получится.
  • Никита:
    Спасибо, Дмитрий!
    Конечно думал… и думаю… :)
  • Egor:
    При обучении методу скорочтения (к примеру г-на Леонидова) основной подход делается на чтение по горизонтали (то есть схватить страницу целиком расфокусированным взглядом).
    И основная проблема это проблема количества символов по горизонтали, если страница будет очень длинна по горизонтали ничего хорошего из этого не выйдет.
    Отсюда вывод верстаем по старинке не более листа а4 а как они идут друг за другом по горизонтали, либо по вертикали дело вкуса.

 

⇓ 

Поделись ссылкой на Seoded.ru с друзьями, знакомыми и собеседниками в соцсетях и на форумах! А сам сайт добавь в закладки! Так победим.

Поделиться ссылкой на эту страницу в:

Полезные ссылки:

Онлайн-игры приносят деньги не только своим создателям Декрет — время зарабатывать деньги!

Ещё материалы по этой теме:

Краткая лекция по usability Заполняем формы колёсиком мышки Резервное копирование с помощью bat-файла Структура HTML-документа Три правила дизайна
основан в 2008 г. © Все права на материалы сайта Seoded.ru принадлежат Алексею Вострову.
Копирование (полное или частичное) любых материалов сайта возможно только с разрешения автора и при указании ссылки на источник.
Ослушавшихся находит и забирает Бабайка!