Тема семінару 5 Створення стартової сторінки з гіперпосиланнями, поштою і текстом

Мета семінару: навчитися створювати сторінки, додавати гіперпосилання і форматувати текст.

План

1. Створити стартову сторінку Інтернет-сайту.

2. Додати та відформатувати текстову інформацію.

3. Додати класичні та поштове гіперпосилання.

4. За результатами семінарів 4 – 8 сформувати звіт.

Теоретичні відомості виконання практичного семінару.

1. Створення стартової Web-сторінки

1.1 Щоб створити сторінку виберіть пункт New в меню File або натиснути комбінацію клавіш Ctrl + N. Після цього з'явиться діалогове вікно New Document. Виберіть у списку Category пункт Basic Page, а в списку Basic Page - пункт HTML 4.01 Transitional, після чого натисніть кнопку ОК. На екрані з'явиться порожнє вікно документа.

1.2 Збережіть сторінку (вибираємо пункт Save as в меню File). Index.html - так зазвичай вказується назва першої (головної) сторінки сайту.

1.3 Задайте основні властивості сторінки, для цього потрібно зайти в меню Modify і вибрати пункт Page Properties (Рис. 9):

Рис. 9 Налаштування властивостей сторінки

• Шрифт, його колір, колір фону або фоновий малюнок.

• Left Margin, Right margin - відступ від краю сторінки зліва і справа.

• Top Margin, Bottom margin - те ж, але зверху і знизу.

• Link color - колір посилань, Rollover links - колір посилання при наведенні на неї, Visited Links - колір відвіданих посилань, Active Links - колір поточної активного посилання.

• Document Encoding - кодування документа (Кирилиця - Windows)

• Tracing image - кладе на фон напівпрозору картинку з дизайном.

2. Додавання та форматування текстової інформації

2.1 Наберіть текст стартової сторінки. Приклад тексту (Рис. 10).

Для створення списку і вставки спеціальних символів використовуйте панель text.

1.2 Зробіть заголовок, для цього поставте перед ним курсор і виберіть в меню форматів пункт Heading 1. Вирівняйте заголовок по центру за допомогою кнопок вирівнювання редактора властивостей (Рис. 7).

2.3 Задайте шрифт тексту, розмір (Список Font та список Size в редакторові властивостей відповідно). Якщо вам потрібно привести текст до його початкового вигляду, то клікніть на текст, і виберіть Remove Tag в меню правої кнопки миші.

Рис.10 Приклад додавання тексту

2. Створення класичних та поштових гіперпосилань

3.1 Виділіть текст в редакторові властивостей в полі Link введіть адресу сторінки (наприклад, about_me.html). Для того, щоб вказати сторінку поза вашого сайту, введіть в поле Link інтернет-адресу, наприклад, www.macromedia.com. Щоб сторінка відкривалася в новому вікні, виберіть у списку Target – blank.

3.2 Створіть поштову гіперпосилання. Для цього необхідно перемкнутися на сторінку Common панелі об'єктів і клацнути кнопку Email Link (Рис. 11) або можна в полі Link набрати mailto: (ваш ел. Адресу).

Рис. 11 Додавання поштового гіперпосилання

Питання для самоконтролю

1. Як створити нову Web-сторінку в Dreamweaver?;

2. Що таке шаблон, які шаблони існують в Dreamweaver;

3. Як створити текстовий блок на новій Web-сторінці, як форматувати абзаці;

4. Як створити різні типи заголовків у тексті Web-сторінки;

5. Як змінити додаткові параметри списку;

6. Форматування окремих символів;

7. Вставка спеціальних символів;

8. Створення поштових гіперпосилань.