Закони верстки сайту

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

Існує безліч варіантів розташування об'єктів на сторінках сайту, і зараз я постараюся показати основні з них з усіма їх перевагами і недоліками. Що розуміють під об'єктами сайту? Логотип, головне меню навігації по розділах сайту і сама текстова інформація різних розділів. Для більшої зручності розуміння структури розділимо макет сторінки на чотири частини: шапка, панель навігації, вміст і підвал. Розглянемо все по частинах і подивимося, де повинна знаходитися і що повинна містити кожна частина. Макет головної сторінки сайту може і в принципі повинен відрізнятися від решти сторінок: саме головна сторінка повинна зацікавити користувача в тому, щоб той залишився на сайті і продовжив знайомство з його вмістом. Підрозділи призначені для відображення інформації. Саме тому нам доведеться розглядати головну сторінку окремо, але спочатку розберемося з основними параметрами сайту.

Перша проблема, з якою стикається дизайнер, - вибір розміру сайту, а точніше його ширини. Будь-яка сторінка повинна прокручуватися тільки по вертикалі. Дизайнери, які змушують користувача пересувати і горизонтальний бігунок, можуть відразу розпрощатися з 90% можливої ​​відвідуваності. Сайти бувають "гумові" і з фіксованою шириною. Гумові браузера і не виходять за його межі, добре виглядають при будь-якому дозволі, але мають обмеження - не можна вирівнювати картинки по краю і в шапку не можна вставити жорстку картинку, тому що вона не зможе розтягуватися. З такою шириною екрану все виглядає нормально. А тепер подивимося, що станеться, якщо у користувача встановлено більшу роздільну здатність і його екран ширший. Потворність, чи не так? Те ж саме станеться, якщо картинки будуть вирівняні по лівому краю, тому текст не повинен обтікати зображення, а кожній картинці - своя рядок. Я вже натякнув, що не можна використовувати в шапці жорстку картинку. Якщо в якості логотипу встановити малюнок шириною 1000 пікселів, то менше цієї величини сайт не зможе зменшитися. А при більшій ширині вікна картинку буде складно розтягнути без використання сценаріїв і без втрати якості. Щоб вирішити цю проблему, в заголовку можна використовувати шматок однотонного кольору або таблицю з картинкою в якості фону, яка буде розмножуватися при розтягуванні.

МИ ХОЧЕМО жорсткіше!

ЗВ В БУДЬ-ЯКИЙ МІСЦЕ

У МЕНЕ В салат МУХИ!

Багато дизайнерів в один голос кричать, що пора забути про табличне форматування і використовувати стилі. Стилі - потужна річ, але вони підтримуються далеко не всіма браузерами (більше 80% браузерів за статистикою - IE 6, ще близько 10% - IE 5, так може, вже пора забути про Netsсape п'ятирічної давності? - прим.).

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