HTML-редактор Dreamweaver - Настройка программы

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

Dreamweaver (Дримвивер) - специализированный визуальный HTML-редактор от компании Adobe. Изначально и до 8-й версии (до 2005 года) программа разрабатывалась и поддерживалась компанией Macromedia. Начиная с 9-ой версии 2007 года (она же версия CS3) программу выпускает компания Adobe.

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

Adobe Dreamweaver является одним из популярных HTML-редакторов в мире. И случайности в этом быть не может. К тому же имя компании «Adobe» о чем-то должно говорить. Существует даже всемирное сообщество пользователей Dreamweaver.

Стоит также сказать, что с нулевыми знаниями языка HTML и технологии CSS начинать работу с редактором Dreamweaver не имеет смысла. Так как Dreamweaver это всего лишь помощник, который автоматизирует работу с кодом и предоставляет интеллектуальное сопровождение его написания.

Итак, Adobe Dreamweaver это визуальный HTML-редактор, в котором html-документ создается в визуальном режиме, то есть можно редактировать код и одновременно с этим видеть результат. При желании есть возможность мгновенно перейти к просмотру редактируемых страниц в браузере.

В среде разработки и дизайна Adobe Dreamweaver доступны большинство популярных передовых средств веб-разработки. Такие как HTML, XHTML, CSS, XML, JavaScript, Ajax, PHP, Adobe ColdFusion и ASP.

Поэтому, если Вы уже знакомы с HTML и CSS, и хотите быстро создавать сайты, то пора переходить к работе в специализированном HTML-редакторе Dreamweaver.



Установка программы – Общие сведения

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

Перед тем как приступать к работе с редактором Adobe Dreamweaver, его необходимо настроить. Далее рассмотрим, что нужно для этого сделать.

Для примера будем работать с 12-ой версией программы CS6 от 21 Апреля 2012. В этой версии редактора уже реализована поддержка HTML5.

Указываем тип документа

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

Для этого в строке главного меню программы Adobe Dreamweaver нужно выбрать вкладку Правка и далее в раскрывающемся списке выбрать пункт Настройки. Либо перейти в настройки программы при помощи сочетания клавиш CTRL+U.

При этом появится окно, в котором пользователь сразу же оказывается в категории Создать документ. Здесь нужно проследить, чтобы в поле Документ по умолчанию было выбрано значение HTML, и тогда в следующем поле появится расширение *.html.

Далее в поле Тип документа по умолчанию (DTD) следует выбрать синтаксис соответствующего языка. В основном это HTML версии 5.

В поле Кодировка по умолчанию выбирается используемая кодировка. Как правило, это Юникод(UTF-8).

Таким образом, по умолчанию в редакторе Dreamweaver будет создаваться html- или php-документ, со следующим исходным кодом:

Корневой каталог сайта

Перед тем, как перейти к разговору о главной функции программы Adobe Dreamweaver, следует понимать, что такое корневой каталог сайта и где он располагается.

Дело в том, что все файлы любого сайта: это файл главной страницы index.html или index.php, файл со стилями style.css, папка с php блоками, служебные файлы robots.txt и sitemap.xml, папка с изображениями img и другие, все они, так или иначе, расположены в одной папке. Эта папка называется корневым каталогом сайта.

Как правило, имя корневого каталога (корневой папки) совпадает с доменным именем будущего или уже существующего сайта. Это просто удобно.

Например, корневая папка этого сайта называется webpupil, то есть, так же как и доменное имя.

Так вот, корневая папка сайта, содержащая все его файлы и подкаталоги, размещается в специальном каталоге локального сервера. Если разработчик работает с сервером Denver, то это папка z:/home.

При этом полный путь к корневому каталогу сайта будет следующий:

Так устроен и работает локальный сервер Denver: окончательным корневым каталогом любого сайта, с которым проводится работа на локальном сервере Denver, является папка www.

Главная функция программы

Для работы с сайтами в программе Adobe Dreamweaver необходимо освоить главную функцию программы Управление web-сайтами. Эту функцию можно еще назвать функцией «Определения сайта»

Что это за функция и как с ней работать?

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

Теперь для работы с этим сайтом в программе Adobe Dreamweaver, необходимо его определить, то есть следует указать редактору на новый сайт, а точнее путь к его корневой папке.

Для этого делаем следующее: в правой служебной колонке программы нужно перейти на вкладку Файлы и из ниспадающего меню выбрать пункт Управление web-сайтами.

В появившемся окне (эта иллюстрация отсутствует) нужно создать новый сайт, для этого требуется нажать на кнопку Новый сайт.

После этого в окне «Настройка сайта для...» нужно указать Имя веб-сайта и затем путь к его корневому каталогу в поле Локальная папка сайта. Эти два поля обязательны для заполнения.

В правой колонке этого окна есть возможность задать дополнительные настройки для сайта: указать папку для изображений по умолчанию, URL-адрес, если он уже есть и другие опции. Но в большинстве случаев они остаются не тронутыми.

Нажимаем кнопку Сохранить, затем Готово и на этом всё.

Имя вновь созданного сайта можно будет видеть справа во вкладке Файлы в ниспадающем меню выбора сайтов.

Этих настроек программы Dreamweaver как правило достаточно, чтобы начать с ней работать.