Основы работы в Dreamweaver

Основы работы в Dreamweaver

2-е издание, исправленное

Национальный Открытый Университет “ИНТУИТ”
2016

2

Основы работы в Dreamweaver/ - М.: Национальный Открытый Университет “ИНТУИТ”, 2016

Для создания современных web-сайтов обязательно необходимо использовать динамику. Данный
курс позволяет начать создавать такие сайты не обладая знаниями в области языков
программирования и баз данных, для этого достаточно использовать Macromedia Dreamweaver MX.
Macromedia Dreamweaver в течение многих лет является лидером на рынке визуальных HTML-
редакторов. В программе сочетаются мощь, необычно высокое качество генерации кода и простота
использования. Без ущерба для простоты использования или качества генерируемого кода, которые
всегда являлись отличительными чертами программы Dreamweaver компании Macromedia, данная
программа впитала эти технологии, тем самым предоставив возможность не только работать с
каждой из них по отдельности, но и создавать высокоэффективные приложения путем сочетания
нескольких.

(c) ООО “ИНТУИТ.РУ”, 2006-2016
(c) 2006-2016

3

О курсе

Macromedia Dreamweaver в течение нескольких лет является лидером на рынке
визуальных HTML-редакторов. В программе сочетаются мощь, необычно высокое
качество генерации кода и простота использования. Тем не менее, начиная с выхода
первой версии Dreamweaver, сеть постоянно менялась. За прошедшие годы
многочисленные технологии, многие из которых развивались независимо от сети,
превратились в ключевые инструменты для веб-разработки. Среди них, например,
JavaScript, базы данных, SQL, Java, WML, WSDL, каскадные таблицы стилей, XML,
XSLT, CGI-сценарии, и, помимо всего этого, ряд новых серверных языков,
позволяющих разработчикам преобразовывать веб-страницы в профессиональные
интерактивные веб-приложения, управляемые базами данных. К таким языкам
относятся Macromedia ColdFusion, Microsoft ASP и ASP.NET, а также JSP и PHP. Без
ущерба для простоты использования или качества генерируемого кода, которые всегда
являлись отличительными чертами программы Dreamweaver компании Macromedia,
данная программа впитала эти технологии, тем самым предоставив возможность не
только работать с каждой из них по отдельности, но и создавать высокоэффективные
приложения путем сочетания нескольких.

Предварительные замечания

Программа Dreamweaver создавалась с учетом стремительного развития сетевых
технологий и, в то же время, многие разработчики не поспевали за столь бурным
развитием технологических новшеств. HTML, редактирование изображений и
каскадные таблицы стилей — это одно, а объектные модели документа, циклы с
оператором for, относительные данные, объединение массивов, наборы записей,
файлы cookie и методы — это совсем иное. Карьера веб-дизайнеров, во многом,
определяется их способностью совершить переход от статичного HTML к
полноценным динамическим веб-приложениям, — что, разумеется, подразумевает
знание хотя бы некоторых из указанных технологий.

Именно это является причиной создания этого курса. После выполнения
предложенных в курсе практических упражнений вы приобретете уверенные навыки
работы с тремя наиболее популярными сегодня языками разработки приложений:
Microsoft ASP (VBScript), Macromedia ColdFusion Markup Language (CFML) и
открытым языком PHP. Помимо этого, в курсе приведена информация о разработке баз
данных, написании SQL-запросов, каскадных таблицах стилей, новом стандарте
XHTML и о многом другом.

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

4

графического интерфейса.

Для работы с курсом потребуется следующее:

знание основ работы с операционной системой, в частности, использования
системного меню и управления файлами;
установленная программа Dreamweaver MX, а также соответствие компьютера
системным требованиям, необходимым для ее запуска;
умение работать в Dreamweaver, в том числе, использовать различные панели,
включая панель инспектора свойств, и главное меню. Понимание процесса
регистрации сайта и работы с панелью Site (Сайт);
понимание принципов работы HTML-кода, знание наиболее употребляемых тегов
и атрибутов, таких как <p>, <table>, <tr>, <td>, <ol>, <ul>, <h1>, <h2> и <img>.
Понимание общих принципов HTML, например, различия между абсолютными и
относительными ссылками коррект-ности вложения тегов и разницы между
заголовком и телом документа.

