এইচটিএমএল

এইচটিএমএল
(হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ)
	সর্বশেষ সংস্করণ এইচটিএমএল ৫ এর অফিশিয়াল লোগো
ফাইলনাম এক্সটেনশন	.html; .htm;
ইন্টারনেট মাধ্যমের ধরন	text/html
টাইপ কোড	টেক্সট
নির্মাণে	WHATWG, ওয়ার্ল্ড ওয়াইড ওয়েব কনসোর্টিয়াম
প্রাথমিক মুক্তি	১৯৯৩; ৩১ বছর আগে
সর্বশেষ প্রকাশ	Living Standard; (২০২১)
বিন্যাসের ধরন	ডকুমেন্ট ফাইল ফরমেট
যার ধারক	এইচটিএমএল উপাদান
যার অন্তর্ভুক্ত	ওয়েব ব্রাউজার
প্রসারিত হয়েছে	এসজিএমএল
সম্প্রসারিত	এক্সএইচটিএমএল
মুক্ত বিন্যাস?	হ্যাঁ
ওয়েবসাইট	html.spec.whatwg.org

এই নিবন্ধটি অসম্পূর্ণ। আপনি চাইলে এটিকে সম্প্রসারিত করে উইকিপিডিয়াকে সাহায্য করতে পারেন।

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

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

এইচটিএমএল উপাদানগুলো হলো এইচটিএমএল পেজ তৈরির মৌলিক কাঠামো। এইচটিএমএলের নির্দেশনায় বিভিন্ন উপাদান যেমন ছবি ও অন্যান্য ওয়েব ফরম প্রক্রিয়াকৃত পেজে এমবেডেড অবস্থায় থাকে। নিয়মানুসারে কাঠামোবদ্ধ ওয়েবপেজ গঠন করার ক্ষেত্রে এইচটিএমএল বিভিন্ন শাব্দিক ট্যাগ তৈরি করে দেয় যেমন, headings, paragraphs, lists, links, quotes, এবং অন্যান্য উপাদান। এইচটিএমএলের উপাদানগুলোকে ট্যাগ বলা হয়, যে ট্যাগগুলো আবার কোণ বন্ধনীদ্বারা যুক্ত থাকে। <img> এবং <input> ট্যাগগুলো সরাসরি ওয়েবপেজে বিষয়বস্তু প্রকাশ করে। অন্যান্য ট্যাগ যেমন <p> এবং </p> তথ্য অনুচ্ছেদের দুপাশে থাকে এবং সাব-এলিমেন্ট ট্যাগ অন্তর্ভুক্ত করে থাকে। ব্রাউজার এইচটিএমএল ট্যাগ প্রকাশ করেনা কিন্ত এইচটিএমএল ট্যাগকে ব্যবহার করে ওয়েবপেজে তথ্য প্রকাশ করে থাকে।

বিভিন্ন স্ক্রিপ্টিং ভাষা যেমন জাভাস্ক্রিপ্টে এইচটিএমএল যুক্ত হয়ে থাকতে পারে এবং সেটা ওয়েব পেজের আচরণ এবং বিষয়বস্তুর উপর প্রভাব ফেলে। পাশাপাশি সিএসএস যুক্ত হয়ে এইচটিএমএল এর সৌন্দর্য ও গঠনশৈলীর পরিবর্তন নিয়ে আসে।

ইতিহাস

১৯৮০ সালে ব্রিটিশ কম্পিউটার বিজ্ঞানী টিম বার্নার্স-লি, যিনি সার্ন এ একজন ঠিকাদার ছিলেন, সর্বপ্রথম সার্ন গবেষকদের মাঝে দস্তাবেজ শেয়ার করার জন্য ENQUIRE prototyped নামে একটি ‍System এর প্রস্তাব দেন। ১৯৮৯ সালে, বার্নার্স-লি একটি ইন্টারনেট ভিত্তিক হাইপারটেক্সট সিস্টেম প্রস্তাবে একটি মেমো লিখেন। ১৯৯০ সালে বার্নার্স-লি ব্রাউজার এবং সার্ভারের সফ্টওয়্যারে এইচটিএমএল (HTML) এর উল্লেখ করেন ।এ বছরেই, বার্নার্স-লি এবং সার্ন এর তথ্য সিস্টেম ইঞ্জিনিয়ার Robert Cailliau যৌথভাবে সার্নকে এ প্রকল্পের জন্য অর্থায়নে অনুরোধ করেন, কিন্তু প্রকল্পটি আনুষ্ঠানিকভাবে সার্ন দ্বারা গৃহীত হয়নি।

