Welcome to Hyper Text Markup Language (HTML)

Not so programming language
By - Ashish Singh
Engineer at NextFuturegenz
HTML Basics: Understanding the Fundamentals

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.

HTML Document Structure

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

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

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>


Common HTML Tags

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.

Conclusion

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.