Beginner LevelHTML & Semantic Web
How do you embed media in HTML5 using <audio> and <video> elements?
❓ Interview Prompt: Explain <video> and <audio> tags, controls attribute, fallback <source> formats, and poster images.
HTML5 introduced native '<video>' and '<audio>' elements, eliminating legacy third-party plugins (like Flash).
Key Attributes:
•
'controls': Displays native play/pause/volume browser playback controls.
•
'<source src="..." type="...">': Provides fallback media formats (MP4, WebM, Ogg) for cross-browser compatibility.
•
'poster="thumb.jpg"': Displays a preview thumbnail image before video playback begins.
Code Implementation Example
html
<video controls width="640" height="360" poster="thumbnail.jpg">
<source src="video.webm" type="video/webm">
<source src="video.mp4" type="video/mp4">
Your browser does not support HTML5 video.
</video>💡Embedding responsive HTML5 video with fallback sources and poster image.
🎯 Interview Key Takeaway
Provide multiple <source> media formats inside <video> and <audio> tags with controls enabled for accessibility.
#video#audio#Media#HTML5#Beginner
Back to all HTML & Semantic Web Questions→