Принцип построения курса

В упражнениях учебного курса от компании Macromedia демонстрируется, как при
помощи ASP, ColdFusion и PHP создавать в Dreamweaver MX 2004 интерактивные веб-
приложения, управляемые базами данных. Курс состоит из следующих уроков:

Урок 1. Введение в Newland Tours.
Урок 2. Модернизация до XHTML.
Урок 3. Работа по усовершенствованию дизайна сайта.
Урок 4. Динамические веб-сайты.
Урок 5. Перемещение данных между страницами.
Урок 6. Отправка электронной почты с помощью веб-формы.
Урок 7. Создание приложения для расчета стоимости путешествий.
Урок 8. Базы данных в сети.
Урок 9. Завершение создания приложения для расчета стоимости путешествий.
Урок 10. Фильтрация и отображение данных.
Урок 11. Создание разделов с информацией о путешествиях.
Урок 12. Создание поисковых интерфейсов.
Урок 13. Аутентификация пользователей.
Урок 14. Управление контентом при помощи форм.
Урок 15. Создание страниц для обновления.
Урок 16. Написание простой CMS вручную.

Работа над проектом сайта

При работе с курсом будет создаваться сайт виртуального туристического агентства
Newland Tours, которое занимается организацией путешествий по многим странам
мира. На данный момент список путешествий содержится на статичной HTML-

5

странице. Особенностью подобного сайта, так же, как и многих других, является то,
что на сайт регулярно добавляются новые туры и удаляются старые, а данные по ним
(особенно цены) часто меняются. Среди сотрудников Newland Tours нет
профессионального веб-разработчика, который мог бы постоянно обновлять и
поддерживать сайт, поэтому в курсе будет предложен способ обновления контента на
сайте рядовыми работниками компании. Более того, с помощью этого курса веб-
дизайнеры научатся создавать удобную поисковую систему, чтобы посетители сайта
могли легко сортировать список путешествий и без труда прокручивать страницу с
большим числом данных.

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

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

Соглашения

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

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

Полужирный шрифт. В каждом уроке основные этапы, новые термины и ключевые
фрагменты выделяются полужирным шрифтом.

Курсивом выделены файлы и их расширения, а также папки, веб-страницы, сайты в
Интернете, адреса веб-узлов и, в ряде случаев, текст, который следует ввести для
выполнения задания.

Команды меню и комбинации клавиш. Нередко существует несколько способов

6

выполнить одно и то же действие в Dreamweaver. Такие способы приводятся в каждом
уроке. В командах меню связь между его пунктами обозначается следующим образом:
Меню\Команда1\Команда2. Для обозначения комбинаций клавиш употребляется
значок “+” между их названиями. Это означает, что нужно нажимать клавиши
одновременно. Например, (Shift)+(Tab) означает, что нужно при нажатой клавише
(Shift) одновременно нажать и клавишу (Tab).

Необходимое программное обеспечение (ПО). Файлы для выполнения практических
заданий расположены в папке, имя которой соответствует уроку: Lesson01, Lesson02 и
т.д. Внутри каждой папки к урокам находятся папки Start и Complete, соответствующие
состояниям сайта Newland Tours в начале и в конце урока. В уроках, идущих после
нескольких первых, где применяются одни и те же файлы, вне зависимости от
используемой серверной модели (ASP, ColdFusion или PHP), папки Start и Complete
состоят из подкаталогов, соответствующих каждой серверной модели — newland-asp,
newland-cfm и newland-php.

Список файлов, необходимых для выполнения заданий, приводится в начале каждого
урока.

Если возникли трудности

