Иллюстрированный самоучитель по Dreamweaver MX

Всякая электронная книгамеет введение, где

Как сделать простейший сайт

Что дальше?
Что такое Интернет

Гиперссылки

ЧАСТЬ I. Как сделать простейший сайт
Как сделать простейший Web-сайт

Как создаются Web-страницы

Клиенты и серверы Интернета

Простейшая Web-страничка

Измененная Web-страничка
Два окна Web-обозревателя, в которых загружены разные Web-страницы

Зачем нужны HTML-редакторы

Добавляем программы просмотра Web-страниц

Что дальше?
Добавляем программы просмотра Web-страниц
Добавляем внешний HTML-редактор
Основные принципы работы с Dreamweaver

Главное окно программы

Использование регулярных выражений

Настраиваем скорость интернет-соединения
Настройка Dreamweaver
Поиск и замена текста
Просмотр Web-страницы
Работа с кодом HTML
Работа с Web-страницами

Работа в окне документа

Диалоговое окно Workspace Setup

Главное окно Dreamweaver

Панель, отделенная от края родительского окна
Панели, объединенные в группу
Сжатое" окно панели
Дополнительное меню группы панелей (открыто)
Кнопка скрытия-раскрытия дока
Редактор свойств

Вкладки, обозначающие все открытые окна документа в раскрытом состоянии
увеличить размеры панели так, чтобы

Диалоговое окно Rename Panel Group
Секция тегов
Секция размера окна с открытым списком
Секция размера страницы
Кнопки переключения режимов отображения Web-страницы
Режим отображения страницы и кода
Режим отображения кода
Панель Code Inspector

Окно мини-редактора HTML
Окно мини-редактора при вставке нового тега
Окно мини-редактора с новым кодом HTML, который будет вставлен в страницу
Диалоговое окно правки тега
Кнопка Tag Chooser
Диалоговое окно Tag Chooser
Диалоговое окно Find and Replace
Диалоговое окно Find and Replace (выбран режим "хитрого" поиска)

Диалоговое окно Find and Replace (выбран режим поиска тега)

Панель Search
Кнопка Preview/Debug in Browser
Окно справочной системы Dreamweaver

Вкладка New Document диалогового окна Preferences

Вкладка Fonts диалогового окна Preferences
Вкладка Status Bar диалогового окна Preferences
Окно сведений о программе просмотра
Вкладка File Types / Editors диалогового окна Preferences
Среда Dreamweaver MX
Три режима отображения Web-страницы
Учим русский
Управление окнами и панелями Dreamweaver
Выбор рабочей среды
Вызов справки

Чистка HTML-кода

Активные изображения

Активные изображения
Что дальше?
Два вида графических изображений

Фоновые изображения

Графика Macromedia Flash

Графика Macromedia Shockwave
Изображения-гиперссылки
Элементы ActiveX
Карты-изображения
Модули расширения
Мультимедиа

Поддержка мультимедийных данных

Работа с графическими изображениями
Web-страница сведений об авторе
Кнопка Image панели объектов
Диалоговое окно Select Image Source
Страница сведений об авторе с его портретом

Вид редактора свойств при выделенном изображении

Маркер "плавающего" изображения
Значок "коммерческое эт" — символ электронной почты
Диалоговое окно Insert Rollover Image
Учебная Web-страница с картой-изображением
Элементы управления

Вид редактора свойств для выделенной "горячей области"

Готовая карта-изображение
Диалоговое окно Change Attribute
Диалоговое окно Insert Flash Text
Только что созданная надпись Flash

Вид редактора свойств при выбранном изображении Flash

Диалоговое окно Insert Flash Button
Только что созданная кнопка Flash
Кнопка Flash панели инструментов
Кнопка Shockwave панели объектов
Web-страница с фоновым изображением
Кнопка Plugin панели объектов
Модуль расширения

Редактор свойств при выделенном модуле расширения
Диалоговое окно Parameters
Запущенный модуль расширения
Видеоклип на Web-странице
Кнопка ActiveX панели объектов

Редактор свойств при выделенном элементе ActiveX

Вставка графического изображения

Форматирование таблиц

Что дальше?
Форматирование таблиц
Формирование таблиц
Таблицы
Использование таблиц

