B
Biggan.me
Science & Math Calculators
🌐বাংলা
NCTB HSC ICT (Chapter 4) / Grade 11-12• 7 min read• Published: 2026-09-09

HSC ICT Ch 4: HTML & Web Design Guide

Comprehensive NCTB HSC ICT Chapter 4 Web Design guide: HTML5 document structure, container vs void tags, table rowspan and colspan, hyperlinks, and board exam solutions.

Peer-reviewed by the Biggan.me Scientific Board • 100% aligned with NCTB & NCERT examination syllabi

1. What is HTML and Document Anatomy

HTML stands for HyperText Markup Language. Rather than being a traditional procedural programming language, it is a declarative markup system designed by Sir Tim Berners-Lee in 1990 to structure documents displayed in web browsers.

Every compliant HTML5 document follows a strict hierarchical tree structure:

<!DOCTYPE html> // Instructs browser to parse as modern HTML5
<html lang="en">
<head>
<meta charset="UTF-8">
<title>My First Web Page</title>
</head>
<body>
<h1>Welcome to Web Design!</h1>
<p>This is a paragraph of text.</p>
</body>
</html>

2. Container Tags vs Void / Empty Tags

In board examination multiple-choice questions (MCQs), distinguishing between tag classifications is a frequent theme:

📦 Container Tags

Elements requiring both an opening tag and a closing tag (</...>) enclosing content.

<p>Content goes here</p>
<h1>Heading 1</h1>
<table>...</table>

⚡ Void / Empty Tags

Self-contained elements that cannot contain any child nodes or text content. No closing tags exist for them.

<br> (Line break)
<hr> (Horizontal rule)
<img src="..."> (Image embed)

3. Mastering Tables: rowspan and colspan Logic

Approximately 80% of Creative Questions (CQ) in HSC ICT Chapter 4 require writing markup for a visual tabular grid. The essential tags are:

  • <table border="1">: Declares the table grid
  • <tr>: Table Row
  • <th>: Table Header (bold and centered by default)
  • <td>: Table Data cell

Cell Merging Principles

colspan="n"

Merges n adjacent columns horizontally into a single unified cell.

rowspan="n"

Merges n rows vertically downward into a single unified cell.

*Exam Tip: When a cell uses rowspan="2", the subsequent table row (<tr>) must omit that column's <td> to avoid layout overflow!

4. Hyperlinks and Media Embeds

To link to external web pages or internal relative paths, use the <a> (Anchor) tag with the href attribute:

<a href="https://biggan.me" target="_blank">Visit Biggan.me</a>

To display images, the <img> tag requires the src (source URL) and alt (alternative description) attributes:

<img src="diagram.png" alt="Circuit Diagram" width="300" height="150">

5. Common Board Exam Pitfalls Checklist

✕
Pitfall: Writing closing tags for void elements like </br> or </img>. Void elements must remain self-closing or unclosed in HTML5.
✕
Pitfall: Forgetting the border="1" attribute on the <table> tag in handwritten CQ answers. Without it, borders default to invisible.
✓
Pro Tip: Maintain consistent indentation during examination writing. It clearly signals element nesting hierarchy to the board examiner, preventing marks deduction.
Interactive Computational ToolStep-by-Step Proofs & Casio Bridge

HTML5 & CSS Live Runner

Interactive in-browser code editor with live preview, tag references, and HSC board exam templates.

Launch Interactive Solver

Editorial & Academic Standards

All educational articles and worked exemplars on Biggan.me are verified against IUPAC standards, CODATA recommended physical constants, and respective NCTB (Bangladesh) and NCERT (India) curricula. Our mission is to eliminate black-box rote learning through transparent intermediate steps.

Our Verification Methodology →Editorial Board →