Тема: Створення електронних навчально-інформаційних видань. Розробка структури видання

ЗАВДАННЯ:

Розробити Web-сайт для представлення в мережі інформації про Вашу групу.

· Сайт винний складатися з домашньої сторінки, що надає інформацію про групу в цілому, і трьох персональних сторінок, що містять інформацію про шкірного студента.

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

· На сторінках Web-сайту має бути присутньою текстова і графічна інформація, а також наступні обов'язкові елементи:

· Панелі Навігатора (Navigation Bars);

· Загальні полючи сторінок (Shared Borders);

· Заголовки сторінок (Page Banners);

· Списки, що стискуються.

· Інформація на сторінці має бути скомпонована і оформлена відповідно до вимог, що пред'являються до вмісту і дизайнові Web-сайтів.

Позначка заняття: Виробити практичні навики по створенню і редагуванню Web-сторінок і Web-сайтів за допомогою засобів Microsoft FrontPage. Ознайомитися з поняттям гіперпосилання і освоїти основні прийоми роботи з гіперпосиланнями, доступні в FrontPage. Розробити структуру і основні компонента Web-сайту.

Порядок виконання роботи:

1. Уключіть комп'ютер.

2. Запустіть додаток Microsoft FrontPage (група Microsoft Office).

3. Ознайомтеся із зовнішнім виглядом і вмістом рядка меню і панелі інструментів. Порівняєте їх з аналогічними елементами вже відомих вам програм, що входять у Microsoft Office (Word, Excel, Access).

4. Створіть порожній Web-сайт на локальному дискові вашого комп'ютера.

Виберіть пункт меню Файл/ Створити/ Web (File/ New/ Web). Із запропонованих шаблонів Web-сайтів (Web Sites) у лівій частині екрану виберіть Порожній Web (Empty Web). Визначите розташування і задайте ім'я вашого Wеb'а в запропонованому полі праворуч.

5. Створіть декілька порожніх сторінок, у які будуть занесені дані про кожен із студентів (персональні сторінки студентів) і збережіть їх, даїчи кожній сторінці ім'я (прізвище) студента.

Аби створити сторінку використовуйте меню Файл/ Створити/ Сторінка (File/ New/ Page), із запропонованих шаблонів вибрати Звичайна (Normal Page). Аби зберегти сторінку під заданим ім'ям використовуйте меню Файл/ Зберегти як (File/ Save As), у полі введення ввести необхідне ім'я файлові сторінки, змінити заголовок сторінки (Title) за допомогою кнопки Змінити. (Change.), натискувати кнопку Зберегти (Save). Наприклад, імена сторінок (файлів): «іванов», «петров», «сидоров», – а заголовки: «іванов іван», «Петров петро», «Сидоров сидір» відповідно.

6. У меню Вид (View) виберіть режим переглядові (Folder List) і перевірте розміщення файлів і каталогів, необхідних для роботи вашого Wеb'а.

7. Встановите ієрархію сторінок вашого Web-сайту.

У меню Вигляд (View) виберіть режим Навігатора (Navigation) і створіть домашню сторінку сайту, слідуючи вказівкам комп'ютера.

Зверніть увагу, що оскільки ви створюєте сайт на локальному дискові, ті ім'я домашньої сторінки за умовчанням: index.htm. Крім того, зміна імені і заголовка домашньої сторінки в спискові Folder List або за допомогою меню File/ Save As ніяк не відбиваються в режимі переглядові Навігатор (Navigation).

За допомогою миші перетягніть вже створені Вами сторінки із спискові файлів і каталогів (Folder List) у лівій частині екрану на робоче поле навігатора і встановите ієрархію між ними. (Сторінки «Іванов іван», «Петров петро», «Сидоров сидір» є сторінками одного рівня і дочірніми по відношенню до домашньої).

8. Поверніться в режим переглядові сторінки (меню Від/ Сторінка (View/ Page)), у спискові файлів і каталогів (Folder List) у лівій частині екрану виберіть файл домашньої сторінки (index.htm) і відкрийте його для редагування (два клацання лівою клавішею миші на імені файлові). Сторінку для редагування також можна відкрити і з режимові Навігатора (Navigation), двічі клацнувши лівою клавішею миші на її значкові в робочому полі.

