Описание представления навигационного меню

/* На внутренних страницах сайта титульная надпись в "шапке"
выступает в качестве ссылки на главную страницу. Для этой
ссылки задаются такие правила, чтобы она визуально была
неотличима от заголовка без ссылки */
#header a:link, #header a:visited, #header a:hover, #header a:active {
color: #fff;
text-decoration: none;
}

/* При помощи свойства display мы превращаем гиперссылки и
контейнер <span>...</span>, размещенные в блоке навигации, из
внутристрочных элементов в блочные, что дает нам возможность
указать ширину при помощи свойства width */
#menu a, #menu span
{
display: block;
width: 154px;
margin: auto;
}
/* Далее следуют правила представления кнопок навигационного меню.
Их четыре вида: 1) обыкновенные; 2) выделенные при помощи курсора
мыши; 3) соответствующие текущему "магистральному" разделу и
предназначенные для его внутренних страниц - для таких кнопок
назначен класс current; 4) соответствующие текущей
странице и поэтому не являющиеся ссылками - этот вид кнопок
представлен элементами <span>...</span> */
#menu a {
color: #000;
text-decoration: none;
}
#menu a:link, #menu a:visited {
background: #fff0cc;
border: solid 2px #fc9;
}
#menu a:hover, #menu a:active, #menu a.current:link,
#menu a.current:visited, #menu span {
border-style: solid dotted;
border-width: 2px;
border-color: #c00;
}
#menu a.current:link, #menu a.current:visited, #menu span {
background: #fff;
}
#menu span
{
color: #999;
}
#menu a.current:hover, #menu a.current:active {
background: #fff0cc;
}

Материалы, относящиеся к описываемому сайту, расположены на компакт-диске в директории \examples\03\08-11.
Это была, однако, лишь присказка. А сказка впереди.
Очевидным недостатком статического сайта является то, что меню навигации описывается на каждой странице. Таким образом, для того, чтобы добавить в структуру сайта новый раздел, придется модифицировать с десяток файлов веб-страниц (это количество в реальных веб-проектах может быть, разумеется, существенно б?льшим).
То же самое относится к «подвалу» — если нам захочется изменить год в упоминании о копирайте или адрес электронной почты, придется делать это во множестве файлов.
Благодаря использованию SSI-директивы include мы могли бы выделить описания «шапки», навигационного меню и «подвала» в отдельные файлы.
Трудность, однако, заключается в том, что описания «шапки» и навигационного меню не тождественны для всех страниц. На помощь приходят условные директивы SSI, проверяющие, какая именно страница запрошена пользователем.
Представляется разумным создать в структуре каталогов сайта две новые директории: _includes и _styles. В первую предполагается поместить файлы, подключаемые при помощи SSI, а во вторую — лист стилей. Названия директорий предваряются символом подчеркивания в знак того, что эти каталоги являются служебными, не относящимися к основному информационному наполнению сайта.
Будем использовать SSI по максимуму с тем, чтобы файлы информационных страниц сайта не содержали в себе ничего, кроме полезного контента.


© 2008-2018 ОптимизацияВебСайтов.ру


Любое использование текстового и графического контента сайта без активной ссылки на источник не доскается.