চতুর্থ অধ্যায় পাঠ-৫ঃ HTML এর সুবিধা এবং অসুবিধা সমূহ, HTML ট্যাগ, HTML এলিমেন্ট, HTML অ্যাট্রিবিউট।

এই পাঠ শেষে যা যা শিখতে পারবে-

• ১। HTML বর্ননা করতে পারবে।
• ২। HTML ব্যবহারের সুবিধা ও অসুবিধা বর্ননা করতে পারবে।
• ৩। HTML ট্যাগ ও এর প্রকারভেদ ব্যাখ্যা করতে পারবে।
• ৪। HTML এলিমেন্ট ও অ্যাট্রিবিউট ব্যাখ্যা করতে পারবে।
• ৫। একটি ওয়েবপেইজ তৈরির জন্য HTML এর মৌলিক কোড লিখতে পারবে।
• ৬। ওয়েবপেইজ তৈরির প্রয়োজনীয় টুলস বর্ননা করতে পারবে।

HTML এর মৌলিক বিষয় সমূহঃ HTML হল  Hyper Text Markup Language। এটি মুলত ওয়েবপেইজ তৈরির জন্য ব্যবহৃত মার্কআপ ল্যাংগুয়েজ। HTML দ্বারা তৈরি ফাইলসমুহের এক্সটেনশন .html অথবা .htm হয় যা সাধারণত ওয়েবপেইজ নামে পরিচিত। HTML কে মার্কআপ ল্যাংগুয়েজ বলা হয় । কারণ HTML কতকগুলো মার্কআপ ট্যাগের সমষ্টি । আর এই মার্কআপ ট্যাগের কাজ হল ওয়েবপেইজে বিভিন্ন তথ্য কিভাবে প্রদর্শন করবে তা নির্দেশ করা। জেনেভার সার্ন এ কাজ করার সময় টিম বার্নাস-লী সর্বপ্রথম HTML আবিস্কার করেন। 1995 সালে HTML 2.0 , 1997 সালের জানুয়ারি মাসে HTML 3.2 এবং একই সালের ডিসেম্বর মাসে HTML 4 ভার্সন বাজারে আসে। HTML এর সর্বশেষ ভার্সন হচ্ছে HTML 5।

HTML এর সুবিধাসমূহঃ 

• ১। যেকোন ওয়েবপেইজের টেমপ্লেট তৈরি করা যায়।
• ২। এটি একটি ইউজার ফ্রেন্ডলি ওপেন টেকনোলজি।
• ৩। অধিকাংশ ব্রাউজার সাপোর্ট করে।
• ৪। সিনটেক্স সহজ তাই HTML শেখা সহজ।
• ৫। যেকোনো টেক্সট এডিটরে কোড লেখা যায়।
• ৬। ওয়েবপেইজের সাইজ কম হওয়াতে হোস্টিং স্পেস কম লাগে, অর্থাৎ খরচ কম হয়।
• ৭। HTML কোন কেস সেনসিটিভ ভাষা নয়।

HTML এর অসুবিধাসমুহঃ

• ১। শুধুমাত্র স্ট্যাটিক ওয়েবপেইজ তৈরি করা যায়।
• ২। সাধারণ ছোট একটি ওয়েবপেইজ তৈরি করতেও অনেক কোড লিখতে হয়।

HTML ট্যাগঃ HTML ট্যাগ হলো এক ধরণের লুকায়িত কীওয়ার্ড যা একটি ওয়েবপেইজের তথ্য বা বিষয়বস্তু কীভাবে বিন্যাস এবং প্রদর্শন করবে তা সুনির্দিষ্ট করে। একটি ট্যাগের সাধারণত দুইটি অংশ (কিছু ট্যাগের একটি) থাকে । একটিকে বলা হয় ওপেনিং ট্যাগ এবং অন্যটি ক্লোজিং ট্যাগ। ওপেনিং এবং ক্লোজিং ট্যাগের নাম একই, তবে মধ্যে পার্থক্য হলো, ক্লোজিং ট্যাগে একটি স্ল্যাস(/) থাকে। HTML ট্যাগের সিনট্যাক্স- <opening_tag_name>    </ closing_tag_name> । যেমনঃ <p> </p>, <a> </a> ইত্যাদি।