9. На домашній сторінці створіть текстові гіперпосилання на персональні сторінки шкірного студента.

Наберіть вихідний текст, наприклад, «Інформація про студентів: іванов, петров, сидоров». Аби створити гіперпосилання на персональну сторіночку іванова, виділите в тексті «іванов», виберіть у меню Вставка (Insert) пункт Гіперпосилання. (Hyperlink.), у діалоговому вікні Створення Гіперпосилання (Create Hyperlink) виберіть файл иванов.htm, натискуйте кнопку OK. Відстежите зміни, що сталися у вікні редагування сторінки. Перевірте, чи правильно функціонує створена гиперссылкка, перемкнувши в режим Попереднього переглядові сторінки (Preview) (вкладка в лівій нижній частині екрану). Створіть інші гіперпосилання за описаною схемою.

Для створення гіперпосилання використовують також поєднання клавіш [Ctrl]+[K] або кнопку Гіперпосилання (Hyperlink) на панелі інструментів.

У вікні Створення Гіперпосилання (Create Hyperlink) обернете увагу на кнопки, розташовані праворуч від полючи адреси, які в разі споживи допоможуть вам знайти потрібний для гіперпосилання файл поза вашим сайтом, або створити для неї порожню сторінку усередині сайту.

Аби змінити або видалити вже існуюче гіперпосилання виділите її і знову скористайтеся меню Вставка/ Гіперпосилання. (Insert/ Hyperlink.), а в діалоговому вікні, що з'явилося, Редагування Гіперпосилання (Edit Hyperlink) зміните (або видалите) адреси файлові сторінки.

10. На кожній з персональних сторінок студентів помістите кнопки для повернення на домашню сторінку.

Перейдіть на одну з персональних сторінок. Встановите курсор у місці, де ви хочете розташувати кнопку. У меню Вставка/ Компонентів виберіть Кнопка (Insert/ Component/ Hover Button). У вікні властивостей кнопки (Hover Button Properties), що з'явилося, у полі Текст Кнопки (Button Text) уведіть напис, який розташовуватиметься на кнопці (наприклад, «Повернення на домашню сторінку»). У полі Пов'язати з: (Link to:) введіть адресі домашньої сторінки. Ви можете скористатися також кнопкою Переглядом. (Browse.), розташованою праворуч від вказаного полючи, аби вибрати сторінку із спискові. Далі виберіть Колір кнопки (Button color), Колір тлу (Background color), один з Ефектів зміни вигляду кнопки при наведенні на неї курсору (Effect), Колір ефекту (Effect color), а також задайте ширину і висоту кнопки в полях Ширина (Width) і Висота (Height). Далі ви можете просто скопіювати кнопку на інші персональні сторінки і встановити для кожної кнопки власне колірне і шрифтове оформлення й ефекти.

11. Перевірте роботові кнопок, перемкнувши в режим Попереднього переглядові (Preview).

12. Поверніться на домашню сторінку. У меню Вигляд виберіть режим Гіперпосилання (View/ Hyperlinks).Перевірте створені вами зв'язки між сторінками. Вибираючи в спискові Folder List різні файли сторінок, перевірте створені вами зв'язки між ними. Порівняєте режим переглядові Гіперпосилання (Hyperlinks) з режимом переглядові Навігатор (Navigation).

13. Покажіть результати роботи викладачеві.

14. Закінчити роботові додатків.

Контрольні питання:

1. Які режими переглядові структури Web– сайту доступні в FrontPage?

2. Яким чином можна задати ієрархію сторінок Вашого сайту?

3. Як зазвичай називається основна сторінка сайту?

4. Як зробити посилання на зовнішній ресурс?

5. Де зберігаються малюнки, що розміщуються на вашому сайті?

6. Яким чином можна змінити назву і заголовки Web- сторінки?

7. Які основні режими переглядові доступні в FrontPage?

8. Яким чином можна змінити (задати) ієрархію сторінок Вашого Web?

9. У якій частині вікна браузерові виводиться заголовок Web-сторінки, що переглядається?

10. Яким чином можна перевірити роботові гіперпосилань?

Дата добавления: 2014-12-26