صدا، ویدئو و زیرنویس

پخش رسانه با کنترل‌های بومی

audio و video با controls کنترل پخش فراهم می‌کنند. چند source امکان انتخاب فرمت پشتیبانی‌شده را می‌دهد. متن یا لینک داخل عنصر، راه جایگزین است. فایل‌های نمونه را باید با فایل‌های واقعی پروژهٔ خودت جایگزین کنی.

<audio controls preload="metadata">
  <source src="media/intro.mp3" type="audio/mpeg">
  <a href="media/intro.mp3">دانلود معرفی صوتی</a>
</audio>
<video controls preload="metadata" poster="images/poster.jpg"
       width="640" height="360">
  <source src="media/intro.mp4" type="video/mp4">
  <track kind="captions" src="media/fa.vtt" srclang="fa"
         label="فارسی" default>
  <a href="media/intro.mp4">دانلود ویدئو</a>
</video>

poster تصویر پیش از پخش است. preload پیشنهاد بارگذاری به مرورگر است. captions گفتار و صداهای لازم را توصیف می‌کند؛ subtitles معمولاً ترجمهٔ گفتار است. فایل WebVTT با WEBVTT آغاز و زمان‌بندی متن‌ها را مشخص می‌کند. علاوه بر زیرنویس، متن پیاده‌شدهٔ محتوا را هم در دسترس بگذار.

پخش خودکارِ دارای صدا معمولاً محدود می‌شود و مزاحم کاربر است؛ برای درس‌ها روی controls و انتخاب کاربر تکیه کن. muted یک ویژگی بولی است؛ muted="false" هم حضور این ویژگی را اعلام می‌کند. همین قاعده دربارهٔ controls و autoplay هم برقرار است.

تمرین دستی: فایل صوتی خودت را در media قرار بده، controls را حذف و اضافه کن و تفاوت را ببین.