Главная › Образование › Какие основные элементы web страницы. Основные элементы веб-страниц. Структура языка HTML: теги

Какие основные элементы web страницы. Основные элементы веб-страниц. Структура языка HTML: теги

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

Первым элементом web-страницы, является ее заголовок . Он может быть выполнен как в текстовом, так и в графическом варианте, однако и в том и в другом случае он должен располагаться в верхней части документа. Иногда с заголовком совмещают меню выбора кодировки кириллицы и кнопки для перехода с русскоязычной на англоязычную версию сайта , если данный Web-ресурс представлен на двух языках.

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

Основную часть документа занимает так называемое текстовое поле - участок, где и размещается смысловое наполнение страницы: содержательный информационный текст и иллюстрации. Перечисленные элементы еще называют «контент» (от англ, content - содержание). Расположение текстового поля зависит в первую очередь от того, каким образом web-дизайнер разместит остальные элементы документа.

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

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

Наиболее устоявшимся подходом является размещение элементов навигации у левой границы страницы.

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

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

Web-сайты отличаются друг от друга:

Размерами (от нескольких страничек до Web-серверов с гигабайтами информации).

Дизайном (общим цветовым решением, форматом шрифта, используемыми иллюстрациями и т.д.).

Структурой (системой ссылок, связью страниц внутри сайта, а также связью с другими сайтами).

Вместе с тем, любая веб-страница строится из стандартных элементов, которые можно разделить на две группы:

Пассивные (иллюстративные) элементы

анимация

Активные элементы

поля ввода
переключатели

Фреймы (англ. frame - рама, каркас) - это технология, которая позволяет разделять веб-страницу на несколько частей (окон) и дает возможность изменять содержание каждой части вне зависимости от других частей. Так, оглавление сайта часто помещается в один неизменяемый фрейм, а содержимое -в другой.

Тема 9. Электронное общение. Адреса электронной почты

Электронная почта (E-mail от англ. Electronic mail) является основным видом сетевых услуг. Обмен сообщениями реализуется через систему почтовых серверов .

Для каждого пользователя на почтовом сервере заводится свой почтовый ящик - это место на диске сервера, в котором хранятся сообщения электронной почты. При прохождении процедуры регистрации электронного адреса пользователь получает имя (login) и пароль, по которым в дальнейшем получает доступ к своему почтовому ящику. Имя (login, логин) почтовому ящику дает сам пользователь. Сервер следит лишь за тем, чтобы имя было уникальным.

Адрес электронной почты состоит из двух частей, разделенных знаком @ (этот знак принято называть “собака”):

имя почтового ящика пользователя (выбранное им, в нашем примере - irina ).

доменное имя почтового сервера (в нашем примере - mail . ru ) .

Например, irina @ mail . ru

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

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

По данным этой записи сервер идентифицирует пользователя.

Безопасность в Интернет Планирование защиты

Объектом атаки может стать как передаваемая по сети информация, так и компьютер, подключенный к Интернет.

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

Линии защиты:

Блокировка возможных атак:

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

Используйте аутентификацию и шифрование.

Уменьшение источников риска:

Используйте только те службы Интернет, которые Вам действительно необходимы.

Используйте лишенное недоработок программное обеспечение и постоянно обновляйте его.

Правильно настройте программное обеспечение (чем меньше разрешено, тем выше безопасность).

Не афишируйте информацию о себе в сети.

Ограничьте доступ к ресурсам своего компьютера.

Подготовка к восстановлению после атаки:

Создайте и регулярно обновляйте резервные копии рабочих данных.

Всегда имейте под рукой дистрибутивы программ.

Аутентификация (от rp еческого authentikos - подлинность) – подтверждение подлинности.

Все мы прочли огромное количество статей о том, как подбирать ключевые слова и правильно составлять из них список, как с помощью ключевых слов сделать сайт, релевантный определённым поисковым запросам. Давайте детальнее рассмотрим вопрос размещения ключевых слов на веб-страницах.

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

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

Заголовок страницы (тег title)
Ключевые слова страницы (Meta-тег keywords)
Описание страницы (Meta-тег description)
Альтернативный текст для картинок (Alt-тег)
Содержимое веб-страницы (тег body)

Из всех вышеперечисленных элементов веб-страницы самым важным из всех является содержимое страницы (пункт 5). Более подробно об этом далее.

А пока что давайте разберём этот список по порядку.

Элемент №1. Заголовок страницы (тег title)

