HTML Introduction

May 28, 2017    HTML Tags Blog Post

HTML Introcuction

HTML এর কথা উঠলেই আমাদের ওয়েব সাইট এর কথাই সবার আগে মনে পড়ে । কারন ওয়েব পেজ এর বেসিক ভিজুয়াল কম্পোনেন্টস গুলোর মূল ভিত্তি হল HTML . HTML এর পুরো ফর্ম হল (Hyper Text Markup Language) . পুরো নাম শুনেই বুঝতে পারা যায় যে HTML হল এক ধরনের Markup Language । মার্ক আপ ল্যাগুয়েজ গুলো স্টার্টিং ট্যাগ <> দিয়ে শুরু হয় এবং এন্ডিং ট্যাগ </> দিয়ে শেষ হয় । অনেকে HTML কে প্রোগ্রামিং লাঙ্গুয়েজ বলে ভুল করে থাকে । অনেক ধরনের মার্ক আপ ল্যাঙ্গুয়েজ আছে । যেমনঃ XML, YML , GML, SGML । XML কিন্তু এন্ড্রয়েড ও জাভা সফট এর টেক্সট ও গ্রাফিকাল রিপ্রেসেন্টেশন এ ব্যবহার করা হয় । তাহলে বুজতে পারাই যায় যে মার্ক আপ ল্যাঙ্গুয়েজ গুলো টেক্সট ও গ্রাফিকাল ইউজার ইন্টারফেস কম্পোনেন্টস গুলো কে রিপ্রেসেন্ট করার জন্য ব্যবহার করা হয়ে থাকে ।

প্রোগ্রামিং ল্যাঙ্গুয়েজ এর জন্য কম্পাইলার দরকার পড়ে কারন একটি ল্যাঙ্গুয়েজ এর কী ওয়ার্ড, আইডেন্টিফায়ার, টোকেন, ফাংশন, গানিতিক অপারেশন, প্রিসিশন, ব্রাঞ্চিং সহ ল্যাঙ্গুয়েজ যাবতীয় অপারেশন কম্পাইলার এই বলে দেয়া থাকে । ঠিক তেমনি HTML দেখার জন্য ব্রাউজার এর প্রয়োজন পড়ে । কারন ব্রাউজার এর Rendering Engine এ HTML এর যাবতীয় কম্পোনেন্টস কে দেখায় ।

ব্রাউজার এ কোন ওয়েব সাইট এর এড্রেস টাইপ করলে সেই সাইট কন্টেন্টসমূহ (HTML) সার্ভার থেকে ব্রাউজার এর Rendering Engine নিয়ে আসে এবং সেই HTML কে HTML Parser পার্স করে একটি DOM (Document Object Modle) Tree বানায় ।

যেমনঃ

<html>
  <body>
    <p>
      Hello World
    </p>
    <div> <img src="mektek.png"/></div>
  </body>
</html>

এই HTML কে নিম্নের DOM Tree তে কনভার্ট করবে ব্রাউজার এর রেন্ডারিং ইঞ্জিন ।



Image of domtree

এখন এই DOM ট্রি থেকে পাওয়া অব্জেক্ট মডেল গুলোর প্রোপার্টি কয়েক ধাপে ব্রাউজার এ পেইন্ট হয় । নিচে ফ্লো দেখানো হল ঃ



Image of dom

এভাবেই মূলত HTML এর কম্পোনেন্টস কে ব্রাউজার এ প্রকাশ করা হয় ।

Introduction এ HTML কি এবং কিভাবে কাজ করে তা নিয়ে সংক্ষেপে বলা হল। এত কিছু না জেনেও HTML শুরু করা যায় কিন্তু একজন সিএসই এর ছাত্র হিসেবে HTML কিভাবে কাজ করে তা জানা উচিত । HTML Parser পার্স করে যে পার্স ট্রি বানায় তা পার্সিং এলগরিদম ব্যবহার করে । ফোর্থ সেমিষ্টার এর ফিনিট অটোমাটা কোর্স এ পার্স ট্রি সম্পর্কে বিস্তারিত জানতে পারবে ।


blog comments powered by Disqus
Fork me on GitHub