Розбіжності

Тут показані розбіжності між вибраною ревізією та поточною версією сторінки.

--- subjects:basic:informatika:web:multymedia_na_veb-storinkah [07.11.2022 02:18] – [Table] Адміністратор
+++ subjects:basic:informatika:web:multymedia_na_veb-storinkah [07.11.2022 02:45] (поточний) – [Джерела] Адміністратор
@@ Рядок 14: / Рядок 14: @@
 **Поширені формати відео**
-^ Формат           ^ Розширення файлу  | Опис                                                                                                                                                                                                                                    |
+^ Формат           ^ Розширення файлу  ^ Опис                                                                                                                                                                                                                                    ^
 | MPEG             | .mpg\\ .mpeg      | MPEG. Розроблено Moving Pictures Expert Group. Перший популярний формат відео в Інтернеті. Більше не підтримується в HTML.                                                                                                              |
 | AVI              | .avi              | AVI (англ. Audio Video Interleave, що буквально можна перекласти як "чергування аудіо та відео") — мультимедійний контейнер для аудіо-відео даних. Добре відтворюється на комп’ютерах Windows, але не у веб-браузерах.                  |
@@ Рядок 38: / Рядок 38: @@
 | MP3        | .mp3              | Файли MP3 насправді є звуковою частиною файлів MPEG. MP3 є найпопулярнішим форматом для музичних плеєрів. Поєднує гарне стиснення (невеликі файли) з високою якістю. Підтримується всіма браузерами.                                                                                                                             |
 | MP4        | .mp4              | MP4 — це формат відео, але його також можна використовувати для аудіо. Підтримується всіма браузерами                                                                                                                                                                                                                            |
+<alert type="warning">**Примітка**. Стандарт HTML підтримує лише звук MP3, WAV і Ogg.</alert>
+===== Елемент HTML <video> =====
+HTML тег <video> добавляє, відтворює та керує відеороликом на веб-сторінці. Шлях до файлу задається через атрибут src або вкладений елемент ''<source>''.
+В даний час існує три формати відео, що підтимуються елементом ''<video>'': MP4, WebM та Ogg.
+Приклад:
+<code html>
+ <video width="320" height="240" controls>
+  <source src="movie.mp4" type="video/mp4">
+  <source src="movie.ogg" type="video/ogg">
+Ваш браузер не підтримує тег video.
+</video>
+</code>
+Атрибут ''controls'' додає елементи керування відео, як-от відтворення, пауза та гучність.
+Рекомендується завжди включати атрибути ''width'' та ''height''. Якщо висоту та ширину не встановлено, сторінка може мерехтіти під час завантаження відео.
+Елемент ''<source>'' дозволяє вказати альтернативні відеофайли, які браузер може вибрати. Браузер використовуватиме перший розпізнаний формат.
+Текст між тегами ''<video>'' і ''</video>'' відображатиметься лише в браузерах, які не підтримують елемент ''<video>''.
+===== Елемент HTML <audio> =====
+HTML тег <audio> відтворює аудіозапис і керує ним на веб-сторінці. Шлях до файлу задається через атрибут src або вкладений тег ''<source>''.
+Приклад:
+<code html>
+ <audio controls>
+  <source src="horse.ogg" type="audio/ogg">
+  <source src="horse.mp3" type="audio/mpeg">
+Ваш браузер не підтримує тег video.
+</audio>
+</code>
+Атрибут ''controls'' додає елементи керування звуком, як-от відтворення, пауза та гучність.
+Елемент ''<source>'' дозволяє вказати альтернативні аудіофайли, які браузер може вибрати. Браузер використовуватиме перший розпізнаний формат.
+Текст між тегами ''<audio>'' і ''</audio>'' відображатиметься лише в браузерах, які не підтримують елемент ''<audio>''.
+===== Плагіни HTML =====
+Плагіни були розроблені для використання в різних цілях:
+  * Для запуску Java-аплетів
+  * Для запуску елементів керування Microsoft ActiveX
+  * Для відображення флеш-фільмів
+  * Для відображення карт
+  * Для сканування на віруси
+  * Для підтвердження банківського ідентифікатора
+<callout type="danger" title="Увага!" icon="fa fa-warning">
+Більшість браузерів більше не підтримують аплети та плагіни **Java**.
+Елементи керування **ActiveX** більше не підтримуються жодним браузером.
+У сучасних браузерах також відключено підтримку **Shockwave Flash.**</callout>
+==== Елемент <object> ====
+Елемент ''<object>'' підтримується всіма браузерами. Він визначає вбудований об'єкт у документ HTML.
+Його розроблено для вбудовування плагінів (наприклад, Java-аплетів, програм читання PDF та Flash Player) у веб-сторінки, але також можна використовувати для включення HTML чи зображень у HTML:
+<code html>
+<object width="100%" height="500px" data="snippet.html"></object>
+<object data="audi.jpeg"></object>
+</code>
+==== Елемент <embed> ====
+Елемент ''<embed>'' підтримується в усіх основних браузерах. Елемент ''<embed>'' також як і ''<object>'' визначає вбудований об'єкт у документ HTML.
+Веб-браузери вже давно підтримують цей елемент. Однак він не був частиною специфікації HTML до HTML5.
+Приклад:
+<code html><embed width="100%" height="500px" src="snippet.html"> </code>
+==== HTML відео YouTube ====
+Перетворення відео в різні формати може бути складним і трудомістким. Простіше рішення — дозволити YouTube відтворювати відео на вашій веб-сторінці.
+YouTube відображатиме ідентифікатор (наприклад, tgbNymZ7vqY), коли ви збережете (або відтворите) відео. Ви можете використовувати цей ідентифікатор і посилатися на своє відео в коді HTML.
+Щоб відтворити відео на веб-сторінці, виконайте такі дії:
+  * Завантажте відео на YouTube
+  * Зверніть увагу на ідентифікатор відео
+  * Визначте елемент ''<iframe>'' на своїй веб-сторінці
+  * Атрибут ''src'' вказує на URL-адресу відео
+  * Використовуйте атрибути ширини та висоти, щоб вказати розмір програвача
+  * Додайте будь-які інші параметри до URL-адреси (див. нижче)
+Приклад:
+<code html>
+<iframe width="420" height="315" src="https://www.youtube.com/embed/PTHhUE_P3YA"></iframe>
+</code>
 ===== Джерела =====
   * [[https://www.w3schools.com/html/html_media.asp|HTML Multimedia]]
+  * [[https://css.in.ua/html/tag/video|HTML Video]]
+  * [[https://www.w3schools.com/html/html5_audio.asp|HTML Audio]]
+  * [[https://www.w3schools.com/html/html_youtube.asp|HTML YouTube Videos]]