TML, CSS, СКРИПТЫ: практика создании сайтов

Код настолько прозрачен, что мне

даже не хочется его комментировать — со всеми свойствами и типами

селекторов, использованными в правилах листа стилей, читатель уже отлично

знаком.

п^^^’^^^Т^Т^^’^ч»‘

<^^1е>Правильный caUT

npaBnnbHbM сайт

Внешний вид документа, описанного в листинге 4.16, показан на рис. 4.19.

рВЩЩ|^^^В^^^^Ш^^^^^Я|И^^^^Н|

&Ф — DP»** @*д Г^рехоа $зкй*4ки ^нс^ие^ы ?р|аавк*

О * *Ф » Й^ *’Й1 Й) 1 J f»e:///Z:/examples/04/16/.ndex html

@ns^8h9 started Qiatestifeadte^.

*j m m**t* \\CV

j m t

ifr., ¦ ft .*.., J

Правильный сайт

Здесь ¦ Будет • Меню • Навигации

Организация пространства страницы

Успех будущего веб-проекта во многом определяется качеством исполнения

фундамента — шаблонов главной и внутренних страниц сайта. Мы приняли за аксиому тот

факт, что все сайты информационного характера (в отличие от презентационных проектов)

в значительной мере похожи друг на друга. И общность эта сильнее всего выражена в

составе и взаимном расположении элементов страниц.

В организации пространства страницы любого информационного сайта можно выделить

как минимум четыре функциональные области со строго определенными ролями. Это

«шапка» (в английской терминологии — header), блок навигации, область основного текста

и «подвал» (footer).

foroeo

mW^^vwW^^ *:• ^, ^ «5 •»

Рис. 4.19. Внешний вид страницы стремя функциональными областями

Очевидно, однако, что «снизу чего-то не хватает» — давайте попробуем

продублировать навигационный блок ниже текстового содержания, попутно

поиграв немного с вертикальными отступами новоиспеченных двух панелей

навигации, которые теперь определяются при помощи селектора класса.

Заодно не мешало бы приделать и «подвал»:

206 Часть II. Применение веб-технологий стороны клиента для создания сайтов

\ Лиотинг 4,17, Усовершенствованный шаблон страницы

^ «http://www.w3.org/TR/xhtmll/DTD/xhtmll-strict.dtd»>