Главная
Новости
Статьи и обзоры
Горожанин
Обнинск в Internet
Web Design
Hardware
Software
Безопасность
Серфинг
Игродром
Relax
Технологии
Web-обзор
Интернет-ликбез
Опросник
УП-Технологии
ART.net
Ссылки
Архив
О нас
Контакты
Форумы
Основатель: К.Николаенко
Главный Редактор: С.Коротков
Web Design: Neutron
|
|
= Web-Дизайн =
DREAMWEAVER MX: РАБОТА С КОДОМ
© Алексей Кутовенко alteridem@tut.by
Все есть текст. Книги, которые мы читаем, фильмы, которые мы смотрим, и даже культура в целом (привет господину Деррида со товарищи) может рассматриваться как сверхсложный текст. Данное положение вполне можно отнести и к нашей работе с пакетом Dreamweaver MX. Все дороги ведут в Рим - и все наши манипуляции с кнопками, инструментами, меню и панелями преследуют решение одной-единственной задачи, главный итог которой - получение ТЕКСТА. Благо этот текст имеет вполне зримое выражение в строках кода web-страниц.
Web-дизайн и web-программирование - занятия, на мой взгляд, довольно демократичные, поскольку "минимальной конфигурацией" пропуска в эту сферу, по сути, является компьютер с браузером и любым текстовым редактором. При должной усидчивости, крепких нервах и хорошем знании языков разметки и web-программирования вполне приличный сайт можно сконструировать даже с помощью пресловутого "Блокнота" или другой подобной программы. Однако, несмотря на кажущуюся простоту такого решения, у него имеется ряд недостатков, что довольно быстро выявляет необходимость использования специализированных редакторов. Разработчики программного обеспечения без дела не сидели, и теперь к нашим услугам предлагаются сонмы HTML-редакторов на любой вкус и для любых запросов. Dreamweaver MX также предлагает ряд полезных возможностей для прямой работы с кодом web-страницы, которые мы далее и рассмотрим.
Пакет Dreamweaver MX поддерживает работу с достаточно широким набором файлов различного типа. Кроме чистого и незамутненного HTML, это CSS, JavaScript, VBScript, XML, WML, EDML, PHP, ColdFusion, различного разлива ASP, JSP и другие технологии. В общем, здесь действительно есть из чего выбрать.
Как вы прекрасно знаете, Dreamweaver облегчает процесс написания кода страницы, действуя в соответствии с концепцией WYSIWYG (What You See Is What You Get - "что вижу, то и получаю"), визуализируя структуру страницы в ходе работы. Мы даем команды, рисуем мышью, заполняем формы в диалогах, а весь необходимый код генерируется автоматически. Надо отдать должное создателям пакета, их детище делает это вполне достойно. При этом предлагаемые программой варианты не являются непреложной догмой - Dreamweaver довольно уважительно отнесется и к тому коду, который вы напишете самостоятельно как его встроенными средствами, так и с помощью других редакторов. Самовольных изменений программа вносить не станет до тех пор, пока вы явно об этом не попросите.
Практическую часть, как обычно, начнем с подготовки удобного рабочего места. Как вы уже знаете, на панели инструментов Document присутствуют три кнопки, предназначенные для переключения между тремя режимами просмотра страницы в Document Window. Это Design View, Code and Design View и Code View. Команды переключения режимов продублированы в меню View.
Первый режим (Designe View) - это яркое воплощение концепции WYSIWYG - полная визуализация и ни строчки кода. Он хорош, когда вы занимаетесь поисками оптимального размещения элементов на странице. Нам же сейчас более интересны два других режима.
При включении Code and Designe View окно разделяется на две части, при этом в одной показывается визуализированная страница (как при Designe View), а во второй доступен ее код. Если вы выделите на странице какой-либо объект, будет выделен и соответствующий ему участок кода, что весьма полезно при отладке страницы или поиске ошибок. Код может показываться как в верхней части окна, так и в нижней. Настроить это по вкусу можно в меню View - там есть пункт Designe View on Top. Если вы вносили правки в код, то не забудьте обновить отображаемую в визуальном режиме страницу с помощью кнопки Refresh или же клавиши F5.
Если вы планируете плотно работать с кодом напрямую, то имеет смысл использовать специальный вариант интерфейса рабочей среды пакета Dreamweaver MX, предназначенный именно для таких случаев. Называется он HomeSite/Code Style. Как видно из его названия, он в значительной степени повторяет интерфейс известного HTML-редактора. Откройте панель настроек Dreamweaver MX (меню Edit-Preferences или комбинация Ctrl+U) и перейдите на вкладку General - там есть кнопка Change Workspace, нажав которую, вы увидите диалог выбора варианта интерфейса. Выбрав из них нужный, перезагрузите Dreamweaver.
Давайте осмотримся в новом окружении. Боковые панели инструментов переместились влевую часть окна. Document Window по умолчанию открывается в "кодовом" режиме Code View. Посмотрим, что он нам предлагает. Все строки кода, отображаемого в Document Window, пронумерованы, чем значительно облегчается поиск требуемых фрагментов. Dreamweaver MX умеет "подсвечивать" синтаксис поддерживаемых языков. Это значит, что все значимые конструкции кода сразу заметны на глаз, что способствует резкому сокращению ошибок. Что касается последних, то все участки кода, которые, по мнению Dreamweaver, содержат ошибки, по умолчанию выделяются желтым цветом. Если вы перейдете к такому участку, то на панели Properties появится информация о нем, которую можно использовать при исправлении этого кода.
Окончание следует.
|
|