Один неприятный момент при обучении разработке динамичных веб-сайтов – это
практически неизбежное возникновение ошибок. Обычно динамичный веб-сайт
представляет собой смесь нескольких технологий, и некоторые из них, особенно ASP,
ColdFusion и PHP, в свою очередь, зависят от настроек сервера. Если сервер и база
данных настроены неправильно, непременно появятся сообщения об ошибке, даже
если в Dreamweaver код набран корректно. Хуже всего то, что сообщения об ошибках,
как правило, сложно разобрать (особенно для ASP), а в некоторых случаях они вводят
в заблуждение.

Ниже приведено несколько способов для решения подобной проблемы.

Использовать файлы из папки Complete для текущего урока.

На странице Macromedia TechNote можно ознакомиться с наиболее типичными
серверными ошибками. Хотя изначально эта страница была создана для Dreamweaver
UltraDev, предшественника Dreamweaver MX, она включает список нескольких
наиболее распространенных серверных ошибок и их решений: ссылка:
http://www.macromedia.com/support/ultradev/ts/documents/common_server_errors.htm

Убедиться, что тестируемая страница содержит все необходимые данные. Для работы
ряда страниц необходимо наличие переменных запроса или переменных URL-адреса.
Например, SQL-запрос, отправляемый с детальной страницы, должен отфильтровать
записи базы данных на основе переменной запроса, получаемой со страницы,
ссылающейся на детальную страницу. Если тестировать эту детальную страницу
напрямую, не переходя на нее по ссылке с другой страницы, данные, которые ожидает
ASP, ColdFusion или PHP, не будут получены, вследствие чего возникнет ошибка. По

7

этой причине всегда следует начинать тестирование с начальной страницы
приложения, а не с промежуточной страницы, на которую посетители переходят при
просмотре.

Вовремя понять, что пора перейти к следующему шагу. Несмотря на то, что нужно
выявить и устранить любую найденную ошибку, не следует пытаться проломить
головой стену. Цель курса заключается в формировании навыка разработки
динамичных веб-сайтов, а не в буквальном повторении каждой детали сайта Newland
Tours. Столкнувшись в определенном месте с какими либо проблемами, лучше
загрузить файл из папки Complete и перейти к следующему уроку.

Попытаться определить причины возникновения тех или иных проблем – из-за ошибок
в коде или из-за неверных настроек. Если страница отображается некорректно во время
разработки статичного сайта, это обычно происходит из-за ошибок в коде. При
появлении серверной ошибки многие начинающие веб-дизайнеры считают, что
допустили ошибку в коде. Тем не менее, проблема, скорее всего, связана с
настройками. Причиной может быть неверное разграничение прав доступа,
недоступность сервиса или отсутствующие DSN. Самый лучший способ проверки –
загрузить файл из папки Complete. Если он тоже не станет работать, значит с кодом все
в порядке, и следует обсудить этот вопрос с администратором сервера.

Проверять обновления на сайте курса.Поскольку ошибки ASP, ColdFusion, и PHP очень
распространены и выявляются с трудом, автор и команда редакторов приложили
значительные усилия, чтобы убедиться в том, что код в курсе не содержит ошибок.
Однако полностью безошибочных курсов не бывает, и если вы их найдете, сообщите,
пожалуйста, об этом нам.

Задавать вопросы на соответствующих форумах, посвященных Dreamweaver.
Macromedia поддерживает несколько бесплатных форумов, на которых любой может
задать вопросы или ознакомиться с информацией по наиболее типичным проблемам.
Форумы сопровождаются группой технической поддержки Macromedia, а также
ветеранами и высококлассными специалистами, прекрасно знающими Dreamweaver,
ASP, ColdFusion и PHP. Поэтому нередко ответ появляется через несколько минут
после задания вопроса. Для доступа к форумам следует посетить страницу,
расположенную по адресу: ссылка:
http://www.macromedia.com/support/dreamweaver/ts/documents/dream_newsgrp.htm.

Какие знания и навыки вы получите

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

После завершения курса вы сможете:

модернизировать код страниц действующего сайта и, таким образом, получить
легкий в поддержке и совместимый со стандартами XHTML и CSS код;
четко представлять ограничения протокола HTTP и механизмы взаимодействия

8

