HTML

Introduction to Web and HTML

How the Web Works What is HTML Why Learn HTML

HTML Tags

HTML Tags

HTML (Hypertext Markup Language) uses tags to define elements on a web page. These tags are essential for structuring, presenting, and organizing content. Each HTML tag serves a specific purpose and plays a unique role in building web pages. Let's explore some of the most commonly used HTML tags:

1. Headings - <h1>, <h2>, <h3>, <h4>, <h5>, <h6>

Headings are used to define the hierarchical structure of your content, with <h1> being the most important and <h6> the least. These tags are crucial for improving accessibility and SEO.

<h1>Main Heading</h1>
<h2>Subheading</h2>

2. Paragraphs - <p>

The <p> tag is used to define paragraphs of text. It separates content into blocks, making it easier to read.

<p>This is a paragraph of text.</p>

3. Lists - <ul>, <ol>, <li>

Lists are essential for organizing information. <ul> creates unordered (bulleted) lists, <ol> creates ordered (numbered) lists, and <li> defines list items.

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
</ul>

<ol>
  <li>First item</li>
  <li>Second item</li>
</ol>

4. Links - <a>

The <a> tag is used to create hyperlinks, allowing users to navigate between web pages or resources.

<a href="https://www.example.com">Visit Example.com</a>

5. Images - <img>

Images are displayed using the <img> tag. It requires the src attribute to specify the image source and the alt attribute for alternative text.

<img src="image.jpg" alt="A sample image">

6. Head - <head>

The <head> element contains metadata about the document, such as the title of the page, character encoding, and links to external resources.

<head>
  <meta charset="UTF-8">
  <title>Page Title</title>
</head>

7. Body - <body>

The <body> tag contains the main content of the web page, including text, images, links, and other elements.

<body>
  <h1>Welcome to My Website</h1>
  <p>Explore our content here.</p>
</body>

8. Divisions - <div>

The <div> tag is a generic container used for grouping and styling content. It's often used with CSS to apply styles to a group of elements.

<div class="container">
  <p>This is a styled container.</p>
</div>

9. Line Break - <br>

The <br> tag is used to insert line breaks within text, which is particularly useful for creating content with manual line breaks.

<p>This text has a line break here.<br>And continues on the next line.</p>

10. Horizontal Line - <hr>

The <hr> tag creates a horizontal line, often used to separate sections or content on a web page.

<p>Content above the line.</p>
<hr>
<p>Content below the line.</p>

These are just a few of the many HTML tags available. Each tag has a specific role in defining the structure and presentation of your web pages. As you continue learning HTML, you'll discover more tags and elements that cater to various content types and design needs.