HTML ট্যাগ দুই প্রকার। যথা –

• ১। কন্টেইনার ট্যাগ
• ২। এম্পটি ট্যাগ

কন্টেইনার ট্যাগ এবং এম্পটি ট্যাগ এর মধ্যে পার্থক্যঃ 

কনটেইনার ট্যাগ	এম্পটি ট্যাগ
যে সকল ট্যাগের ওপেনিং ট্যাগ, ট্যাগের বিষয়বস্তু ও ক্লোজিং ট্যাগ থাকে তাকে কনটেইনার ট্যাগ বলে।	যে সকল ট্যাগের ওপেনিং  ট্যাগ আছে কিন্তু ক্লোজিং ট্যাগ নাই তাকে এম্পটি ট্যাগ বলে।
যেমন: <p>…</p>, <b>…</b> ইত্যাদি।	যেমন: <br>, <hr>, <img> ইত্যাদি।

HTML এলিমেন্ট: ওপেনিং ট্যাগ থেকে শুরু করে ক্লোজিং ট্যাগ পর্যন্ত সকল কিছুকে HTML এলিমেন্ট বলে। ওপেনিং ট্যাগ ও ক্লোজিং ট্যাগের মধ্যবর্তী সবকিছুই হলো HTML এলিমেন্ট এর কনটেন্ট।

HTML অ্যাট্রিবিউট: HTML অ্যাট্রিবিউট হচ্ছে HTML এলিমেন্ট সমূহের বৈশিষ্ট্য নির্ধারক। অ্যাট্রিবিউট সবসময় ওপেনিং ট্যাগে লেখা হয়। একটি অ্যাট্রিবিউটের দুটি অংশ থাকে। যথা: Attribute Name এবং Attribute Value। Attribute Value সবসময় ডাবল কোটেশনের (” “) মধ্যে বসে। Attribute Name এবং Attribute Value এর মাঝে  একটি সমান চিহ্ন (=) বসে।

ওয়েবপেইজ তৈরির জন্য HTML এর বেসিক কোডঃ ওয়েবপেইজ ডিজাইন করার জন্য HTML ব্যবহার করা হয়। HTML দিয়ে তৈরি কোন ওয়েবপেইজের সাধারণত দুইটি (Head Section,Body Section) অংশ থাকে।

Head Section:  এই সেকশনে ব্যবহৃত গুরুত্বপূর্ণ ট্যাগগুলোর পরিচিতি নিচে দেওয়া হলঃ

ট্যাগের নাম	ব্যবহার
<title> </title>	ওয়েবপেইজের টাইটেল নির্ধারনে এই ট্যাগ ব্যবহৃত হয়। টাইটেলটি ব্রাউজারের টাইটেল বারে প্রদর্শিত হয়।
<style> </style>	ওয়েবপেইজের কোন এলিমেন্টের স্টাইল( রং,সাইজ) বা পজিশন নির্ধারণ করতে  ট্যাগটি ব্যবহৃত হয়।
<link> </link>	HTML ডকুমেন্ট ব্যতীত অন্যান্য ডকুমেন্ট যেমন- CSS ফাইলের সাথে সম্পর্ক তৈরি করতে ব্যবহৃত হয়।
<script> </script>	ক্লায়েন্ট সাইড স্ক্রিপ্ট (জাভা স্ক্রিপ্ট) নির্ধারণ করতে ব্যবহৃত হয়।
<meta> </meta>	ওয়েবসাইট সম্পর্কিত তথ্য (ডেভেলোপারের পরিচয়, ওয়েবসাইটের বিষয়বস্তু ইত্যাদি) সংযুক্ত করতে ব্যবহৃত হয়।

Body Section: এই সেকশনটি একটি ওয়েবপেইজের মূল অংশ। একটি ওয়েবপেইজে কোন কিছু প্রদর্শন করার জন্য প্রয়োজনীয় সকল কোড এই অংশে লেখা হয়। মনে রাখতে হবে হেড সেকশন এবং বডি সেকশন দুটি HTML ট্যাগ এর মধ্যে লিখতে হয়।

