Ліво, Право або Центр?, Різне, Інтернет-технології, статті

Олександр Климов

Ви пам’ятаєте себе дитиною із зав’язаними очима? Тримає в руках шматок старої мотузки з гострою голкою на одному кінці і шукають, куди б її увіткнути на намальованому зображенні осла. У той безтурботний час це приносило нам, дітлахам, нескінченні години щастя в непогожі зимові дні.

Строкатий шматок мотузки був хвостом, якого не вистачало ослу, і ідея полягала в тому, щоб доставити друзям і супротивникам шалений веселощі, коли ви встромляли хвіст в ніс або ліве вухо бідному тварині.

Щасливі, прості дні. Мир далекий від сучасних, 64-розрядних, ігрових приставок з “Періодично повторюється стимулюванням синдрому дії “, які можуть з’явитися в нетерплячих дитячих руках на другий місяць перебування в дитячому саду. Незалежно від цієї сучасної високої техніки, всякий раз, коли я починаю планування нового сайту, я згадую про грі ‘Увіткни ослу хвіст “.

Всім нам добре відомо, що хороша система навігації по сайту життєво важлива. Вона повинна бути витонченою, але простий, хитрою, але інтуїтивно зрозумілою. І, перш за все, однаково розташовуватися на всіх сторінках сайту. І тут може виникнути проблема – де на сторінці її розмістити?

Більшість людей розміщує навігацію на верху сторінки – це досить простий вибір, хоча вторинну текстову навігацію також може бути корисно розмістити внизу кожної сторінки.

Але що робити з основною системою навігації на верху сторінки? Розташувати її ліворуч, праворуч або по центру? Це значно цікавіший питання.

Всі ми хочемо, щоб наші сайти виділилися в натовпі. Розташування навігації зліва може бути нудним, центр має, і переваги і недоліки. А розташування праворуч може виглядати як осел з хвостом, зростаючим з лівого вуха. Так що ж робити?

Давайте швидко розглянемо кожну з позицій.

Консервативна Ліва сторона

Ліва частина сторінки – звичайне місце для розташування навігаційних елементів. Так як в англійською та іншими західно-європейських мовах пишуть і читають зліва направо, то система навігації розташовується прямо на шляху погляду користувача.

Також, навігаційна панель розташована ліворуч під багатьох програмах, і це стало чимось на зразок негласного стандарту у веб-дизайні. Навіть в друкованому дизайні, навігація зазвичай розташовується зліва – подивіться, наприклад, як зроблено більшість змістів.

Головна проблема з розташованою зліва навігаційною панеллю полягає в тому, що вона віднімає місце у вмісту і зменшує доступне на сторінці простір. Вона створює ефект ‘інформаційної огорожі’, яку відвідувач повинен подолати для того, щоб прочитати матеріали, розташовані на сторінці. Це може бути як негативним, так і позитивним фактором.

Нехай, наприклад, користувач обмежений дозволом екрану 640х480 пікселів. З урахуванням того, що він не може розгорнути вікно браузера на весь екран, на вміст сторінки залишається 570-580 пікселів. Навіть, якщо припустити, що залишиться 600 пікселів, цього дуже мало для вмісту сторінки, якщо зліва добавлена навігаційна панель.

Радикальна Права сторона

Недавно стало популярним розміщення навігаційної панелі у правого краю веб-сторінки. Аргументується це тим, що навігаційна панель забирається з шляху погляду користувача, і це дозволяє негайно поринути в читання змісту. Прихильники распоженной справа системи навігації також зазначають, що оскільки кнопки розташовані близько смуги прокрутки, це скорочує рух миші для користувача.

Незважаючи на своє потенційне перевагу, правобічна наувігація має кілька серйозних недоліків. Розглянемо спочатку просте питання. Де точно знаходиться право? В Залежно від розмірів монітора і вікна браузера, відстань від лівої межі до правої може сильно відрізнятися.

На дуже великих моніторах (вони стають все більше і дешевше з кожним днем!) навігаційна панель може виявитися дуже далеко від лівого краю сторінки, і рух миші між нею і улюбленої кнопкою користувачів – на якій написано ‘Back’ – може бути величезним. Це може бути добре чи погано в залежності від конкретної ситуації.

Також, при такому гнучкому розташуванні правої межі сторінки, дизайн теж повинен бути дуже гнучким. З цієї причини деякі дизайнери створюють штучну праву межу для своєї правобічної навігації. Зазвичай вони розташовують її між 600 і 650 пікселями так, щоб вся сторінка була не ширше 750 пікселів, що приблизно еквівалентно стандартному листу паперу.

Це прийнятно, але не дозволяє отримати на всіх моніторах друга перевага правобічної навігації: близькості навігаційної панелі до смузі вертикальної прокрутки. Звичайно, вона буде ближче, ніж лівостороння, але все одно далеко на великих моніторах.

Ліберальний Центр

Розташування навігаційної панелі по центру є останнім з основних способів. Важкі навігаційні елементи начебто кнопок або карт зображення (image map) звичайно використовують тільки на головній сторінці сайту, так як вони можуть швидко заволодіти увагою відвідувача і відвернути від змісту.

Однак, для головних веб-сторінок важка графічна шапка не є дуже великий проблемою. Їх основне завдання – допомогти відвідувачу зрозуміти, куди йти далі, тому розташування навігації по центру може мати сенс. Такий дизайн дозволяє головній сторінці сайту візуально відрізнятися від решти сторінок, дозволяючи легко зрозуміти, що саме вона головна.

Треба сказати, що на всіх інших сторінках слід уникати розташованої по центру навігаційної панелі – відмінною від простих текстових посилань. Вміст сторінки також бажано не вирівнювати по центру, так як це створює враження ‘аматорської сторінки’, особливо якщо в параграфі більше декількох слів.

Висновок. Ваш вибір 🙂

Продавець на базарі говорить: “Ви заплатили ваші гроші і ви вибираєте! “.

Рідко є однозначно ‘кращий шлях’ що-небудь зробити. Це дозволяє проявитися і засяяти вашому власному стилю. Кожне розташування навігаційної панелі має свої переваги та недоліки. Потрібно розглянути безліч інших аспектів створення веб-сайту перед тим як зробити правильний вибір.

Я не буду робити вибір за вас – це не правильно. Я намагаюся показати різні варіанти і зняти сліпоту з ваших думок, щоб ви не дуже часто встромляли ослові хвіст у ліву ніздрю.

Це повинно статися, тому що ви бачите можливі альтернативи. Ви будете робити правильний вибір у вашій власній ситуації – по крайней мере, майже завжди.

Це я вам обіцяю 🙂

Схожі статті:


Сподобалася стаття? Ви можете залишити відгук або підписатися на RSS , щоб автоматично отримувати інформацію про нові статтях.

Коментарів поки що немає.

Ваш отзыв

Поділ на параграфи відбувається автоматично, адреса електронної пошти ніколи не буде опублікований, допустимий HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*

*