দৃশ্যকল্প-১
A Sample Table
ICT | HSC Exam-2025 | |
MCQ | CQ | |
দৃশ্যকল্প-২
O Vegetables
O Fruits
iv. Ripe
v. Dried
HTML ডকুমেন্টে বিভিন্ন উপাদান (elements) যেমন হেডিং, প্যারাগ্রাফ, ছবি, লিংক ইত্যাদি চিহ্নিত করতে এবং তাদের গঠন ও আচরণ নির্ধারণ করতে ট্যাগ (Tag) ও অ্যাট্রিবিউট (Attribute) ব্যবহার করা হয়। ট্যাগ হলো < ও > চিহ্নের মধ্যে লেখা কিছু নির্দিষ্ট কীওয়ার্ড যা ব্রাউজারকে কোনো উপাদানের শুরু ও শেষ নির্দেশ করে, যেমন: ও
একটি ট্যাগের মৌলিক কার্যকারিতা পরিবর্তন বা সুনির্দিষ্ট করতে অ্যাট্রিবিউট অপরিহার্য। উদাহরণস্বরূপ, একটি ইমেজ ট্যাগ src এবং alt নামক অ্যাট্রিবিউট ব্যবহার করা হয়, যেমন: 
src ও alt হলো অ্যাট্রিবিউট, যা ট্যাগের কার্যকারিতাকে আরও সুনির্দিষ্ট করে তোলে।
উদ্দীপকের দৃশ্যকল্প-১ এর ন্যায় ব্রাউজারে ফলাফল পেতে প্রয়োজনীয় HTML কোড নিচে দেওয়া হলো:
| ICT | HSC Exam-2025 | |
| MCQ | CQ | |
ওয়েবপেজে সারণি (table) তৈরি করার জন্য HTML-এ উক্ত সারণিতে, 'ICT' সেলটি দুটি সারি জুড়ে বিস্তৃত করার জন্য rowspan="2" অ্যাট্রিবিউট ব্যবহার করা হয়েছে। অপরদিকে, 'HSC Exam-2025' সেলটি দুটি কলাম জুড়ে বিস্তৃত করার জন্য colspan="2" অ্যাট্রিবিউট ব্যবহার করা হয়েছে। এই অ্যাট্রিবিউটগুলো ব্যবহার করে দৃশ্যকল্প-১ এ প্রদর্শিত নির্দিষ্ট বিন্যাসের সারণি তৈরি করা যায়, যা তথ্য উপস্থাপনাকে আরও সুসংগঠিত ও কার্যকরী করে তোলে। HTML (HyperText Markup Language) ওয়েবপেজ তৈরির মূল ভাষা। এটি বিভিন্ন উপাদানের কাঠামো নির্ধারণ করে, যেমন - তালিকা, ছবি, লিঙ্ক ইত্যাদি। উদ্দীপকের দৃশ্যকল্প-২ তে একটি তালিকার ধারণা দেওয়া হয়েছে, যা HTML এর মাধ্যমে Unordered List ( দৃশ্যকল্প-২ এ "Vegetables", "Fruits" এবং এর উপ-আইটেম "Ripe", "Dried" একটি তালিকার আকারে দেখানো হয়েছে। এখানে "Fruits" এ ক্লিক করার কার্যকারিতা চাওয়া হয়েছে, যা নির্দেশ করে যে "Fruits" একটি হাইপারলিঙ্ক (hyperlink) হবে। "Ripe" এবং "Dried" এর পূর্বে "iv." এবং "v." নির্দেশ করে যে এগুলো একটি ক্রমিক তালিকা (ordered list) এবং পূর্ববর্তী "Fruits" আইটেমের অন্তর্গত। HTML এ উদ্দীপকের দৃশ্যকল্প-২ এর জন্য প্রয়োজনীয় HTML কোড নিচে দেওয়া হলো: উপরের কোডে, আমরা সবাই জানি ইন্টারনেট ব্যবহার করে ইমেইল, ফাইল শেয়ারিং, ভয়েস কলিং এরকম বিভিন্ন তথ্য ও সেৰা আদান-প্রদান করা যায়। এদের মধ্যে তথ্য আদান-প্রদানের জন্য বহুল ব্যবহৃত একটি মডেল হচ্ছে ওয়েৰ। ওয়েব হচ্ছে ওয়ার্ল্ড ওয়াইড ওয়েব-এর সংক্ষিপ্ত রূপ। ওয়েবের মাধ্যমে ইন্টারনেট ব্যবহার করে ছুটি যন্ত্রের মধ্যে তথ্য আদান-প্রদান করা যায়। বর্তমানে ওয়েবকে আমরা বলতে পারি তথ্যভান্ডার যেখানে অনেক তথ্য রিসোর্স, ওয়েব ডকুমেন্ট আকারে সঞ্চিত আছে। জামরা আমাদের দৈনন্দিন জীবনে ওয়েবের নানা ধরনের তথ্যের উপর পুরোপুরি নির্ভরশীল হয়ে গেছি। এই অধ্যায়ে কীভাবে একটি কার্যকর ওয়েব সাইট তৈরি করা যায় সেটি শিক্ষার্থীদের সামনে তুলে ধরা হবে। এ অধ্যায় পাঠ শেষে শিক্ষার্থীরা- একটি HTML ফাইলকে ব্রাউজারে সুন্দরভাবে উপস্থাপনের জন্য বিভিন্ন ট্যাগ ব্যবহার করা হয়, আর এই ট্যাগ এবং ট্যাগের ভেতরের বিষয়বস্তুকে একত্রে HTML এলিমেন্ট বলে। ওয়েবসাইট পাবলিশ করার জন্য প্রধানত ওয়েব সার্ভার (Web Server) বা হোস্টিং (Hosting) এবং একটি ডোমেইন নাম (Domain Name) প্রয়োজন। একটি ওয়েবসাইটকে ইন্টারনেটে সকলের জন্য উন্মুক্ত করতে হলে ওয়েবসাইটের ফাইলগুলো একটি শক্তিশালী কম্পিউটারে সংরক্ষণ করতে হয় যা ২৪/৭ (২৪ ঘণ্টা, ৭ দিন) চালু থাকে এবং ইন্টারনেট সংযুক্ত থাকে। এই কম্পিউটারকেই ওয়েব সার্ভার বলে এবং এই সেবা প্রদানকারীকে হোস্টিং প্রোভাইডার (Hosting Provider) বলা হয়। অন্যদিকে, ডোমেইন নাম হলো ওয়েবসাইটের একটি অনন্য ঠিকানা (যেমন: example.com) যার মাধ্যমে ব্যবহারকারীরা ইন্টারনেট ব্রাউজারে ঠিকানা লিখে ওয়েবসাইটটি খুঁজে পায়। এই দুটি উপাদান ছাড়া ওয়েবসাইট ইন্টারনেটে অ্যাক্সেস করা সম্ভব নয়। এইচটিএমএল (HyperText Markup Language) হলো ওয়েব পেজ তৈরির জন্য ব্যবহৃত একটি মার্কআপ ভাষা। এটি ওয়েব ব্রাউজারে প্রদর্শিত বিষয়বস্তু যেমন টেক্সট, ছবি এবং লিংক কাঠামোবদ্ধ করতে সাহায্য করে। উদ্দীপকে বর্ণিত X ডিগ্রি কলেজের হোম পেজ তৈরির জন্য উদ্দীপকের শর্তানুযায়ী হোম পেজ তৈরির জন্য প্রয়োজনীয় HTML কোড নিচে দেওয়া হলো:
X ডিগ্রি কলেজের ওয়েবসাইটটিকে ডায়নামিক ওয়েবসাইট বলা যায় না। এটি একটি স্ট্যাটিক ওয়েবসাইট। একটি স্ট্যাটিক ওয়েবসাইট মূলত সাধারণ HTML কোড ব্যবহার করে তৈরি করা হয়, যেখানে প্রতিটি পেজ সার্ভারে পূর্ব-নির্ধারিত অবস্থায় সংরক্ষিত থাকে এবং ব্যবহারকারীকে সবসময় একই তথ্য প্রদর্শন করে। এই ওয়েবসাইটগুলোতে সাধারণত সার্ভার-সাইড স্ক্রিপ্টিং ভাষা বা ডেটাবেসের ব্যবহার থাকে না। অন্যদিকে, একটি ডায়নামিক ওয়েবসাইট সার্ভার-সাইড স্ক্রিপ্টিং ভাষা (যেমন PHP, ASP.NET, Python) এবং ডেটাবেস (যেমন MySQL, SQL Server) ব্যবহার করে তৈরি হয়, যা ব্যবহারকারীর কার্যকলাপ বা সময় অনুযায়ী কন্টেন্ট পরিবর্তন করতে সক্ষম এবং ব্যবহারকারীর সাথে ইন্টারঅ্যাক্ট করতে পারে। উদ্দীপকে উল্লিখিত X ডিগ্রি কলেজের ওয়েবসাইটটি "শুধু এইচটিএমএল ব্যবহার করে" তৈরি করা হয়েছে এবং এতে "ভিজিটরদের মতামত প্রদানের কোনো ব্যবস্থা নেই"। এই দুটি বৈশিষ্ট্য একটি স্ট্যাটিক ওয়েবসাইটের মূল নির্দেশক। যেহেতু ওয়েবসাইটটি শুধুমাত্র HTML ব্যবহার করে নির্মিত, তাই এটি সার্ভার থেকে ব্যবহারকারীর অনুরোধ অনুযায়ী ডেটাবেস থেকে তথ্য এনে প্রদর্শন করতে পারে না বা ব্যবহারকারীর ইনপুট গ্রহণ করে প্রতিক্রিয়া জানাতে পারে না। ওয়েবসাইটের হোম পেজে একটি ছবি (ict.jpg) এবং একটি লিংকের (notice.html) উপস্থিতি এটিকে আরও স্ট্যাটিক প্রকৃতির প্রমাণ করে, কারণ এই উপাদানগুলি পূর্ব-নির্ধারিত এবং স্বয়ংক্রিয়ভাবে পরিবর্তন হয় না। যদি এটি একটি ডায়নামিক ওয়েবসাইট হতো, তবে এতে ভিজিটরদের মতামত প্রদানের ব্যবস্থা, লগইন অপশন, বা কন্টেন্ট আপডেট করার জন্য একটি অ্যাডমিন প্যানেলের মতো ফিচার্স থাকত। উদ্দীপকের তথ্য বিশ্লেষণ করে নিশ্চিতভাবে বলা যায় যে, X ডিগ্রি কলেজের ওয়েবসাইটটি কোনোভাবেই ডায়নামিক ওয়েবসাইট নয়, বরং এটি একটি স্ট্যাটিক ওয়েবসাইট। ডোমেইন নেম হলো ইন্টারনেটে একটি ওয়েবসাইটের স্বতন্ত্র পরিচয়সূচক নাম, যা সংখ্যাভিত্তিক আইপি অ্যাড্রেসের (IP Address) পরিবর্তে ব্যবহৃত হয়। এটি ব্যবহারকারীদের জন্য ওয়েবসাইট খুঁজে পাওয়া ও মনে রাখা সহজ করে তোলে, কারণ দীর্ঘ এবং জটিল আইপি অ্যাড্রেসের চেয়ে একটি সহজে স্মরণীয় শব্দভিত্তিক নাম ব্যবহারকারীদের জন্য অনেক বেশি সুবিধাজনক। ডোমেইন নেমের গুরুত্ব অপরিসীম কারণ এটি ইন্টারনেটে একটি সুনির্দিষ্ট অনলাইন ঠিকানা হিসেবে কাজ করে। এটি একটি প্রতিষ্ঠান বা ব্যক্তির অনলাইন ব্র্যান্ডিং (branding) এবং বিশ্বাসযোগ্যতা তৈরিতে অপরিহার্য ভূমিকা পালন করে। ডোমেইন নেম ছাড়া নির্দিষ্ট কোনো ওয়েবসাইটে প্রবেশ করা কঠিন হয়ে পড়ত, যা ডিজিটাল যোগাযোগ, তথ্য আদান-প্রদান ও ই-কমার্সের মতো কার্যক্রমে ব্যাপক বাধা সৃষ্টি করত। ১ ক্লিকে প্রশ্ন, শীট, সাজেশন ও শুধু প্রশ্ন সিলেক্ট করুন — প্রশ্নপত্র অটোমেটিক তৈরি! Complete Exam Learn, practice, analyse and improve ট্যাগ ব্যবহার করা হয়। সারণির প্রতিটি সারি
(table row) ট্যাগ দ্বারা এবং প্রতিটি তথ্য সেল (table data) ট্যাগ দ্বারা নির্দিষ্ট করা হয়। উদ্দীপকের দৃশ্যকল্প-১ এ একটি সারণি (table) এর বিন্যাস দেখানো হয়েছে যা এই ট্যাগগুলো ব্যবহার করে তৈরি করা সম্ভব।
(anchor) ট্যাগ ব্যবহার করে হাইপারলিঙ্ক এবং এর value অ্যাট্রিবিউট ব্যবহার করে ক্রমিক তালিকার সূচনা মান নির্দিষ্ট করা যায়।দৃশ্যকল্প-২
ট্যাগ ব্যবহার করা হয়েছে, যেখানে href="fruits.html" অ্যাট্রিবিউটটি নির্দেশ করে যে "Fruits" এ ক্লিক করলে "fruits.html" নামক ফাইলটি খোলা হবে। "Fruits" আইটেমের ভেতরে অ্যাট্রিবিউট ব্যবহার করে তালিকাটি 'iv' থেকে শুরু করা হয়েছে। এটি ওয়েবপেজকে সুসংগঠিত এবং ইন্টারেক্টিভ করে তোলে।
Related Question
View All
ট্যাগ ব্যবহার করা হবে। এছাড়াও, "Welcome to X Degree College" লেখাটি নীল রঙে প্রদর্শনের জন্য ট্যাগের সাথে style="color: blue;" অ্যাট্রিবিউট ব্যবহার করতে হবে।
Welcome to X Degree College
অনলাইন পরীক্ষা তৈরির সফটওয়্যার!
Related Question
Preparation
Promotion