ওয়েবপেইজ তৈরি করার জন্য প্রয়োজনীয় টুলস সমুহঃ ওয়েবপেজ তৈরি করার জন্য এডিটর এবং ব্রাউজার প্রয়োজন হয়। কিছু এডিটর যেমন- Notepad, Notepad++, Sublime Text। কিছু ব্রাউজার যেমন- Internet Explorer, Google Chrome, Mozilla Firefox, Apple Safari, Opera, Netscape Navigator,Mosaic ইত্যাদি।

পাঠ মূল্যায়ন- 

জ্ঞানমূলক প্রশ্নসমূহঃ

• ক। HTML ট্যাগ কী?
• ক। কন্টেইনার ট্যাগ কী?
• ক। এম্পটি ট্যাগ কী?
• ক। HTML এলিমেন্ট কী?
• ক। HTML অ্যাট্রিবিউট কী?

অনুধাবনমূলক প্রশ্নসমূহঃ

• খ। ওয়েবপেইজ ডিজাইনে HTML এর গুরুত্ব ব্যাখ্যা কর।
• খ। HTML ব্যবহারের সুবিধা বর্ণনা কর।
• খ। ওয়েবপেইজ তৈরিতে HTML ভাষা বেশি জনপ্রিয়- ব্যাখ্যা কর।
• খ। HTML কোন Case sensitive ভাষা নয়- ব্যাখ্যা কর।
• খ। ট্যাগ ও অ্যাট্রিবিউট উদাহরণসহ ব্যাখ্যা কর।
• খ। <b> ও <br> ট্যাগদ্বয় ব্যাখ্যা কর।

সৃজনশীল প্রশ্নসমূহঃ

উদ্দীপকটি পড় এবং প্রশ্নের উত্তর দাওঃ

http://www.kgmc.gov.bd/2015/recruit.html

• ঘ। উদ্দীপকের ওয়েবসাইটটি তৈরিতে ব্যবহৃত ল্যাঙ্গুয়েজটির সুবিধা ও অসুবিধা আলোচনা কর ।

বহুনির্বাচনি প্রশ্নসমূহঃ

১। HTML এর পূর্ণরূপ কোনটি?

ক. HyperText Markup Language

খ. High Text Markup Language

গ. HyperText Language

ঘ. Hyper Term Markup Language

২। HTML বেসিক স্ট্রাকচার কয়টি মৌলিক ট্যাগ আছে?

ক. ৮      খ. ৯      গ. ১০     ঘ. ১১

৩। কোন ট্যাগ দ্বারা লাইন তৈরি করা যায়?

ক.<p>    খ.<hr>    গ.<th>     ঘ.<br>

৪। HTML এর আবিষ্কারকের নাম কী?

ক. টিম বার্নার্স-লি   খ. এলান টুরিং      গ. লিবনিজ         ঘ. আডাবাইরন

৫। HTML এ প্রধান কয়টি অংশ থাকে?

ক. ২      খ. ৩      গ. ৪       ঘ. ৫

৬। ১ম ওয়েব ব্রাউজার হলো-

ক. Mosaic        খ. Moasic        গ. Mousic         ঘ. Mocsic

৭। HTML Editor কোনটি?

ক.Notepad         খ.Firefox      গ.Internet Explorer       ঘ.MS Word

৮। <link> ট্যাগের কাজ কী?

ক. স্টাইল ডেফিনিশন বর্ণনা করা

খ. ডকুমেন্ট সেকশন নির্ধারণ করা

গ. রিসোর্স রেফারেন্স  নির্ধারণ করা

ঘ. পুশ বাটন নির্ধারণ করা

৯। HTML এর ending ট্যাগ কোনটি?

ক. </>     খ. <//>      গ. []         ঘ. <>

১০। কোনটি ট্যাগের নির্দেশকে সুনির্দিষ্ট করে?

ক. অ্যাট্রিবিউট      খ. ট্যাগ     গ. এলিমেন্ট        ঘ. কনটেন্ট

১১। ওয়েব ব্রাউজিং সফটওয়্যার হলো-

i.Internet Explorer       ii.Open         iii.Mozila Firfox

নিচের কোনটি সঠিক?

