Урок 49. Структура веб-сайтів, різновиди веб-сайтів. Різновиди веб-сторінок. Етапи створення веб-сайтів. Основи веб-дизайну
Тема уроку: “Структура веб-сайтів, різновиди веб-сайтів. Різновиди веб-сторінок. Етапи створення веб-сайтів. Основи веб-дизайну”
Пригадаємо…
- Що називають комп’ютерними мережами, як класифікують комп’ютерні мережі?
- Хто такий провайдер, його основні функції?
- Що таке браузер (наведіть приклади)?
Прочитайте!
Сукупність веб-сторінок певної тематики із системою навігації, що дає можливість переміщатися між ними за допомогою гіперпосилань, збережених на одному сервері, утворює сайт, або веб-сайт.
Структура сайта визначає наявність розділів, сторінок, посилань на сторінки, розташування цих елементів та їхній взаємозв’язок.
Під час планування структури сайта необхідно продумати кілька основних складових: структуру каталогів, структуру навігації, заставку сайта. Важливо визначитися з необхідною кількістю сторінок і встановити зв’язки між ними.
Різновиди веб-сайтів
Landing Page Сторінка-вітрина – веб-сторінка, яка відкривається при натисканні на рекламне оголошення чи ланку (лінк). «Цільова сторінка» є логічним продовженням рекламного оголошення або посилання.
Сайт-візитка, який найчастіше складається з декількох сторінок: інформація про фахівця, сторінка з послугами та цінами, сторінка з відгуками про роботу і портфоліо, контактна інформація для зв’язку.
Форум – це сайт для спілкування, тут створюють теми і допомагають один одному в рамках однієї загальної тематики.
Блог можна схарактеризувати як онлайн-щоденник і спосіб ділитися корисною інформацією (контентом). Хтось пише про своє життя, хтось ділиться життєвим досвідом і навчає свою аудиторію. Блог це ще й діалог між автором і читачами.
Сайти новин – відвідуваність (понад 3 000 відвідувачів на добу) і вид контенту. Залежно від охоплення і масштабу можна поділити на міські, обласні новинні сайти, новинні сайти в масштабах держави і світу.
Інформаційні сайти (ще називають SEO-сайти) мають дуже схожий вигляд на сайт новин, але мають ряд відмінностей. SEO-сайти створюються для надання відвідувачам того, що цікавить їх.
Корпоративні сайти Сайт для середніх і великих компаній. Створюється для публікації такої інформації: про компанію, про вакансії, про товари, послуги, про партнерів, контактна інформація.
Інтернет-магазини Назва говорить сама за себе. Інтернет-магазин (онлайн-магазин) – це платформа, де ви розміщуєте свої товари, а відвідувачі купують товар, оформляючи замовлення і оплачуючи покупку в режимі онлайн.
Способи створення веб-сторінки. Складові структури веб-сторінки:
Веб-сторінки є текстовими документами. Їх створюють з використанням мови розмітки гіпертексту HTML. У них міститься HTML- код сторінки, що складається з даних двох типів:
- текст, який відображається на сторінці;
- теги, команд, що визначають розмітку тексту: його структуру, формат фрагментів тексту, забезпечують встановлення не текстових об’єктів.
Переглянути HTML- код у сторінці веб-браузера, відкритої у вікні браузера Google Chrome, можна, вибравши в конкретному меню сторінки команду Переглянути джерело сторінки.
Етапи створення веб-сайту
Виконання практичного завдання
Завдання 1 Розробіть у будь-якому графічному редакторі (можна скористатись програмою Word, або PowerPoint) структуру головної сторінки сайту на одну з тем:
- Моя школа
- Моє місто
- Моє хобі
- Дистанційне навчання
- Улюблені місця відпочинку
Виконане завдання 1 надішліть на електронну адресу або у Classroom вчителя. Якщо надсилаєте електронним листом, в темі листа вказуйте прізвище і клас.
Якщо у вас немає можливості працювати за ПК, замість практичних завдань можна дати письмову відповідь на запитання:
- Які різновиди веб-сайтів ви знаєте?
- Запишіть основні етапи створення веб-сайтів.
- Які складові можна виділити на веб-сторінці? Схарактеризуйте їх.
Вимоги до листа: у темі листа ОБОВ’ЯЗКОВО вказуйте прізвище, ім’я та клас (наприклад: Сидоров Михайло, 9Б).
-
Кодування даних
-
Апаратне забезпечення комп'ютера
-
Опрацювання текстових даних
- Урок 7. Повторення раніше вивченого матеріалу з теми “Текстовий процесор”
- Урок 8. Пошук та заміна фрагментів тексту. Створення, редагування та форматування символів, колонок, списків в текстовому документі. Недруковані знаки.
- Урок 9. Створення, редагування та форматування таблиць.
- Урок 10. Створення, редагування та форматування графічних об’єктів в текстовому документі.
- Урок 12. Практична робота №3. Створення текстового документа, що містить об’єкти різних типів.
- Урок 14. Автоматизоване створення змісту.
- Урок 15. Практична робота №4. Форматування документу. Створення титульної сторінки. Автоматизоване створення змісту.
-
Алгоритми та програми. Основи подвійно- та об'єктно-орієнтованого програмування
- Урок 13. Поняття мови програмування. Складові мови програмування.
- Урок 14. Знайомство з середовищем програмування.
- Урок 15. Поняття події, обробника події.
- Урок 16. Практична робота №5. Створення об’єктно-орієнтованої програми, що відображає вікно повідомлення.
- Урок 17. Елемент керування “кнопка”.
- Урок 18. Елемент керування “напис”.
- Урок 19. Складання програм, що обробляють натискання кнопок та визначають вміст написів на формі.
- Урок 20. Практична робота №6. Створення програми з кнопками та написами.
-
Алгоритми роботи з об'єктами та величинами
- Урок 21. Поле його властивості (Python)
- Урок 22. Величини (змінні і константи), їхні властивості. (Python)
- Урок 23. (Python) Практична робота №7. Складання та виконання лінійних алгоритмів опрацювання величин в навчальному середовищі програмування.
- Урок 24. Налагодження програм. (Python)
- Урок 25. Використання налагоджувача програм у візуальному середовищі програмування. Покрокове виконання програм, перегляд значень змінних під час виконання програми. (Python)
- Урок 26. Величини логічного типу, операції над ними.
- Урок 27. Алгоритми з розгалуженнями для опрацювання величин. (Python)
- Урок 28. Алгоритми з розгалуженнями для опрацювання величин. (Python)
- Урок 29 (Python). Складені умови. Пошук найбільшого та найменшого серед кількох значень.
- Урок 30. (Python) Інструктаж з БЖД. Практична робота 9. Складання та виконання алгоритмів з розгалуженнями для опрацювання величин.
- Урок 31. (Python) Елементи для введення даних: прапорець.
- Урок 32. (Python) Елементи для введення даних: перемикач.
- Урок 33. (Python) Алгоритми з повтореннями для опрацювання величин. Цикл з лічильником.
- Урок 34. (Python) Цикл з передумовою. Складання алгоритмів опрацювання величин у навчальному середовищі програмування, їх налагодження і виконання.
- Урок 35. (Python) Співвідношення типів даних та елементів для введення даних, зчитування даних з елементів введення.
- Урок 36. (Python) Розв’язання задач
- Урок 37. (Python) Практична робота №9. Складання та виконання алгоритмів з повтореннями та розгалуженнями для опрацювання величин.
- Урок 38 (Python). Повторення вивченого матеріалу.
- Урок 21. Поле, його властивості.
- Урок 22. Величини (змінні і константи), їхні властивості.
- Урок 23. Практична робота №7. Складання та виконання лінійних алгоритмів опрацювання величин в навчальному середовищі програмування.
- Урок 24. Налагодження програм.
- Урок 25. Використання налагоджувача програм у візуальному середовищі програмування. Покрокове виконання програм, перегляд значень змінних під час виконання програми.
- Урок 28. Алгоритми з розгалуженнями для опрацювання величин.
- Урок 30. Складені умови. Пошук найбільшого та найменшого серед кількох значень.
- Урок 30. Елементи для введення даних: перемикачі, прапорці.
- Урок 31. Елементи для введення даних: випадаючі списки.
- Урок 32. Алгоритми з повтореннями для опрацювання величин. Цикл з лічильником.
- Урок 33. Цикл з передумовою. Складання алгоритмів опрацювання величин у навчальному середовищі програмування, їх налагодження і виконання.
- Урок 36. Практична робота №9. Складання та виконання алгоритмів з повтореннями та розголуженнями для опрацювання величин.
- Урок 37. Відображення базових графічних примітивів. Відображення рисунків із зовнішніх файлів.
- Урок 38. Практична робота №10. Складання та виконання алгоритмів з графічним відобреженням даних.
-
Опрацювання мультимедійних об’єктів
- Урок 39. Поняття мультимедіа. Формати аудіо- та відеофайлів.
- Урок 40. Додавання відеокліпів, звукових ефектів і мовного супроводу до слайдової презентації.
- Урок 41. Елементи анімації. Інструктаж з БЖД. Практична робота 11. Розробка презентацій з елементами анімації, відеокліпами, звуковими ефектами та мовним супроводом.
- Урок 42. Програмне забезпечення для опрацювання об’єктів мультимедіа. Захоплення аудіо та відео, створення аудіо-, відео фрагментів. Засоби перетворення аудіо- та відеоформатів.
- Урок 43. Програми для редагування аудіо- та відеоданих. Загальні поняття про відеофільм.
- Урок 44. Побудова аудіо- та відеоряду. Додавання до відеокліпу відеоефектів та налаштування переходів між його фрагментами.
- Урок 45. Налаштування часових параметрів аудіо- та відеоряду. Інструктаж з БЖД. Практична робота 12. Створення відеокліпу. Додавання відеоефектів, налаштування часових параметрів аудіо- та відеоряду.
- Урок 46.Сервіси розміщення аудіо та відео файлів в Інтернеті.
- Урок 47. Інструктаж з БЖД. Практична робота 13. Розміщення аудіо- та відеоматеріалів в Інтернеті.
- Урок 48. Підсумковий урок з теми: «Опрацювання мультимедійних об’єктів»
-
Створення та публікація веб-ресурсів
Створення та публікація веб-ресурсів
- Урок 49. Структура веб-сайтів, різновиди веб-сайтів. Різновиди веб-сторінок. Етапи створення веб-сайтів. Основи веб-дизайну
- Уроу 50. Основи веб-дизайну
- Урок 51. Поняття про засоби автоматизованої розробки веб-сайтів, редактор веб-сайтів з графічним інтерфейсом
- Урок 52. Поняття про систему керування вмістом сайту. Поняття хостингу. Автоматизоване створення статичної веб-сторінки, вибір її типу й оформлення.
- Урок 53. Наповнення веб-сторінки текстом та графічним матеріалом, створення гіперпосилань, завантаження файлів
- Урок 54. Інструктаж з БЖД. Практична робота №14. Автоматизоване створення веб-сайту
- Уроки 55-56. Поняття про мову розмітки HTML. Структура веб-сторінки. Оформлення тексту. Текстові елементи веб-сторінки, теги та їх атрибути.
- Урок 57. Інструктаж з БЖД. Практична робота 15. “Створення веб-сторінки за допомогою «Мови гіпертекстової розмітки»
- Урок 58. Малюнки. Гіперпосилання
- Урок 59-60. Таблиці на веб-сторінках. Списки на веб-сторінках
- Урок 61. Інструктаж з техніки безпеки. Практична робота 16 «Створення веб-сторінки за зразком з використанням таблиць, списків та малюнків»
0.00 на основі 0 рейтингів