Adobe Dreamweaver

Обзор


Содержание сайта
Комбинированные редакторы л. 1
Adobe Dreamweaver Обзор 

Содержание

О Creative Cloud
Новое в последних версиях

Основные шаги

Настройки программы

Интерфейс

Работа с сайтами Dreamweaver

Создание документов (страниц)

Управление файлами и папками

Заметки разработчика

Использование CSS

Макет страниц

Работа с объектами
Список объектов

Фреймы (рамки)
Использование тега DIV
Элементы AP
JavaScript
Цвет
Создание ссылок и навигация

Управление файлами и папками

Совместная работа Dreamweaver с Photoshop, Fireworks, Adobe Flash и др. приложениями

Интеграция с Business Catalyst


Поиск на сайте
Ресурсы и библиотеки
Расширения

Шаблоны

Работа с кодом

Использование сетевых служб
Adobe


Отображение XML-данных с
помощью XSLT


Создание динамических
страниц


Создание форм

Специальные возможности

Сайты для разных экранов и устройств

Предварительный просмотр
Проверка сайта

Отчеты в Dreamweaver

Программа передачи файлов (FTP)


Элементы интерфейса - Панели инструментов


Панели инструментов «Стандартная» и «Документ» предназначены для выполнения стандартных операций редактирования и операций с документами, панель инструментов «Создание кода» — для быстрого ввода кода, а панель «Обработка стиля» — для просмотра страницы в том виде, в котором она будет отображена на других типах носителей. При необходимости можно скрыть или отобразить эти панели инструментов.

• Выберите «Просмотр» > «Панели инструментов», а затем выберите нужную панель.
• Щелкните правой кнопкой мыши (Windows) или удерживая нажатой клавишу «Control» (Macintosh) любую из панелей, а затем выберите панель из контекстного меню.

Примечание. Чтобы отобразить или скрыть панель «Создание кода» в инспекторе кода («Окно» > «Инспектор кода»), выберите во всплывающем меню «Параметры просмотра» в верхней части инспектора пункт «Панель инструментов "Создание кода"».


Панель инструментов «Стандартная»
На панели находятся стандартные команды - создать, открыть, сохранить (сохранить все), копировать, вставить и др.




Панель инструментов Документ


Для Adobe Dreamweaver CC



A. Представление «Код» B. Показать отображения структуры и кода C. Представление «Дизайн» D. Интерактивный просмотр E. Просмотр/отладка в браузере F. Заголовок документа G. Управление файлами

Для Adobe Dreamweaver CS6, 12.1, 12.2


  1. Код - редактирование в режиме кода
  2. Разделение - разделение окна редактирования на код и визуальное редактирование. При выборе совмещенного представления в меню «Параметры просмотра» становится доступным параметр «Представление "Дизайн"
  3. Дизайн - визуальное редактирование (режим невозможен при работе с файлами XML, JavaScript, CSS - кнопка будет затемнена)
  4. Live - предварительный просмотр (редактирование невозможно). Представление «Интерактивный код» - отображает реальный код, используемый браузером для отображения страницы. Интерактивный просмотр  учитывает некоторое искажение вида страницы при ее создании в режиме дизайна. При интерактивном просмотре возможен только просмотр (без редактирования).
  5. Многоэкранный просмотр - Просмотр страницы, как она появилась бы на экранах с различными разрешениями.
  6. Просмотр и отладка в браузере - Позволяет осуществлять предварительный просмотр или отладку в браузере. Выберите браузер с помощью всплывающего меню.
  7. Управление файлами - Отображает всплывающее меню «Управление файлами».
  8. Проверка W3C - Позволяет проверить текущий документ или выбранный тег.

  9. Проверка совместимости браузера - Позволяет проверить совместимость кода CSS с различными браузерами.
  10. Обновление представления дизайна (после того, как в режима кода были сделаны изменения). Сделанные в представлении «Код» изменения не появляются автоматически в представлении «Дизайн» до тех пор, пока не будут выполнены определенные действия, такие как сохранение файла или нажатие этой кнопки.
  11. Название документа - ввод заголовка страницы, который будет отражен в браузере.
