1  2  3  4  5  6  7

Оптимизация фреймов
Создав наш первый работающий набор фреймов, можно подумать о его оптимизации.
Уменьшение объема и сложности HTML - кода
Если вы создаете достаточно сложные наборы фреймов, то можете столкнуться с тем, что Dreamweaver не очень оптимально формирует соответст­вующий HTML -код. В частности (да вы и сами это видели), Dreamweaver не может формировать наборы более чем из двух фреймов. Судя по всему, разработчики программы облегчили себе задачу за счет увеличения объема и сложности получаемого HTML -кода. Конечно, это можно стерпеть, если учесть, как хорошо Dreamweaver справляется со своими задачами в других случаях, но все же проблема остается.
Взгляните на код, сформированный Dreamweaver для нашего набора фреймов (автор слегка сократил его, убрав не относящиеся к делу атрибуты тегов):
<FRAMESET ROWS="*,54">
<FRAMESET ROWS="30,*">
<FRAME NAME="Header" SRC="/HTMLs/Header.htm">
<FRAMESET COLS="100,399">
<FRAME NAME="Nav" SRC="/HTMLs/Nav.htm">
<FRAME NAME="Main" SRC="/HTMLs/Main.htm">
</FRAMESET>
</ERAMESET>
<FRAME NAME="Copyright" SRC="/HTMLs/Copyright.htm">
</ERAMESET>
Как видите, Dreamweaver формирует только простые наборы из двух фреймов. А если фреймов в одном простом наборе должно быть больше, исполь­зуются сложные наборы с многократным вложением.
В частности, нам был нужен набор из трех горизонтальных фреймов. Поскольку Dreamweaver формирует только двухфреймовые простые наборы, он создал два вложенных набора, по два фрейма в каждом. (Соответствующий код выделен полужирным шрифтом.) Давайте немного упростим этот фраг­мент кода. У нас получится вот что :
<FRftMESET ROWS="30,*,54">
<FRAME NAME="Header" SRO"/HTMLs/Header.htm">
<FRAMESET COLS="100,399">
<FRAME NAME="Nav" SRC="/HTMLs/Nav.htm">
<FRAME NAME=" Main " SRC="/HTMLs/Main.htm">
</FRAMESET>
<FRAME'NAME="Copyright" SRC="/HTMLs/Copyright.htm">
</ERAMESET>
Если раньше у нас была трехкратная вложенность фреймов, то теперь мы обошлись двукратной, совместив два двухфреймовых простых набора в один трехфреймовый. (Этот фрагмент кода выделен полужирным шрифтом.) Как видите, HTML -код набора фреймов стал проще и компактнее.
Откройте страницу default . htm в окне документа, переключитесь в режим кода и внесите эти изменения, после чего снова переключитесь в режим страницы. Что мы видим? В окне документа ничего не изменилось. Как ви­дите, Dreamweaver правильно обрабатывает простые наборы из любого ко­личества фреймов. Вы можете щелкать по ним мышью в окне фреймов, устанавливать значения параметров в редакторе свойств, заполнять их текстом i в окне документа. Более того, если вы выберете набор из трех фреймов, Dreamweaver правильно отобразит его структуру в редакторе свойств. Получается, что Dreamweaver всетаки поддерживает простые наборы с количеством фреймов более двух.
Ускорение обработки фреймов
Приведем несколько советов, которые помогут Web -обозревателю быстрее обработать и отобразить наборы фреймов.
1. При указании размеров фреймов (высоты или ширины) по возможности используйте абсолютные (в пикселах), а не относительные (в процентах) единицы измерения. Помните, что для того, чтобы отобразить фрейм, Web -обозревателю нужно сначала получить его абсолютный размер. А если вы указали размер фрейма в относительных единицах, Web -обозреватель должен будет сначала вычислить соответствующий размер своего окна, что займет дополнительное время.
2. Внимательно проверяйте корректность интернет-адресов в атрибутах src тегов < frame >. Мало того, что обращение по несуществующему интернет-адресу занимает много времени, так один фрейм вашего набора останет­ся "пустым". А нет ничего отвратительнее "пустого" фрейма.
3. Задавайте замещение < noframes > только в тех случаях, если оно действи­тельно нужно. Помните, что любой лишний HTML -код замедляет загрузку Web -страницы, увеличивая ее в размерах. Уже говорилось по по­воду замещений и повторять это нет смысла.
4. Оптимизируйте HTML -код, порождаемый Dreamweaver .
Решение проблем с фреймами
Как вы знаете, ничего идеального на свете не бывает. Это утверждение относится и к фреймам.
Недостатки фреймов и их преодоление
Вроде бы, фреймы всем хороши. Они позволяют разделить окно Web -обозревателя на несколько независимых "форточек", в каждой из которых может отображаться своя Web -страница. Таким образом, одна большая Web -страница делится на несколько маленьких, содержащих какую-либо часть большой страницы: заголовок, полосу навигации, сведения об авторских правах и основное содержимое. При этом когда пользователь щелкает по гиперссылке, происходит обновление только фрейма с основным содер­жимым; содержимое всех остальных фреймов остается неизменным.
Достоинства такого подхода очевидны. Во-первых, не нужно дублировать заголовок, полосу навигации и сведения об авторских правах на всех страницах сайта — достаточно поместить их один раз в соответствующие фреймы, где они и останутся. Во-вторых, сами страницы уменьшатся в размерах и станут быстрее загружаться.
На этом достоинства фреймов кончаются, и начинаются недостатки.
Недостаток первый: невозможность обновления содержимого сразу двух или нескольких фреймов. Давайте рассмотрим гипотетический сайт — каталог программ, структура фреймов которого показана на рис. 7.26.
Предположим, пользователь щелкает одну из позиций списка категорий, расположенного в левом фрейме. Вам необходимо обновить содержимое фрейма списка программ, относящихся к выбранной категории, и вы это сделаете. Но, кроме того, нужно будет обновить содержимое фрейма описа­ния выбранной программы, скажем, вывести описание первой или самой популярной программы в списке. Ведь если оставить в нем описание программы, относящейся совсем к другой категории, это будет, мягко говоря, некрасиво.
К несчастью, средствами HTML это сделать невозможно. Обычная гипер­ссылка HTML , описываемая парным тегом <а>, может указывать только на один файл. Если вы хотите по щелчку загружать сразу две страницы (или более — в данном случае это несущественно) в разные фреймы, вам придет­ся писать сценарий на языке JavaScript . А это уже довольно сложная задача для начинающего Web -дизайнера. На первый раз можем посоветовать только постараться избежать использования таких наборов фреймов или же отказаться от фреймов вообще.
Недостаток второй: невозможность задания текста, который Web -обозреватель помещает в заголовок своего окна. Как вы знаете, он помеща­ет туда название отображаемой в окне Web -страницы. Но поскольку страница набора фреймов никогда не меняется (меняется только содержимое одного из фреймов), текст в заголовке окна Web -обозревателя остается не­изменным. В принципе, это не очень страшно — мало кто из посетителей сайтов обращает внимание на заголовок окна Web -обозревателя. Но если вы собираетесь выводить в заголовке окна какую-либо важную информацию, имейте это в виду.
Недостаток третий: "несовместимость". Путь фреймов к признанию комите­том WVVWC был так долог и тернист, что за это время успели появиться несколько программ Web -обозревателей, их поддерживающих. Но поскольку единого стандарта на фреймы не было, поддерживали они их по-своему. В результате фреймы стали одним из самых "несовместимых" элементов HTML
В данном случае можно посоветовать только тщательно тестировать страни­цы наборов фреймов в разных программах Web -обозревателей. Конечно, Dreamweaver старается генерировать максимально совместимый код, но всетаки не помешает лишний раз проверить, что он сгенерировал.
Недостаток четвертый. О нем мы поговорим в главе 14, когда будем рассматривать поисковые системы и "раскрутку" вашего сайта с их помощью.
Проблема с фреймами в старых версиях Navigator
А вот это уже не "функциональная особенность" некогда известной программы, а элементарная ошибка разработчиков. Старые версии Navigator неправильно отображают страницы наборов фреймов после того, как поль зователь изменит размеры окна. И разработчики Dreamweaver , чтобы компенсировать невнимательность разработчиков фирмы Netscape , ввели в свой Web -редактор специальную функцию исправления данной ошибки.
Откройте в окне документа Dreamweaver страницу набора фреймов и выберите в меню Commands пункт Add / Remove Netscape Resize Fix . На экране появится небольшое окно-предупреждение, кратко описывающее проблему с фреймами в Navigator и то, что Dreamweaver может сделать для ее реше­ния.
Если вы нажмете кнопку Add , Dreamweaver добавит в код страницы небольшую программу-сценарий на языке JavaScript , перезагружающую стра­ницу набора фреймов после изменения размеров окна Navigator . Если вы нажмете кнопку Cancel , Dreamweaver ничего не сделает.
Может случиться так, что вы захотите удалить эту программу-сценарий, для чего вам необходимо просто еще раз выбрать пункт Add / Remove Netscape Resize Fix в меню Commands . На экране появится другое окно-предупреждение. Нажмите кнопку Remove для удаления данного кода или кнопку Cancel — для отказа от этого.
Следует ли этим пользоваться? Вероятно, да. Поскольку старые версии Netscape Navigator все еще используются некоторой частью интернетчиков, нужно предусмотреть все, чтобы они могли без проблем просматривать ваши страницы. Тем более что это не отнимет у вас никаких усилий — за вас все сделает Dreamweaver . А помещаемый им сценарий очень мал и не может существенно увеличить размер страницы набора фреймов.
Что дальше?
Вот мы и познакомились с фреймами и фреймовым дизайном. И даже создали новый вариант сайта с их использованием.
Но, как уже говорилось, фреймы потихоньку устаревают. Сейчас в моде дизайн с использованием таблиц. Табличный дизайн позволяет создавать Web -страницы, больше напоминающие печатные документы, например газеты. Они включают в себя несколько колонок с текстом, множество графических иллюстраций, линеек, т. е. всего того, к чему привыкли дизайнеры-полиграфисты. Таблицы позволяют сделать все это с легкостью. А уж как Dreamweaver обращается с таблицами! Одним словом, вы должны узнать это.

1  2  3  4  5  6  7

Вверх