HTML অডিও

এইচটিএমএল-তে আউডিও প্লে করার বিভিন্ন পদ্ধতি রয়েছে。

সমস্যা, সমস্যা, এবং সমাধান

এইচটিএমএল-তে আউডিও প্লে করা খুবই সহজ নয়!

আপনাকে বেশ কিছু কৌশল জানা উচিত, যাতে আপনার আউডিও ফাইলগুলি সকল ব্রাউজারে (ইন্টারনেট এক্সপ্লোরার, চ্রোম, ফায়ারফক্স, স্যাফারি, ওপেরা) এবং সকল হার্ডওয়্যারে (পিসি, ম্যাক, আইপ্যাড, আইফোন) প্লে করা যায়。

এই চাপ্তকে, CodeW3C.com আপনাকে সমস্যা এবং সমাধান সামগ্রী প্রস্তুত করেছে।

প্লাগইন ব্যবহার করুন

ব্রাউজার প্লাগইনটি একটি ছোট কম্পিউটার প্রোগ্রাম, যা ব্রাউজারের প্রমাণন ফাংশনগুলিকে সম্প্রসারিত করে

প্লাগইনগুলির বেশ কিছু ব্যবহার রয়েছে: সঙ্গীত পাল্লা, ম্যাপ দেখানো, ব্যাঙ্ক অ্যাকাউন্ট পরীক্ষা, ইনপুট কন্ট্রোল প্রভৃতি

<object> বা <embed> ট্যাগটি ব্যবহার করে এইচটিএমএল পৃষ্ঠায় প্লাগইন যোগ করা যায়

এই ট্যাগগুলি রিসোর্স (সাধারণত অএইচটিএমএল-বাইরের রিসোর্স) এর কন্টেনার নির্ধারণ করে, যা ইলেকট্রনিক ট্যাগ হলেও ব্রাউজারটি দ্বারা প্রদর্শিত হবে এবং বাইরের প্লাগইন দ্বারা প্রদর্শিত হবে。

<embed> ইলেকট্রনিক ট্যাগ ব্যবহার করুন

<embed> ট্যাগটি বহির্ভূত (অএইচটিএমএল-বাইরের) কনটেন্টের কন্টেনার নির্ধারণ করে, এটি এইচটিএমএল 5-এর একটি ইলেকট্রনিক ট্যাগ, যা HTML 4-তে অবলুপ্ত হয়, কিন্তু সকল ব্রাউজারতেই কাজ করে。

নিচের কোড স্প্লিন্টটি এইচটিএমএল পৃষ্ঠায় এমপি৩ ফাইলটির অন্তর্ভুক্তি করতে পারে:

ইনস্ট্যান্স

<embed height="100" width="100" src="song.mp3" />

স্বয়ং প্রয়াস করুন

প্রশ্ন:

  • <embed> ট্যাগ HTML 4-তে অবলুপ্ত হয়। পৃষ্ঠা HTML 4-তে পরীক্ষা পাশ করতে পারে না。
  • বিভিন্ন ব্রাউজারগুলির অডিও ফরম্যাটকে সমর্থন করে থাকে, তা ভিন্ন ভিন্ন হতে পারে。
  • যদি ব্রাউজারটি ফাইলের ফরম্যাটকে সমর্থন করে না, তবে প্লাগইন ছাড়াই অডিও পাল্লা দেওয়া যায় না。
  • যদি ব্যবহারকারীর কম্পিউটারে প্লাগইন ইনস্টল না হয়, তবে অডিও পাল্লা দেওয়া যায় না。
  • যদি এই ফাইলটিকে অন্য ফরম্যাটে রূপান্তরিত করা হয়, তবেও সকল ব্রাউজারতেই পাল্লা দেওয়া যায় না。

মন্তব্য:প্রমাণপত্র: <!DOCTYPE html> (HTML5) প্রমাণপত্র সমস্যা সমাধান করুন。

<object> ইলেকট্রনিক ট্যাগ ব্যবহার করুন

<object tag> ট্যাগটি বহির্ভূত (অএইচটিএমএল-বাইরের) কনটেন্টের কন্টেনার নির্ধারণ করতেও পারে。

নিচের কোড স্প্লিন্টটি এইচটিএমএল পৃষ্ঠায় এমপি৩ ফাইলটির অন্তর্ভুক্তি করতে পারে:

ইনস্ট্যান্স

<object height="100" width="100" data="song.mp3"></object>

স্বয়ং প্রয়াস করুন