При выборе "Интерактивного просмотра" на панели появляется кнопка "Интерактивный код" - кнопка 5 на рисунке ниже.




Строка состояния



Строка состояния содержит Селектор тегов, Инструмент «Выделение»,  Инструмент «Рука», Инструмент «Масштаб», «Размер окна» (для режима "Дизайн"), Размер документа и примерное время загрузки, кодировку документа.

1. Селектор тегов - Отображает иерархию тегов, окружающих текущее выделение. Чтобы выделить тег и все его содержимое, щелкните нужный тег в иерархии. Чтобы выделить тело документа целиком, выберите <body>. Чтобы задать атрибут class или ID для тега в селекторе тегов, щелкните тег правой кнопкой (Windows) или щелкните тег, удерживая клавишу Control (Macintosh), и выберите класс или идентификатор в контекстном меню.
2. Инструмент «Выбор» Включает и выключает инструмент «Рука».
3. Инструмент «Рука» Позволяет щелкнуть документ и перетащить его в окно документа.
4. Инструмент «Масштаб» и всплывающее меню «Задать масштаб просмотра» Позволяет задать для документа масштаб просмотра.
5. Всплывающее меню «Размер окна» (Недоступно в представлении Код.) Позволяет изменить размер окна документа в предопределенное или заказное значение. При изменении размера просмотра страницы в представлении дизайна или интерактивного просмотра изменяются только размеры просмотра. Размер документа остается неизменным.

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



Нижняя панель

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

Можно сформировать следующие типы отчетов:
Поиск Позволяет искать теги, атрибуты и конкретный текст внутри тегов.
Справочные материалы Позволяет выполнить поиск полезной справочной информации.
Проверка Позволяет проверять код и синтаксические ошибки.
Совместимость браузера Позволяет проверять в документах код HTML, чтобы выявить теги или атрибуты, которые не поддерживаются целевыми браузерами.
Проверка ссылок Позволяет искать и исправлять поврежденные, внешние и потерянные ссылки.
Отчеты сайта Предоставляет возможность улучшить рабочие процессы и протестировать параметры HTML сайта. Отчеты о рабочих процессах включают контролируемые и недавно измененные примечания, а также заметки разработчика; отчеты HTML включают комбинируемые вложенные теги шрифта, специальные возможности, отсутствующий текст атрибута «Alt», лишние вложенные теги, удаляемые пустые теги и документы без названия.
Журнал FTP Позволяет просматривать операции передачи файлов по FTP.
Серверная отладка Позволяет просматривать отладочную информацию приложения Adobe ColdFusion.

Навигация по панелям

1 Находясь в окне документа, нажмите клавиши «Ctrl» и «F6» для смещения фокуса на панель.
Пунктир вокруг заголовка панели обозначает, что фокус находится на панели. Программа чтения с экрана озвучивает заголовок панели, получившей фокус.
2 Одновременно нажимайте клавиши «Ctrl» и «F6» до тех пор, пока фокус не сместится на необходимую панель. (Для перемещения между панелями в обратном порядке одновременно нажимайте клавиши «Ctrl», «Shift» и «F6».)
3 Если нужная вам панель закрыта, используйте сочетание клавиш в меню Windows для отображения этой панели, а потом одновременно нажмите «Control» и «F6».
Если нужная панель открыта, но не развернута, переместите фокус на заголовок панели и нажмите клавишу «Пробел». Чтобы ее свернуть, нажмите клавишу «Пробел» еще раз.
4 Используйте клавишу «Tab» для перемещения по элементам управления панели.
5 Клавиши со стрелками используются в следующих случаях.
• Если элемент управления имеет варианты выбора, для перемещения между вариантами используйте клавиши со стрелками, а для выбора значения — клавишу «Пробел».
• Если на панели находятся вкладки, открывающие другие панели, расположите фокус на открытой вкладке.










О всех замеченных ошибках или неточностях в описании программы, а также о возможных дополнениях просьба сообщить по адресу: average.2011@mail.ru
Если у Вас есть веб-страница с дополнительными материалами по данной теме, сообщите адрес страницы, чтобы на нее можно было сделать ссылку.


Рейтинг@Mail.ru