Презентація Веб-технології Урок 4

1. Інформаційна структура сайта

10
(11)
Урок 4
За навчальною програмою 2018 року

2. Актуалізація опорних знань і життєвого досвіду

Розділ 1
§4
Актуалізація опорних знань
і життєвого досвіду
Давайте
спробуємо
використовуючи запитання:
організувати
10
(11)
бесіду,
Яка буває інформація на веб-сайтах?
Від чого залежить присутність певної інформації
на сайті?
Як оцінити інформацію, яка є на сайті?
Що таке інформативність?
© Вивчаємо інформатику
teach-inf.at.ua

3. Інформаційна структура сайта

Розділ 1
§4
Інформаційна структура сайта
Cтворення
веб-сайта
починається
інформаційної структури сайта.
10
(11)
зі
створення
Структура веб-сайтів:
головна сторінка;
шапка сайта, що розташована у верхній частині
головної сторінки;
меню сайта — список гіперпосилань на його розділи.
Меню є одним із найважливіших компонентів сайта;
гіперпосилання для переходу на різні сторінки сайта
або навіть на інші сайти.
© Вивчаємо інформатику
teach-inf.at.ua

4. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
При створенні структури сайта слід дотримуватися
певних принципів, зокрема:
Принципу простоти
© Вивчаємо інформатику
teach-inf.at.ua
Принципу цільової
сегментації

5. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Оскільки структура сайта складається з різних його
розділів, то для зручності його відвідування та
швидкого знаходження потрібних відомостей доцільно
робити структуру простою, без додаткових підрозділів.
© Вивчаємо інформатику
teach-inf.at.ua

6. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
«Ідеальна» структура сайта має мати один вхід й
один вихід. Як це зробити, якщо сайт має безліч
сторінок? У такому разі сайт матиме кілька входів і
лише один вихід.
Для
зручності
орієнтування
головна сторінка сайта має містити
меню з повним його описом, яке
дасть
змогу
користувачеві
зорієнтуватися у вмісті сайта та
швидко
перейти
до
потрібного
розділу.
Така
структура
сайта
будується за принципом «воронки».
© Вивчаємо інформатику
teach-inf.at.ua

7. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Принцип цільової сегментації базується на тому, що
користувач спочатку виділяє основні групи цільової
аудиторії й на основі потреб кожної групи створюється
структура сайта.
Такий
принцип
побудови є ефективним
для сайтів, на яких
виділяється 2-3 основні
групи користувачів.
© Вивчаємо інформатику
teach-inf.at.ua

8. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
Підчас
планування
структури
сайта
продумати кілька основних складових:
Структуру
каталогів
Структуру
навігації
teach-inf.at.ua
необхідно
Необхідність
заставки сайта
Важливо
визначитися
з
необхідною
сторінок і встановити зв'язки між ними.
© Вивчаємо інформатику
9
кількістю

9. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
Розглядають:
Внутрішню
структуру сайта
9
Зовнішню
структуру сайта
Продумана внутрішня структура сайта дає змогу всі
необхідні матеріали розташувати зручно й доступно в
розділах і підрозділах. Навіть якщо сайт містить
великий
обсяг
відомостей,
слід
розробити
таку
внутрішню
структуру,
у
якій
можна
легко
зорієнтуватися потенційним клієнтам.
© Вивчаємо інформатику
teach-inf.at.ua

10. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
Розрізняють внутрішню структуру сайта:
Лінійна
Деревоподібна
«Павутина»
Лінійну (послідовну) структуру
веб-сайта доцільно використовувати
в
разі
послідовного
подання
відомостей, наприклад, про товари
та
послуги
або
матеріали
навчального посібника.
© Вивчаємо інформатику
teach-inf.at.ua
9
Комбінована
структура

11. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Перегляд таких сайтів здійснюється послідовно: від
початкової (головної) до останньої сторінки.
Кожна сторінка має
посилання
тільки
на
одну, наступну сторінку
сайта.
Інколи,
для
зручності навігації по
сайту,
до
сторінки
також
додається
посилання
на
попередню сторінку.
© Вивчаємо інформатику
teach-inf.at.ua
Головна сторінка
Сторінка 1
Сторінка 2

12. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
При
ієрархічній,
або
деревоподібній,
структурі
створюється одна головна сторінка, яка не має попередніх,
решта сторінок має лише одну попередню сторінку.
Головна сторінка
Сторінка
Сторінка
Сторінка
Сторінка
© Вивчаємо інформатику
Сторінка
teach-inf.at.ua
Сторінка
Сторінка
Сторінка
Сторінка

13. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Структура «Павутина». У цьому випадку усі сторінки
Web-сайту містять посилання на інші сторінки, і
користувач може легко перейти з будь-якої сторінки
практично на будь-яку іншу.
© Вивчаємо інформатику
teach-inf.at.ua

14. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
При довільній структурі кожна сторінка може містити
посилання на довільну кількість сторінок сайта. Така
структура найкраще підходить для сайтів, що містять
різні за тематикою матеріали: каталогів, зібрань статей
з різних тем або добірок посилань.
Прикладом
такої
структури
української літератури
ukrlib.com.ua
© Вивчаємо інформатику
teach-inf.at.ua
є
сайт
Бібліотека

15. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
На
практиці
майже
завжди
використовується
поєднання деревоподібної та послідовної структур,
тобто комбінована структура.
Наприклад, зміст електронної
книги
або
каталог
статей
починається
з
ієрархічно
розташованих
сторінок,
але
кожний окремий розділ чи статтю
доцільно
розбити
на
кілька
частин,
які
розташовуються
послідовно одна за одною.
© Вивчаємо інформатику
teach-inf.at.ua

16. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Інколи розглядають мережеву структуру, яка базується
на побудові системи такої навігації сайта, коли між
вертикальними
й
горизонтальними
елементами
(сторінками) існує взаємний зв'язок і можливість
швидкого переходу з однієї сторінки на іншу без
додаткової необхідності відвідування проміжних сторінок.
Така структура призводить до
зайвого збільшення кількості
гіперпосилань,
а
її
застосування є обмеженим для
сайтів з великою кількістю
сторінок.
© Вивчаємо інформатику
teach-inf.at.ua

17. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Зовнішня структура визначає спосіб розміщення
відомостей на сторінці при виборі кожного пункту меню.
Також можна вказати конкретне місце для розміщення
на сайті:
Банера
Картинок
Зовнішня структура
дизайну сайта.
© Вивчаємо інформатику
teach-inf.at.ua
має
Додаткових
посилань
гармонійно
відповідати

18. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Навігація по сайту має бути простою та зрозумілою:
користувач у будь-який час має знати відповіді на такі
запитання:
Де він
перебуває?
© Вивчаємо інформатику
Куди можна
піти?
teach-inf.at.ua
Як туди
дістатися?
Як
повернутися
назад?

19. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Розв'язувати ці задачі можна по-різному. Наприклад,
для легкого визначення місця-розташування на сайті
можна виділити ту сторінку в меню, на якій перебуває
користувач, а саме меню зробити доступним на всіх
сторінках сайта.
© Вивчаємо інформатику
teach-inf.at.ua

20. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Також можна зробити так звані навігаційні ключі,
тобто у верхній частині кожної сторінки вказати повний
шлях до цієї сторінки за схемою:
головна сторінка
назва розділу
назва сторінки
© Вивчаємо інформатику
teach-inf.at.ua
При
цьому
слід
дотримуватися
правила
трьох кліків: до будь-якої
сторінки
сайта
користувач має дістатися
не більш ніж за три
переходи (три кліки).

21. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Розрізняють:
Текстову систему
навігації
© Вивчаємо інформатику
teach-inf.at.ua
Навігацію за
допомогою
кнопок
Використання
навігаційних карт

22. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Інколи замість головної сторінки сайта з'являється
заставка. Це велике фото зі звуковим супроводом або
відеоролик. Такі сторінки створюють, щоб привернути
увагу користувача.
© Вивчаємо інформатику
teach-inf.at.ua

23. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Головна сторінка сайта має задовольняти правилу
«3 по 3», тобто три абзаци по три речення про тематику
та зміст, авторів і призначення сайта.
© Вивчаємо інформатику
teach-inf.at.ua

24. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Крім того Головна сторінка сайта, має відповідати
таким вимогам:
відображати тематику сайта;
бути цікавою, щоб користувач мав бажання переглянути інші
сторінки сайта;
містити інструмент реалізації пошуку по сайту;
містити розділ з актуальними даними, що постійно оновлюються,
наприклад, новини, акції, поради дня тощо;
містити відомості про спосіб зворотного зв'язку (e-mail, телефон,
адресу).
© Вивчаємо інформатику
teach-inf.at.ua

25. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Зовнішній вигляд решти сторінок сайта має бути
витриманим у єдиному стилі. На них має бути вказано
назву ресурсу й посилання на головну сторінку.
© Вивчаємо інформатику
teach-inf.at.ua

26. Яку структуру можуть мати сайти?

Розділ 1
§4
Яку структуру можуть мати сайти?
9
Залежно від засобу створення, сайти можуть мати
одинакові елементи структури. До них належить:
Логотип
власника
сайта чи
графічний
декор
Назва
сайта,
фірми чи
сторінки
© Вивчаємо інформатику
teach-inf.at.ua
Гіперпосилаиня
чи панель
навігації
сайта
Дані, які
наповнюють вміст
сторінки
сайта
Контактні
дані тощо

27. Запитання для рефлексії

Розділ 1
§4
Запитання для рефлексії
10
(11)
1. Чи маю я задоволення від результатів роботи на
уроці?
2. Наскільки мій
завершення?
проект
просувається
до
логічного
3. Чи потрібні мені додаткові дослідження?
4. Чи виходить у мене
учителем та учнями?
© Вивчаємо інформатику
teach-inf.at.ua
співпрацювати
з

28. Домашнє завдання

Розділ 1
§4
Домашнє завдання
Написати есе
«Які бувають інформаційні
структури веб-сайтів»
© Вивчаємо інформатику
teach-inf.at.ua
10
(11)

29. Працюємо за комп’ютером

Розділ 1
§4
Працюємо за комп’ютером
© Вивчаємо інформатику
teach-inf.at.ua
10
(11)

30. Дякую за увагу!

10
(11)
Урок 4
За навчальною програмою 2018 року