jivo banner 468x60jivo banner 728x90jivo banner 930x180beget banner 468x60beget banner 728x90beget banner 930x180skillbox banner 468x60skillbox banner 728x90skillbox banner 930x180

Как правильно расположить сайдбар: справа или слева?

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

В тоже время ответ на вопрос: как расположить сайдбар, справа или слева давно изучен и имеет ответ. Это решение зависит от того, какой контент вы собираетесь включить в боковую панель, и от его относительной важности. Левая боковая панель полезна, если ваша основная навигация расположена на боковой панели. Поскольку читатели придают большее значение тому, что находится в левой части страницы.

Это основано на так называемом F-паттерне. Т.к. мы пишем слева направо, то и читаем мы так же.

f-pattern

Сначала пользователи читают горизонтально, обычно верхнюю часть области содержимого. Этот начальный элемент образует верхнюю полосу буквы F.

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

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

Очевидно, что этот шаблон сканирования не всегда состоит ровно из трех частей. Иногда пользователи будут читать нижнюю часть контента, что делает узор больше похожим на E, чем на F. В других случаях они читают только один раз, что делает узор похожим на Г. В целом, однако, модели чтения примерно напоминают букву F, хотя расстояние между верхней и нижней полосой может быть разным.

Вместо заключения

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

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

Правые боковые панели наиболее распространены. Боковая панель имеет второстепенное значение по сравнению с содержанием, а информация, размещенная на ней, полезна, но не жизненно важна. Чаще всего здесь располагаются похожие статьи, связанные новости, апсейлы, объявления, акции и реклама.

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

smsc banner 480x320smsc banner 728x90smsc banner 120x600skillbox banner 480x320skillbox banner 728x90skillbox banner 120x600flexbe banner 480x320flexbe banner 728x90flexbe banner 120x600

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 1

Оценок пока нет. Поставьте оценку первым.

Похожие посты