Общие недостатки таблиц и их преодоление

Параметры ячейки
Параметры строки
Параметры таблицы
Предопределенные форматы таблиц
Проблемы с таблицами и их решение

Проблемы с таблицами в старых версиях Navigator

Простые таблицы

Работа с таблицами

Фигурный текст неправильно отображается Web-обозревателем
Текст фиксированного формата отображается правильно
Диалоговое окно Insert Table
Таблица с заполненными ячейками
Диалоговое окно Insert Rows or Columns (включен переключатель Rows)
Диалоговое окно Insert Rows or Columns (включен переключатель Columns)
Диалоговое окно Split Cell
Вид редактора свойств при выделенной ячейке таблицы
Вид таблицы при включенном флажке No Wrap
Результат установки

Вид редактора свойств при выделенной таблице
Перекрытие параметров таблицы параметрами ячеек.
Кнопки управления значениями ширины и высоты ячеек и строк таблицы
Диалоговое окно Format Table
Диалоговое окно Sort Table
Диалоговое окно Import Tabular Data
Изначальная таблица, готовая к слиянию ячеек
Кнопка слияния ячеек редактора свойств

Вместо того чтобы нажимать эту

Рамка без текста
Готовый заголовок — текст в рамке
Текст в рамке в окне Navigator 4.74.
Внешняя таблица
Готовая рамка для заголовка, состоящая из двух вложенных одна в другую таблиц
Графическая рамка, состоящая из двух вложенных таблиц
Готовый заголовок в графической рамке
Еще одна ошибка в старых
Готовый текст с отступами
Горизонтальные линейки в ячейке таблицы
Текстовый абзац с вертикальными линейками

Список увлечений Ивана Ивановича Иванова

Внешняя таблица, которая потом станет списком увлечений
Заголовок первой секции списка увлечений
Готовая первая секция списка увлечений
Готовый список увлечений
Страница списка законченных проектов
Слияние ячеек таблиц
Сложные таблицы

Сортировка таблицы
Составные изображения
Создание таблиц
Текст фиксированного формата
Текст с отступами
Текст в графической рамке
Текст в рамке
Вставка табличных данных
Выделение элементов таблиц

Абсолютные и относительные интернет-адреса

Цель гиперссылки

Цель гиперссылки
Что дальше?
Фрейм и набор фреймов
Фреймы

Недостатки фреймов и их преодоление

Оптимизация фреймов

Полоса навигации

Проблема с фреймами в старых версиях Navigator
Работа с фреймами
Работа с фреймами и наборами фреймов
Решение проблем с фреймами
Классический набор из четырех фреймов

Вкладка Frames панели объектов (показана частично)

Три горизонтальных фрейма
Готовый набор фреймов
Толстая штриховая линия выделяет фрейм, чье содержимое сохраняется в данный момент
Панель Frames

Вид редактора свойств при выделенном наборе фреймов
Вид редактора свойств при выделенном фрейме

Текст замещения
Готовый заголовок сайта
Готовые сведения об авторских правах
Готовое основное содержимое сайта, отображаемое по умолчанию
Раскрывающийся список Target, содержащий имена фреймов

Диалоговое окно Insert Navigation Bar
Готовая полоса навигации
Окно, предупреждающее о проблеме с фреймами в Navigator и предлагающее путь ее решения
Окно, предлагающее удалить сценарий перезагрузки страницы

Схемы наборов фреймов
Сложные наборы фреймов
Создание фреймов
Создание остальных страниц сайта
Создание содержимого фреймов
Свойства фреймов
Свойства наборов фреймов

Уменьшение объема и сложности HTML-кода
Ускорение обработки фреймов
Замещение и работа с ним
Заполнение фреймов

Форматирование таблиц и ячеек разметки

Что дальше?
Форматирование таблиц и ячеек разметки
Табличный дизайн
Недостатки способа создания таблиц разметки вручную

Недостатки таблиц

Недостатки табличного дизайна

Основы табличного дизайна
Параметры ячеек разметки
Параметры таблицы разметки
Построение таблиц разметки автоматически

Построение таблиц разметки вручную

