এইচটিএমএল ইউটিউব - HTML5 Youtube


YouTube হল আমেরিকা ভিত্তিক বর্তমানে সব থেকে জনপ্রিয় ভিডিও শেয়ারিং সাইট। YouTube এর মূলকার্যালয় San Bruno, California অবস্থিত। PayPal এর ৩ জন প্রাক্তন কর্মচারী Chad Hurley Steve Chen এবং Jawed Karim ফেব্রুয়ারী, ২০০৫ সালে YouTube প্রতিষ্ঠা করে। নভেম্বর, ২০০৬ সালে US$1.65 বিলিয়ন এর বিনিময়ে গুগল, ইউটিউব কিনে নেয়। ইউটিউব, বর্তমানে গুগল এর একটি সহযোগী প্রতিষ্ঠান হিসেবে চালানো হচ্ছে।

কোন এইচটিএমএলে পেজে কোন ভিডিও চালু করার জন্য সবচেয়ে সহজ পদ্ধতি হলো ইউটিউব ব্যবহার করা।


ভিডিও ফরম্যাট নিয়ে ঝামেলা?

এই টিউটোরিয়ালের প্রথম দিকে আপনি ভিডিওটিকে বিভিন্ন ফরম্যাটে রুপান্তর করেছেন। এ ক্ষেত্রে ভিডিও টি সকল ব্রাউজারে সমর্থন করানো বেশ জটিল। কোন ভিডিও বিভিন্ন ফরম্যাটে রুপান্তর করা কঠিন এবং সময় সাপেক্ষ কাজ। এক্ষেত্রে, ওয়েব পেজে ইউটিউব থেকে সরাসরি ভিডিও চালু করা হতে পারে একটি ভাল সমাধান।


ইউটিউব ভিডিও আইডি

যখন ইউটিউবে ভিডিও চালু করা বা সংরক্ষন করা হয়, তখন ইউটিউব একটি আইডি যেমন - awEbss49QWa, ইউটিউবের লিংকের পরে প্রদর্শন করে। এই আইডি ব্যবহার করে ওয়েব পেজের এইচটিএমএল কোডে ভিডিওটি লিংক করে দেয়া যায়।


এইচটিএমএল পেজে ইউটিউব ভিডিও চালানো

ওয়েব পেজে ইউটিউব ভিডিও চালানোর জন্য, নিচের কাজগুলো করতে হবে -

উদাহরণ

<iframe width="420" height="315" 
src="https://www.youtube.com/embed/tgbNymZ7vqY">
</iframe>


কোড এডিটর



ইউটিউব অটোপ্লে

একজন ব্যবহারকারী যখন ওয়েব পেজ ভিজিট করবে তখন ভিডিও স্বয়ংক্রিভাবে চালু করার জন্য শুধুমাত্র ইউটিউব এর URL এ একটি প্যারামিটার যুক্ত করা হয়।
Autoplay এট্রিবিউটের মানগুলো নিম্নরূপ -

উদাহরণ

<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?autoplay=1">
 </iframe>


কোড এডিটর


নোট - কোন ওয়েব সাইটে স্বয়ংক্রিয়ভাবে ভিডিও চালু করার ব্যাপারে সতর্ক থাকা প্রয়োজন, কারণ স্বয়ংক্রিয়ভাবে একটি ভিডিও শুরু হলে অনেক সময় ওয়েব পেজের ভিজিটর বিরক্ত হতে পারে।


ইউটিউব - প্লে-লিস্ট

মূল URL ছাড়াও একটি কমা দ্বারা পৃথক ভিডিও তালিকা তৈরি করা যায়।


ইউটিউব - লুপ

একই পদ্ধতিতে ইউটিউবের প্লে-লিস্ট এম্বেড করা যায়। কোন একটি ভিডিও কতবার চলবে তা নির্ধারণ করার জন্য loop এট্রিবিউট ব্যবহার করা যায়।
loop এট্রিবিউটের মানগুলো হল নিম্নরূপ -

উদাহরণ

<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY?playlist=tgbNymZ7vqY&loop=1">
>/iframe>


কোড এডিটর



ইউটিউব - কন্ট্রোল প্যানেল

ভিডিও নিয়ন্ত্রন বা cotrol করতে এটি ব্যবহৃত হয় এবং এই প্যানেলটিকে নিয়ন্ত্রন করতে controls এট্রিবিউট ব্যবহার করা হয়।
controls এট্রিবিউটের মানগুলো হল নিম্নরূপ -

উদাহরণ

<iframe width="420" height="315"
  src="https://www.youtube.com/embed/tgbNymZ7vqY?controls=0">
  </iframe>


কোড এডিটর



<object> অথবা <embed> ট্যাগের ব্যবহার

ইউটিউব জানুয়ারী, ২০১৫ থেকে <object> এবং <embed> ট্যাগের ব্যবহার ডেপ্রিসিয়েটেড বা deprecated ঘোষনা করেছে। তাই এই দুইটি ট্যাগের পরিবর্তে <iframe> ব্যবহার করা ভাল।

<object> ট্যাগ ব্যবহার করে নিচে একটি উদাহরণ দেখুন।

উদাহরণ - <object> ব্যবহার

<object width="420" height="315"
data="https://www.youtube.com/embed/tgbNymZ7vqY">
</object>

<embed> ট্যাগ ব্যবহার করে নিচে একটি উদাহরণ দেখুন।

উদাহরণ - <embed> ব্যবহার

<embed width="420" height="315" src="https://www.youtube.com/embed/tgbNymZ7vqY">

কোড এডিটর