Мультимедіа на веб-сторінках
За навчальною програмою 2018 року
Урок 17
10
(11)
Актуалізація опорних знань і життєвого досвіду
Розділ 3 § 17
Пропоную розповісти про свій досвід використання сайтів із мультимедіа.
Я часто користуюся такими сайтами...
Мультимедіа потрібно...
На цих сайтах мультимедіа допомагає...
10�(11)
Мультимедіа на веб-сторінках
Розділ 3 § 17
Використання мультимедійних даних на веб-сторінках робить їх наочними, легкими для сприйняття.
10�(11)
Мультимедіа на веб-сторінках
Розділ 3 § 17
Завдяки поданню інформації не у вигляді тексту, який потрібно уважно читати, а у формі аудіозаписів та відеозображень можна скоротити час перегляду.
10�(11)
Мультимедіа на веб-сторінках
Розділ 3 § 17
Завдяки спеціальним модулям, вбудованим у браузер, аудіо- та відеофайли можуть відтворюватися прямо у його вікні.
10�(11)
Мультимедіа на веб-сторінках
Розділ 3 § 17
Як додати аудіо на веб-сторінку?
<audio src="audio.mp3" controls></audio>
Шлях до файлу
Додати панель керування
10�(11)
Мультимедіа на веб-сторінках
Розділ 3 § 17
Атрибути тегу <audio>:
autoplay
Відтворювати музику відразу після завантаження сторінки.
controls
Додає панель керування до аудіофайлу.
loop
Циклічно повторює аудіофайл.
muted
Вказує, що звук має бути відключений
preload
Використовується для завантаження файлу разом із завантаженням веб-сторінки.
src
Вказує шлях до аудіо файлу.
10�(11)
Мультимедіа на веб-сторінках
Розділ 3 § 17
Приклад використання HTML тега <audio>:
10�(11)
Мультимедіа на веб-сторінках
Розділ 3 § 17
Як додати відео на веб-сторінку?
<video src="video.mp4" controls</video>
Шлях до файлу
Додати панель керування
10�(11)
Мультимедіа на веб-сторінках
Розділ 3 § 17
Атрибути тегу <video>:
autoplay
Відео починає відтворюватися автоматично після завантаження сторінки.
controls
Додає панель керування до відеоролика.
height
Задає висоту області для відтворення відеоролика.
loop
Повторює відтворення відео від початку до його завершення.
muted
Вказує, що відео буде відтворюватися без звуку
10�(11)
Мультимедіа на веб-сторінках
Розділ 3 § 17
(Продовження…) Атрибути тегу <video>:
poster
Вказує адресу картинки, яка буде відображатися поки відео недоступне або не відтворюється.
preload
Використовується для завантаження відео разом із завантаженням веб-сторінки.
src
Вказує шлях до відеоролика.
width
Задає ширину області для відтворення відеоролика.
10�(11)
Мультимедіа на веб-сторінках
Розділ 3 § 17
Приклад використання HTML тега <video>:
10�(11)
Запитання для рефлексії
Розділ 3 § 17
10�(11)
Домашнє завдання
Розділ 3 § 17
Розповісти у соціальних мережах про свій досвід із застосування мультимедіа у веб-дизайні. Про-
аналізувати коментарі та поради друзів.
Запланувати у щоденнику самоосвіти пізнавально-дослідницьку діяльність з питань створення
мультимедіа.
10�(11)
Працюємо за комп’ютером
Розділ 3 § 17
10�(11)
Дякую за увагу!
За навчальною програмою 2018 року
Урок 17
10
(11)