Siksha Sarovar

Siksha Sarovar (sikshasarovar.com) is a free educational web application that helps students in India learn programming and prepare for academic and competitive exams. The platform offers structured coding courses (C, C++, Python, Java, HTML, CSS, PHP, Power BI, AI, Machine Learning, Data Science), complete university curriculum notes for BCA/MCA students with previous year question papers, Class 10 and Class 12 CBSE/HBSE school notes, and dedicated preparation material for SSC, UPSC, Banking, Railway and other government exams. Browsing the site is completely free and requires no account. Users may optionally sign in with Google solely to save their learning progress, quiz scores and personal preferences across devices.

Privacy Policy | Terms of Service | Contact Siksha Sarovar | About Siksha Sarovar

v4.0.9 · PWA
Siksha Sarovar logo
Siksha Sarovar
Your Learning Universe

Siksha Sarovar is a free e-learning platform for coding courses, BCA university notes and competitive exam preparation. Optional Google sign-in saves your learning progress across devices.

Initializing knowledge base…
Compiling modules 0%

HTML Basics: Structure and Syntax

Lesson 3 of 34 in the free Web Technologies notes on Siksha Sarovar, written by Rohit Jangra.

HTML Basics: Structure and Syntax

What is HTML?

HTML (HyperText Markup Language) is the standard markup language used to create web pages. It describes the structure of web content using elements represented by tags.

Basic HTML Document Structure

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My First Page</title>
  </head>
  <body>
    <h1>Hello, World!</h1>
    <p>This is a paragraph.</p>
  </body>
</html>

HTML Elements and Tags

An HTML element consists of:

  • Opening tag: <tagname>
  • Content: text or nested elements
  • Closing tag: </tagname>

Some elements are self-closing (void elements): <br>, <img>, <input>, <hr>

HTML Attributes

Attributes provide additional information about elements:

<a href="https://example.com" target="_blank">Visit Example</a>
<img src="photo.jpg" alt="A photo" width="300">
<p class="intro" id="first-para">Welcome!</p>

Common Global Attributes

AttributePurpose
idUnique identifier
classCSS class name(s)
styleInline CSS
titleTooltip text
langLanguage
data-*Custom data attributes

Headings and Paragraphs

<h1>Main Title</h1>
<h2>Section Title</h2>
<h3>Subsection</h3>
<p>A paragraph of text.</p>
<br> <!-- line break -->
<hr> <!-- horizontal rule -->

HTML Comments

<!-- This is a comment and won't be displayed -->

DOCTYPE Declaration

<!DOCTYPE html> tells the browser which HTML version the page uses. For HTML5, it is simply <!DOCTYPE html>.

Head Section Elements

ElementPurpose
<title>Browser tab title
<meta>Metadata (charset, viewport)
<link>External CSS files
<script>JavaScript files
<style>Inline CSS
Key Takeaway: HTML provides the skeleton of every web page. Understanding the basic document structure, elements, and attributes is the first step in web development.