HTML Essentials

Урок 07 · 10 хв

Медіа й вбудовування

Відео, звук, картинка під екран, чужа сторінка в iframe.

Файл сам себе не покаже. Потрібен елемент із джерелом і запасним текстом на випадок, якщо браузер не вміє формат. Автозапуск зі звуком майже завжди погана ідея: людина не просила.

Відео з керуванням

controls малює кнопки браузера. Кілька source — браузер візьме перший, який уміє. Текст усередині video видно, лише якщо жодне джерело не підійшло. Так само влаштований audio.

Картинка під щільність екрана
AI

Можна спитати про це правило«У picture завжди потрібен img»

Чужа сторінка

iframe вбудовує інший документ. Без title скринрідер оголосить «фрейм» і замовкне. Не клади туди власний сайт без потреби: це окремий документ зі своїми скриптами. Карти й відео з чужих хостів — нормальний випадок, віджет «про всяк випадок» — ні.

  • controls — дай людині паузу й гучність.
  • autoplay без muted на відео часто блокується браузером.
  • Важкий ролик не став вище першого екрана без запиту: спершу текст.
  • Якщо медіа недоступне, усередині тега має лишитися посилання або коротке пояснення.
AI

Можна спитати про цей пункт«Суть уроку»

Перевірка

Закріпи, поки не пішов далі

  1. 1. Що робить атрибут controls у video?

  2. 2. Чи обов'язковий img усередині picture?

  3. 3. Навіщо title в iframe?

  4. 4. Куди подіти запасне посилання, якщо відео не відкрилося?