OsnovyWebDis

</FORM>

</BODY>

</HTML>

2.Збережіть документ у файлі test.html.

3.Відкрийте збережений документ у браузері. У разі потреби розблокуйте активний вміст веб-сторінки (див. рис. 5.16).

4.Заповніть форму, давши відповіді на всі запитання. Клац­ ніть кнопку Кількість правильних відповідей. Після цього вебсторінка матиме приблизно такий вигляд, як показано на рис. 5.19.

Рис. 5.19. Тестування з використанням форми

Створення форм та динамічних ефектів у FrontPage

Програма FrontPage дає змогу створювати форми, вибираючи ко­ манди з меню — знати мову HTML для цього не обов'язково. Але, як зазначалося, створений у FrontPage сайт має бути опублікова­ ний на сервері, що підтримує FrontPage Server Extensions. В іншо­ му разі деякі елементи такого сайту працювати не будуть.

Створити форму у FrontPage можна у три способи.

•За допомогою майстра. Програма задає низку запитань про те, якою повинна бути форма і, ґрунтуючись на відповідях, будує форму, яку згодом можна відредагувати так, щоб вона повністю відповідала вимогам.

•Використовуючи шаблон сторінки з формою. При цьому про­ грама не ставить жодних запитань, а відразу створює форму певного типу, наприклад для гостьової книги. її також можна редагувати.

• Самостійно зі стандартних елементів. Для цього спочатку створюють сторінку, а потім розміщують на ній форму. Front­ Page у формі створить дві кнопки — Отправить (Надіслати) і Сброс (Скинути). Розробнику залишається створити на фор­ мі поля та інші елементи.

Шаблони та майстри для створення форм

Щоб переглянути список шаблонів і майстрів форм, які пропонує FrontPage, в меню Файл (Файл) слід вибрати команду Создать (Створити) і в області завдань клацнути посилання Другие шаб­ лоны страниц (Інші шаблони сторінок). У діалоговому вікні, що відкриється, для вибору шаблону або майстра створення форм використовують вкладку Общие (Загальні) (рис. 5.20).

Рис. 5.20. Вибір майстра або шаблону для створення форм

Серед шаблонів та майстрів програми FrontPage варто відзначити такі:

•Форма подтверждения (Форма підтвердження) — шаблон фор­ ми для підтвердження отримання інформації;