Режим разметки страницы Dreamweaver
Кнопки Standard View и Layout View панели объектов
Точка начала отсчета в месте пересечения измерительных линеек
Диалоговое окно Grid Settings
Кнопки Draw Layout Table (слева) и Draw Layout Cell (справа) панели объектов
Готовая ячейка основного содержания и таблица разметки
Выделенная ячейка разметки

Четыре ячейки разметки (сетка временно отключена)
Заголовок таблицы
Строка ширин
Готовая разметка страницы (сетка временно отключена)
Вид редактора свойств при выделенной ячейке разметки
Диалоговое окно Choose Spacer Image
Обозначение "саморастягивающейся" ячейки в строке ширин
Меню строки ширин

Вид редактора свойств при выделенной таблице разметки
Новая начальная страница сайта (колонка новостей пока не заполнена)
Вертикальный просвет
Горизонтальный просвет
Готовая главная страница в обычном режиме отображения
Готовая страница после внесения всех исправлений

Схемы табличного дизайна

Таблицы и ячейки разметки
Тонкая настройка и оптимизация таблицы разметки

Зачем нужны таблицы

Задание ширины ячеек

Заполнение начальной страницы

Гиперссылки в шаблонах

Каскадные таблицы стилей

Что дальше?
Дополнительные параметры
Каскадные таблицы стилей

Недостатки таблиц стилей и их преодоление
Определение стиля
Параметры абзаца
Параметры фона
Параметры маркеров списка
Параметры местонахождения
Параметры рамки
Параметры размеров и размещения
Параметры шрифта
Почему "каскадные"
Поддержка внутренних стилей

Применение стилей
Псевдостили гиперссылок
Работа с таблицами стилей в Dreamweaver
Справка по атрибуту color в панели Reference
Web-страница, использующая стили
Панель CSS Styles
Вкладка Type диалогового окна New CSS Style

Комбинированный список Size, задающий размер шрифта
Вкладка Background диалогового окна CSS Style Definition
Вкладка Block диалогового окна CSS Style Definition

Вкладка Box диалогового окна CSS Style Definition
Графическое изображение, выровненное по правому краю
Графическое изображение и текстовый абзац, размещенные в разных горизонтальных позициях
Текст с отступами, заданными атрибутами стилей
Текстовый абзац с отступами, созданными с помощью групп атрибутов Padding и Margin
Вкладка Border диалогового окна CSS Style Definition
Рамка вокруг абзаца (фон абзаца для удобства сделан светло-серым)
Элемент страницы, созданный с использованием стиля рамки outset
Вкладка List диалогового окна CSS Style Definition

Вкладка Extensions диалогового окна CSS Style Definition
Панель CSS Styles после задания всех стилей
Страница 10.2.htm после применения стилевых классов centered и red
Панель CSS Styles в режиме правки стилей
Кнопка Delete Style панели CSS Styles
Кнопка Edit Style Sheet панели CSS Styles
Диалоговое окно Edit Style Sheet

Диалоговое окно Link External Style Sheet
Кнопка Attach Style Sheet панели CSS Styles
Диалоговое окно Tag Editor (выбрана вкладка Style Sheet/Accessibility)
Измененный HTML-код в мини-редакторе HTML
Диалоговое окно Design Time Style Sheets
Диалоговое окно Convert to 3.0 Browser Compatible
Создание стилей
Таблицы стилей и шаблоны

Три способа задания стиля
Управление стилями
Управление таблицами стилей
Временные таблицы стилей
Введение в каскадные таблицы стилей

Зачем они нужны

Свободно позиционируемые элементы

Анимация графических изображений

Анимация графических изображений

Анимация — подход Dreamweaver

Анимация реального времени
Более сложная анимация
Что дальше?
Анимация элементов Web-страниц

Недостатки анимации, основанной на Web-сценариях, и их преодоление
Ограничения HTML
это специальные, как правило, нестандартные,
Основные принципы анимации

Простейшая анимация
Панель Timelines
Комбинированный список анимаций
Предупреждение, выводимое Dreamweaver после добавления свободного элемента в анимацию
Новая дорожка анимации

Маркер выделенного кадра
Готовая траектория анимированного элемента (выделена первая ключевая точка)

Две дорожки анимации
Ключевая точка, помещенная на дорожке анимации (в данный момент выделена)
Положение анимированного заголовка в новой ключевой точке
Сложная траектория
Диалоговое окно Rename Timeline

