এইচটিএমএল এর বেসিক স্ট্রাকচার [Html Structure]

এর আগে আমি অনেক বক বক করেছি।  তাই আর বক বক করতে চাই না। এখন আমি আপনাদেরকে একটি ওয়েভপেজ কিভাবে গঠিত হয় তা দেখাব। তো শুরু করি তাহলে….

<!DOCTYPE html>

<html>

<head>

<title>Page Title</title>

</head>

<body>

<h1>My First Heading</h1>

<p>My First Paragraph</p>

</body>

</html>

Page Title

My First Heading

My first paragraph.

আমি প্রথমেই কিছু কোড লিখে নিয়েছি। অনেকেই ভাবতে পারেন আমি কি লিখলাম এই গুলা। হ্যাঁ এতক্ষন লিখছি এখন আপনাদের সামনে এই ট্যাগ গুলো ব্যাখ্যা করব।

১. আপনারা লক্ষ্য করলে দেখবেন আমি প্রথম লাইনের প্রথমেই লিখেছি <!DOCTYPE html>। অর্থ্যাত এর মাধ্যমে ব্রাউজারকে বলে দেওয়া হচ্ছে আমার এই ওয়েবপেজ এইচটিএমএল ৫ (html5) দিয়ে তৈরি করা হয়েছে এবং এখানকার সমস্ত ট্যাগই এইচটিএমএল ৫ এর ষ্ট্যাণ্ডার্ড মেইনটেইন করে ব্যবহার করা হয়েছে।

২. এরপর দ্বিতীয় লাইনে <html> লিখেছি এবং তা সবার শেষে  </html>  দিয়ে শেষ হয়েছে। 

*এইচটিএমএলের সকল ট্যাগ <> দিয়ে শুরু হয়ে </> দিয়ে শেষ হয়। আপনারা ভাবতে পারেন এত ট্যাগ কিভাবে মুখস্ত করব। তাহলে আমি বলব এত ট্যাগ মুখস্ত করার দরকার নেই। আপনারা শুধু এই লিংক থেকেই ট্যাগ গুলোর লিস্ট দেখতে পারবেন এবং কোন ট্যাগ দিয়ে কি কাজ করা হয় তা সহজেই জানতে পারবেন।*

৩. এরপরেই আছে হেডিং পার্ট অর্থাৎ যেখানে ওয়েবসাইটের আইডেন্টিটি থেকে থাকে। এখানেই টাইটেলের ভিতর ওয়েবসাইটের পরিচিতি মূলক একটি বাক্য বা শব্দ থাকে যা খুবই গুরুত্ববহন করে থাকে। এখানে মেটা ট্যাগও যুক্ত করা হয়। আমরা মেটা ট্যাগ নিয়ে পরবর্তীতে আলোচনা করব।

৪. এরপরে আসা যাক বডি (<body></body>) অংশে। এই বডি অংশটাই সাধারণত একটি ওয়েবসাইটের মূল কন্টেন্ট বহন করে থাকে। অর্থ্যাত আমরা ওয়েবপেজে যে সমস্ত লেখা,ছবি,ভিডিও দেখি সবই বডি পার্টে থাকে। 

৫. এরপরে ট্যাগের মাধ্যমে কোড লিখা শেষ হয়েছে।

*আমি এখানে যতটুকু সম্ভব ওয়েবসাইটের স্ট্রাকচার তুলে ধরার চেষ্টা করেছি। এর পরেও যদি আপনাদের বুঝতে কোন রকম সমস্যা হয় তাহলে আমাকে মেসেজ করতে পারেন

Advertisements

আপনার মতামত জানান

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s