HTMLBeginner

HTML Introduction

ওয়েব ডেভেলপমেন্ট যাত্রা শুরু করার জন্য HTML-এর সাথে পরিচিত হোন। কীভাবে ব্রাউজার HTML পড়ে এবং একটি ওয়েবপেজ তৈরি করে তা জানুন।

13টি অংশবাংলা ভাষায়

HTML হলো ওয়েবপেজ তৈরির মূল ভিত্তি। ইন্টারনেটে যতগুলো ওয়েবপেজ দেখতে পান, প্রতিটিই HTML দিয়ে লেখা। HTML সম্পর্কে ভালোভাবে জানা মানে ওয়েব ডেভেলপমেন্টের প্রথম ধাপ সফলভাবে পেরোনো।

এই অধ্যায়ে যা যা শিখবেন

HTML কী এবং কেন এটি প্রয়োজন
ব্রাউজার কীভাবে HTML রেন্ডার করে
প্রথম HTML ডকুমেন্ট তৈরি করা
HTML ডকুমেন্টের সাধারণ গঠন

ওয়েবপেজ কীভাবে কাজ করে

যখন আপনি একটি URL লিখে একটি ওয়েবপেজ খুলেন, তখন ব্রাউজার সেই পেজের HTML ফাইলটি সার্ভার থেকে ডাউনলোড করে। এরপর ব্রাউজার সেই HTML-কে parse করে — অর্থাৎ পড়ে — এবং স্ক্রিনে একটি সুন্দর পেজ হিসেবে রেন্ডার করে দেখায়।

HTML হলো সেই ভাষা যা একটি পেজের structure (গঠন) ঠিক করে — কোথায় শিরোনাম থাকবে, কোথায় প্যারাগ্রাফ, কোথায় ছবি, কোথায় লিংক। আর সৌন্দর্যের দায়িত্ব পরে CSS-এর, আর ইন্টারঅ্যাকশনের দায়িত্ব JavaScript-এর।

প্রথম HTML ডকুমেন্ট

চলুন অতি সহজ একটি HTML ডকুমেন্ট দেখি। এটি একটি নোটপ্যাড বা VS Code-এ লিখে index.html নামে সেভ করলেই ব্রাউজারে খুলে দেখা যাবে।

index.htmlhtml

html

<!DOCTYPE html>
<html lang="bn">
  <head>
    <meta charset="UTF-8" />
    <title>আমার প্রথম পেজ</title>
  </head>
  <body>
    <h1>হ্যালো বিশ্ব!</h1>
    <p>এটি আমার প্রথম HTML পেজ।</p>
  </body>
</html>

মজার তথ্য

<!DOCTYPE html> অংশটি ব্রাউজারকে বলে যে এটি একটি আধুনিক HTML5 ডকুমেন্ট। এটি ছাড়া ব্রাউজার পুরোনো (quirks) মোডে চলে, যা বিভিন্ন রেন্ডারিং সমস্যা তৈরি করতে পারে।

HTML ডকুমেন্টের গঠন

<!DOCTYPE html> — ডকুমেন্ট টাইপ ঘোষণা
<html> — পুরো ডকুমেন্টের মূল কনটেইনার
<head> — মেটা তথ্য, টাইটেল ও লিংক (দেখানো হয় না)
<body> — স্ক্রিনে যা দেখানো হয় তার সবকিছু

পরের অধ্যায়ে আমরা HTML-এর পূর্ণরূপ এবং এর কাজ আরও বিস্তারিতভাবে জানবো।

শেষ প্যারায় নিজে practice করুন — কোড কপি করে নিজের এডিটরে চালিয়ে দেখুন।