Course Overview
Introduction to HTML
HTML (HyperText Markup Language) is the standard language for creating web pages. It defines the structure and content of a website, telling browsers how to display text, images, links, and other elements. HTML is not a programming language but a markup language, using tags to describe content.
- Purpose: HTML provides the backbone of web pages, enabling content organization and accessibility.
- Role in Web Development: Works alongside CSS (styling) and JavaScript (interactivity).
Example: A simple HTML page structure:
<!DOCTYPE html>
<html>
<head>
<title>My First Web Page</title>
</head>
<body>
<h1>Welcome to My Website</h1>
<p>This is a paragraph of text.</p>
</body>
</html>
HTML Syntax
HTML uses tags to mark up content. Tags are enclosed in angle brackets (< >), and most come in pairs: an opening tag (e.g., <p>) and a closing tag (e.g., </p>).
- Elements: A tag pair and its content form an element (e.g., <p>Hello</p>).
- Attributes: Tags can include attributes for additional information (e.g., <a href=”https://example.com”>Link</a>).
Syntax Rules:
- Tags are case-insensitive, but lowercase is standard.
- Closing tags have a forward slash (/).
- Some tags are self-closing (e.g., <img src=”image.jpg” />).
Example: Using tags and attributes:
<a href="https://www.example.com" target="_blank">Visit Example</a>
<img src="logo.png" alt="Company Logo" />
HTML Document Structure
Every HTML document follows a standard structure:
- <!DOCTYPE html>: Declares the document as HTML5.
- <html>: The root element, containing all other elements.
- <head>: Contains metadata, like the page title (<title>), and links to stylesheets.
- <body>: Contains visible content, like headings, paragraphs, and images.
Example: A complete HTML document:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Sample Page</title>
</head>
<body>
<header>
<h1>My Website</h1>
</header>
<main>
<p>Welcome to my site! Learn about <strong>HTML</strong> today.</p>
</main>
</body>
</html>
Leave a Reply