Макет (шаблон) xhtml страницы, созданный на основе div верстки с тремя колонками и колонтитулом (footer), прижатым к нижней части окна браузера

Анонсы

Здесь можно размещать анонсы будущих статей, обзоров и учебных материалов.

Ссылки

Место для размещения ссылок на ресурсы схожей тематики.

Форум

Возможность поучаствовать в on-line обсуждении вопросов, касающихся тематики ресурса.

Новости

Новости, связанные с жизнью сайта и его авторов.

Последние публикации

Ссылка на последние публикации, размещенные на ресурсе.

Реклама

Здесь уместно разместить рекламный баннер или блок контекстной рекламы.

Описание макета html страницы



Макет создан на основе так называемой DIV верстки, когда страница разбивается на области не средствами элементов таблицы (table, tr, th, td) а с использованием блочного тэга DIV.


Этот подход более гибкий, но и менее тривиальный, чем табличная верстка...

Верстка html страницы



Перед тем, как отрыть исходный код этой страницы, изучите материал статьи о стандартах XHTML, HTML и CSS, размещенных здесь.

Примеры веб-дизайна



Другие примеры html верстки и прочие приемы веб-дизайна вы можете найти на сайте codingcraft.ru в разделе основы веб-дизайна.

Особенности DIV верстки



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


Исходный html код содержит все необходимые комментарии.

Блок footer



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