ASP, ColdFusion и PHP с этим протоколом для создания функциональных
приложений;
перемещать данные между страницами и сохранять их при помощи переменных
форм, переменных запросов или URL-адресов, переменных файлов cookie,
переменных сеансов и переменных приложений;
отбирать и обрабатывать данные, введенные посетителями через веб-формы;
проверять данные, введенные в форму при помощи кода, исполняемого как на
стороне клиента (JavaScript), так и на стороне сервера (ASP, ColdFusion, или PHP);
создавать код для оценки выражений и проведения простых математических
расчетов;
подключать сайт к базе данных и отображать записи из нее;
фильтровать данные, извлеченные из базы данных;
создавать поисковый интерфейс, позволяющий пользователям получать только
нужную информацию;
аутентифицировать пользователей и ограничивать доступ на страницы;
создавать систему управления содержимым, позволяющую владельцам сайта
добавлять содержимое при помощи веб-форм, а не при помощи HTML-редакторов
и FTP-протокола;
создавать код для разработки наиболее популярных сценариев ASP, ColdFusion и
PHP, которые могут использоваться в будущих проектах;
использовать основные операторы SQL, позволяющие создавать страницы,
сложным образом взаимодействующие с данными;
управлять ходом выполнения сценариев при помощи условных выражений и
циклов;
работать с моделями поведения Dreamweaver, диалоговым окном Recordset (Набор
записей) и вложенными объектами приложений для ускоренной разработки
динамических веб-приложений.

Минимальные системные требования для Windows

Macromedia Dreamweaver MX 2004.
Процессор Intel Pentium III или равный по производительности (600 МГц и выше).
Windows 98 SE, Windows 2000 или Windows XP.
128 Мб оперативной памяти (рекомендуемый минимум 256 Мб).
Internet Explorer или Netscape Navigator версии 4.0 и выше.
Доступ к Интернету (только для урока 6).
Доступ к серверу, способному обрабатывать выбранный язык:

пользователи ASP/VBScript должны иметь доступ к веб-серверу Microsoft
Internet Information Services (IIS). IIS распространяется в составе
операционных систем Windows 2000 и Windows XP Professional и способен
работать на локальном компьютере. Другие возможные варианты
подключения к IIS-серверу: подключение по локальной сети или
подключение по сети через FTP-протокол;
пользователи ColdFusion должны иметь доступ к серверу приложений
ColdFusion, установленному на веб-сервере, таком как IIS, Apache или
автономном сервере ColdFusion. Версия ColdFusion, ограниченная одним IP-

9

адресом, может быть скачана бесплатно с сайта ссылка:
http://www.macromedia.com
пользователи PHP должны иметь доступ к веб-серверу, такому как Apache, с
установленным модулем PHP. Возможен запуск PHP в среде IIS, тем не
менее, рекомендуется именно Apache.

Минимальные системные требования для Macintosh

Macromedia Dreamweaver MX 2004.
Процессор Power Mac G3 (500 МГц).
Mac OS 10.2.6.
128 Мб оперативной памяти (рекомендуемый минимум 256 Мб).
Internet Explorer 4.0 или Safari 1.0 и выше.
Доступ к Интернету (только для урока 6).
Доступ к серверу, способному обрабатывать выбранный язык:

пользователи ASP/VBScript должны иметь доступ по локальной сети или
через Интернет к веб-серверу Microsoft Internet Information Services (IIS). IIS и
ASP на Macintosh не могут запускаться локально;
пользователям ColdFusion необходимо иметь доступ по локальной сети или
через Интернет к серверу ColdFusion. ColdFusion на Macintosh не может
запускаться локально (если он не установлен поверх сервера J2EE, такого как
Macromedia JRun);
пользователи PHP должны иметь доступ к веб-серверу, способному
использовать PHP, такому как Apache. Следует иметь доступ к Apache по
локальной сети или через Интернет. Вдобавок, пользователи Mac получили
возможность запускать сервер Apache с установленным модулем PHP
локально, не подключаясь к отдельному серверу в локальной сети или в
Интернете.

10