X

X

X

HTML এর সূচনা ( Introduction)


HTML বলতে কি বোঝায়??

HTML হচ্ছে ওয়েব পেজের মার্কআপ তৈরি করার একটি ভাষা। কোনো খাতায় বা বইয়ে কোনোকিছু নোট করে রাখার জন্য আমরা যে দাগ অঙ্কন করি, সেটাকে মার্কআপ করা বলে। ওয়েব পেজের ক্ষেত্রে পেজের কোনো অংশ কি কাজ করে সেটিকে যে ভাষায় মার্কআপ করা হয় সেটিই HTML ।

  • HTML এর পূর্ণরূপ Hyper Text Markup Language
  • HTML একটি ওয়েব পেজের গঠন (Structure) বর্ণনা করে। একারনে এটিকে ওয়েব পেজের কঙ্কালও বলা যায়।
  • HTML ইলামেন্টস সমূহ হলো ওয়েব পেজের গাঠনিক একক।
  • HTML ইলামেন্টস গুলোকে ট্যাগের মাধ্যমে প্রকাশ করা হয় বা লেখা হয়।
  • HTML এর বিভিন্ন ট্যাগ দ্বারা ওয়েব পেজের বিভিন্ন উপাদান যেমন প্যারাগ্রাফ, শিরোনাম (header) ইত্যাদি প্রকাশ করা হয়।
  • ওয়েব ব্রাউজার গুলো সরাসরি HTML ট্যাগকে প্রদর্শন করে না। বরং ট্যাগগুলো দ্বারা বর্ণিত কন্টেন্ট প্রদর্শণ করে।

HTML উদাহরণ

<!doctype html>

<html>
<head>
      <title>Web Page title</title>
 </head>
 <body>
      <h1>This is heading element</h1>
      <p>This is paragraph</p>
</body>
</html>

নিজে নিজে চেষ্টা করুন বাটনে ক্লিক করে দেখুন এটি কিভাবে কাজ করে।

উদাহরণের ব্যাখ্যা

  • <!DOCTYPE html> এর মাধ্যমে ব্রাউজারকে নির্দেশ করা হয় যে, ওয়েব পেজটি HTML5 এ লিখিত হয়েছে।
  • <html> ইলামেন্ট হচ্ছে একটি ওয়েব পেজের রুট ( শুরু) ।
  • <head> ইলামেন্ট একটি ওয়েব পেজের গুরুত্বপূর্ণ তথ্য ধারণ করে। এই অংশটি সাধারণত ওয়েব ব্রাউজারে দেখা যায় না।
  • <title> একটি ওয়েব পেজের শিরোনাম ধারণ করে। যেটি আমরা প্রতিটি পেজের ক্ষেত্রে ওয়েব ব্রাউজারের এড্রেস বারের উপরে দেখতে পাই।
  • <body> একটি ওয়েব পেজের দৃশ্যমান অংশ ধারণ করে।
  • <h1> দ্বারা একটি বড় মাপের শিরোনাম নির্দেশ করা হয়। অর্থ্যাৎ, এটি হচ্ছে সবচেয়ে বড় মাপের শিরোনাম।
  • <p> দ্বারা একটি প্যারাগ্রাফ (অনুচ্ছেদ) নির্দেশ করা হয়।

HTML Tags

HTML ট্যাগসমূহ দ্বারা বিভিন্ন ইলামেন্টের নাম নির্দেশ করা হয়। প্রতিটি ইলামেন্ট দুইটি ট্যাগ নিয়ে গঠিত। একটি শুরু এবং অপরটি শেষ নির্দেশ করে। ইংরেজিতে এদেরকে opening tag এবং closing tag বলে। নিচে নিয়মটি বর্ণনা করা হলো:

<tagname>এখানে কন্টেন্ট লিখতে হবে…</tagname>

  • HTML ট্যাগসমূহকে সাধারণত জোড়ায় জোড়ায় লিখা হয়। উদাহরণস্বরপ : <div> and </div>
  • এখানে প্রথম ট্যাগটিকে  start tag/opening tag, এবং দ্বিতীয় ট্যাগটিকে  end tag/closing tag বলে।
  • End tag কেও start ট্যাগ এর মতো লিখা হয় , কিন্তু ‘<‘ এর পরে এবং ট্যাগ নামের আগে একটি  forward slash (/) দেওয়া হয়।
     

Web Browsers

ওয়েব ব্রাউজার ওয়েব সার্ভার থেকে ওয়েবে পেজ সংগ্রহ করে এবং তাদেরকে কম্পিউটার বা মোবইলে প্রদর্শণ করে।
ওয়েব ব্রাউজার HTMl ট্যাগ প্রদর্শন করে না কিন্তু ঐ ট্যাগা দ্বারা বর্ণিত তথ্য প্রদর্শন করে।


HTML এর গঠন

নিচে একটি ওয়েব পেজেকে চিত্রাকারে প্রকাশ করা হলো:

<html>

<head>

<title>Page title</title>

</head>

<body>

<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

</body>

</html>

বি:দ্র: শুধুমাত্র <body> এর মধ্যবর্তী (উপরের সাদা অংশটি) অংশ ব্রাউজারে প্রদর্শিত হয়।


বি: দ্র: The <!DOCTYPE> এর অর্থ

<!DOCTYPE> ‌এর মাধ্যমে ওয়েব পেজের ধরণ (Type) বর্ণনা করা হয় এবং এটির মাধ্যমে একটি ওয়েব পেজকে সঠিকভাবে উপস্থাপন করা হয়। আবার এটি HTML এর সঠিক সংস্করণ (Version) বাছাই করতে সাহায্য করে। এটিকে সম্পূর্ণ পেজের সবার উপরে লিকে হয়। এটি ছোট কিংবা বড় হাতের অক্ষরে লিখা য।

HTML5 এর জন্য <!DOCTYPE> এর লিখিত রূপ নিম্নরূপ:

<!DOCTYPE html>

HTML ভার্শন

Version Year
HTML 1991
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 2000
HTML5 2014