Welcome to Creationbangla-24 . কেমন আছেন বন্ধুরা? আশা করি মহান আল্লাহ্ তা'য়ালার অশেষ রহমতে ভালো আছেন। আপনারা অবশ্যই Title দেখে বুঝতে পেরেছেন এই পেজে কী বিষয় নিয়ে আলোচনা করতে যাচ্ছি। তো আপনাদের জানিয়ে রাখি এটি একটি শিক্ষা বিষয়ক সাইট। এই site এ আমি নির্দিষ্ট কিছু বিষয় নিয়ে ধারাবাহিক ভাবে লিখব। আপনাদের একটি কথা না বললেই নয় যে, এই Page টি ভালোভাবে বুঝার জন্য এবং Page টি থেকে উপকৃত হওয়ার জন্য সম্পূর্ণ Page টি মনযোগ সহকারে পড়বেন। এখন এই পেজটিতে আপনাদের সাথে আলোচনা করতে যাচ্ছি "Audio Tag" সম্পর্কে এবং আপনাদের সাথে আছি আমি Md.Aiub তো চলুন বন্ধুরা শুরু করা যাক।
আপনি যদি <audio> ও </audio> এর মাঝে কোনো কিছু লিখেন তবে সেটি ওয়েব পেজে প্রদর্শন করবে না, বরং <audio> ট্যাগকে অকার্যকর করে তুলবে। সুতরাং <audio> ও </audio> এর মাঝে কোনো কিছু লিখবেন না। বর্তমানে অডিও সাপোর্টের জন্য তিনটি file formats রয়েছে, সেগুলো হলো: MP3, WAV, OGG.
Multipurpose Internet Mail Extensions(MIME) type audio formats গুলো হলো: MP3 এর জন্য audio/mpeg, OGG এর জন্য audio/ogg, WAV এর জন্য audio/wav.
তাছাড়াও <audio> ট্যাগে Global Attribute, Event Attribute সহ autoplay, controls, loop, muted, preload, src Attribute গুলো সাপোর্ট করে।
<audio> Tag এর গঠনরীতি
<audio> Tag এর গঠনরীতি হলো <audio attribute="value"> </audio> অর্থাৎ <audio> ট্যাগের অভ্যন্তরে attribute ব্যবহার করতে হবে। তারপর = চিহ্ন দিয়ে " " Double Quotation এর মাঝে Attribute এর Value টি বসিয়ে দিতে হবে। <audio> ও </audio> ট্যাগের মাঝে আপনি চাইলে <source> ব্যবহার করতে পারেন, কিন্তু কোনো টেক্স ব্যবহার করতে পারবেন না। যদি করেন তবে <audio> support করবে না এবং টেক্সও ওয়েবপেজে প্রদর্শন করবে না।
<audio> Tag এর গঠনরীতি হলো <audio attribute="value"> </audio> অর্থাৎ <audio> ট্যাগের অভ্যন্তরে attribute ব্যবহার করতে হবে। তারপর = চিহ্ন দিয়ে " " Double Quotation এর মাঝে Attribute এর Value টি বসিয়ে দিতে হবে। <audio> ও </audio> ট্যাগের মাঝে আপনি চাইলে <source> ব্যবহার করতে পারেন, কিন্তু কোনো টেক্স ব্যবহার করতে পারবেন না। যদি করেন তবে <audio> support করবে না এবং টেক্সও ওয়েবপেজে প্রদর্শন করবে না।
নিম্নে ওয়েবপেজে Audio Content ব্যবহার করার জন্য কোডিং করে দেখানো হলো। আপনি চাইলে কোড পরিবর্তন করে এখানেই অনুশীলন করতে পারেন এবং Run Code Button এ ক্লিক করে উক্ত কোডের Output দেখতে পারেন । আবার আপনি চাইলে Copy Code Button এ ক্লিক করে কোডগুলো কপি করতে পারেন এবং তা আপনার প্রয়োজনে ব্যাবহার করতে পারেন।
উপরিউক্ত Tag বিশ্লেষণ ও কাজের বর্ণনা :
- <!doctype html> এটাকে আসলে সম্পূর্ণ কোন Tag বলা হয় না। <!doctype html> ট্যাগ ব্যবহার করা হয় <html> ট্যাগ এর পূর্বে। যা ওয়েব ব্রাউজার কে html এর ভার্সন বলে দেয়। যাতে ওয়েব ব্রাউজার ওয়েব কন্টেন্ট গুলোর সাথে ভালো ভাবে কাজ করতে পারে। আর <!doctype html> ট্যাগ এর প্রধান কাজ হচ্ছে ওয়েব ব্রাউজার কে বলে দেওয়া যে, ওয়েব পেজটির Document type. HTML5 Standard.
- <html> ট্যাগ দ্বারা ওয়েব ব্রাউজারকে নির্দেশ করা হয়েছে যে, এই ওয়েব পেজটি HTML ভাষায় তৈরী।
- <head> ট্যাগ ওয়েবপেজ সম্পর্কিত তথ্য ধারণ করে। এখানে ওয়েব পেজের শিরোনাম রাখা হয়েছে <head> ট্যাগ এর মাঝে। তাছাড়াও <head> ট্যাগ এর মাঝেই আপনাকে Style sheet, Script, meta ট্যাগ ব্যবহার করতে হবে।
- <title> ট্যাগ ওয়েবপেজের শিরোনাম ধারণ করে। <title> ট্যাগ এর মাধ্যমে ওয়েবপেজের শিরোনাম শুরু করা হয়েছে এবং সম্পূর্ণ শিরোনামটি এই ট্যাগ এর মধ্যেই রাখতে হবে।
- </title> ট্যাগ এর মাধ্যমে ওয়েবপেজের শিরোনাম শেষ করা হয়েছে। অর্থাৎ <title> ট্যাগ বন্ধ করা হয়েছে। এই ট্যাগ এর বাইরে কিছু লিখলে সেটা ওয়েব পেজের শিরোনাম বলে গণ্য হবে না।
- </head> ট্যাগ এর মাধ্যমে <head> বন্ধ করা হয়েছে।
- <body> ট্যাগ ওয়েবপজের মূল উপাদান ধারণ করে। আপনি ওয়েবপেজে যা প্রদর্শন করাতে চান সেই সম্পর্কিত সকল ট্যাগ <body> ট্যাগ এর মধ্যে রাখতে হবে।
- <audio> Tag ট্যাগের মাধ্যমে ওয়েবপেজে অডিও কনন্টেট ব্যবহার করা হয়েছে।
- Controls Attribute এর কাজ হলো Audio/Video Controller প্রদর্শন করা। যেমন: play/pause Button etc.
- src Attribute মিডিয়া ফাইলের URL নির্দেশ করে। আপনি আপনার ইচ্ছা অনুযায়ী URL ব্যবহার করবেন।
- type Attribute এর কাজ হলো ডেটার ধরণ নির্ধারণ করা। এখানে ডেটার ধরণ হিসাবে audio/mpeg ব্যবহার করা হয়েছে।
- <source> ট্যাগের মাধ্যমে Media Element এ একাধিক Media resource করার জন্য ব্যবহার করা হয়েছে।
- </audio> Tag এর মাধ্যমে <audio> ট্যাগ বন্ধ করা হয়েছে।
- </body> Tag এর মাধ্যমে <body> ট্যাগ বন্ধ করা হয়েছে।
- </html> Tag Tag এর মাধ্যমে <html> ট্যাগ বন্ধ করা হয়েছে। অর্থাৎ Html ভাষায় তৈরিকৃত ওয়েজপেজটি শেষ করা হয়েছে। এই ট্যাগ এর বাইরে কিছু লিখলে তা Html ভাষায় তৈরিকৃত ওয়েজপেজটির কোনো Document বলে বিবেচিত হবে না।
ًপ্রিয় পাঠক বন্ধুরা,
আপনারা যদি এই পেজটি পড়ে উপকৃত হন তাহলে আমার পরিশ্রম স্বার্থক হবে। উপকৃত হয়ে থাকলে এই পেজটি আপনার বন্ধুদের মাঝে শেয়ার করতে ভুলবেন না। আপনার মতামত প্রকাশ করতে চাইলে কমেন্ট বক্সে কমেন্ট করতে পারেন। এতোক্ষণ ধর্য্যসহকারে Page টি পড়ার জন্য এবং আপনার মূল্যবান সময় আমাদের সাথে ব্যয় করার জন্য ধন্যবাদ। এর পরের Page এ আপনাদের সাথে "Bold Style Text" নিয়ে আলোচনা করবো, সেই সময় পর্যন্ত আমদের সাথে থাকার আমন্ত্রণ রইল। আপনাদের সকলে সুস্বাস্থ্য ও দীর্ঘায়ু কামনা করে আজকের মতো শেষ করছি,
আল্লাহ হফেজ...
আপনারা যদি এই পেজটি পড়ে উপকৃত হন তাহলে আমার পরিশ্রম স্বার্থক হবে। উপকৃত হয়ে থাকলে এই পেজটি আপনার বন্ধুদের মাঝে শেয়ার করতে ভুলবেন না। আপনার মতামত প্রকাশ করতে চাইলে কমেন্ট বক্সে কমেন্ট করতে পারেন। এতোক্ষণ ধর্য্যসহকারে Page টি পড়ার জন্য এবং আপনার মূল্যবান সময় আমাদের সাথে ব্যয় করার জন্য ধন্যবাদ। এর পরের Page এ আপনাদের সাথে "Bold Style Text" নিয়ে আলোচনা করবো, সেই সময় পর্যন্ত আমদের সাথে থাকার আমন্ত্রণ রইল। আপনাদের সকলে সুস্বাস্থ্য ও দীর্ঘায়ু কামনা করে আজকের মতো শেষ করছি,
আল্লাহ হফেজ...
Post a Comment