•Форма обратной связи (Форма зворотного зв'язку) — шаблон форми для введення зауважень стосовно сайту;

•Мастер страницы формы (Майстер сторінки форми) — майстер створення форми для опитування відвідувачів сайту; дає змогу

сформувати список запитань, на які потрібно одержати від­ повіді;

•Гостевая книга (Гостьова книга) — шаблон гостьової сторінки; ця сторінка дасть змогу відвідувачам сайту залишити свої враження про нього;

•Страница поиска (Сторінка пошуку) — шаблон сторінки у ви­ гляді форми, яку використовують для пошуку інформації на сторінках сайту;

•Регистрационная форма (Реєстраційна форма) — шаблон форми для реєстрації відвідувача сайту.

Вправа 5.7

Розглянемо роботу майстра Мастер страницы формы (Майстер сто­ рінки форми) детально.

1.Запустіть програму FrontPage. Відкрийте діалогове вікно із переліком шаблонів та майстрів і перейдіть на вкладку Общие (Загальні).

2.Виберіть у списку Мастер страницы формы (Майстер сторінки форми) і клацніть кнопку ОК. У першому, інформаційному вікні клацніть кнопку Далее (Далі), після чого з'явиться вік­ но (рис. 5.21), що містить такі кнопки:

•Добавить (Додати) — відкриває діалогове вікно для вибору теми і формування запитання;

•Изменить (Змінити) — відкриває діалогове вікно, що дає змогу змінити запитання;

•Удалить (Видалити) — видаляє зі списку виділене запитання;

•Вверх (Вгору) — переміщує виділене у списку запитання на один рівень вгору;

•Вниз (Донизу) — переміщує виділене у списку запитання на один рівень донизу;

•Очистить (Очистити) — очищує список, видаляючи з нього всі запитання.

3.Для формування запитання клацніть кнопку Добавить (До­ дати). У верхній частині діалогового вікна, що відкриється, міститься список тем, відносно яких можна формувати запи­ тання. В області Описание (Опис) є короткий опис полів, які

будуть поміщені у форму за вибраною темою. Запитання слід вводити у поле Измените приглашение для этого вопроса (Змі­ ніть запрошення для цього запитання).

Рис. 5 . 2 1 . Вікно додавання запитання для форми

4.Виберіть тему личные данные (особисті дані). У полі підказки введіть текст «Повідомте про себе:» (рис. 5.22). Клацніть кноп­ ку Далее (Далі).

Рис. 5.22. Формування першого запитання на тему «Персональна інформація»

5. У наступному діалоговому вікні виберіть прапорці та пере­ микачі, що відповідають інформації, яку потрібно отримати від відвідувача веб-сторінки. Встановіть прапорці ФИО (Прі­ звище, ім'я, по батькові) з властивістю-перемикачем полное имя (повне ім'я), возраст (вік) із властивістю число полных лет

(кількість повних років), пол (стать), цвет волос (колір волос­ ся), цвет глаз (колір очей) (рис. 5.23). Перейдіть до списку запитань за допомогою кнопки Далее (Далі).

Рис. 5.23. Визначення полів для збирання персональної інформації про відвідувача сайту

6.Знову скористайтеся кнопкою Добавить (Додати) та виберіть тип інформації дата (дата), у полі підказки наберіть текст «Введіть дату:». Клацніть кнопку Далее (Далі). У наступному вікні визначте формат, в якому користувач повинен вводити дату, сІсІ.тт.уу(«місяць.день.рік»), а також задайте ім'я змінної (на­ приклад, data), що буде пов'язана з відповіддю користувача. Клацніть кнопку Далее (Далі). Тепер у вікні, зображеному на рис. 5.21, виведено список із двома запитаннями, які заплано­ вано задати користувачу. Клацніть кнопку Далее (Далі).

7.Наступне діалогове вікно дає змогу визначити оформлення майбутньої форми. Воно містить дві групи перемикачів та пра­ порець (рис. 5.24).

Група перемикачів Выберите способ представления списка во­ просов (Виберіть спосіб подання списку запитань) містить варі­ анти, що дають змогу визначити спосіб оформлення запитань, розташованих у формі:

•обычные абзацы (звичайні абзаци);

•нумерованный список (нумерований список);

•маркированный список (маркований список);

•список определений (список визначень).

Рис. 5.24. Оформлення елементів майбутньої форми

Перемикач Создать оглавление для этой страницы? (Створити зміст для цієї сторінки?) містить два значення. За умовчан­ ням змісту для сторінки немає (значення Нет). Якщо є потре­ ба його створити, вибирають значення Да. Коли прапорець Ис­ пользовать таблицы для полей формы (Використовувати таблиці для полів форми) встановлено, вирівнювання полів у формі буде виконано за допомогою таблиць.

8.Виберіть оформлення запитань як звичайних абзаців, відсут­ ність змісту на сторінці та використання таблиць для вирів­ нювання полів форми. Клацніть кнопку Далее (Далі).

9.У наступному діалоговому вікні можна зазначити, де зберіга­ ти дані, введені у форму. Пропонуються такі варіанти:

•сохранить результаты в виде веб-страницы (зберегти результа­ ти у вигляді веб-сторінки);

•сохранить результаты в текстовый файл (зберегти результати в текстовий файл);

•использовать специальный сценарий CGI (використовувати спеціальний сценарій CGI).

Уразі вибору першого або другого варіанта необхідно ввести назву веб-сторінки або текстового файлу в поле Введите ба­ зовое имя для файлов результатов (Введіть базове ім'я для фай­ лів результатів).

10.Виберіть збереження результатів у вигляді веб-сторінки і за­ дайте для файлу результатів назву results. Клацніть кнопку Далее (Далі).

11.Майстер створення форм отримав відповіді на всі запитан­ ня. Клацніть кнопку Готово (Готово).

12.Розглянемо створену форму. У разі необхідності можна ско­ регувати зовнішній вигляд форми: змінити шрифти, кольо­ ри, стандартні тексти питань тощо (рис. 5.25).

Рис. 5.25. Вигляд форми після внесення коректив

Елементи форм

Програма FrontPage дає змогу самостійно формувати та редагу­ вати форми, виконуючи певні дії з їх окремими елементами, які вставляють на веб-сторінку за допомогою команди Вставка • Форма (Вставка • Форма) (рис. 5.26). При цьому можна вибрати, зокре­ ма, такі елементи форми:

•Поле — однорядкове поле для введення текстових даних;

•Текстовое поле — область із можливістю прокручування для введення текстів великого обсягу;

•Флажок — прапорець;

•Переключатель — перемикач;

•Раскрывающийся список — список, що розкривається;

•Кнопка — кнопка.

Рис. 5.26. Вставлення форми

Вправа 5.8

Розглянемо процес формування веб-сторінки, призначеної для заповнення форми для складання іспитів.

1.Відкрийте редактор FrontPage. Створіть сторінку за допомогою кнопки Создание новой обычной страницы (Створення нової зви­ чайної сторінки) панелі інструментів Стандартная (Стандартна).

2.Введіть слова «Заповни форму для складання іспитів» та зро­ біть цей текст заголовком четвертого рівня (рис. 5.27).

3.У новому абзаці введіть текст «Прізвище:» та додайте поле для введення текстових даних (команда Вставка • Форма • Поле (Вставка • Форма • Поле)). Клавішею Enter перенесіть кнопки Отправить (Надіслати) і Сброс (Скинути) у новий абзац.

4, Після однорядкового поля перейдіть на новий абзац і введіть текст «З цього списку вибери район, де ти проживаєш:», а по­ тім у новий рядок того самого абзацу (перехід на нього здій­ снюється комбінацією клавіш Shift+Enter) вставте поле роз­ кривного списку (команда Вставка • Форма • Раскрывающийся список (Вставка • Форма • Розкривний список)).

Рис. 5.27. Створення заголовка форми

5.Виділіть вставлений елемент і виконайте команду Свойства поля формы (Властивості поля форми) з його контекстного ме­ ню. У діалоговому вікні, що відкриється, клацніть кнопку Добавить (Додати), у новому діалоговому вікні в полі Вари­ ант (Варіант) введіть значення першого елемента розкривного списку — «Франківський» — та клацніть ОК. Це значення з'явиться у переліку елементів списку (рис. 5.28).

6.Аналогічно додайте у перелік елементів списку пункти «Сихівський» та «Галицький» і клацніть ОК. Розміри поля списку зміняться, і в ньому відобразиться перший елемент.