Створення та адміністрування сайту

Про матеріал

Методична розробка уроку містить розширений план-конспект уроку із посиланнями на інтерактивні вправи та практичну роботу

Перегляд файлу

Міністерство освіти і науки України

Департамент освіти і науки

Полтавської обласної військової адміністрації

Вище професійне училище №7

м.Кременчука Полтавської області

Т.НОВІКОВА

Створення та адміністрування сайту

Методична розробка уроку інформатики

Portofolio Guru yang Menarik dan Interaktif Menggunakan Google Sites - SIT Al Haraki - Sekolah Islam Terpadu Terbaik di Depok, Jawa Barat

Кременчук-2023

Новікова Т. Створення та адміністрування сайту: методична розробка уроку інформатики, Вище професійне училище №7, м. Кременчук-2023, 16 с.

Розглянуто та схвалено до використання в освітньому процесі ВПУ№7 на засіданні циклової методичної комісії «Природничо-математична підготовка».

Протокол 18.02.2023 № 6

УРОК № 31

Дата: __.__2023. Час проведення: __. Місце проведення: каб.№ 41. Група: З1-22.

Предмет: інформатика.

Тема програми № 4. Мультимедійні та гіпертекстові документи (8 год.).

Тема уроку № 31. Створення та адміністрування сайту (1 год.).

Цілі:

формування предметних компетентностей:

- засвоєння знань щодо створення сайтів із вибором елементів оформлення сайта;

- створення вебсторінок і системи навігації в сервісі Google Сайти.

розвиток ключових компетентностей:

- вільне володіння державною мовою: уміння висловлювати власну думку під час відповідей на запитання та виконання завдань уроку;

- навчання впродовж життя: уміння засвоювати навчальний матеріал та застосовувати отримані знання для виконання практичної роботи;

- інформаційно-комунікаційна компетентність: уміння користуватися цифровими технологіями, сервісами Web 2.0, зокрема сервісом Google Сайт;

- ініціативність і підприємливість: уміння брати відповідальність за свої дії під час виконання практичної роботи;

- соціальна і громадянська компетентність: здатність працювати в парі для досягнення поставленого завдання; поважати думку інших; бережне відношення до комп’ютерної техніки.

Очікувані результати:

Учні знають:

- порядок створення сайту на сервісі Google Сайт;

- прийоми редагування та форматування вебсторінок;

- порядок публікації сайту в Інтернеті.

Учні вміють:

- створювати власний Google-сайт, використовуючи готові шаблони оформлення;

- розміщувати текстові та графічні об’єкти на вебсторінках;

- створювати підсторінки та налаштовувати гіперпосилання;

- прийоми форматування вебсторінок.

Тип уроку: комбінований.

Форми організації навчальної роботи: фронтальна та індивідуально-групова робота.

Методи та прийоми навчання: розповідь з практичним показом, інтерактивна вправа «Так-ні» на сервісі wordwall.net, робота з віртуальною інтерактивною дошкою Padlet, практична робота за ПК, інтерактивна онлайн-вправа LearningApps.

Дидактичне забезпечення: план-конспект уроку, інструкційні картки до практичної роботи, презентація до уроку «Створення та адміністрування сайту», відеоінструкція, інтерактивні завдання на платформах wordwall.net, Padlet, LearningApps.

Технічне забезпечення: комп’ютери з доступом до мережі Інтернет, ноутбук, проєктор, екран, смарфони учнів.

Методична мета:

продемонструвати методику використання сучасних онлайн технологій з метою формування предметних компетентностей.

Міжпредметні зв’язки: інформаційні технології, виробниче навчання, предмети професійно-технічного циклу.

СТРУКТУРА УРОКУ:

І. ОРІЄНТАЦІЯ ДІЯЛЬНОСТІ (5 хв.).

1.1 Перевірка наявності учнів.

1.2 Перевірка готовності учнів до уроку.

1.3 Перевірка домашнього завдання (3хв.).

1.3.1 Інтерактивна вправа «Так-ні».

1.3.2 Мапа сайту.

ІІ.ЦІЛЕПОКЛАДАННЯ (1хв.).

Мотивація навчальної діяльності учнів.

2.1 Повідомлення теми і мети уроку.

2.2 Цільова установка уроку.

ІІІ.ЦІЛЕРЕАЛІЗАЦІЯ (35 хв.).

3.1 Актуалізація опорних знань (2хв.).

3.1.1 Інтерактивна вправа з віртуальною дошкою.

