What is HTML?
HTML stands for HyperText Markup Language. It is used to design web pages using the markup language. HTML is a combination of Hypertext and Markup language. Hypertext defines the link between the web pages and markup language defines the text document within the tag that define the structure of web pages.
HTML is used to create the structure of web pages that are displayed on the World Wide Web (www). It contains Tags and Attributes that are used to design the web pages. Also, we can link multiple pages using Hyperlinks.
.html is the HTML file extension
HTML Basic Format Page Structure:
Now let us look into the html page structure:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
<!DOCTYPE html>– A doctype or document type declaration is an instruction used to instruct the web page on what version of HTML is used in the web page. It is not an element or tag. The doctype declaration isnot case-sensitive.<html>– This tag is used to define the root element of an HTML document. This tag tells the browser that it is an HTML document. It is the second outer container element that contains all other elements within it.<head>– This tag is used to define the head portion of the HTML document. Elements within the head tag are not visible except for the title tag which we see above as the tab title.<meta>meta is a head element that tells the type of content a webpage has. Let's learn more about meta tag:charsetis the document’s character encoding which should be equal to “utf-8”(Unicode Transformation Format) for html5 documents. It is also case-sensitive. Lastly, utf-8 is the one type of character encoding. Most of the websites use utf-8. ASCII has one type of character encoding but it can encode only English characters.the
viewportis the existing size of the window where we are viewing the website but we might face issues in narrow screens like phones so this viewport comes in rescue for mobile-optimized sites. "content="width=device-width,initial-scale=1.0" is used for 100% viewport width meaning max width of the screen. initial-scale=1.0 is the zoom level of the page when the site is loaded for the first time. 1 is the default value.
<title>- The title you can see on top of the tab describes what the website contains.
<body> The body tag is used to enclose all the visible content of a webpage. In other words, the body content is what the browser will show on the front end.
Modern HTML5 Building Block,Sematic HTML:
<header>- It contains the introductory content and is the top part of the webpage.<nav>-This defines a set of important navigation links used within a document.<main>- This tag is used for the main content of your webpage.<section>- This tag is used to divide your content into meaningful sections<aside>- This tag is used for content that's related to the main content but not exactly part of it.<article>- This tag is used for a standalone piece of content that could be read on its own, like a blog post or a news article.<footer>- It contains the bottom part of the webpage,often containing copyright information, links to contact details, or other closing information.
HTML Comments:
<!-- -->
The comment tag is used to insert comments in the HTML code.
Features of HTML:
It is easy to learn and easy to use.
It is platform-independent.
Images, videos, and audio can be added to a web page.
Hypertext can be added to the text.
It is a markup language.
In the next blog, we will learn more about HTML.