Настройка встроенного редактора кода
Для работы с исходным текстом страницы, как можно догадаться, лучше всего подходят текстовый или комбинированный режимы. В них используется встроенный редактор кода Dreamweaver, о настройке которого сейчас пойдет речь.
Многие "кодеры" любят использовать очень длинные строчки кода. Иногда в одну такую строчку ухитряются запихивать даже весь исходный текст для страницы. Это часто используется перед окончательной публикацией, чтобы сэкономить размер файла за счет удаления лишних символов — пробелов и переводов строки. Кроме того, длинные строки получаются при создании элементов в визуальном режиме. Если вам попался такой код и вы никак не можете прокрутить страницу, чтобы найти конец (или еще хуже — середину) строки, воспользуйтесь опцией переноса строк. Выберите команду меню View | Code View Options | Word Wrap, чтобы строки автоматически подгонялись под текущий размер редактора. Или нажмите кнопку View Options на инструментальной панели Document (рис. 4.9). При этом перенос строк осуществляется только в Dreamweaver, никакие лишние символы, вроде разрыва строки, при этом не вставляются.
|
Рис. 4.9. Параметры настройки встроенного редактора кода, доступные при нажатии кнопки View Options |
Для ориентации в коде удобно использовать нумерацию отдельных строк. Нумерация строк применяется в Dreamweaver при выдаче сообщений поискового или отладочного характера. По умолчанию, эта опция включена. Но вы можете отключить или включить ее с помощью команды меню View | Code View Options | Line Numbers.
Советую также включить опцию подсветки неправильного HTML-кода, выполнив команду меню View | Code View Options | Highlight Invalid HTML
Включение опции заставляет Dreamweaver отслеживать неправильно набранный код, который часто возникает при ручной набивке. Правда, отслеживаются только те ошибки, которые противоречат правилам оформления HTML, как, к примеру, отсутствующие угловые скобки (рис. 4.10). Теги, изобретенные вами самими, не считаются неправильными, если вы соблюли все формальности при их написании. Неправильный фрагмент кода выделяется маркером желтого цвета, а если щелкнуть на нем мышью, в панели свойств появится подсказка, поясняющая суть ошибки.
Но более полный контроль ошибок дает включение другой опции — подсветки кода Syntax Coloring. По умолчанию она включена и, к примеру, теги отображаются синим цветом, а их содержимое — текст, который будет виден в браузере, отображается черным цветом. Каждому типу кода соответствует свой цвет, который можно изменить в настройках Dreamweaver. Поэтому подсветка очень удобна для распознавания служебных элементов кода различного рода.
|
Рис. 4.10. Пример неправильного кода, который может отслеживать Dreamweaver, — отсутствие закрывающей угловой скобки. Если выделить участок с таким кодом, в панели свойств можно прочитать причину ошибки |
А как нам это может помочь при ловле ошибок? Очень просто. В случае сбоя, тип исходного кода распознается программой неправильно и, соответственно, нарушается его нормальная расцветка. Мы видим, что тег, который должен отображаться синим цветом, вдруг стал черным. Значит, где-то там ошибка! Чтобы включить или отключить подсветку кода, используется команда меню View | Code View Options | Syntax Coloring.
При нажатии на клавишу < Enter> в текстовом режиме Dreamweaver не только переводит текст на следующую строку, но и автоматически делает отступ от края. Эта опция включена по умолчанию и управляется с помощью команды меню View | Code View Options | Auto Indent. Размер отступа задается в общих настройках Dreamweaver, наряду с другими параметрами форматирования кода.