О программе Macromedia Dreamweaver Macromedia Dreamweaver - это программа, которая содержит программный инструментарий для визуальной компоновки Веб-страниц и для работы с HTML-кодом. Интуитивно понятный интерфейс Dreamweaver прост, не требующий длительного изучения.
Непосредственно в Dreamweaver можно создавать анимацию, использовать данные из Microsoft Office, легко импортировать графику, меню и кнопки.
Использование программы
Macromedia Dreamweaver позволяет в первую очередь экономить время и внимание при создании Веб-страниц. При этом множество функций программы уникальны, для их достижения, при кодировании HTML вручную, потребовалось бы множество времени и специальных знаний. Первым этапом в изучении программы Dreamweaver - это изучение интерфейса и настройки программы. Благодаря применению диалоговых окон можно без труда освоить основные настройки программы. Стоит отметить, что несмотря на то, что интерфейс программы прост, все расширенные возможности программы становятся доступны только после соответствующей настройки. Множество функций скрыто в меню программы и количество и размер кнопок интерфейса минимально. Подобное расположение в
значительной мере позволило сэкономить рабочее пространство, не позволяя отвлекаться от основной задачи создания Веб-сайтов.
Использование встроенной системы шаблонов и библиотечных элементов для ускорения процесса создания сайта позволяет пользователям, совершенно не знакомых с навыками программирования HTML, создавать свои Вебстраницы без заучивания синтаксиса языка HTML, тегов, не тратя время на исправление ошибок в коде Веб-страницы. Задание основных свойств страницы. В меню ''Modify'' выбираем пункт ''Page Properties ". Появляется следующее диалоговое окошко: свойства страницы. Encoding (кодировку символов) придется задавать для каждой страницы, если сразу не заменить его на кириллицу в свойствах Dreamweaver (Edit / Preferences / Encoding).
В окошке "Title" прописываем название страницы (которое будет отображаться в верхней части панели браузера). При условии задания верной кодировки русский язык поддерживается абсолютно корректно. В окошке "Background Image" задается фоновый рисунок, если надо. При наведении курсора на квадратики рядом с пунктами "Background", "Text", "Links", "Visited Links", "Active Links" вид курсора меняется на пипетку. Если нажать этой пипеткой на квадратик, получим следующее диалоговое окно. Внизу отображается образец цвета, над которым расположен в данный момент курсор, и его код.
Три кнопочки справа: пипетка - выбор цвета из данной палитры, ластик - выбор цвета, отображаемого браузером по умолчанию - "Default" (если сделан данный выбор, то в код страницы не будет добавлено никаких тегов относительно цвета данного элемента.
Далее можно задать значения краев страницы. Если вы решили воспользоваться этой возможностью, то обязательно укажите одинаковые значения в ячейках "Top Margin" и "MarginHeight", а также в ячейках "Left Margin" и "MarginWidth" (например, 0 и 0; 7 и 7), чтобы страница отображалась корректно в различных браузерах - все они понимают "края" по своему (Top Margin и Left Margin прописываются для Эксплорера, а MarginHeight и MarginWidth - для Навигатора). После заполнения всех этих полей можно нажать кнопку "Apply", посмотреть, что получилось, и если не понравится - сразу переделать. Можно также нажать кнопку "ОК" и вернуться к основному окну, а переделать потом.
Одно из основных достоинств Dreamweaver состоит в том, что в текущем сеансе работы функция "Undo" ("отменить") применима даже к изменениям, сделанным до сохранения файла. То есть, если вы сделали что-то, сохранили файл, а потом решили отменить это действие - это возможно (во Front Page возможность отмены действия после сохранения исчезает). Задание текущей директории и редактирование свойств сайта в целом Чтобы иметь возможность создавать короткие гиперссылки и работать с вложенными папками сайта, нужно задать директорию, в которой располагается сайт в целом, и определить его остальные свойства. В Dreamweaver также имеется собственный встроенный FTP-клиент, который в 3-ей версии ни в чем не уступает Cute FTP, а в чем-то даже его превосходит.
Например, можно попросить загрузить на сервер страницу вместе со всеми связанными изображениями, a Dreamweaver сам определит, какие картинки использованы на странице, и подгрузит их в нужные директории автоматически. Причем это именно FTP-клиент, который не позволяет себе ни в чем превышать полномочия.
Чтобы пользоваться встроенным FTP-клиентом, также необходимо задать параметры сайта. Параметры сайта и определение рабочей директории ("root folder") так же нужны для того, чтобы Dreamweaver корректно прописывал пути к вставляемым изображениям. Итак, в меню "Site"выбираем пункт "New site" и в результате получаем следующее диалоговое окно Заполняем все требуемые пункты в разделе "Local Info" (в "Link Management Options''можно ничего не прописывать, если вы предпочитаете использовать короткие ссылки вида: <а href="..lfolderlfile.htm">). Главное - указать "Local Root Folder", остальные параметры особого значения не имеют. Заполнение раздела "Web server info'' требуется в том случае, если вы собираетесь пользоваться встроенным FTP-клиентом. Настройки похожи на настройки Cute FTP. Раздел ''Site Map Layout" является настройкой карты сайта. В него надо вникать, если вы собираетесь использовать автоматическую навигацию. Если нет - оставьте все, как естъ.Все остальные настройки тоже лучше оставить по умолчанию.
Когда вы все заполните и нажмете кнопку "ОК", вас спросят, создать ли кэш для ускорения работы. Для основных сайтов кэш лучше создать. Если же вы делаете что-либо одноразовое, типа обоев в виде страницы, то от создания кэша можно отказаться.
Примечание: вы можете вообще не определять сайт, если все используемые изображения у вас заранее собраны в одну директорию и при этом вы не собираетесь пользоваться встроенным FTP-клиентом, а созданные HTML-файлы сохраняете в этой же директории. В данном случае важно сохранить файл до вставки первого изображения (иначе путь к изображению будет прописан некорректно). Следующий урок мы начнем с форматирования текста.
⇐Приемы оптимизации графики | TeachPro WEB-дизайн | Форматирование текста⇒