3.2 Сприйняття й усвідомлення учнями нового матеріалу (13хв.).

3.2.1 Розповідь з мультимедійною підтримкою.

3.2.2 Відеоурок.

План

Створення сайту засобами сервісу Google сайти.
Вибір елементів оформлення сайту.
Створення веб-сторінок і системи навігації.

3.3 Практична робота за комп’ютером (20хв.).

Завдання: Створити та опублікувати сайт засобами Google сайти.

3.3.1 Інструктаж з ОП та БЖД у комп’ютерному кабінеті.

3.3.2 Інструктаж щодо виконання практичної роботи.

3.3.3 Розподіл по парах.

3.3.4 Виконання завдань практичної роботи за інструкційними картками.

IV.РЕФЛЕКСИВНО-ОЦІНЮЮЧИЙ ЕТАП (4хв.).

4.1 Підведення підсумків уроку (2 хв.).

4.1.1 Інтерактивна вправа «Назви елемент».

4.2 Цінування. Оцінування (1 хв.).

4.3 Повідомлення домашнього завдання та пояснення етапів його виконання (1 хв.).

ХІД УРОКУ:

І. ОРІЄНТАЦІЯ ДІЯЛЬНОСТІ (5 хв.).

1.1 Перевірка наявності учнів.

1.2 Перевірка готовності учнів до уроку.

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

1.3. Перевірка домашнього завдання (3хв.).

Прийом: інтерактивна вправа «Так-ні».

Форма: індивідуальна.

Засоби: смартфони учнів, Qr-код на вправу, сервіс wordwall.net

М.К. Перевірка знань відбувається методом бліц-опитування за допомогою онлайн вікторини. Це дає можливість швидко перевірити знання основних понять і термінів усіх учнів групи Запитання створені на сервісі wordwall.net. Викладач демонструє на екрані Qr-код. Учні зі своїх смартфонів заходять на вправу. Викладач озвучує питання. Учні відповідають так або ні. Давши відповіді на запитання, потрібно вказати прізвище та ім’я. На екрані демонструється таблиця результатів.

Виконайте вправу «Так-ні». Для цього віскануйте Qr-код, який на екрані презентації (копія на парті). Якщо Ви погоджуєтеся з твердженням, треба натиснути Так, якщо не погоджуєтеся - Ні. Вкінці надрукувати прізвище та ім’я.

ТАК-НІ

Вебсайт – це сукупність веб-сторінок, доступних у мережі Інтернет, які об'єднані як за змістом, так і за навігацією під єдиним доменним ім’ям. (Так).
Вебсторінка, вміст якої може змінюватись залежно від певних умов та/або дій називається статична веб-сторінка (Ні).
За ознакою доступності сервісів вебсайти класифікують на: відкриті, напіввідкриті, закриті (Так).
HTML – це стандартна мова розмітки документів у мережі Інтернет (Так).
Документи, призначені для перегляду на екрані комп'ютера за допомогою браузера, називають атрибутами (Ні).
Контент - це вміст вебсторінок (Так).
Текст і нетекстові об'єкти, призначені для розміщення на веб-сторінках, зберігаються в базі даних (Так).
Засобом для автоматичного створення вебсайтів є текстовий редактор Блокнот (Ні).
HTML-код вебсторінки не може складатися з тисячі рядків (Ні).
Онлайн системи конструювання сайтів не надають доменне ім'я сайту (Ні).

Прийом: Мапа сайту.

Форма: індивідуальна.

Засоби: платформа Google Клас, сервіс www.mindmeister.com

М.К. Для практичної перевірки домашнього завдання використовується сервіс https://www.mindmeister.com. Учні повинні були створити ментальну карту мапи майбутнього сайту.

Вашим домашнім завданням було скласти структуру сайту або мапу сайту за допомогою сервісу https://www.mindmeister.com Отож, перевіримо, як ви справились із завданням.

ІІ ЦІЛЕПОКЛАДАННЯ (1хв.).

Мотивація навчальної діяльності учнів.

2.1 Повідомлення теми і мети уроку.

2.2 Цільова установка уроку.

М.К. Цільова установка уроку підвищує інтерес учнів до теми, що вивчається, спонукає до роздумів, активізує знання учнів. Використовується прийом мотиваційної розповіді.

