Структура странички и навигация

Структура странички и навигация

Любой сайт, если он состоит более чем из одной странички, имеет некую структуру, а также систему меню (гиперссылок), с помощью которой пользователь может перейти в нужный раздел.

Основа основ навигации в любом сайте — система меню: го¬ризонтальная, вертикальная или комбинированная.

Горизонтальная система меню располагается так же, как и, например, в программах. Реже используется горизонтальное меню с выпадающим вертикальным меню. Довольно часто в качестве системы навигации (особенно на больших сайтах) используется вертикальное меню, так как в него обычно помещается гораздо больше элементов. Встречаются и комбинированные типы меню.

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

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

Какие виды графики обычно используются на сайтах? Давайте их перечислим:
• шапка (заголовок). Заголовки сайтов обычно делают в графике, чтобы иметь возможность, например, изобразить логотип и написать название сайта красивым шрифтом с какими-
то эффектами.
• элементы меню. Их также могут оформлять в виде графики — чтобы иметь возможность написать пункты меню красивым шрифтом. Это считается не очень хорошим тоном (меню принято делать все-таки в тексте), однако такой подход используется довольно часто;
• пиктограммы. Это небольшие изображения, заменяющие собой пункты текстового меню. Пиктограммы более компактны по сравнению с текстовым обозначением действия, поэтому используют их довольно часто. Например, пиктограмма с изображением конвертика обычно заменяет ссылку «написать письмо», с изображением принтера - ссылку «распечатать», а с изображением домика - ссылку на главную страницу сайта. Иногда пиктограммы объединяют с текстовыми ссылками;
• фоновые рисунки. Правилом хорошего тона в дизайне сайтов считается создание ровного одноцветного фона, который не мешает восприятию текста. Однако многие веб-мастера (особенно начинающие) предпочитают использовать в качестве фона сайта некие текстуры или даже целые рисунки. Иногда это может смотреться вполне стильно... ...а иногда — просто кошмарно;

• баннеры. Еще один практически обязательный элемент, присутствующий на большинстве сайтах, — так называемые баннеры. В отдельной главе мы будем очень подробно рассматривать баннеры и баннерообмен, а сейчас достаточно просто знать, что это просто реклама. Ее удивляйтесь, если вы зайдете на сайт, посвященный опытам Ликок де Буабодрана, а там вдруг увидите яркий прямоугольничек, призывающий вас срочно познакомиться с какой-нибудь красоткой, — это и есть рекламный баннер. Обычно баннеры бывают следующих размеров: 468x60 — классический размер прямоугольного баннера (рис. 18.22); 100x100-устаревший и довольно редко используемый размер; 88x31 — так называемые кнопки или баннерики, которые обычно применяются в качестве ссылок на какие-то другие проекты; 120x600 — «высокий» баннер, который часто называют «башней». Стоит отметить, что вам могут попадаться другие баннеры;
• анимация. В старые интернетовские времена наличие анимированных картинок на сайте считалось крайне дурным тоном, и их использовали только васи пупкины для своих кошмарных домашних страничек. Однако с появлением флэш-анимации стали возникать сайты, частично или целиком выполненные с использованием флэш. Как правило, выглядят они очень стильно и привлекательно.

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