HTML में इमेजेस और मल्टीमीडिया सम्मिलित करना
HTML में केवल टेक्स्ट ही नहीं, बल्कि इमेजेस, ऑडियो, वीडियो, डॉक्यूमेंट्स और अन्य मल्टीमीडिया एलिमेंट्स को भी सम्मिलित किया जा सकता है। नीचे इन सभी टैग्स का विस्तृत विवरण, सिंटैक्स और उदाहरण दिए गए हैं।
1. <img>
टैग - इमेज सम्मिलित करना
<img>
टैग का प्रयोग वेबपेज में इमेज जोड़ने के लिए किया जाता है।
<img src="nature.jpg" alt="प्राकृतिक दृश्य" width="500" height="300" />
- src: इमेज का URL या फाइल लोकेशन
- alt: वैकल्पिक टेक्स्ट (SEO + Accessibility)
- width/height: पिक्सेल में आकार
2. <audio>
टैग - ऑडियो फाइल सम्मिलित करना
<audio>
टैग का प्रयोग किसी वेबपेज में म्यूजिक या आवाज़ शामिल करने के लिए होता है।
<audio controls>
<source src="audio.mp3" type="audio/mpeg">
आपका ब्राउज़र ऑडियो को सपोर्ट नहीं करता।
</audio>
controls ऐट्रिब्यूट प्ले-पॉज बटन दिखाता है।
3. <video>
टैग - वीडियो सम्मिलित करना
<video>
टैग का उपयोग HTML पेज में वीडियो जोड़ने के लिए किया जाता है।
<video width="600" height="340" controls>
<source src="movie.mp4" type="video/mp4">
आपका ब्राउज़र वीडियो को सपोर्ट नहीं करता।
</video>
4. <iframe>
टैग - अन्य पेज या YouTube वीडियो जोड़ना
<iframe>
टैग किसी अन्य वेबसाइट, मैप या YouTube वीडियो को एम्बेड करने के लिए प्रयोग होता है।
<iframe width="560" height="315" src="https://www.youtube.com/embed/xyz" frameborder="0" allowfullscreen></iframe>
5. <embed>
टैग - डॉक्यूमेंट, PDF या मीडिया फाइल जोड़ना
<embed>
टैग का उपयोग PDF, Flash या अन्य फॉर्मेट की फाइल्स एम्बेड करने में किया जाता है।
<embed src="file.pdf" width="600" height="500" type="application/pdf">
6. <object>
टैग - मल्टीपर्पज़ एम्बेडिंग
<object>
टैग का प्रयोग भी किसी बाहरी फाइल जैसे PDF, SWF आदि को एम्बेड करने के लिए किया जा सकता है।
<object data="file.pdf" type="application/pdf" width="600" height="500">
आपका ब्राउज़र इस ऑब्जेक्ट को नहीं दिखा सकता।
</object>
7. सुझाव और SEO टिप्स
- इमेज के लिए
alt
टैग SEO और Accessibility दोनों के लिए ज़रूरी है। - मीडिया फाइल्स को compress करके उपयोग करें ताकि पेज की स्पीड बनी रहे।
- YouTube जैसे वीडियो के लिए
<iframe>
सर्वोत्तम विकल्प है। - बड़े फाइल्स (जैसे PDF) के लिए
<embed>
या<object>
का प्रयोग करें।
निष्कर्ष
HTML में मल्टीमीडिया सम्मिलन वेबसाइट को अधिक इंटरएक्टिव और उपयोगकर्ता-अनुकूल बनाता है। सही टैग्स और SEO रणनीति का उपयोग करके हम कंटेंट की गुणवत्ता को और बेहतर बना सकते हैं।