প্রশ্ন:

  • বিভিন্ন ব্রাউজারগুলির অডিও ফরম্যাটকে সমর্থন করে থাকে, তা ভিন্ন ভিন্ন হতে পারে。
  • যদি ব্রাউজারটি ফাইলের ফরম্যাটকে সমর্থন করে না, তবে প্লাগইন ছাড়াই অডিও পাল্লা দেওয়া যায় না。
  • যদি ব্যবহারকারীর কম্পিউটারে প্লাগইন ইনস্টল না হয়, তবে অডিও পাল্লা দেওয়া যায় না。
  • যদি এই ফাইলটিকে অন্য ফরম্যাটে রূপান্তরিত করা হয়, তবেও সকল ব্রাউজারতেই পাল্লা দেওয়া যায় না。

এইচটিএমএল 5 <audio> ইলেকট্রনিক ট্যাগ ব্যবহার করুন

<audio> ইলেকট্রনিক এইচটিএমএল 5-এর একটি ইলেকট্রনিক ট্যাগ, যা HTML 4-তে অবলুপ্ত হয়, কিন্তু সকল ব্রাউজারতেই কাজ করে。

ইনস্ট্যান্স

<audio controls="controls">
  <source src="song.mp3" type="audio/mp3" />
  <source src="song.ogg" type="audio/ogg" />
আপনার ব্রাউজারটি এই অডিও ফরম্যাটকে সমর্থন করে না。
</audio>

স্বয়ং প্রয়াস করুন

উপরোক্ত উদাহরণটিতে mp3 ফাইল ব্যবহার করা হয়েছে, তাই ইন্টারনেট এক্সপ্লোরার, চ্রোম এবং স্যাফারিতে এটি কাজ করে。

ফায়ারফক্স এবং ওপেরা-তেও এই অডিওকে কাজ করার জন্য, ogg ফরম্যাটের ফাইল যোগ করা হয়েছে। যদি ব্যর্থ হয়, তবে ত্রুটি সংবাদ দেখানো হবে。

প্রশ্ন:

  • <audio> ট্যাগ HTML 4-তে অবলুপ্ত হয়। আপনার পৃষ্ঠা HTML 4-তে পরীক্ষা পাশ করতে পারে না。
  • আপনি অডিও ফাইলটিকে ভিন্ন ফরম্যাটে রূপান্তরিত করতে হবে。
  • <audio> ইলেকট্রনিক ব্রাউজারগুলিতে কাজ করে না。

মন্তব্য:প্রমাণপত্র: <!DOCTYPE html> (HTML5) প্রমাণপত্র সমস্যা সমাধান করুন。

শ্রেষ্ঠ এইচটিএমএল সমাধান

ইনস্ট্যান্স

<audio controls="controls" height="100" width="100">
  <source src="song.mp3" type="audio/mp3" />
  <source src="song.ogg" type="audio/ogg" />
<embed height="100" width="100" src="song.mp3" />
</audio>

স্বয়ং প্রয়াস করুন

উপরোক্ত উদাহরণটিতে দুইটি ভিন্ন আউডিও ফরম্যাট ব্যবহৃত হয়েছে। HTML5 <audio> এলিমেন্টটি mp3 এবং ogg-এ আউডিও প্লে করার চেষ্টা করবে। যদি এটা ব্যর্থ হয়, তবে কোডটি <embed> এলিমেন্টটির জন্য একটি রিটার্ন চেষ্টা করবে。

প্রশ্ন:

  • আপনাকে আউডিওকে আরও একটি ফরম্যাটে রূপান্তরিত করতে হবে。
  • <audio> এলিমেন্টটি HTML 4 এবং XHTML প্রমাণপত্র করতে পারে না。
  • <embed> এলিমেন্টটি HTML 4 এবং XHTML প্রমাণপত্র করতে পারে না。
  • <embed> এলিমেন্টটি ত্রুটি সংবাদ দেখানোর জন্য একটি রিটার্ন করতে পারে না。

মন্তব্য:প্রমাণপত্র: <!DOCTYPE html> (HTML5) প্রমাণপত্র সমস্যা সমাধান করুন。

ওয়েবসাইটে আউডিও যোগ করার সবচেয়ে সহজ পদ্ধতি

ওয়েবপেজে আউডিও যোগ করার সবচেয়ে সহজ পদ্ধতি কি?

যাহুর মিডিয়া প্লেয়ার তাদের মধ্যে একটি হয়ে রয়েছে。

যাহু মিডিয়া প্লেয়ার ব্যবহার একটি ভিন্ন পথ। আপনি শুধুমাত্র যাহুকে গান প্লে করার কাজ করাতে হবে。

এটি mp3 এবং একটি সিরিজ অন্যান্য ফরম্যাট প্লে করতে পারে। একটি সহজ কোডস্ট্রিংকে মাত্র একটি লাইনে, আপনি একটি হাউজপেজকে পেশাদারী প্লেয়ার তৈরি করতে পারেন。

