Учебник Macromedia Dreamweaver (стр. 49 из 135)

Полезное содержимое сайта

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

Сведения о правах разработчика сайта

Рис. 7.6. Набор фреймов с заголовком, объединенным с набором гиперссылок

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

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

Кроме того, часто в отдельных фреймах помещают рекламу в виде банне-ров. Таким образом реклама отделяется от действительно полезной информации. Обычно фреймы с рекламой располагаются горизонтально сверху и (или) снизу окна Web-обозревателя и не очень велики по размерам — как раз на один или два баннера (рис. 7.7).

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

Рекламные баннеры

Остальное содержимое сайта

Рекламные баннеры

Рис. 7.7. Набор фреймов с двумя рекламными блоками

Здесь следует сказать еще о так называемых нулевых или невидимых фреймах. Так называются фреймы, чья ширина (для вертикальных фреймов) или высота (для горизонтальных) равна нулю. Фактически такие фреймы не видимы в окне Web-обозревателя. Используются они, как правило, для всяческих неблаговидных целей: размещения рекламных баннеров, которые оплачиваются за факт показа (такой баннер как бы показывается, но на самом деле не видим), скрытия какой-либо важной информации и пр. Часто такие "фокусы" можно увидеть на хакерских и жульнических сайтах.

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

Сложные наборы фреймов

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

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

Но проблема в том, что фреймы, входящие в один набор, могут располагаться либо только по горизонтали, либо только по вертикали. Но, скажете вы, как же сделать наборы фреймов, приведенные на рис. 7.1—7.7? Ведь их же кто-то делает, а если не делает, так зачем их было здесь приводить?

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

Взгляните на рис. 7.1. Давайте подумаем, как приведенный на нем набор фреймов можно реализовать на практике. Здесь мы имеем три фрейма, расположенных горизонтально и занимающих всю ширину набора, и один фрейм, занимающий часть среднего фрейма. Очевидно, что нам понадобятся два набора фреймов: один, внешний, делящий окно Web-обозревателя на три части по горизонтали, и второй, внутренний, делящий средний фрейм надвое по вертикали. Рис. 7.8 иллюстрирует вышесказанное.

Заголовок сайта
Набор гиперссылок для перехода между страницами сайта	Полезное содержимое сайта
Сведения о правах разработчика сайта

Рис. 7.8. Сложный набор фреймов, состоящий из двух простых. Внешний набор фреймов обозначен сплошными линиями, внутренний — штриховыми

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

Работа с фреймами

Но хватит пустых разговоров! Давайте займемся делом и на конкретном примере рассмотрим принципы фреймового дизайна. Мы создадим новую версию нашего сайта, посвященного гипотетическому Web-дизайнеру Ивану Ивановичу Иванову, версию, основанную на фреймах. И, не мудрствуя лукаво, выберем для него схему, показанную на рис. 7.1.

Проверьте, создали ли вы новую папку Sample2. Также проверьте, не удалили ли вы старую версию сайта, находящуюся в папке Sample 1. Ведь одна из важнейших заповедей Web-дизайнера: не разбрасываться старыми материалами — они могут пригодиться для нового сайта. Проверили? Все на месте? Тогда вперед!

Прежде всего, введем в Dreamweaver информацию о новом сайте. Вы можете просто взять сайт Sample site 1 и заменить его имя, корневую папку и имя главной страницы, а можете и создать новый сайт "с нуля". Как это делается, было рассказано в главе 6. На вкладке Remote Info диалогового окна Site Definition в раскрывающемся списке Access выберите пункт None (см. рис. 6.3) — мы с вами нигде не будем публиковать этот сайт. И имя нашего сайта будет Sample site 2.

После этого создайте новую Web-страницу. Сейчас мы рассмотрим процесс создания фреймов...

Создание фреймов

Да, мы рассмотрим, как создаются фреймы в Dreamweaver.

Но сначала сделайте следующее. Включите в подменю Visual Aids меню View пункт-выключатель Frame Borders. Это нужно, чтобы Dreamweaver показал нам границы наших будущих фреймов. Дело в том, что границы между фреймами могут быть невидимыми, что может создать нам немало проблем при написании текста страниц, отображаемых в этих фреймах. Если же вы выберете названный пункт, Dreamweaver будет показывать схематичные линии в тех местах, где проходят границы фреймов.

Внимание!

При открытии страницы, определяющей набор фреймов, вам придется каждый раз включать пункт-выключатель Frame Borders подменю Visual Aids меню View. К сожалению, Dreamweaver не запоминает этой установки.

Проще всего набор фреймов можно создать, воспользовавшись вкладкой Frames панели объектов. На рис. 7.9 показаны те ее кнопки, которые нам сейчас нужны. Голубым (на рисунке — светло-серым) цветом закрашен текущий фрейм, т. е. тот, в котором в настоящий момент стоит текстовый курсор. Также можно воспользоваться пунктами подменю Frames меню Insert. В табл. 7.1 приведены описания всех кнопок вкладки Frames панели объектов и соответствующих им пунктов подменю Frames.

Рис. 7.9. Вкладка Frames панели объектов (показана частично)

Таблица 7.1. Кнопки вкладки Frames панели объектов(в порядке слева направо)

Название кнопки	Пункт подменю Frames меню Insert	Описание
Left Frame	Left	Вставляет фрейм слева от текущего (того, в котором находится текстовый курсор) в тот же набор
Right Frame	Right	Вставляет фрейм справа от текущего в тот же набор
Top Frame	Top	Вставляет фрейм выше текущего в тот же набор
Bottom Frame	Bottom	Вставляет фрейм ниже текущего в тот же набор
Bottom and Nested Left Frame	Bottom Nested Left	Вставляет фрейм ниже текущего в тот же набор, создает в текущем фрейме вложенный набор с двумя горизонтальными фреймами и делает текущим правый фрейм вложенного набора
Bottom and Nested Right Frame	Bottom Nested Right	Вставляет фрейм ниже текущего в тот же набор, создает в текущем фрейме вложенный набор с двумя горизонтальными фреймами и делает текущим левый фрейм вложенного набора
Left and Nested Bottom Frame	Left Nested Bottom	Вставляет фрейм левее текущего в тот же набор, создает в текущем фрейме вложенный набор с двумя вертикальными фреймами и делает текущим верхний фрейм вложенного набора
Right and Nested Bottom Frame	Right Nested Bottom	Вставляет фрейм правее текущего в тот же набор, создает в текущем фрейме вложенный набор с двумя вертикальными фреймами и делает текущим верхний фрейм вложенного набора
Top and Bottom Frames	Top and Bottom	Вставляет два фрейма сверху и снизу от текущего
Left and Nested Top Frame	Left Nested Top	Вставляет фрейм левее текущего в тот же набор, создает в текущем фрейме вложенный набор с двумя вертикальными фреймами и делает текущим нижний фрейм вложенного набора

Right and Nested Top Frame Top and Nested Left Frame Top and Nested Right Frame

Right Nested Top Top Nested Left Top Nested Right

Вставляет фрейм правее текущего в тот же набор, создает в текущем фрейме вложенный набор с двумя вертикальными фреймами и делает текущим нижний фрейм вложенного набораВставляет фрейм выше текущего в тот же набор, создает в текущем фрейме вложенный набор с двумя горизонтальными фреймами и делает текущим правый фрейм вложенного набораВставляет фрейм выше текущего в тот же набор, создает в текущем фрейме вложенный набор с двумя горизонтальными фреймами и делает текущим левый фрейм вложенного набора

Итак, давайте приступим к созданию нашего набора фреймов.