এইচটিএমএল ট্যাগ গুলো Element name আর angle bracket (<>) দিয়ে তৈরি । প্রতিটি ভাষা লেখার জন্য নির্দিষ্ট নিয়ম থাকে। এই নিয়ম বা ধরনকেই syntax বলে। এইচটিএমএল ট্যাগগুলো লেখার জন্যও নির্দিষ্ট সিন্ট্যাক্স আছে। এভাবে না লিখলে ব্রাউজার ট্যাগ অনুযায়ী কন্টেন্ট দেখাতে সমর্থ্য হবে না।

HTML tag এর syntax হলো-

<tagname>content goes here...</tagname>

বিভিন্ন কোড

হেডিং

এইচটিএমএল হেডিং <h1> থেকে <h6> ট্যাগসমূহ দ্বারা লেখা হয়।^[২] h1 হচ্ছে সবচেয়ে বড় হেডিং এবং ক্রমান্বয়ে h6 সবচেয়ে ছোট। বিভিন্ন ধরনের বড় ছোট হেডিং নিম্নরূপে লেখা হয়।

<h1>বড় হেডিং</h1>
<h6>ছোট হেডিং</h6>

অনুচ্ছেদ ট্যাগ

কোন অনুচ্ছেদ লেখার জন্যে আরম্ভ ট্যাগ হিসেবে <p> এবং সমাপ্তি ট্যাগ হিসেবে </p> ব্যবহার করতে হয়। উদাহরণঃ

<p>আপনার কাঙ্ক্ষিত অনুচ্ছেদ</p>

এইচটিএমএল টেবিল

এইচটিএমএল এ টেবিল তৈরী করার জন্য নিম্নের কোড ব্যবহার করা হয়। টেবিল তৈরীতে চার ধরনের Tag ব্যবহার করা হয়।

<tr> ট্যাগ ব্যবহার করা হয় Table Row লেখার জন্য ।
<th> ট্যাগ ব্যবহার করা হয় Table Header লেখার জন্য ।
<td> ট্যাগ ব্যবহার করা হয় table Data লেখার জন্য ।

<!DOCTYPE html>
<html lang="bn">
<head>
    <title>দেশ সম্পর্কিত টেবিল</title>
</head>
<body>
    
    <table border="1" cellpadding="10" cellspacing="0">
        <tr>
            <th>দেশের নাম</th>
            <th>রাজধানী</th>
            <th>জনসংখ্যা</th>
            <th>মুদ্রা</th>
        </tr>
        <tr>
            <td>বাংলাদেশ</td>
            <td>ঢাকা</td>
            <td>১৬৬.৩০ মিলিয়ন</td>
            <td>বাংলাদেশি টাকা (BDT)</td>
        </tr>
        <tr>
            <td>ভারত</td>
            <td>নতুন দিল্লি</td>
            <td>১.৪২ বিলিয়ন</td>
            <td>ভারতীয় রুপি (INR)</td>
        </tr>
        <tr>
            <td>পাকিস্তান</td>
            <td>ইসলামাবাদ</td>
            <td>২৩১.৪০ মিলিয়ন</td>
            <td>পাকিস্তানি রুপি (PKR)</td>
        </tr>
        <tr>
            <td>শ্রীলঙ্কা</td>
            <td>কলম্বো</td>
            <td>২১.৫৯ মিলিয়ন</td>
            <td>শ্রীলঙ্কান রুপি (LKR)</td>
        </tr>
    </table>
</body>
</html>

এই কোড টি ঠিক এরকম হবে


দেশের নাম	রাজধানী	জনসংখ্যা	মুদ্রা
বাংলাদেশ	ঢাকা	১৬৬.৩০ মিলিয়ন	বাংলাদেশী টাকা(BDT)
ভারত	নতুন দিল্লী	১.৪২ বিলিয়ন	ভারতীয় রুপি(INR)
পাকিস্তান	ইসলামাবাদ	২৩১.৪০ মিলিয়ন	পাকিস্তানি রুপি(PKR)
শ্রীলঙ্কা	কলম্বো	২১.৫৯ মিলিয়ন	শ্রীলঙ্কান রুপি (LKR)

<table border="1">
<tr>
<th>দেশের নাম</th>
<th>স্বাধীনতার বছর</th>
</tr>
<tr>
<td>বাংলাদেশ</td>
<td>১৯৭১</td>
</tr>
</table>

উপরের কোডটির আউটপুট হিসেবে নিচের টা আসবে।

দেশের নাম	স্বাধীনতার বছর
বাংলাদেশ	১৯৭১

এগুলো ছাড়া আরো অনেক ট্যাগ ব্যবহৃত হয়। যেমন <li>...</li> <ul>...</ul> <ol>...</ol> <img src="imagelink">...</img>

আরো দেখুন

তথ্যসূত্র

বহিঃসংযোগ

[1] "W3C Html"।

[2] w3schools

[১]

[২]