Сперва рассмотрим заголовок страницы (тег title). Этот элемент самый первый и наиболее важный из всех прочих элементов в блоке head любой веб-страницы.

Заголовок веб-страницы Вы можете наблюдать в самой верхней строке Интернет браузера. Чтобы убедиться в этом, запустите любой браузер, к примеру, Internet Explorer, Opera или Mozilla Firefox, зайдите на любой сайт и сравните содержимое тега title с самой верхней строкой в этих браузерах. Поисковые машины используют этот тег в своих целях – для сбора информации о сайте и определения его тематики, а также используют в результатах поисковой выдачи (SERP) в качестве названия веб-страницы.

Запомните! Заголовок веб-страницы — это её краткое описание.

Помимо вышеперечисленного содержимое тега title используется в качестве названия веб-страницы при добавлении её в Избранное Интернет браузера.

Элемент №2. Ключевые слова страницы (Meta-тег keywords)

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

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

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

Элемент №3. Описание страницы (Meta-тег description)

Meta-тег description — ещё один элемент сайта, в котором следует размещать ключевые слова. Поисковые машины просматривают данный тег на предмет наличия в нём ключевых слов, а также сравнивают его содержимое с содержимым самого сайта (содержимым тега body). Очень важным обстоятельством является и то, что поисковые машины используют содержимое тега description в качестве описания веб-страницы в результатах поисковой выдачи (SERP).

Данный тег должен содержать краткое описание веб-страницы, но не более 50 слов.

Элемент №4. Альтернативный текст для картинок (Alt-тег)

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

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

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

Элемент №5. Содержимое веб-страницы (тег body)

Итак, наконец-таки мы добрались до самого основного элемента сайта – тега body, элемента, содержимое которого больше всего интересует Интернет-пользователей. Основные поисковые машины больше не дадут Вам 1 строчку в результатах поисковой выдачи (SERP) только из-за наличия нескольких повторений ключевого слова на странице Вашего веб-сайта. Там сможет оказаться только наиболее релевантная конкретному поисковому запросу веб-страница.

Чтобы этого добиться, Вам следует внедрить подобранные ключевые слова в код веб-страниц, соблюдая частоту их повторения. Действуйте следующим образом: для каждой конкретной страницы выберете 1-2 ключевых слова и оптимизируйте соответствующую страницу под них.

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

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

Язык HTML

Web-страницы могут существовать в любом формате, но в качестве стандарта принят Hyper Text Markup Language - язык разметки гипертекстов, предназначенный для создания форматированного текста, насыщенного изображениями, звуком, анимацией, видеоклипами и гипертекстовыми ссылками на другие документы, разбросанные как по всему Web-пространству, так и находящиеся на этом же сервере или являющиеся составной частью этого же Веб-проекта.

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

Язык HTML существует в нескольких вариантах и продолжает развиваться, но конструкции HTML скорее всего будут использоваться и в дальнейшем. Изучая HTML и познавая его глубже, создавая документ в начале изучения HTML и расширяя его насколько это возможно, мы имеем возможность создавать Web-страницы, которые могут быть просмотрены многими браузерами Web, как сейчас, так и в будущем. Это не исключает возможности использования других методов, например, метод расширенных возможностей, который предоставляется Netscape Navigator, Internet Explorer или некоторыми другими программами.

Работа по HTML - это способ усвоить особенности создания документов в стандартизированном языке, используя расширения, только если это действительно необходимо.

HTML был ратифицирован World Wide Web Consortium. Он поддерживается несколькими широко распространенными браузерами, и, возможно, станет основанием почти всего программного обеспечения, которое имеет отношение к Web.

Принципы создания web-страницы, основные элементы web-страницы

Для создания Web-страниц используется особый язык HTML (HyperText Markup Language - язык гипертекстовой разметки). Этот язык определяет набор специальных команд, называемых тегами и используемых для задания форматирования или назначения тех или иных элементов Web-страницы. Особые теги используются для размещения на Web-страницах графических изображений, аудио- и видеоклипов и прочих так называемых внедренных объектов.

Web-страницы представляют собой обычные текстовые файлы, созданные в стандартном Блокноте или аналогичном простейшем текстовом редакторе. И содержат они текст, тот самый текст, который вы хотите поместить на страницы, только размеченный особым образом. Для того чтобы различные программы Web-обозревателей правильно отображали одну и ту же Web-страницу, язык HTML должен быть стандартизирован.

