Як користуватися Adobe Dreamweaver

Adobe Dreamweaver є таким потужним інструментом для веб-дизайнерів, оскільки він має так багато речей, які ви можете зробити з ним. Звичайно, всі ці речі, які ви можете зробити, ускладнюють навчання. Дізнайтеся деякі з багатьох речей, які може робити Dreamweaver, включаючи зміни в останній версії CS5. І не забудьте перевірити наявні речі відсутній у Dreamweaver CS5.

Визначення сайту

• Створити новий веб-сайт
• Створити веб-сайт
• Налаштуйте лише ті частини сайту, які вам потрібні, коли вони вам потрібні *Нове в CS5
• Налаштуйте віддалені сервери, сервери контролю якості та тестування для більш повних робочих процесів *Нове в CS5
• Створюйте та публікуйте нові каталоги
• Змініть тип документа
• Включіть метадані на свої сторінки

Оживлення вашого сайту

• Визначте віддалений сайт
• FTP файли на веб-сервер
• Використовуйте систему контролю версій для перевірки файлів
• Підключіться до Subversion для більш розширеного контролю версій *Нове в CS5
• Залишайте нотатки для своїх товаришів по команді

Створення веб-сторінок

• Напишіть сторінку в режимі WYSIWYG
• Напишіть сторінку в HTML
• Створіть нову сторінку за шаблоном
• Створіть нову сторінку з нуля
• Створіть шаблон
• Збережіть файли в каталозі вашого сайту
• Визначте властивості сторінки

CSS

• Використовуйте таблиці стилів CSS
• Додавання вбудованих стилів
• Створіть зовнішню таблицю стилів
• Приєднайте зовнішню таблицю стилів
• Створіть селектори класів, ідентифікаторів, тегів і складених CSS
• Редагувати існуючі правила CSS
• Створіть CSS для сторінок для друку
• Увімкнути та вимкнути властивості стилю *Нове в CS5
• Візуально перевірте модель коробки CSS *Нове в CS5

Текст

• Змінити текст
• Використовуйте різні шрифти
• Вставте розрив рядка
• Використовуйте спеціальні символи
• Включіть сьогоднішню дату
• Пишіть коментарі
• Застосувати HTML-теги до тексту
• Додайте атрибути HTML до тегів

Посилання

• Текст посилання та зображення
• Перевірте посилання на сайти
• Змініть кольори посилань за замовчуванням (посилання, відвідано, наведіть курсор, активне)
• Створюйте підказки інструментів за посиланнями
• Створення посилань mailto
• Створіть якоря веб-сторінки

Зображення

• Додайте графіку на сторінку
• Редагувати зображення
• Змінити розмір зображень
• Додайте альтернативний текст до зображень
• Додайте додаткові параметри доступності до зображень
• Вирівняйте зображення та текст
• Створіть зображення перекидання
• Використовуйте карти зображень
• Використовуйте зображення трасування
• Використовуйте заповнювачі зображень
• Вставте HTML Fireworks
• Вставте файли Photoshop

Макет

• Використовуйте додані безкоштовні шаблони *Нові початкові макети CSS у CS5
• Вставте divs для макета
• Редагувати divs на панелі стилів CSS
• Вставте абсолютно розташовані елементи
• Форматуйте абсолютно розташовані елементи в інспекторі властивостей
• Використовуйте лінійки, сітки та напрямні

Списки

• Додайте марковані та нумеровані списки
• Налаштуйте маркери та цифри списку

Таблиці

• Створіть таблицю
• Додайте рядки та стовпці заголовків
• Використовуйте прозорі зображення тримати клітинки таблиці відкритими
• Створюйте стовпці фіксованої та гнучкої ширини
• Змініть стилі меж таблиць
• Вставити таблицю в таблицю
• Імпортувати табличні дані

Форми

• Використовуйте форму mailto
• Визначте дії форми
• Додайте текст, радіо, прапорець, файл, зображення, поля вибору та приховані поля форми
• Зробіть свої форми доступними за допомогою набору полів і полів міток
• Створіть спеціальні кнопки надсилання
• Перевірка форм за допомогою JavaScript (Spry)

Бази даних і PHP-скрипти

• Приєднайте свій сайт до бази даних
• Налаштуйте сайт PHP/mySQL
• Використовуйте елементи Spry для підключення до бази даних
• Вставте об’єкти даних у свої сторінки
• Перевірте та оновіть джерело даних або дисплей Spry
• Редагувати складні динамічні сайти в режимі дизайну
• Відкрийте для себе всі динамічно пов’язані файли для збирання сайтів PHP CMS (WordPress, Joomla і Drupal) *Нове в CS5
• Підказка спеціального класу для PHP-коду, включаючи сторонні фреймворки, такі як фреймворк Zend *Нове в CS5

Рамки

• Створіть веб-сайт у рамці
• Редагувати вміст Noframes
• Форматуйте та стилізуйте свої рамки
• Налаштуйте цілі зв’язку за замовчуванням між кадрами

Додати інтерактивність

• Створіть фотоальбом (більше не в CS5)
• Додайте звук на веб-сторінки
• Створіть спадне меню
• Використовуйте поведінку Dreamweaver, щоб відкривати спливаючі вікна, створювати меню переходів, відтворювати звук, змінювати зображення тощо
• Додайте RSS-канали на сайт
• Вставте Flash-текст як наведення
• Вставте текст CSS як наведення
• Вставте інші плагіни
• Додайте панель меню Spry, панелі з вкладками, гармошку, підказку та панель, що розгортається
• Використовуйте браузер віджетів, щоб знаходити нові віджети для свого сайту, не потребуючи знати JavaScript

Перевірте свої сторінки

• Перевірте свої сторінки в Live View, щоб побачити зміни через JavaScript та інтерактивність *Нове в CS5
• Перевірте свій HTML
• Перегляньте свої сторінки в кількох браузерах
• Використовуйте BrowserLab для попереднього перегляду своїх сторінок в інших операційних системах *Нове в CS5
• Використовуйте Device Central, щоб перевірити, як виглядають сторінки на мобільних пристроях
• Перевірте сумісність браузера
• Змініть налаштування, щоб вони відповідали тим, з якими має працювати ваш сайт
• Перевірте внутрішні посилання на сайт
• Перевірте доступність вашого сайту (більше не в CS5)
• Перетворіть а Документ Word до HTML

Налаштуйте Dreamweaver

• Додайте розширення
• Вимкніть розширення
• Налаштуйте Dreamweaver за допомогою ярликів

Підвищте свою ефективність

• Використовуйте вбудовані комбінації клавіш
• Використовуйте фрагменти коду
• Створюйте та використовуйте шаблони
• Створюйте нові сторінки з користувацьких шаблонів
• Оновити шаблони
• Включіть один файл в інший за допомогою бібліотеки Dreamweaver
• Оновити бібліотечні елементи
• Включіть один файл в інший за допомогою SSI
• Використовуйте пошук і заміну