آموزش صوت(Audio) در HTML

از عنصر <audio> برای پخش صدا در یک صفحه ی وب استفاده می شود.

استفاده از عنصر <audio> در HTML

برای پخش یک فایل صوتی(audio) در HTML، می توانیم از عنصر <audio> استفاده کنیم:

 <audio controls>
  <source src="https://sina2.ir/images/videos/horse.ogg" type="audio/ogg">
  <source src="/horse.mp3" type="audio/mpeg">
مرورگر شما از تگ صدا پشتیبانی نمی کند
</audio> 

توضیح کدهای بالا:
خصوصیت controls باعث می شود کنترل های صوتی، مثل play و pause و volume به صوت اضافه شوند. عنصر <source> به ما امکان می دهد تا یک فایل جایگزین صوتی مشخص کنیم تا مرورگر در مواقع لزوم از آنها استفاده کند. مرورگر از اولین فرمت شناسایی شده استفاده خواهد کرد. متن بین تگ های <audio> و </audio> تنها وقتی در مرورگر ظاهر می شود که مرورگر از عنصر <audio> پشتیبانی نکند.

خصوصیت autoplay در audio در HTML

برای اینکه یک فایل صوتی(audio) به طور اتوماتیک پخش شود، می توانیم از خصوصیت autoplay استفاده کنیم:

<audio controls autoplay>
  <source src="https://sina2.ir/images/videos/horse.ogg" type="audio/ogg">
  <source src="/horse.mp3" type="audio/mpeg">
مرورگر شما از عنصر صدا پشتیبانی نمی کند
</audio> 

نکته: مرورگرهای کرومیوم(Chromium) ، در اکثر موارد اجازه ی استفاده از autoplay را نمی دهند. اما همواره اجازه می دهند تا از autopaly به صورت بی صدا(muted) استفاده شود.

از کلمه ی muted پس از autopaly استفاده کنید تا فایل صدای شما به صورت اتوماتیک (اما بی صدا) پخش شود:

<audio controls autoplay muted>
  <source src="https://sina2.ir/images/videos/horse.ogg" type="audio/ogg">
  <source src="/horse.mp3" type="audio/mpeg">
مرورگر شما از تگ صدا پشتیبانی نمی کند
</audio> 

پشتیبانی مرورگرها

اعداد درون جدول زیر، اولین ورژن مرورگری را مشخص می کنند که از عنصر <audio> پشتیبانی می کند:

					عنصر
4.0	9.0	3.5	10.5	4.0	<audio>

فرمت های صوتی(Audio) در HTML

سه فرمت صوتی وجود دارند: MP3 و WAV و OGG. پشتیبانی مرورگرها برای فرمت های مختلف عبارت است از:

انواع مدیای audio در HTML

متدهای و پروپرتی ها(Properties) و رویدادهای audio در HTML

بخش DOM در HTML، متدها، پروپرتی ها و رویدادهایی را برای عنصر <audio> تعریف می کند. این به ما امکان می دهد تا، صوت ها را paly و pause و load کنیم و مدت زمان(duration) و شدت صدا(volume) را مشخص کنیم. همچنین در DOM، رویدادهایی وجود دارد که ئقتی یک صوت paly یا pause یا ... می شود، ما را آگاه می سازد.