আজকে আমরা এইচটিএমএল এর বেসিক গঠন সম্পর্কে জানবো। এইচটিএমএল একটি নির্দিষ্ট কাঠামো মেনে চলে। তাই আমি মনে করি এইচটিএমএল (HTML) শিখার পূর্বে এর বেসিক কাঠামো সম্পর্কে জানা প্রয়োজন।
নিচে এইচটিএমএল এর সাধারণ একটি কাঠামো দেওয়া হলঃ
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body><h1>My First Heading</h1>
<p>My first paragraph.</p></body>
</html>
উপরের ডেমোটি লক্ষ করুন।
সকল এইচটিএমএল পেজ অবশ্যই <!DOCTYPE html> দিয়ে শুরু হবে। এটি মুলত আপনার ডকুমেন্ট কি টাইপের তা নির্দেশ করে।
<head> ও </head> এবং ট্যাগের মাঝের কোড গুলো এইচটিএমএল ডকুমেন্টের জন্য আনুষঙ্গিক প্রয়োজনীয় তথ্য যেমন, স্টাইল সিট , জাভাস্ক্রিপ্ট, মেটাডাটা ইত্যাদি সংযুক্ত করে।
<title> ও </title> এর মধ্যে যা লিখবেন ওয়েব ব্রাউজারে প্রদর্শিত হয়। শুধু তাই নয় বিভিন্ন সার্চ ইঞ্জিনেও সার্চ রেজাল্টেও তা প্রদর্শিত হয়।
এইচটিএমএল ডকুমেন্ট <html> দিয়ে শুরু হয় এবং </html> দিয়ে শেষ হয়।
এইচটিএমএল এর যে অংশটি আপনার ব্রাউজারে প্রদর্শিত হয় তা হল <body> ও </body> এর মধ্যে থাকা অংশটি। এখানে বলে রাখা ভালো <body> এর বাইরে যত কোড থেকে তা কখনই ব্রাউজারে প্রদর্শিত হয় না। অর্থাৎ আমরা যেসকল এইচটিএমএল ট্যাগ ব্যবহার করি তা সবগুলোই <body> এর মধ্যে রাখতে হবে।
- প্রতিটি এইচটিএমএল ট্যাগ জোড়ায় জোড়ায় থাকে। এবং শুরুতে ও শেষে angle bracket দিয়ে আবৃত থাকে।যেমনঃ <p>…….</p>, <h2>……<h2>
- জোড়ার প্রথম ট্যাগটি opening ট্যাগ এবং দ্বিতীয় ট্যাগটি closing ট্যাগ নামে পরিচিত।
- closing ট্যাগটি opening ট্যাগের মতই লেখা হয়, তবে ক্লোজিং ট্যাগের ক্ষেত্রে ট্যাগের নামের আগে শুধুমাত্র একটি ফরওয়ার্ড স্ল্যাশ(/) দেয়া হয়, যেমন </h1>, </h2> ইত্যাদি।
আশা করছি আপনরা এইচটিএমএল এর বেসিক গঠন সম্পর্কে কিছুটা হলেও ধারণা পেয়েছেন। পরবর্তী টিউটোরিয়ালে আমরা এইচটিএমএল ট্যাগের ব্যাবহার শিখবো।