Набор элементов управления, служащий для перемещения между кадрами анимации
Диалоговое окно Change Object
Предупреждение, выводимое

События
Создание анимации в Dreamweaver
Создание простейшей анимации
Управление анимациями
Введение в Web-сценарии

Web-сценарии
Зачем нужна анимация

Альтернативные технологии

Базовый интернет-адрес

Базовый интернет-адрес
Что дальше?
Echo
Метатеги и серверные директивы
Include

Как использовать серверные директивы
Как работают поисковые агенты
Ключевые слова
Метатеги
Описание Web-страницы

Пассивная интернет-реклама
Перезагрузка
Поддержка Dreamweaver серверных директив

Поисковые машины
Работа с метатегами в среде Dreamweaver
Реклама в Интернете
Панель заголовка
Кнопка Description панели объектов
Диалоговое окно Description
Кнопка Keywords панели объектов

Диалоговое окно Keywords
Диалоговое окно Base
Редактор свойств при выбранном метатеге базового интернет-адреса
Кнопка Refresh панели объектов
Диалоговое окно Refresh
Диалоговое окно Link

Редактор свойств при выбранном-метатеге связи
Кнопка Meta панели объектов
Диалоговое окно Meta
Значок, которым в панели заголовка отображается метатег типа HTTP-equivalent
Страница-пример, сделанная без использования серверных директив
Web-страницы, содержащие серверные включения, Dreamweaver отображает некорректно
Серверные включения, отображаемые в виде значков
Кнопка Server-Side Include панели объектов

Вид редактора свойств при выбранной серверной директиве include
Серверные директивы
Специальные метатеги
Стандартный набор серверных директив
Связи между Web-страницами

Введение в серверные директивы

Пишем серверные программы

Что дальше?
Введение в серверное программирование
Как данные передаются по Сети

Как Web-обозреватель отправляет введенные данные
Как Web-сервер обрабатывает данные пользователя
Серверное программирование — подход Dreamweaver

Введение в базы данных
Зачем нужны серверные программы

Формы

Более сложные серверные страницы

Более сложные серверные страницы
Быстрое создание серверных страниц
Что дальше?
Простейшие серверные приложения
Создание строки статуса набора данных

Необязательные области серверной страницы

Подготовка к созданию серверных приложений
в нашем сайте серверные страницы.
Получение данных от другой Web-страницы

Привязка элементов управления к данным
Работа с динамическими атрибутами

Регистрация базы данных в Dreamweaver
Диалоговое окно Site Definition (вкладка Testing Server)
Диалоговое окно Администратор источников данных ODBC (вкладка Системный DSN)
Диалоговое окно Создание нового источника данных
Диалоговое окно Установка драйвера ODBC для Microsoft Access
Панель Databases

Диалоговое окно Data Source Name (DSN)
к базе данных, аналогично кнопке

Панель Server Behaviors
Диалоговое окно Recordset
Кнопка Dynamic Text панели объектов
Динамический текст, отображающий содержимое поля Content таблицы Guestbook
Готовая страница Guestbook.asp с навигатором
Готовая страница Guestbook.asp с навигатором и строкой статуса набора данных
Диалоговое окно Recordset (расширенное)

Создание фильтров
Создание источника данных ODBC
Создание набора данных
Создание навигатора
Создание простейших серверных страниц
Создание серверных страниц в Dreamweaver
Создание сложных наборов данных
Создание строки статуса набора данных

Страница для одновременного просмотра нескольких записей
Страница, отображающая данные
Установление соединения с базой данных

Административные страницы сайта

Административные страницы сайта
Создание интерактивных сайтов.
Защита страниц от несанкционированного доступа

Как администрируются Web-сайты
Принципы создания интерактивных сайтов
Реализация поиска высказываний
Реализация выхода с сайта

Средства удаления записи
Страница добавления записи

Страница изменения записи
Страница регистрации посетителя
Именно для недопущения таких случаев

Страница списка категорий
Страница списка высказываний
Страница входа на сайт

Страницы общего доступа
Защита страниц от несанкционированного доступа

Заключение

В старинном русском романсе. Что

Содержание раздела