Ми продовжуємо вивчати тему Мультимедійні та гіпертекстові документи. І тема нашого уроку «Створення та адміністрування сайту». (Учні записують в зошит тему). Сьогодні на уроці ви ознайомитеся з інформацією про те, як створити сайт, із вибором елементів оформлення сайту, створенням веб-сторінок і системи навігації в сервісі Google сайти. Також виконаєте індивідуальну практичну роботу.

Скоріш за все, ви погодитеся з твердженням, що основним, переважаючим джерелом інформації у нашому суспільстві є мережа Інтернет. Також ознакою сучасного Інтернету є спільна діяльність та активне спілкування користувачів. Будь-яка сфера діяльності людини на сьогоднішній день потребує створення сайта. І щоб це зробити, можна звернутися до професіоналів або опанувати інструменти, які допоможуть створювати та адмініструвати власні сайти.

Тема сьогоднішнього уроку є дуже важливою, адже від знань, які ви засвоїте сьогодні, буде залежати виконання колективного проєкту, який ви будете виконувати через декілька уроків.

ІІІ ЦІЛЕРЕАЛІЗАЦІЯ (35 хв.).

3.1 Актуалізація опорних знань (2хв.).

Прийом: інтерактивна вправа.

Форма: фронтальна.

Засоби: смартфони учнів, віртуальна дошка Padlet.

М.К. Учні самостійно визначають послідовність кроків створення сайту. Необхідно зі смарфонів зайти на віртуальну дошку Padlet за Qr-кодом. Відповідає один учень, решта – слідкує за виконанням на екрані. Після закінчення вправи відбувається обговорення правильності виконання завдання. Дана форма роботи спрямована на розвиток логічного мислення учнів, а робота з інтеактивною дошкою економить час уроку.

Подумайте і визначіть кроки розробки сайту засобами онлайн-системи керування вмістом веб-сайтів. Для цього на віртуальній дошці Padlet розставте блоки у правильному порядку.

Отож, разом ми з’ясували, що цими кроками є:

Реєстрація облікового запису на сервері онлайн-системи керування вмістом веб-сайтів.
Створення сайту, вибір його назви.
Вибір елементів оформлення сайту.
Створення сторінок сайту, системи навігації, заповнення сторінок контентом.
Публікація сайту.

3.2 Сприйняття й усвідомлення учнями нового матеріалу (13хв.).

Метод: розповідь з мультимедійною підтримкою.

Прийом: відеоурок.

М.К. Виклад нового матеріалу здійснюється у вигляді розповіді з мультимедійною підтримкою, що сприяє формуванню навчально-пізнавальної діяльності учнів. Учні записують у зошит основні поняття і команди. Для візуалізації алгоритму дій виконання практичної роботи використовується відеоурок, який озвучує викладач під час пояснення.

План

Створення сайту засобами сервісу Google сайти.
Вибір елементів оформлення сайту.
Створення веб-сторінок і системи навігації.

Створення сайту засобами сервісу Google сайти.

Для того, щоб створити сайт в сервісі GoogleСайти, треба мати обліковий запис у сервісі Google. Наступні кроки:

Увійти на Google Диск під власним обліковим записом Google.
Виконати Створити/Більше/ GoogleСайти.

Відкриється головна сторінка нового сайту в режимі редагування і сайт вважатиметься створеним. На Google Диску з’явиться ярлик сайту з підписом Сайт без назви та значком. Цей ярлик можна використовувати, щоб відкрити сайт для редагування.

Звичайно, що кожен сайт повинен мати назву. Її потрібно ввести у полі Введіть назву сайту, яке знаходиться зліва у верхній частині заголовка сторінки. Після чого натиснути Enter або вибрати місце за межами назви. Одночасно буде змінено текст Сайт без назви у правому верхньому кутку над сторінкою.

Вибір елементів оформлення сайту

Сайт може містити ЛОГОТИП. Файл із зображенням логотипа можна завантажити з локального комп’ютера або знайти в Інтернеті.

Алгоритм додавання логотипа сайту:

1. Підвести вказівник до лівого верхнього кута сторінки.

2. Вибрати кнопку Додати логотип.

3. Вибрати спосіб додавання логотипа, це може бути Завантажити або Вибрати. У першому випадку потрібно вибрати файл із зображенням з локального комп’ютера. У другому випадку відкривається панель Вибрати зображення з вкладками Google Диск, Посилання, Google-зображення, Фотографії (Ваші альбоми). Використовуючи елементи керування вкладок, можна знайти зображення в Інтернеті.

4. Вибрати потрібне зображення та натиснути кнопку Вибрати.

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