На практике на стандарт HTML большое влияние оказывает наличие тегов, предложенных и поддерживаемых наиболее известными браузерами, такими как Microsoft Internet Explorer и Google Chrom. Эти теги в данный момент могут, как входить, так и не входить в состав действующей спецификации HTML.

Существуют средства редактирования, разработанные специально для написания HTML. Они позволяют экономить время, так как содержат клавиши быстрого доступа для выполнения повторяющихся операций, например, задания начальных установок документов, таблиц или просто применения стилей к тексту. Редакторы HTML отличаются от авторского WYSIWYG-инструментария тем, что требуют знания правил составления HTML вручную, редакторы лишь упрощают и ускоряют этот процесс. Наряду с тегами HTML, стандартизированными WWWC (стандартные теги), Web-обозреватели поддерживают множество нестандартных тегов. Эти теги были введены разработчиками той или иной программы Web-обозревателя, чтобы получить преимущество перед конкурентами. Они надеялись, что эти фирменные расширения впоследствии войдут в стандарт HTML, но этим надеждам так и не суждено было сбыться. Однако теги остались, и они все так же поддерживаются.

Для создания Web-страниц понадобится любой браузер - Internet Explorer или Google Chrome Mozilla Firefox, а лучше оба, так как многие элементы HTML по-разному отображаются в разных программах просмотра и весьма желательно контролировать эту разницу.

Кроме того, нужен любой текстовой редактор, например для подготовки HTML - файлов, а браузер - для просмотра и контроля сделанного.

Для того чтобы создать Web-страницу, первым делом создают структуру сайта. Сайт - это сервер, имеющий уникальное имя и постоянный адрес, физически подключенный к WWW, или виртуально размещенный на другом, более крупном сервере.

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

Есть несколько простых правил, позволяющих интерфейсу сайта быть понятым посетителю [№10].

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

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

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

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

5. На Web-сайте обязательно должны быть информационные разделы:

с данными о компании (сфера деятельности, адрес, контактные телефоны и т.д.);

Основные элементы Web-страниц:

1. Заголовок / Логотип (Шапка)

3. Контент /Содержание (Текстовое поле)

4. Элементы навигации

5. Информация о разработчиках сайта

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

Первым элементом Web-страницы, который нам предстоит рассмотреть, является ее заголовок. Логотип или название сайта выполняет для него ту же роль, что и вывеска на входе в какое-либо учреждение. Другое дело Интернет: здесь основной способ перемещения - это телепортация, и поэтому мне нужно видеть эту «вывеску» на каждой странице.

Основную часть документа занимает так называемое Текстовое поле - участок, где и размещается смысловое наполнение страницы: содержательный информационный текст и иллюстрации.

Перечисленные элементы еще называют «Контент» (от англ, content - Содержание). Расположение текстового поля зависит в первую очередь от того, каким образом Web-дизайнер разместит остальные элементы документа.

Рисунок 1. Пример контента сайта

Рисунок 2. Контактная информация

Перед тем как приступить к созданию своего сайта очень ответственно подойдите к проблеме компоновки элементов страниц. В общем случае веб-страница делится на контент страницы, навигацию и сопутствующую информацию. Эти элементы в свою очередь делятся на более мелкие элементы.

В итоге последовательность действий по разработке Web-сайта сводится к следующему несложному алгоритму:

1. Постановка целей и определение основных задач.

2. Создание списка будущих тематических разделов.

3. Разработка логической и физической структуры ресурса.

4. Подготовка эскиза дизайна, компоновки сайта, невидимой верстальной таблицы.

5. Подготовка текстовых материалов.

6. Подготовка графических материалов в векторной форме.

7. Экспорт векторных рисунков в растровый формат.

8. Оптимизация всех изображений.

9. Создание шаблонов Web-страниц.

10. Сборка Web-страниц и отладка кода.

11. Проверка идентичности отображения Web-страниц с различным экранным разрешением и цветовой палитрой и различных браузерах.

Любая web-страница содержит определенный набор стандартных элементов, являющихся обязательными компонентами каждого ресурса Интернета. Безусловно, ассортимент и количество подобных объектов могут варьироваться в зависимости от тематической направленности сайта, объема опубликованных на нем материалов, а также от целей и задач, которые ставит перед собой создатель данного ресурса. Компоновка таких элементов, проектирование их взаимного расположения и составляет одну из главных задач web-мастера.

