You can add audio and video to your HTML website using the <audio>
and <video>
tags, respectively. These tags allow you to embed media files directly into your webpage.
Adding Audio:
- Create an
<audio>
tag: This tag acts as a container for your audio file. - Specify the
src
attribute: This attribute points to the location of your audio file, which can be a local file or a URL. - Add controls: The
controls
attribute adds default playback controls to your audio player.
<audio controls>
<source src="audio.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Adding Video:
- Create a
<video>
tag: This tag functions similarly to the<audio>
tag, housing your video file. - Specify the
src
attribute: This attribute directs to the location of your video file, which can be a local file or a URL. - Add controls: The
controls
attribute adds default playback controls to your video player. - Include
<source>
tags: Use<source>
tags to provide alternative video formats, ensuring compatibility across various browsers.
<video controls>
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
Your browser does not support the video element.
</video>
Additional Tips:
- Use appropriate file formats: Ensure your audio and video files are in widely supported formats like MP3, MP4, or WebM.
- Optimize file sizes: Compress your media files to reduce loading times and improve user experience.
- Consider accessibility: Provide alternative text descriptions for videos using the
track
element for users with visual impairments.