Так как же решить эту проблему? И есть ли у нее решение?
Есть.
Решение в том, чтобы вынести повторяющиеся элементы страниц в отдельные файлы, оставив в них только основное содержимое, т. е. выделить в HTML-коде страницы фрагменты, создающие ее заголовок, полосу навигации и сведения об авторских правах, вырезать их и сохранить в других файлах. А на их место поместить серверные директивы include, указывающие на эти файлы.
Поясним вышесказанное на примере. Давайте для примера создадим страничку, код которой приведен ниже.
<HTML> <HEAD>
<ТITLЕ>Страница</ТITLЕ> </HEAD> <BODY>
<TABLE BORDER="1"> <TR>
<TD><A HREF="page1.htm">Страница 1</A>
</TD> <TD ROWSPAN="4">Это основное содержимое страницы.</TD>
</TR> <TR>
<TD><A HREF="page2.htm">Страница 2</A></TD>
</TR> <TR>
<TDXA HREF="page3.htm">Страница 3</A></TD>
</TR> <TR>
<TD><A HREF="page4 .htm">Страница 4</A></TD>
</TR> </TABLE>
</BODY> </HTML>
Сохраните этот код в файле 14.1.htm и откройте его в Web-обозревателе. Вы увидите нечто, похожее на рис. 14.21.
Эта страница сделана на основе табличного дизайна. Значит, она содержит все повторяющиеся элементы. Давайте вынесем их в другие файлы.
Рис. 14.21. Страница-пример, сделанная без использования серверных директив
Сначала нужно выяснить, где находится основное содержимое страницы. В нашем случае это строка: "Это основное содержимое страницы.". Все остальное — повторяющиеся элементы.
Наш случай — самый простой. Мы вынесем все, что находится от тега <BODY> до приведенной выше строки, в файл 14.1.inc, а все, что расположено после нее и до тега </BODY>, — в файл 14.2.inc. А саму страницу переименуем в 14.2.shtm. После всех этих пертурбаций ее код будет выглядеть так:
<HTML> <HEAD>
<ТITLE>Страница</ТITLE> </HEAD>
<BODY>
<!-- linclude file="14 .1.inc" -->
Это основное содержимое страницы.
<!-- #include file="14.2.inc" -->
</BODY>
</HTML>
Как видите, от изначального HTML-кода страницы осталось не так уж и много. А теперь вообразите, что мы проделали такую операцию со всеми страницами большого и сложного сайта. Представляете, насколько уменьшатся все его файлы!
Тогда файл 14. Line будет выглядеть так:
<TABLE BORDER="1"> <TR>
<TD><A HREF="pagel.htm">Страница 1</A></TD>
<TD ROWSPAN="4">
А файл 14.2.inc — так:
</TD> </TR> <TR>
<TD><A НRЕF="раgе2.htm">Страница 2</A></TD>
</TR> <TR>
<TD><A HREF="page3.htm">Страница 3</A></TD>
</TR> <TR>
<TD><A HREF="page4.htm">Страница 4</A></TD> </TR>
</TABLE>
К сожалению, просмотреть страницы этого "дивного нового" сайта в Web-обозревателе мы не сможем. Ни один Web-обозреватель не понимает серверных директив, как ни один Web-сервер не понимает HTML-тегов. Это не его обязанности. Чтобы увидеть, как Web-сервер обработает серверные директивы, нам понадобится сам Web-сервер. А его у нас нет.
Поддержка Dreamweaver серверных директив
К сожалению, поддержка серверных включений Dreamweaver MX оставляет желать лучшего.
Разработчики Dreamweaver утверждают, что их программа читает файлы включений, расшифровывает их и выводит в окно документа вместе содержимым страницы, использующей эти включения. Так-то оно так, но не совсем. Dreamweaver действительно выводит содержимое серверных включений в окне документа, но некорректно обрабатывает HTML-разметку: он "проглатывает" весь HTML-код, находящийся в серверных включениях, и выводит только текст. Посмотрите, что он сделал с нашей страницей 14.2.shtm (рис. 14.22).
Рис. 14.22. Web-страницы, содержащие серверные включения, Dreamweaver отображает некорректно
Иначе, как грубейшей ошибкой, назвать это нельзя. Ведь автор прекрасно помнит, что третья версия Dreamweaver (3.0) нормально отображала содержимое файлов включений. Досадно, что новая версия, вместе с новыми возможностями, таит в себе новые ошибки,
Однако не все так плохо. Вы можете отключить вывод содержимого серверных включений; в этом случае они будут просто помечаться особым значком (рис. 14.23). Для этого откройте окно Preferences, выбрав пункт Preferences в меню Edit, и переключитесь на вкладку Invisible Elements. Отключите флажок Server-Side Includes и нажмите кнопку ОК.
Рис. 14.23. Серверные включения, отображаемые в виде значков
На этом поддержка серверных директив include Dreamweaver не заканчивается. Вы можете вставить серверное включение в код страницы, выбрав пункт Server-Side Include подменю Script Objects меню Insert или нажав кнопку Server-Side Include (рис. 14.24), находящуюся на вкладке Script панели объектов. После этого вам останется только выбрать нужный файл в появившемся на экране диалоговом окне Select File.
Рис. 14.24. Кнопка Server-Side Include панели объектов
Если вы выберете значок серверной директивы include, редактор свойств примет вид, представленный на рис. 14.25. С его помощью вы сможете изменить значения атрибутов этой директивы.
Рис. 14.25. Вид редактора свойств при выбранной серверной директиве include
Разновидность директивы include — с атрибутом file или virtual — задается с помощью набора переключателей Туре. Вам необходимо будет выбрать нужный переключатель: File или Virtual.
Само имя файла задается в поле ввода Filename. Вы также можете нажать значок папки, расположенный справа этого поля ввода, и выбрать нужный файл в появившемся на экране диалоговом окне Select File.
Нажав кнопку Edit, вы сможете отредактировать файл серверного включения. Dreamweaver отобразит его в окне документа в виде HTML-кода.
Да, Dreamweaver очень странно поддерживает серверные директивы. Будем надеяться, что в следующей его версии этот недостаток будет устранен. А пока что можем только посоветовать изучать язык HTML и править код таких вот разделенных на части страниц вручную.
На этом рассказ о серверных директивах окончен.
Что дальше?
На этом мы закончим разговор о Web-дизайне и начнем говорить о Web-программировании. Удивлены? Скажете, что мы вроде бы уже говорили о программировании в Интернете в главе 7J? Да, говорили.
Те программы, которые мы писали ранее, работали на стороне клиента, под управлением Web-обозревателя и виртуальной машины. Но знаете ли вы, что можно писать программы, которые будут работать на стороне Web-сервера? Эти программы будут принимать от посетителя сайта какие-либо данные, обрабатывать их и выдавать результат в виде сформированной самой программой Web-страницы.
Заинтригованы? Тогда читайте дальше.
· ЧАСТЬ IV. ПИШЕМ СЕРВЕРНЫЕ ПРОГРАММЫ
o Глава 15. Введение в серверное программирование
- Что такое серверное программирование
- Зачем нужны серверные программы
- Как Web-сервер обрабатывает данные пользователя
- Как Web-обозреватель отправляет введенные данные
- Как данные передаются по Сети
- Серверное программирование — подход Dreamweaver
- Введение в базы данных
- Что дальше?
ЧАСТЬ IV.
Пишем серверные программы
· Глава 15. Введение в серверное программирование
· Глава 16. Формы
· Глава 17. Простейшие серверные приложения
· Глава 18. Создание интерактивных сайтов
ГЛАВА 15.
Введение в серверное программирование
Что? Какое еще серверное программирование? Что это за беда? И зачем она нам нужна?
Мы, вроде бы, научились создавать Web-страницы в среде Dreamweaver. Мы даже научились создавать с его помощью целые Web-сайты и публиковать их на Web-сервере. Мы изучили две разновидности дизайна страниц: фреймовый, когда сайты строятся на основе наборов фреймов, и табличный, когда содержимое страницы помещается в большую сложную таблицу. Мы познакомились с таблицами стилей, метатегами и серверными директивами. И, наконец, узнали о Web-программировании и Web-сценариях, позволяющих добавить "жизни" нашим статичным страничкам. Что же еще надо для счастья?
Да, изученного ранее нам вполне хватит, чтобы создавать вполне приличные сайты. Многие Web-дизайнеры на этом и останавливаются. Но ведь мы хотим большего, не так ли?
Так давайте же сделаем следующий шаг — перейдем от страниц, хранящихся в файлах на сервере, к страницам, генерируемым специальными программами. Как раз написанием таких программ и занимается серверное программирование.
Но давайте по порядку. И начнем мы с того, что выясним, зачем нужны эти серверные программы.
Что такое серверное программирование
Действительно, что это такое и с чем его едят?
Зачем нужны серверные программы
Вы когда-нибудь посещали интернет-магазин? Например, популярнейший "Озон" (http://www.ozon.ru). Помните, как там выполняется заказ товара?
Если не помните или вообще не знаете, что такое интернет-магазин, давайте вспомним (или узнаем).
Вы заходите на Web-страничку, описывающую нужный вам товар. После долгих мук совести вы все-таки решаетесь на покупку и щелкаете на кнопке Купить. После этого вы получаете несколько Web-страниц, где можете задать свой адрес, способы оплаты и доставки товара и, наконец, подтвердить покупку. Все это вы делаете, щелкая соответствующие кнопки и вводя данные в соответствующие поля ввода, расположенные прямо на страницах.
Что происходит при этом? Как обрабатываются введенные вами данные? Неужели самим Web-обозревателем?