HSC ICT Chapter 4: ওয়েবসাইট কাঠামো ও HTML – Complete Guide
Jet Education BD · Updated: November 17, 2025
Chapter 4 ICT তে আমরা শেখব ওয়েবসাইটের মূল কাঠামো এবং HTML (Hypertext Markup Language)। HTML হলো ওয়েবপেজ তৈরির মূল ভাষা।
এই পোস্টে আমরা HTML সংজ্ঞা, History, Structure, Tags, Attributes, Lists, Links, Images, Tables, Forms, Meta Tags, SEO Tips এবং Exam Tips বিশদভাবে দেখবো।
HTML কি?
HTML (Hypertext Markup Language) হলো markup language যা ওয়েবপেজ তৈরিতে ব্যবহৃত হয়।
এটি ব্রাউজারে content প্রদর্শন করে। HTML tag দিয়ে headings, paragraphs, links, images, tables, lists এবং forms তৈরি করা যায়।
HTML এর ইতিহাস
✔ 1991 – Tim Berners-Lee প্রথম HTML তৈরি করেন
✔ 1995 – HTML 2.0
✔ 1997 – HTML 3.2
✔ 1999 – HTML 4.01
✔ 2014 – HTML5 (Current Standard)
✔ 1995 – HTML 2.0
✔ 1997 – HTML 3.2
✔ 1999 – HTML 4.01
✔ 2014 – HTML5 (Current Standard)
ওয়েবসাইট কাঠামো
একটি ওয়েবসাইট সাধারণত এই structure অনুসারে তৈরি হয়:
• Home Page
• About Page
• Contact Page
• Services/Products Page
• Blog/News Page
• Home Page
• About Page
• Contact Page
• Services/Products Page
• Blog/News Page
Minimal HTML Structure উদাহরণ:
<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
</head>
<body>
<h1>Welcome to My Website</h1>
<p>This is Jet Education BD.</p>
</body>
</html>
<html>
<head>
<title>My Website</title>
</head>
<body>
<h1>Welcome to My Website</h1>
<p>This is Jet Education BD.</p>
</body>
</html>
Head & Body Section
Important HTML Tags
• <h1> – <h6> = Headings
• <p> = Paragraph
• <a href="URL"> = Hyperlink
• <img src="image.jpg" alt="Description"> = Image
• <ul>, <ol>, <li> = Lists
• <table>, <tr>, <td>, <th> = Tables
• <form>, <input>, <select>, <textarea> = Forms
• <p> = Paragraph
• <a href="URL"> = Hyperlink
• <img src="image.jpg" alt="Description"> = Image
• <ul>, <ol>, <li> = Lists
• <table>, <tr>, <td>, <th> = Tables
• <form>, <input>, <select>, <textarea> = Forms
HTML Attributes
• href, src, alt, id, class, style
Example: <img src="logo.png" alt="Logo" style="width:100px;">
Example: <img src="logo.png" alt="Logo" style="width:100px;">
Lists in HTML
• Ordered List – <ol>
• Unordered List – <ul>
• List Item – <li>
Example:
Example:
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
Links & Images
• Hyperlink: <a href="https://www.jeteducationbd.com">Visit Jet Education BD</a>
• Image: <img src="image.jpg" alt="Logo">
• Image: <img src="image.jpg" alt="Logo">
Example:
<table border="1">
<tr><th>Name</th><th>Roll</th></tr>
<tr><td>Rakib</td><td>101</td></tr>
</table>
<tr><th>Name</th><th>Roll</th></tr>
<tr><td>Rakib</td><td>101</td></tr>
</table>
Example:
<form>
Name: <input type="text">
Email: <input type="email">
<input type="submit" value="Submit">
</form>
Name: <input type="text">
Email: <input type="email">
<input type="submit" value="Submit">
</form>
Meta Tags & SEO Tips
• <meta charset="UTF-8"> – Character Set
• <meta name="description" content="HSC ICT Chapter 4 HTML & Website Structure Notes">
• <meta name="keywords" content="HTML, Webpage, HSC ICT, Jet Education BD"> • SEO Tip: Proper headings, meta description, alt text for images, keyword placement
• <meta name="description" content="HSC ICT Chapter 4 HTML & Website Structure Notes">
• <meta name="keywords" content="HTML, Webpage, HSC ICT, Jet Education BD"> • SEO Tip: Proper headings, meta description, alt text for images, keyword placement
Important Exam Tips
• Minimal HTML structure ভালোভাবে মনে রাখুন
• Head ও Body এর পার্থক্য জানুন
• Tables, Lists, Forms প্র্যাকটিস করুন
• Meta tags এবং attributes প্রশ্ন আসে
• Head ও Body এর পার্থক্য জানুন
• Tables, Lists, Forms প্র্যাকটিস করুন
• Meta tags এবং attributes প্রশ্ন আসে
Model Questions
১. Minimal HTML structure লিখুন।
২. Head & Body এর উদাহরণ দিন।
৩. Ordered & Unordered list লিখুন।
৪. Table ও Form উদাহরণ লিখুন।
৫. Meta tag কি এবং SEO তে এর ব্যবহার লিখুন।
FAQ
প্রশ্ন: HTML কি ধরনের ভাষা?
উত্তর: Markup Language
উত্তর: Markup Language
প্রশ্ন: Head & Body পার্থক্য?
উত্তর: Head meta, title, link; Body visible content
উত্তর: Head meta, title, link; Body visible content
প্রশ্ন: HTML5 এর সুবিধা?
উত্তর: Modern, multimedia support, responsive design
উত্তর: Modern, multimedia support, responsive design
উপসংহার
ওয়েবসাইট কাঠামো এবং HTML HSC ICT পরীক্ষার গুরুত্বপূর্ণ অংশ।
Proper structure, Head & Body, Tags, Tables, Lists, Forms, Meta Tags ভালোভাবে পড়লে MCQ ও SAQ উভয়েই সুবিধা পাওয়া যায়।
Jet Education BD নিয়মিত Notes, Model Questions এবং Exam Tips প্রকাশ করে।
Tags: HTML, Website Structure, Webpage, HSC ICT Chapter 4, Meta Tags, SEO, Jet Education BD
মন্তব্যসমূহ
একটি মন্তব্য পোস্ট করুন