XHTML (Extensible Hypertext Markup Language) হল HTML এর একটি উন্নত সংস্করণ যা XML-এর নিয়ম অনুসরণ করে। XHTML ডকুমেন্ট তৈরি করার সময়, HTML ট্যাগস এবং স্ট্রাকচারগুলি কিছু নির্দিষ্ট নিয়মের অধীনে ব্যবহার করতে হয়, যা XML-এর কড়া গঠন অনুসরণ করে। এখানে আমরা XHTML ডকুমেন্টে ব্যবহৃত HTML ট্যাগস এবং স্ট্রাকচার সম্পর্কে বিস্তারিত আলোচনা করব।
১. XHTML ডকুমেন্টের মৌলিক স্ট্রাকচার
একটি XHTML ডকুমেন্টের গঠন HTML এর মতো হলেও, কিছু অতিরিক্ত নিয়ম এবং নির্দিষ্ট কাঠামো অনুসরণ করতে হয়। একটি মৌলিক XHTML ডকুমেন্টের গঠন এরকম হতে পারে:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8" />
<title>My XHTML Page</title>
</head>
<body>
<h1>Welcome to XHTML</h1>
<p>This is an example of a basic XHTML structure.</p>
</body>
</html>
২. XHTML-এ HTML ট্যাগস এবং স্ট্রাকচার
XHTML-এ HTML ট্যাগগুলি মূলত একইভাবে ব্যবহৃত হয়, তবে কিছু অতিরিক্ত নিয়ম অনুসরণ করতে হয়। নিচে কিছু প্রধান HTML ট্যাগ এবং তাদের ব্যবহার আলোচনা করা হলো:
২.1 <html> ট্যাগ
<html> ট্যাগ XHTML ডকুমেন্টের মূল ট্যাগ। এটি XML নামস্পেস (xmlns) নির্দেশ করে এবং ডকুমেন্টের সমগ্র কনটেন্টকে ঘিরে রাখে।
<html xmlns="http://www.w3.org/1999/xhtml">
- এটি XML কনফর্মেন্ট
- সব ট্যাগ ছোট হাতের অক্ষরে থাকতে হবে।
২.2 <head> ট্যাগ
<head> ট্যাগের মধ্যে মেটাডেটা থাকে, যেমন ডকুমেন্টের শিরোনাম (<title>), ক্যারেক্টার সেট, এবং মেটা ইনফরমেশন। XHTML-এ এটি অবশ্যই বন্ধনসহ ব্যবহার করতে হবে।
<head>
<meta charset="UTF-8" />
<title>My XHTML Page</title>
</head>
২.3 <title> ট্যাগ
<title> ট্যাগের মধ্যে ডকুমেন্টের শিরোনাম (যা ব্রাউজারের ট্যাবে দেখা যাবে) রাখুন।
<title>My XHTML Page</title>
২.4 <meta> ট্যাগ
<meta> ট্যাগ সাধারণত মেটাডেটা (যেমন চরিত্র এনকোডিং) ধারণ করে। XHTML-এ এটি বন্ধনসহ ব্যবহার করতে হয়।
<meta charset="UTF-8" />
২.5 <body> ট্যাগ
<body> ট্যাগের মধ্যে ওয়েব পেজের প্রধান কনটেন্ট থাকে। এটি HTML বা XHTML ডকুমেন্টের দৃশ্যমান অংশ।
<body>
<h1>Welcome to My XHTML Page</h1>
<p>This is an example of a basic XHTML structure.</p>
</body>
৩. XHTML ট্যাগস ব্যবহারের কড়া নিয়ম
৩.1 সব ট্যাগকে বন্ধ করা
XHTML-এ সব ট্যাগ অবশ্যই সঠিকভাবে বন্ধ করতে হবে। যেমন, <br> ট্যাগের ক্ষেত্রে, এটি <br /> হতে হবে।
সঠিক উদাহরণ:
<br />ভুল উদাহরণ:
<br>
৩.2 কেস সেনসিটিভিটি
XHTML-এ সব ট্যাগ এবং অ্যাট্রিবিউট নাম ছোট হাতের অক্ষরে থাকতে হবে। যেমন:
<html xmlns="http://www.w3.org/1999/xhtml">
৩.3 অ্যাট্রিবিউট মান কোটেশনে রাখতে হবে
XHTML-এ, প্রতিটি অ্যাট্রিবিউট মান কোটেশনে রাখতে হবে, যেমন:
<img src="image.jpg" alt="Sample Image" />
৩.4 একমাত্রিক ট্যাগগুলোর জন্য বন্ধন ব্যবহার
যেসব ট্যাগ একমাত্রিক (self-closing) হয়, সেগুলোর জন্য অবশ্যই বন্ধন ব্যবহার করতে হবে, যেমন:
সঠিক উদাহরণ:
<img src="image.jpg" alt="Image" /> <br />ভুল উদাহরণ:
<img src="image.jpg" alt="Image"> <br>
৪. XHTML-এ সাধারণ HTML ট্যাগগুলির ব্যবহার
নিচে কিছু সাধারণ HTML ট্যাগ এবং তাদের XHTML সংস্করণ আলোচনা করা হলো:
৪.1 <h1> থেকে <h6> (হেডিং ট্যাগ)
<h1> থেকে <h6> ট্যাগের মাধ্যমে শিরোনাম তৈরি করা হয়। XHTML-এ এগুলোর মধ্যে কোনো পার্থক্য নেই, তবে এগুলিকে অবশ্যই বন্ধ করতে হবে।
<h1>This is a Heading 1</h1>
<h2>This is a Heading 2</h2>
৪.2 <p> (প্যারাগ্রাফ)
<p> ট্যাগ প্যারাগ্রাফ তৈরি করতে ব্যবহৃত হয়। XHTML-এ এটি বন্ধনসহ ব্যবহার করতে হবে।
<p>This is a paragraph of text.</p>
৪.3 <a> (এনকর লিঙ্ক)
<a> ট্যাগ ওয়েব লিঙ্ক তৈরি করতে ব্যবহৃত হয়। এটি href অ্যাট্রিবিউটের মাধ্যমে লিঙ্কের URL নির্ধারণ করে।
<a href="https://www.example.com">Click here to visit example.com</a>
৪.4 <img> (ইমেজ)
<img> ট্যাগ ইমেজ প্রদর্শনের জন্য ব্যবহৃত হয়। XHTML-এ এই ট্যাগে বন্ধনসহ ব্যবহার করতে হয়।
<img src="image.jpg" alt="Sample Image" />
৪.5 <ul>, <ol>, <li> (তালিকা)
<ul>: অর্ডারবিহীন তালিকা (Unordered list)<ol>: অর্ডার করা তালিকা (Ordered list)<li>: তালিকার আইটেম
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
<ol>
<li>First item</li>
<li>Second item</li>
</ol>
XHTML একটি XML-ভিত্তিক মার্কআপ ভাষা, যা HTML এর মতোই ট্যাগ এবং স্ট্রাকচার ব্যবহার করে, তবে এর মধ্যে কিছু কঠোর নিয়ম এবং কনভেনশন অনুসরণ করতে হয়। সব ট্যাগকে বন্ধ করতে হবে, অ্যাট্রিবিউট মান কোটেশনে থাকতে হবে, এবং ট্যাগ নামগুলো ছোট হাতের অক্ষরে থাকতে হবে। XHTML ব্যবহার করলে ওয়েব পেজগুলির গঠন এবং কোডিং স্টাইল স্ট্যান্ডার্ড অনুযায়ী থাকে এবং ব্রাউজারের সাথে সর্বোত্তম সামঞ্জস্য প্রদান করে।