Додавання сторонніх елементів до вебсторінок. Фреймування.
Якщо сторонній ресурс не надає коду для вбудовування свого контенту, його можна додати до сторінки вручну через код фрейму:
<iframe height="450" width="650" name="frame" scrolling="auto" src="URL"> </iframe>
, де
- height – висота фрейму, який вбудовується,
- width – ширина фрейму, який вбудовується,
- name – ім’я фрейму (може мати довільне значення),
- scrolling – параметр, який відповідає за наявність смуг прокручування, його значення "auto" забезпечує прокручування тільки у разі необхідності, значення "no" вимикає смуги прокручування, при цьому вміст сторінки поза розмірами фрейму не відображується,
- src – повна адреса сторінки, що вбудовується.
Увага: в режимі редагування в окремих випадках відображується лише рамка фрейму або зовсім не відображується нічого, проте у перегляді блогу вбудований елемент може мати коректний вигляд, особливо якщо ресурс доступний за протоколом HTTPS.
Комплексне практичне завдання
“Використання довільних елементів на вебсторінках та налаштування їхніх параметрів засобами мови гіпертекстової розмітки”.
Матеріали та ресурси
- підручники
- Інформатика 8 клас, авт. Рівкінд Й.Я., Лисенко Т.І., Чернікова Л.А., Шакотько В.В., (2021), стор. 105-114
- Інформатика 8 клас, авт. Морзе Н., Барна О. (2021), стор.192-219
- Інформатика 8 клас, авт. Коршунова О., Завадський І. (2021), - стор. 170-207
- Кращі віджети Blogger (є комерційний контент)
- Таблицы в блоге, тег <table>
Посилання на створені вебресурси
Завдання уроку
Працюйте з комп’ютером або мобільним пристроєм
- Відкрийте ваш тематичний блог. Продовжуйте розвивати та поліпшувати його. Для цього в різних местах місцях вбудуйте до нього окремі наступні елементи
- відео або зображення, яке не забезпечене власним кодом для вбудовування (використайте тег-контейнер <iframe>...<//iframe>);
- невеличкий аудіогід блогом у віджеті <HTML>/<JavaScript>:
- запишіть аудіо власноруч через мобільний диктофон або інтернет-сервис на зразок Vocaroo,
- розташуйте запис у форматі mp3 на GoogleДиск, надайте до нього доступ та отримайте код вбудовування
- якщо отримати код вбудовування з GoogleДиску не виходить, скористайтесь підказкою;
- якщо сервіс, з яким ви записали аудіо, надає код вбудовування, ігноруйте цей крок,
- використайте код, щоб вбудувати ваш аудіогід до віджету блогу.
- Остаточно перевірте наявність у блозі усіх елементів, зазначених у документі з посиланнями на створені вебресурси. Проставте позначки "+" в власному рядку таблиці.
Вас можна привітати: ви отримали досвід створення та самостійного тестування вебресурсу, побудованого засобами CMS Blogger. Не видаляйте ваш блог щонайменше до отримання семестрової та річної оцінки з інформатики.
Працюйте без пристрою
- Перегляньте цьогорічні записи блогу та матеріали підручників щодо створення вебресурсу засобами автоматизованої розробки.
- На аркуші паперу складіть макет навчального тематичного блогу, який мав бути розроблений у відповідності до завдань дописів блогу "Інформатика 5-9". Подайте структуру, зазначте кількість та орієнтовний вигляд елементів, їхні властивості.
- Зробіть фото макету та здайте його в Класі.
Самостійне завдання для підготовки до наступного уроку:
- пригадати базові поняття та прийоми роботи з мовою програмування Python (можна використати підручник Інформатика 7 клас, авт. Коршунова О., Завадський І. (2020), стор. 92-132 та задній форзац