যাহু মিডিয়া প্লেয়ার

ইনস্ট্যান্স

<a href="song.mp3">Play Sound</a>
<script type="text/javascript" src="http://mediaplayer.yahoo.com/js">
</script>

স্বয়ং প্রয়াস করুন

যাহু প্লেয়ার ব্যবহার করা মুফত। এটা ব্যবহার করার জন্য, আপনাকে এই জাভাস্ক্রিপ্টটিকে ওয়েবপেজের পায়ে জোড়তে হবে:

<script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script>

তারপর আপনাকে শুধুমাত্র এমপি৩ ফাইলের লিঙ্কটিকে আপনার HTML-এ জোড়তে হবে, এবং জাভাস্ক্রিপ্ট স্বয়ংক্রিয়ভাবে প্রত্যেক গানের জন্য প্লে বাটন তৈরি করবে:

<a href="song1.mp3">Play Song 1</a>
<a href="song2.mp3">Play Song 2</a>
...
...
...

যাহু মিডিয়া প্লেয়ার আপনার ব্যবহারকারীদের জন্য একটি ছোট প্লে বাটন প্রদান করে, না যেমন একটি পূর্ণাঙ্গ প্লেয়ার। কিন্তু, যখন আপনি এই বাটনটি ক্লিক করেন, একটি পূর্ণাঙ্গ প্লেয়ার উঠে আসে。

প্রত্যক্ষদৃষ্টিতে, এই প্লেয়ারটি একইসঙ্গে ফ্রেম ভিতরের নিচে টানা থাকে।শুধুমাত্র ক্লিক করলেই, তা ফ্রেম থেকে বেরিয়ে আসবে।

লিঙ্ক ব্যবহার

যদি ওয়েবপেজে মিডিয়া ফাইলের লিঙ্ক থাকে, তখন অধিকাংশ ব্রাউজার "সহযোগী অ্যাপ্লিকেশন" ব্যবহার করে ফাইলটি প্লে করবে

এই কোড শ্রেণীটি mp3 ফাইলের লিঙ্কটি দেখায়।যদি ব্যবহারকারী এই লিঙ্কটি ক্লিক করে, তখন ব্রাউজার এই ফাইলটি পাল্টা করে "সহযোগী অ্যাপ্লিকেশন" ব্যবহার করে ফাইলটি প্লে করবে:

ইনস্ট্যান্স

<a href="song.mp3">Play the sound</a>

স্বয়ং প্রয়াস করুন

ইনলাইন শব্দ

যখন আপনি ওয়েবপেজে শব্দ অন্তর্ভুক্ত করেন বা তা ওয়েবপেজের অংশ হয়, তখন তা ইনলাইন সাউন্ড হিসাবে পরিগণিত হয়

যদি আপনি ইনলাইন সাউন্ডকে ওয়েব অ্যাপ্লিকেশনে ব্যবহার করতে চান, তখন আপনি উপলব্ধি করুন যে, অনেক লোকই ইনলাইন সাউন্ডকে ত্রুটি মনে করে।এছাড়াও, ব্যবহারকারীদের মধ্যে কিছু লোক ব্রাউজারের ইনলাইন সাউন্ড বিকল্পটি বন্ধ করে রেখেছেন

আমাদের সর্বশ্রেষ্ঠ পরামর্শ হল, যখনই ব্যবহারকারী ইনলাইন সাউন্ড শুনতে চায়, তখনই তাদের সাথে সংযুক্ত করুন।একটি ইতিবাচক উদাহরণ হল, যখন ব্যবহারকারী রেকর্ডিং শুনতে চায় এবং কোনও লিঙ্কে ক্লিক করে, তখন পাতা খুলে এবং রেকর্ডিং শুরু করে

HTML 4.01 মাল্টিমিডিয়া ট্যাগ

ট্যাগ বর্ণনা
<applet> অনুমোদিত নয়।এম্বেডেড applet নির্দিষ্ট করে
<embed> HTML4-এ অনুমোদিত নয়, HTML5-এ অনুমোদিত
<object> এম্বেডেড ওবজেক্ট নির্দিষ্ট করে
<param> ওবজেক্টের পারামিটার নির্দিষ্ট করে

HTML 5 মাল্টিমিডিয়া ট্যাগ

ট্যাগ বর্ণনা
<audio> ট্যাগটি শব্দ, যেমন সংগীত বা অন্যান্য আউডিও স্ট্রিম
<embed> ট্যাগটি এমন সামগ্রীকে অন্তর্ভুক্ত করে, যেমন প্লাগইন