Headings are considered very important in HTML documents.
HTML Headings
Defining Headings are done with the <h1> to <h6> tags.
<h1> helps you define the heading that are most important heading. <h6> helps you define the heading that are least important heading.
Example
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading
4</h4>
<h5>This is heading 5</h5>
<h6>This is heading
6</h6>
Try it Yourself
Note: before and after a heading browsers will automatically add few white space (a margin)
Headings Are Important
Search engines makes use of the headings for indexing the structure and content of your web pages.
Users make use of headings to skim your pages.For showing the document structure, it is important to use headings.
<h1> headings are used to indicate main headings, which is followed by <h2> headings, then the less important headings are given <h3>, and so on.
Note: Make use of HTML headings for headings only. Do not use headings to make text BIG or bold.
HTML Horizontal Rules
The <hr> tag is used to define a thematic break in an HTML page. It is displayed mostly as a horizontal rule.
The <hr> element can be used for separating content (or define a change) in an HTML page:
Example
<h1>This is heading 1</h1>
<p>This is some text.</p>
<hr>
<h2>This
is heading 2</h2>
<p>This is some other text.</p>
<hr>
Try it Yourself
The HTML <head> Element
The HTML <head> element is not related or nothing to do with HTML headings.
The <head> element will be a container for metadata. HTML metadata refers to data about the HTML document. These Metadata present is not displayed by the browser.
The <head> element is written between the <html> tag and the <body> tag:
Example
<!DOCTYPE html>
<html>
<head>
<title>My First
HTML</title>
<meta charset="UTF-8">
</head>
<body>
.
.
.
Try it Yourself
Note: Metadata is used to define the document title, character set, styles, links, scripts, and other meta information.
HTML Tip - How to View HTML Source
You could have seen a Web page and wondered "Wow! How these things are done?"
.For finding it out, right-click on the page and click on "View Page Source" (in Chrome) or "View Source" (in IE), or something similar in another browser. This opens a window containing the HTML code of the page.
HTML Tag Reference
NGO' tag reference consists of additional information regarding these tags and their attributes.
in the next chapters of this tutorial, you can learn more about HTML tags and attributes .
| Tag | Description |
|---|---|
| <html> | Defines the root of an HTML document |
| <body> | Defines the document's body |
| <head> | A container for all the head elements (title, scripts, styles, meta information, and more) |
| <h1> to <h6> | Defines HTML headings |
| <hr> | Defines a thematic change in the content |