Table of contents
Let's talk about HTML
Html stands for Hyper Text Markup Language. It provides the basic structure for a web page. This is used to specify whether your web content should be recognized as a paragraph, list, heading, link, image, multimedia player, form, or one of many other available elements. you can also define a custom element.
What is a Hyper Text Markup Language(HTML)?
For better understanding, let's separate them into two parts: "HyperText" and "Markup Language".
HyperText- HyperText refers to links that connect web pages with a website or between websites.
Markup Language- Markup Language is a language that helps define a web page's structure by including tags.
What is HTML5?
The most recent and comprehensive version of HTML, known as HTML5, added numerous significant updates and brand-new capabilities, including multimedia support, enhanced document markup, APIs, etc.
New elements in HTML5 include <video>
, <main>
, <article>
, etc. Along with the capabilities mentioned above, HTML5's syntax was changed and is now based on Document Type Declaration.
What is Tag?
In essence, an HTML tag allows the browser to differentiate between a document, an element, and regular content. A tag is always enclosed in two angle brackets, like this <>...</>
let's take an example of the paragraph tag.
<p>Hi Everyone</p>
What is Element?
Everything between the initial tag and the closing/ending tag is referred to as an HTML element. Below is a fantastic illustration of an HTML element.
<StartingTag> The content to display </EndingTag>
Some elements, such as the <img>
tag, lack a closing or ending tag.
What is an Attribute?
In HTML, an attribute is used to specify additional tag-related information. For instance, a style
an attribute can be used to add additional content to a <h1>
tag if we wish to style that particular tag.
Structure of HTML
The image above demonstrates the HTML structure, where everything in the <head>
tag is displayed to the browser and everything in the <body>
tag is displayed to viewers as part of the web page.
Let's take the example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<h1>Hello</h1>
</body>
</html>
Standard HTML Tags
<!DOCTYPE html>
The DOCTYPE declaration informs the web browser of the HTML version used to create the page. This guarantees that the web page is parsed uniformly across web browsers.
<html>
This is the opening HTML tag, often known as the root or parent tag.
<head>
All of the metadata for the document is contained in this tag. While loading, these details are hidden from end users.
<title>
An HTML document's title is specified by this tag.
<body>
This tag basically defines the body structure of an HTML document and contains all the main content of a website.
Essential Tags for Your HTML Document
Paragraph Tag
The <p>
tag is used to create a paragraph in an HTML document.
Example:-
<p>Enter Paragraph Here...</p>
Output:-
Enter Paragraph Here...
Heading Tag
For writing a Heading in HTML we use different types of tags ranging from <h1>
to <h6>
Example:-
<h1>Enter Main Heading Here...</h1>
<h2>Enter Secondary Heading Here...</h2>
Output:-
Anchor Tag
A hyperlink, which is used to connect pages, is defined by the <a>
element. Href is basically the URL that the hyperlink points to.
Example:-
<a href="where to navigate">Enter Link Name Here...</a>
Output:-
Line Break Tag
A line break in the text is produced by the HTML element <br>
. It is helpful when composing a poem or an address where the line breaks matter.
Example:-
<p>I m on line one <br> I m on line two</p>
Output:-
Image Tag
The HTML <img>
tag is used to show or embed images in web pages.
Attributes:
src
: This attribute is required, and it also contains the URL or path of the image to displayalt
: Defines an alternative text description of the image, It is useful if an image is having some issues then this text is displayed.loading
: Indicates how the browser should load the image. There are two types of loading, firsteager
which loads immediately and secondlazy
which loads the image when it comes under a particular viewport
So, that concludes our discussion on HTML and web servers. Thank you so much if you made it this far; I'd love to hear your thoughts.