HTML (HyperText Markup Language) ওয়েবপেজ তৈরির মূল ভাষা। এটি বিভিন্ন উপাদানের কাঠামো নির্ধারণ করে, যেমন - তালিকা, ছবি, লিঙ্ক ইত্যাদি। উদ্দীপকের দৃশ্যকল্প-২ তে একটি তালিকার ধারণা দেওয়া হয়েছে, যা HTML এর মাধ্যমে Unordered List (
) এবং Ordered List () ট্যাগ ব্যবহার করে তৈরি করা যায়।
দৃশ্যকল্প-২ এ "Vegetables", "Fruits" এবং এর উপ-আইটেম "Ripe", "Dried" একটি তালিকার আকারে দেখানো হয়েছে। এখানে "Fruits" এ ক্লিক করার কার্যকারিতা চাওয়া হয়েছে, যা নির্দেশ করে যে "Fruits" একটি হাইপারলিঙ্ক (hyperlink) হবে। "Ripe" এবং "Dried" এর পূর্বে "iv." এবং "v." নির্দেশ করে যে এগুলো একটি ক্রমিক তালিকা (ordered list) এবং পূর্ববর্তী "Fruits" আইটেমের অন্তর্গত। HTML এ (anchor) ট্যাগ ব্যবহার করে হাইপারলিঙ্ক এবং ট্যাগের এর value অ্যাট্রিবিউট ব্যবহার করে ক্রমিক তালিকার সূচনা মান নির্দিষ্ট করা যায়।
উদ্দীপকের দৃশ্যকল্প-২ এর জন্য প্রয়োজনীয় HTML কোড নিচে দেওয়া হলো:
ট্যাগটি মূল Unordered List তৈরি করেছে। "Fruits" আইটেমটিকে একটি হাইপারলিঙ্ক হিসেবে তৈরি করতে ট্যাগ ব্যবহার করা হয়েছে, যেখানে href="fruits.html" অ্যাট্রিবিউটটি নির্দেশ করে যে "Fruits" এ ক্লিক করলে "fruits.html" নামক ফাইলটি খোলা হবে। "Fruits" আইটেমের ভেতরে ট্যাগ ব্যবহার করে একটি নেস্টেড Ordered List তৈরি করা হয়েছে "Ripe" এবং "Dried" এর জন্য। অ্যাট্রিবিউট ব্যবহার করে তালিকাটি 'iv' থেকে শুরু করা হয়েছে। এটি ওয়েবপেজকে সুসংগঠিত এবং ইন্টারেক্টিভ করে তোলে।
HTML ডকুমেন্টে বিভিন্ন উপাদান (elements) যেমন হেডিং, প্যারাগ্রাফ, ছবি, লিংক ইত্যাদি চিহ্নিত করতে এবং তাদের গঠন ও আচরণ নির্ধারণ করতে ট্যাগ (Tag) ও অ্যাট্রিবিউট (Attribute) ব্যবহার করা হয়। ট্যাগ হলো < ও > চিহ্নের মধ্যে লেখা কিছু নির্দিষ্ট কীওয়ার্ড যা ব্রাউজারকে কোনো উপাদানের শুরু ও শেষ নির্দেশ করে, যেমন: ও
। অন্যদিকে, অ্যাট্রিবিউট ট্যাগের অতিরিক্ত বৈশিষ্ট্য বা তথ্য সরবরাহ করে এবং সর্বদা স্টার্ট ট্যাগের মধ্যে 'নাম="মান"' (name="value") জোড়া হিসেবে লেখা হয়।
একটি ট্যাগের মৌলিক কার্যকারিতা পরিবর্তন বা সুনির্দিষ্ট করতে অ্যাট্রিবিউট অপরিহার্য। উদাহরণস্বরূপ, একটি ইমেজ ট্যাগ কোনো ছবিকে ওয়েবপেজে প্রদর্শন করে। কিন্তু ছবিটি কোথা থেকে আসবে (source) বা ছবি লোড না হলে কী বিকল্প লেখা দেখাবে তা নির্ধারণ করতে src এবং alt নামক অ্যাট্রিবিউট ব্যবহার করা হয়, যেমন: । এখানে হলো ট্যাগ, আর src ও alt হলো অ্যাট্রিবিউট, যা ট্যাগের কার্যকারিতাকে আরও সুনির্দিষ্ট করে তোলে।
উদ্দীপকের দৃশ্যকল্প-১ এর ন্যায় ব্রাউজারে ফলাফল পেতে প্রয়োজনীয় HTML কোড নিচে দেওয়া হলো:
ICT
HSC Exam-2025
MCQ
CQ
ওয়েবপেজে সারণি (table) তৈরি করার জন্য HTML-এ
ট্যাগ ব্যবহার করা হয়। সারণির প্রতিটি সারি
(table row) ট্যাগ দ্বারা এবং প্রতিটি তথ্য সেল
(table data) ট্যাগ দ্বারা নির্দিষ্ট করা হয়। উদ্দীপকের দৃশ্যকল্প-১ এ একটি সারণি (table) এর বিন্যাস দেখানো হয়েছে যা এই ট্যাগগুলো ব্যবহার করে তৈরি করা সম্ভব।
উক্ত সারণিতে, 'ICT' সেলটি দুটি সারি জুড়ে বিস্তৃত করার জন্য rowspan="2" অ্যাট্রিবিউট ব্যবহার করা হয়েছে। অপরদিকে, 'HSC Exam-2025' সেলটি দুটি কলাম জুড়ে বিস্তৃত করার জন্য colspan="2" অ্যাট্রিবিউট ব্যবহার করা হয়েছে। এই অ্যাট্রিবিউটগুলো ব্যবহার করে দৃশ্যকল্প-১ এ প্রদর্শিত নির্দিষ্ট বিন্যাসের সারণি তৈরি করা যায়, যা তথ্য উপস্থাপনাকে আরও সুসংগঠিত ও কার্যকরী করে তোলে।