0% found this document useful (0 votes)
12 views6 pages

1 HTML Basics Detailed

HTML (HyperText Markup Language) is the standard language for creating web pages, defining content structure through elements and tags. Key topics include document structure, semantic HTML, links and images, lists and tables, and forms and controls, with examples provided for each. The notes emphasize the importance of accessibility and SEO in web development.

Uploaded by

rohit.mybox
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
12 views6 pages

1 HTML Basics Detailed

HTML (HyperText Markup Language) is the standard language for creating web pages, defining content structure through elements and tags. Key topics include document structure, semantic HTML, links and images, lists and tables, and forms and controls, with examples provided for each. The notes emphasize the importance of accessibility and SEO in web development.

Uploaded by

rohit.mybox
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

HTML BASICS - INTRODUCTION

HTML (HyperText Markup Language) is the standard language for creating web pages.
It defines the structure of content through elements represented by tags.
These notes cover core concepts, syntax, and practical examples.
1. DOCUMENT STRUCTURE
- <!DOCTYPE html>: Declaration for HTML5.
- <html lang="en">: Root element with language attribute.
- <head>: Contains meta-data like <title>, <meta charset="UTF-8">, <link> (stylesheets), <script> (scripts).
- <body>: Visible content including text, images, links, forms, etc.

Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example</title>
</head>
<body>
<h1>Welcome</h1>
</body>
</html>
2. SEMANTIC HTML
- <header>, <nav>, <main>, <section>, <article>, <aside>, <footer>
- Improves accessibility and SEO.
- Example usage for a blog post:

<article>
<header><h2>Post Title</h2></header>
<p>Content...</p>
</article>
3. LINKS AND IMAGES
- <a href="URL" target="_blank" rel="noopener">Link Text</a>
- Attributes: href, target, rel, title
- <img src="path.jpg" alt="Description" width="300" height="200">
- Attributes: src, alt, width, height, loading="lazy"
4. LISTS & TABLES
- Ordered (<ol>) vs Unordered (<ul>) lists:
<ul>
<li>Item 1</li>
</ul>
- Tables (<table>, <tr>, <td>, <th>, <caption>):
<table>
<caption>Data</caption>
<tr><th>Name</th><th>Age</th></tr>
</table>
5. FORMS & CONTROLS
- <form action="/submit" method="post">
- Inputs: <input type="text" name="username" required>
- Other controls: <select>, <textarea>, <button>
- Accessibility: <label for="id">Label</label>

You might also like