12. Multimedia Integrations (Video & Audio)

1. The Fall of Plugins & Rise of <video>

Basic: HTML5 se pehle video dikhane ke liye Adobe Flash jaisi third-party plugins chahiyen thi jo system slow aur hack hone ka khatra rakhti thi.

Pro: Native <video> element Browser Engine par heavily optimized hai GPU acceleration ke sath. Iske professional level attributes:

• controls: OS level media player UI dikhata hai. Custom UI banana hai (jaise Netflix) toh ise disable karke JS se video.play() trigger kiya jata hai.
• muted & autoplay: UX policies ki wajah se modern browsers (Chrome/Safari) autoplay block kar dete hain agar sound enabled ho. Autoplay loop lagane ke liye muted autoplay playsinline teeno attribute lagana standard practice hai (mostly background hero videos ke liye).
• poster="preview.jpg": Image placeholder jo video parsing se pehle first paint par dikhta hai.

2. Media Formatting Strategy (<source>)

Pro: Alag browsers specific codecs support karte hain. Apple Safari aur Chrome mein compatibility conflicts aa sakte hain. Best practice hai multiple files define karna, browser top se bottom parse karega aur first supported codec chala dega:

<video controls>
  <source src="movie.webm" type="video/webm"> <!-- Google's high compression format -->
  <source src="movie.mp4" type="video/mp4"> <!-- Universal Fallback -->
  Your browser sucks.
</video>

3. The <audio> Element

Pro: Audio implementation bilkul video jaisa hai. Game developers background scores trigger karne ke liye background mein in elements ko hidden (bina controls ke) load karte hain aur JS Audio API pipes ke through game states ke mutabiq sound play karte hain.

4. WebVTT - Semantic Video Subtitles

Pro: A11Y and SEO point of view se video box ke andar ek black box hai. Google video content ko scan nahi kar pata tha. <track> tag se .vtt (Web Video Text Tracks) files associate ki jati hain.
<track kind="subtitles" srclang="en" src="eng.vtt" label="English" default>
Yeh features native caption styling allow karte hain aur search engine transcription padh kar video indexing (video SEO) improve karta hai.