Логотип і назва сайту будуть відображатися у верхній частині вікна на кожній сторінці.

Вам відомо із роботи у текстових редакторах слово «Колонтитул». Сторінка сайту також містить верхній та нижній колонтитули. Кожна сторінка сайту містить верхній колонтитул, який може мати такий вид: Обкладинка, Великий банер, Банер або Лише заголовок. У верхньому колонтитулі розміщено назву веб-сторінки. У перших трьох випадках верхній колонтитул містить ще й фонове зображення.

Вид колонтитула та фонове зображення можна змінити. Панель з відповідними кнопками з’являється, якщо навести вказівник на нижню частину колонтитула. Зображення для колонтитула, як і для логотипа, можна завантажити з локального комп’ютера або з Інтернету. Вибір зображення в Інтернеті виконується так само, як і логотипа, але для колонтитула пропонується додаткова вкладка — Галерея.

Після змінення фонового зображення Google автоматично вибирає колір шрифту у верхньому колонтитулі для поліпшення сприйняття тексту назви веб-сторінки.

Для кожної сторінки сайту у верхньому колонтитулі може бути обране окреме фонове зображення, але доцільно вибирати одне зображення для всіх сторінок.

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

Крім верхнього колонтитула, до всіх сторінок сайту можна додати нижній колонтитул, так званий підвал. Для його додавання слід підвести вказівник до нижньої границі вікна браузера та вибрати кнопку, що з’явиться. У нижньому колонтитулі зазвичай розміщують відомості про роки існування сайту, його розробників, контактні дані тощо.

Створення веб-сторінок і системи навігації

Нова веб-сторінка сайту створюється з використанням елементів керування вкладки Сторінки, яка розміщена на панелі інструментів. Створити сторінку одного рівня із щойно створеною сторінкою можна, вибравши кнопку Додати сторінку. Наприклад, якщо сайт містить лише сторінку Домашня сторінка, то, використавши кнопку Додати сторінку, можна створити сторінки Новинки техніки та Цікаво знати.

Щоб створити сторінку нижчого рівня, ніж вибрана на вкладці сторінка, потрібно вибрати кнопку у вигляді трьох крапок у рядку з назвою сторінки та в меню, що відкрилося, вибрати команду Додати підсторінку. Так можна створити у сторінці Цікаво знати, наприклад, підсторінки Зварювальні апарати і Марки електродів. Таким чином можна створити до п’яти рівнів підсторінок.

У процесі створення веб-сторінок на вкладці Сторінки утворюється мапа сайту, що відображає структуру сайту.

Змінити рівень веб-сторінки у структурі сайту можна, перетягуючи назву сторінки на потрібну позицію. Одночасно зі створенням нової сторінки на панелі навігації у верхньому колонтитулі сторінок сайту додається гіперпосилання для переходу на цю сторінку. Якщо кількість сторінок більша, ніж може вміститися в один ряд на екрані, то на панелі навігації з’являється команда Більше з кнопкою Розгорнути або згорнути, яка відкриває розкривний список з гіперпосиланнями на веб-сторінки. Такі самі кнопки розміщуються поруч із назвами сторінок, для яких створено підсторінки.

Щоб змінити положення панелі навігації, потрібно:

1. Підвести вказівник до верхнього лівого кута екрана.

2. Вибрати кнопку Налаштування навігації.

3. Вибрати спосіб відображення навігаційної панелі.

Під час вибору команди Бічна навігаційна панель у режимі редагування сайту панель навігації зникне, замість неї у лівому верхньому куті сторінки з’явиться кнопка у вигляді трьох горизонтальних ліній Показати або сховати бічну навігаційну панель. Використовуючи цю кнопку, можна відкривати меню сайту під час його перегляду для переходу між сторінками.

3.3 Практична робота за комп’ютером (20хв.).

Завдання: Створити та опублікувати сайт засобами Google сайти.

3.3.1 Інструктаж з ОП та БЖД у комп’ютерному кабінеті.

3.3.2 Інструктаж щодо виконання практичної роботи.

3.3.3 Розподіл по парах.

3.3.4 Виконання завдань практичної роботи за інструкційними картками.

М.К. Учні виконують практичну роботу за ПК за інструкційними картками. Наявність відеоінструкції на сайті викладача полегшує роботу учнів, сприяє кращому засвоєнню прийомів роботи. У ході роботи треба створити 2-сторінковий сайт, налаштувати навігацію, додати текст і графічні об’єкти, вибрати елементи дизайну та опублікувати сайт в Інтернеті.

