HTML stands for HyperText Markup Language which is used for creating webpages and web applications. It defines the structure of the page used by the browser to render web page in the World Wide Web. HTML is omnipresent as whenever any web technology is used this Markup Language comes in handy to provide the overall layout of the pages.
As a beginner One should be familiar with these terminologies as it lays the foundation of the language. They are
- Elements
Elements are the identifiers that describe the structure and content of the objects inside a page. Some used elements are level of headings(<h1> through <h6>), paragraphs (<p>) and many more like <a>, <div>, <span> etc.
- Tags
An element when embedded between less than and greater than angle brackets is considered as Tag. Tags mostly come in pairs of opening and closing tags.
Opening tags are the beginning of an element and closing tags represents the end of an element. Example <span></span>, <div></div>, <a></a>
- Attributes
Attributes provide some additional information about an element. Attributes are created within the opening tag, after an element’s name. For Example. <a> element having an href attribute would look like this: <a href="https://google.com/">Google</a>
This is the basic structure of the html text base code that we write which in turn our browser understands(parses) to display in the web page.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Beginners HTML</title>
</head>
<body>
Welcome to shubham's blog!
</body>
</html>
Here you can see <!DOCTYPE html>which shows the DOCTYPE Declaration which informs the browser that the document type is HTML 5.
<html> tag shows the beginning of the HTML content of the page and </html> shows the end of the content of page and in between is the actual content of the page which contains various other elements
<html lang="en">denotes the lang attribute which specifies the language of the element's content. It can vary according to language. Example "fr" for french , "es" for spanish and many more.
The <head>section of the webpage describes the stuff that is not present in the body of the webpage but contains other information which browsers need to know. Ex. Title of the page. It contains other information as well but for the start all browser needs to know that it has a title.
The <body>section of the webpage shows the actual content which is shown by the browser. Inside the body tag we embed our various html elements.
The whole html webpage can be seen as a tree like structure also know as DOM(Document Object Model)
Headings
Headings assist to speedy cut up content material and set up hierarchy, and they may be key identifiers for users studying a web page. The heading levels go from
<h1>to<h6>. Every level of heading should be used to value the content and not to make the content bold or bigger. We can use CSS to do that.<h1>is the highest level of heading and<h6>is the lowest level of heading.Image tag
The <img> tag is used to embed an image in an HTML page. It provides the link for the referenced image. Example
<img src="ball.gif" alt="Ball">
As you can see <img> tag takes into consideration 2 required attributes. src = It specifies the path of the image alt = It specifies the text which is displayed when the image is somehow not being loaded.
You might note that <img> tag does not have an end tag and tags which do not have an end tag are known as Empty Tag.