ওয়েব ডেভলপমেন্টের পথচলা - HTML Basics - 01

 HTML কি?

Hyper Text Markup Language হলো একটি ওয়েব এপ্লিকেশনের কঙ্কাল। আপনি আজকে যে ওয়েব এপ্লিকেশনটা দেখছেন তার ঠিক পিছে আছে একগুচ্ছ HTML কোড। তাহলে কি শুধু HTML দিয়েই ওয়েব সাইট তৈরী করা সম্ভব। আমার উত্তর হবে না। এটা শুধুমাত্র কাঠামো তৈরীতে কাজে লাগবে এবং ওয়েব ডেভলপমেন্টের কাজ শিখতে আপনাকে অবশ্যই অবশ্যই HTML শিখতে হবে শুরুতে।

আপনার প্রশ্ন হতে পারে তাহলে কিভাবে HTML শিখব?

1.     প্রথম ধাপঃ HTML ফাইল তৈরী।

ক।        প্রথমত নোটপ্যাড/ ভিজুয়াল স্টুডিও কোড/ সাবলাইমটেক্সট / এটম / যেকোন এডিটর ডাউনলোড করে                    ইনেস্টল করি।

খ।        সেখানে নিউ ফাইল ওপেন করি ফাইলটি .html এক্সটেনশন ব্যাবহার করে সেভ করি।

গ।        ফাইলটি .html এক্সটেশন দিয়ে সেভ করলেই দেখবেন এটি আপনার ডিফল্ট ব্রাউজারে ওপেন করতে                        পারছেন। এবং আপনার ডিফল্ট ব্রাউজারে আপনি একটি ফাঁকা ওয়েব সাইট দেখতে পাচ্ছেন।

2.     দ্বিতীয় ধাপঃ HTML এর কাঠামোঃ

একটি HTML ফাইল শুরু করতে গেলেই দেখবেন শুরুতে লেখা <!DOCTYPE html>

এর মানে কি? স্বাভাবিক ভাবেই আপনার মনে এই প্রশ্ন জাগতে পারে । এটা মূলত একটি ঘোষণা এটি একটি HTML 5 ডকুমেন্ট যা কম্পিউটার/ ডিভাইসকে বুঝতে সাহায্য করে এটি ব্রাউজারে রান হবার একটি ফাইল।

এর পরে <html> লেখা থাকে যা একটি ট্যাগ যার মাধ্যমে কম্পিউটারকে বোঝানো হয়  তুমি এর ভেতরে যা পাবে তাই তুমি তোমার ব্যাবহারকারীকে দেখাবে ব্রাউজারে।যার এন্ডিং ট্যাগ বা শেষ বোঝাতে </html> ট্যাগ ব্যাবহার করা হয়।

<head> ট্যাগটি এর পরেই দেখবেন। যার এন্ডিং ট্যাগ </head> যার কাজ হলো এই ওয়েব পেজে থাকা বিভিন্ন তথ্য আপনার সামনে উপস্থাপিত হবে বা সংযুক্তি সমূহ যুক্ত হবে। সংযুক্তি সমূহ হতে পারে এই ওয়েব পেজটি দেখতে কেমন হবে বা এর আচরণ কেমন হবে ইত্যাদি ইত্যাদি।

<head> ট্যাগের ভেতরে থাকবে <title> ট্যাগ যার কাজ মূলত এই ওয়েব সাইটের এই পেজের নাম কি সেটা দেখানো।<title> ট্যাগের এন্ডিং ট্যাগ </title>

<head> ট্যাগ শেষে আরেকটি ট্যাগ থাকে যার নাম <body> যা মূলত মূল কাজে ব্যাবহৃত হয়। তার আগে একটি ছোট্ট জিনিষ জেনে রাখা ভালো এইচটিএমএল এর ক্ষুদ্রতম এলিমেন্টের নাম হলো কম্পোনেন্ট। একাধিক কম্পোনেন্টের সমন্বয়ে একটি এইচটিএমএল এর বডি তৈরী হয়।যেমন ধরেন একটা হেডিং লিখতে <h1></h1> ট্যাগ ব্যাবহার হয়।

বডি ট্যাগ এর এন্ডিং বা শেষ বোঝাতে </body> ট্যাগ ব্যাবহার করা হয়।

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Joy's blog</title>
</head>
<body>
    <h1>Hello!!</h1>
</body>
</html>

চিত্রেঃ একটি HTML কোড





Reference: W3Schools

মন্তব্যসমূহ