Практична робота полягатиме в тому, що потрібно створити у системі GoogleСайти веб-сайт «Зварник – професія майбутнього», розмістивши на ньому відомості про професію, встановити логотип, змінити зображення у верхньому колонтитулі, додати нижній колонтитул, додати сторінки до сайту.

Хід виконання практичної роботи:

Увійдіть на Google Диск з вашим обліковим записом Google.
Виконайте Створити/Більше/Google Сайти.
Уведіть у поле Введіть назву сайту у верхній частині сторінки зліва назву «Зварник – професія майбутнього» і натисніть клавішу Enter.
Додайте логотип до сайту. Для цього:

- Підведіть вказівник до лівого верхнього кута сторінки.

- Виберіть кнопку Додати логотип.

- Виберіть кнопку Вибрати.

- Виберіть вкладку Пошук.

- Уведіть ключове слово зварник у поле пошуку та натисніть клавішу Enter.

- Виберіть одне із зображень і кнопку Вибрати.

- Виберіть команду Використовувати колір логотипа для теми.

Змініть зображення у верхньому колонтитулі. Для цього:

- Наведіть вказівник на верхній колонтитул.

- Натисніть кнопку Змінити зображення і команду Вибрати зображення.

- Виберіть на вкладці Галерея одне із зображень.

- Натисніть кнопку Вибрати.

Додайте нижній колонтитул. Для цього:

- Підведіть вказівник до нижньої частини сторінки.

- Натисніть кнопку Додати нижній колонтитул.

- Введіть у текстове поле поточний рік, ваше прізвище та ім’я.

- Розташуйте текст по центру.

- Змініть колір фону нижнього колонтитула. Для цього натисніть зліва від нижнього колонтитула кнопку Фон розділу та команду Виділення 2

- Клацніть мишкою за межами текстового поля.

У поле Заголовок сторінки введіть назву Зварник – професія майбутнього.
Створіть 2-3 нові сторінки, назви яких відображають відомості про професію зварника (інструменти і матеріали, охорона праці, види робіт тощо). Для цього використайте кнопку Додати сторінку на вкладці Сторінки.
Оформіть нові сторінки, використовуючи зміну зображення у верхньому колонтитулі.
Зверніть увагу на формування панелі навігації зверху сторінки. Змініть розташування панелі навігації/Збоку.
Розташуйте панель навігації знову За верхнім краєм. Зверху сторінки виберіть у лівому верхньому куті екрана кнопку Налаштування навігації (зображення шестерні), вибрати Навігація/ Режим/ За верхнім краєм.
Завершіть роботу і повідомте викладача про виконання.

3.3.5 Релаксаційна пауза (1 хв.).

(Вправи для очей)

1. Погляд спрямувати вліво-вправо, вправо-прямо, вверх-прямо, вниз-прямо без затримки в кожному положенні. Повторити 5 разів і 5 разів у зворотному напрямі.

2. Заплющіть очі на рахунок "раз-два", розплющіть очі і подивіться на кінчик носа на рахунок "три-чотири".

3. Кругові рухи очей: до 5 кругів вліво і вправо.

IV. РЕФЛЕКСИВНО-ОЦІНЮЮЧИЙ ЕТАП (4 хв.).

4.1 Підведення підсумків уроку (2 хв.).

Прийом: «Назви елемент».

Форма: фронтальна.

Засоби: платформа learningapps.org/

М.К. Викладач на екрані відкриває вправу. Учні по черзі відповідають на запитання усно. Викладач дублює відповіді учнів на екрані. Дана форма роботи спонукає учнів до усвідомлення і засвоєння нового матеріалу.

4.2 Цінування. Оцінювання (1 хв.).

М.К. Викладач аналізує діяльність учнів на уроці, виконання практичної роботи, відмічає активних учнів. За потреби, викладач може виставити оцінки активним учням.

4.3. Повідомлення домашнього завдання та пояснення етапів його виконання (1 хв.).

- Підручник Й.Ривкінд Інформатика 10 клас – параграф 4.3., уміти усно відповідати на запитання ст.130.

- Закінчити оформлення сайту, наповнити контентом професійного спрямування.

- Адресу опублікованого сайту прикріпити на Google Classroom

Додаток 1

ІНСТРУКЦІЙНА КАРТКА

Створення сайту засобами Google сайти

Увага! Під час роботи з комп’ютером дотримуйтеся правил охорони праці та безпеки життєдіяльності.