HTML, or Hypertext Markup Language, is the backbone of the internet. It is the language used
to create web pages, and it is what allows us to navigate the web and access information
from all around the world. In this tutorial, we will learn the basics of HTML, including how
to structure an HTML document, how to use tags to define elements on a web page, and how to
add content to those elements.
We use it to create basic structure of any website, it uses tags
to define what it would look online on the browser.
The structure of html is like a tree where it all begun with single html tag as root of the
structure and then start moving forward from there. In Html we have more than 120 tags we
can use to structure any kind of website may it be single page application(SPA) or a
full-fledged admin panel to manage content.
An HTML document is made up of two parts: the head and the body. The head contains information about the document, such as the title and any scripts or stylesheets that are used on the page. The body contains the content that is displayed on the page, such as text, images, and links.
To create an HTML document, start by opening a new file in a text editor, such as Notepad or Sublime Text. Then, type the following code:
<!DOCTYPE html>
<html>
<head>
<title>My First Web Page</title>
</head>
<body>
<h1>Welcome to my web page!</h1>
<p>This is my first web page. I hope you enjoy it!</p>
</body>
</html>
This is the basic structure of an HTML document. The <!DOCTYPE html>
declaration tells the browser that this is an HTML5 document. The
<html>
tag encloses the entire document, and the
<head>
and <body>
tags enclose their respective
sections.
HTML tags are used to define elements on a web page. They are enclosed in angle brackets and
usually come in pairs: an opening tag and a closing tag. The opening tag contains the name
of the element, and the closing tag contains a forward slash before the name.
For example, the <p>
tag is used to define a paragraph, and it
looks like this:
<p>This is a paragraph.</p>
Some tags, such as <br>
and <img>
, do not require a
closing tag. These are called self-closing tags
To add attributes to an element, include them inside the opening tag.
For example, the
<a>
tag is used to create links, and it has an href attribute that
specifies the URL of the link. Here is an example of an anchor tag with an href attribute:
<a href="https://www.google.com/">Google</a>
There are many HTML tags, but some are used more frequently than others. Here are a few of
the most common HTML tags and their uses:
<head>
- Contains information about the document, such as the title and any scripts or stylesheets that are used on the page. <body>
- Contains the content that is displayed on the page, such as text, images, and links. <h1>
- Defines a heading. <p>
- Defines a paragraph. <a>
- Defines a link. <img>
- Defines an image. <ul>
- Defines an unordered list. <ol>
- Defines an ordered list. <li>
- Defines a list item. <table>
- Defines a table. <tr>
- Defines a table row. <td>
- Defines a table cell.
HTML is the foundation of the web, and understanding the basics of HTML is essential for anyone who wants to create a website. By learning how to structure an HTML document, how to use tags to define elements on a web page, and how to add content to those elements, you can begin to create your own web pages and share your ideas with the world.