वीडियो एम्बेड करें HTML:एक चरण-दर-चरण मार्गदर्शिका

आप इन कार्यों का उपयोग करके एक HTML दस्तावेज़ में एक वीडियो एम्बेड कर सकते हैं: <video> , <object> , और <embed> . प्रत्येक अलग तरह से काम करता है, और प्रत्येक . का उपयोग करता है src वांछित वीडियो के URL को इंगित करने के लिए विशेषता।

जब आप एक वेब पेज बना रहे हों, तो आप यह तय कर सकते हैं कि आप दस्तावेज़ में एक वीडियो एम्बेड करना चाहते हैं। उदाहरण के लिए, आप एक ट्यूटोरियल लिख रहे होंगे कि कैसे केक बेक किया जाए और रेसिपी के साथ एक वीडियो भी शामिल किया जाए।

HTML दस्तावेज़ में वीडियो एम्बेड करने के कुछ तरीके हैं। इस गाइड में, हम आपको इन HTML . का उपयोग करके वीडियो एम्बेड करने के तीन तरीके बताएंगे कार्य:<video> . का उपयोग करना , <object> . का उपयोग करके , और <embed> . का उपयोग करके ।

वीडियो टैग

HTML5 वेब पेजों में वीडियो एम्बेड करने के लिए एक उपयोगी तत्व शामिल है:<video> . हालांकि यह तत्व सभी आधुनिक वेब ब्राउज़र में काम नहीं करता है—यह अभी भी कुछ नया है—टैग अधिकांश ब्राउज़रों में काम करेगा।

वीडियो तत्व में दो पैरामीटर होते हैं:आपके वीडियो का स्रोत और वे नियंत्रण जिनका आप उपयोग करना चाहते हैं। एम्बेड वीडियो HTML . के लिए सिंटैक्स यहां दिया गया है <video> टैग:

<video controls="controls" src="videos/ourVideo.mp4">
	This browser does not support the video element.
</video>

उपरोक्त उदाहरण में, हम src . का उपयोग करते हैं videos/ourVideo.mp4 . पर वीडियो को संदर्भित करने के लिए विशेषता . हम ब्राउज़र को controls . का उपयोग करके उसके साथ आने वाले नियंत्रणों के डिफ़ॉल्ट सेट का उपयोग करने के लिए भी कहते हैं गुण। हमारे <video> . में टेक्स्ट अगर वीडियो वेब पेज पर रेंडर नहीं हो पाता तो टैग दिखाई देगा।

यदि हम वैकल्पिक स्रोतों को शामिल करना चाहते हैं, तो हम निम्नलिखित कोड का उपयोग कर सकते हैं:

<video controls="controls">
	<source src="videos/ourVideo.mp4" type="video/mp4">
	<source src="videos/ourSecondVideo.mp3" type="video/mp3">
	This browser does not support the video element.
</video>

अब हमने अपने स्रोत तत्व का उपयोग करके अपने वेबपेज पर एक वीडियो डाला है। ऊपर, हमने एक mp4 और एक mp3 संसाधन का संदर्भ दिया है, लेकिन आप <video> में किसी भी मानक वीडियो प्रारूप का उपयोग कर सकते हैं टैग।

81% प्रतिभागियों ने कहा कि बूटकैंप में भाग लेने के बाद उन्हें अपनी तकनीकी नौकरी की संभावनाओं के बारे में अधिक आत्मविश्वास महसूस हुआ। आज ही एक बूटकैंप से मिलान करें।

बूटकैंप शुरू करने से लेकर अपनी पहली नौकरी खोजने तक, औसत बूटकैंप ग्रेड ने करियर संक्रमण में छह महीने से भी कम समय बिताया।

टैग एम्बेड करें

इसके अतिरिक्त, आप <embed> . का उपयोग कर सकते हैं वीडियो और अन्य मल्टीमीडिया को एक HTML . में एम्बेड करने के लिए तत्व वेब पृष्ठ। यहां <embed> . का एक उदाहरण दिया गया है किसी वेब पेज पर Adobe Flash वीडियो को संदर्भित करने के लिए टैग का उपयोग किया जा रहा है:

<embed src="videos/ourVideo.swf" width="600px" height="400px">

यह कोड वेबपेज पर एक फ्लैश वीडियो प्रस्तुत करता है। हमने width . का भी इस्तेमाल किया और height हमारे वीडियो प्लेयर के आकार को निर्दिष्ट करने के लिए पैरामीटर। इस मामले में, हमारा वीडियो प्लेयर 600×400 आकार में रेंडर करेगा।

हालाँकि, यदि आप किसी फ़्लैश संसाधन का संदर्भ दे रहे हैं, तो हो सकता है कि आपका वीडियो न चले। ऐसा इसलिए है क्योंकि उपयोगकर्ताओं के पास अपने सिस्टम पर फ्लैश स्थापित और सक्रिय होना चाहिए, और कई उपयोगकर्ता नहीं करते हैं।

ऑब्जेक्ट टैग

हम एक <object> . का भी उपयोग कर सकते हैं विभिन्न प्रकार के मीडिया को एक HTML . में एम्बेड करने के लिए टैग वेब पृष्ठ। उदाहरण के लिए, आप HTML5 embed को एम्बेड करने के लिए इस टैग का उपयोग कर सकते हैं आपके वेब पेज में वीडियो, ऑडियो, फ्लैश संसाधन, या पीडीएफ फाइलें। यहां <object> का एक उदाहरण दिया गया है किसी वेब पेज पर वीडियो एम्बेड करने के लिए उपयोग किया जा रहा तत्व:

<object src="videos/ourVideo.mp4" width="600px" height="400px"></object>

फिर से, उपयोगकर्ताओं के पास <object> . के लिए फ़्लैश स्थापित और सक्रिय होना चाहिए काम करने के लिए टैग। भले ही आप अभी भी <object> . का उपयोग करना चाहें , <video> . का उपयोग करने पर विचार करें तत्व या दोनों उन उपयोगकर्ताओं के लिए जिनके पास फ़्लैश स्थापित नहीं है।

निष्कर्ष

HTML इसमें तीन तत्व शामिल हैं जो आपको वीडियो फ़ाइलों को एक वेब पेज में एम्बेड करने की अनुमति देते हैं:<video> , <object> , और <embed> . इसलिए, यदि आप किसी वेबपेज पर वीडियो जोड़ना चाहते हैं, तो आपको इन टैग्स का उपयोग करना चाहिए। आज, हमने इन टैगों के उपयोग और ब्राउज़र और फ्लैश के साथ उनकी संगतता पर चर्चा की।

अब आप किसी भी वेब पेज पर वीडियो एम्बेड करने के लिए आवश्यक ज्ञान से लैस हैं!