ক.i ও ii             খ.i ও iii         গ. ii ও iii          ঘ.i, ii ও iii

১২। HTML দিয়ে ওয়েবপেইজ তৈরির জন্য নিচের কোন এক্সটেনশন ব্যবহৃত হয়।

 i..htm       ii. .html        iii. .doc

নিচের কোনটি সঠিক?

ক.i ও ii             খ.i ও iii             গ.ii ও iii           ঘ.i, ii ও iii

১৩। ওপেনিং ট্যাগ থেকে ক্লোজিং ট্যাগ পর্যন্ত সকল কিছুকে কী বলে?

ক. অ্যাট্রিবিউট      খ. ট্যাগ      গ. এলিমেন্ট       ঘ. কনটেন্ট

১৪। HTML ট্যাগের চিহ্ন কোনটি?

ক. []      খ. {}    গ. ()      ঘ. <>

১৫। ওয়েবপেইজ তৈরিতে কোন ভাষা ব্যবহৃত হয়?

ক.python      খ.html     গ.cobol         ঘ.Fortran

১৬। নিচের কোন ট্যাগের ক্লোজিং ট্যাগ থাকে?

ক.<hr>     খ.<img>        গ.<tr>       ঘ.<br>

১৭। কোনটি ওয়েব ব্রাউজার?

ক.Firefox    খ.Microsoft outlook     গ.Yahoo messanger     ঘ. Google Gmail

১৮। ওয়েবপেইজ তৈরিতে ব্যবহৃত আবশ্যক ট্যাগ কোনটি?

ক. <html>….</html>

খ. <a href= “URL”></a>

গ. <font face= “Sutonny MJ”….</font>

ঘ. <img src= “Board.jpg”….with “100” height= “200”>

১৯। হোমপেইজ দেখার জন্য আব্যশক-

i.ওয়েব ব্রাউজার    ii.সার্চ ইঞ্জিন        iii.ইন্টারনেট

নিচের কোনটি সঠিক?

ক.i ও ii        খ.i ও iii          গ.ii ও iii           ঘ.i, ii ও iii

২০। HTML এর body অংশে থাকে-

i.ছবি  ii.টেবিল  iii.ওয়েবপেইজ টাইটেল

নিচের কোনটি সঠিক?

ক.i ও ii             খ.i ও iii             গ.ii ও iii           ঘ.i, ii ও iii

২১। HTML হচ্ছে-

i.শেখা সহজ           ii.কেস সেনসিটিভ             iii.রক্ষানাবেক্ষন সহজ

নিচের কোনটি সঠিক?

ক.i ও ii             খ.i ও iii         গ.ii ও iii           ঘ.i, ii ও iii

২২। নিচের কোনটি ফাঁকা ট্যাগ?

ক.<th>         খ.<td>      গ.<br>        ঘ.<em>

২৩। html  এর বৈশিষ্ট্য হলো-

ক. এটি ইউজার ফ্রেন্ডলি ওপেন টেকনোলজি

খ. নিরাপত্তা ব্যবস্থা উন্নত

গ.  Html  নিজেকে বর্ধিত করার ক্ষমতা রাখে

ঘ. কোড লিখতে সিনটেক্স মনে রাখতে হয়

২৪। যে ট্যাগের শুরু আছে কিন্তু বিষয়বস্তু ও শেষ থাকে না তাকে বলে-

ক. এট্রিবিউট         খ. হেড          গ. এম্পটি             ঘ.কনটেইনার

২৫। এম্পটি ট্যাগ হলো-

i.<br>            ii.<ol>            iii.<img>

নিচের কোনটি সঠিক?

ক.i ও ii           খ.i ও iii          গ.ii ও iii           ঘ.i, ii ও iii

২৬। নিচের কোন ট্যাগের এলিমেন্ট থাকে না ?

i.<br>        ii.<img>        iii.<ul>

নিচের কোনটি সঠিক?

ক. i ও ii            খ.i ও iii           গ.ii ও iii           ঘ.i, ii ও iii

২৭। ওয়েবপেইজ প্রদর্শনে ব্যবহৃত হয়-

ক. ব্রাউজার          খ.PHP         গ.HTML          ঘ.ইন্টারপ্রেটার