Первым элементом web-страницы, который нам предстоит рассмотреть, является ее заголовок. Он может быть выполнен как в текстовом, так и в графическом варианте, однако и в том и в другом случае он должен располагаться в верхней части документа. Иногда с заголовком совмещают меню выбора кодировки кириллицы и кнопки для перехода с русскоязычной на англоязычную версию сайта, если данный web-ресурс представлен на двух языках. Непосредственно подзаголовком документа, как правило, располагается пространство, отведенное для размещения рекламного баннера. Включение баннера именно в верхнюю часть web-страницы в большинстве случаев является обязательным условием регистрации сайта в службах баннерного обмена - системах, рекламирующих созданный вами ресурс в обмен на показ на страницах вашего сайта рекламы других участников баннерообменной сети. Стандартный размер баннеров, публикуемых под заголовком документа, составляет обычно 468x60 точек. Если вы используете статический принцип компоновки страницы, ширина заголовка вашего документа будет составлять приблизительно 640 пикселов: это значение обусловлено, прежде всего, необходимостью обеспечить корректное отображение документа на мониторах с экранным разрешением 640x480 точек и избежать появления горизонтально полосы прокрутки, затрудняющей его просмотр. Очевидно, что ширина баннера в этом случае будет значительно меньше ширины заголовка, благодаря чему в той части страницы, где вы планируете отвести место под рекламу, образуется незанятое пространство, которое можно заполнить логотипом компании-владельца данного сайта или ссылкой на сервер, осуществляющий web-хостинг. Разумеется, логотип необходим далеко не всегда: как правило, он включается в состав web-страницы лишь в случае, если сайт имеет коммерческую направленность.

Основную часть документа занимает так называемое текстовое поле - участок, где и размещается смысловое наполнение страницы: содержательный информационный текст и иллюстрации. Перечисленные элементы еще называют «контент» (от англ, content - содержание). Расположение текстового поля зависит в первую очередь от того, каким образом web-дизайнер разместит остальные элементы документа.

Следующей обязательной составляющей частью web-страницы являются элементы навигации - гиперссылки, связывающие данный документ с другими разделами сайта. Элементы навигации могут быть выполнены в виде текстовых строк, графических объектов, то есть кнопок, либо активных компонентов, например Java-апплетов. Последние представляют собой те же кнопки, которые, в отличие от своих «традиционных» сестер, умеют реагировать на движения мыши, выполняя при наведении на них курсора какие-либо несложные действия (включение подсветки, создание эффекта «нажатия», изменение формы и т. д.). Как я уже упоминал в разделе «Основные "постулаты" web-дизайна»,располагать элементы навигации следует таким образом, чтобы они всегда были «на виду», «под рукой», то есть так, чтобы пользователю не приходилось «отматывать» страницу назад, если текстовое поле занимает по высоте несколько физических экранов, после чего подолгу искать ссылки на другие разделы. Наиболее устоявшимся подходом является размещение элементов навигации у левой границы страницы.

В нижней части документа принято публиковать информацию о разработчиках сайта и адрес электронной почты, по которому посетители ресурса могут направить владельцам странички свои отклики, предложения и пожелания. Если web-страница является стартовым документом, в нижней ее части также размещают счетчик посещений - небольшой сценарий, вызывающий установленный на сервере CGI-скрипт, который фиксирует каждое открытие документа в браузере пользователей, изменяя значение индикатора счетчика. Благодаря этому web-мастер без труда определит количество посетителей, навестивших его страничку в течение какого-либо времени. Отмечу, что счетчик посещений устанавливается только на первой странице, вызываемой при обращении к сайту, в остальных документах ресурса он отсутствует.

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

Рис. 3.6. Пример компоновки web-страницы с левым позиционированием элементов навигации

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

Рис. 3.7. Пример компоновки web-страницы с правым позиционированием элементов навигации

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

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

Рис. 3.8. Пример компоновки web-страницы с верхним позиционированием элементов навигации

Безусловно, все, что было сказано в данном разделе, является не панацеей, а руководством к действию. Я пытаюсь изложить лишь общие принципы, которые применяются при компоновке структуры сайта, окончательное же решение всегда остается за web-мастером. В конечном счете, какой бы дизайн вы не заложили в основу своего будущего проекта, результат ваших трудов все равно будет правильным: в Интернете нет ни цензуры, ни каких-либо регламентов, загоняющих создателя сайта в те или иные жесткие рамки. Примером дизайнерского решения, не попадающим ни в одну из указанных выше категорий, может служить так называемая смешанная компоновка, примерная схема которой приведена на рис. 3.9.

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

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

Рис. 3.9. Пример «смешанной» компоновки web-страницы