History of HTML | Boilerplate Explained
History of HTML
In 1989, an English Computer Scientist, Sir Tim Berners Lee invented the world wide web ( WWW) and in 1991 Tim Berners Lee wrote the first version of HTML. Since then, there have been numerous different versions of HTML. The first version of HTML was HTML 1.0 and it was officially released in 1993 for the purpose to share information that can be accessed via web browser. Then in 1995, HTML 2.0 was published which is slightly better then HTML 1.0. HTML 2.0 comes up with few additional features, which helps users to create more effective websites. Then comes HTML 4.01 in 1999, which was widely used and was a successful version of HTML until 2014, Then comes HTML5, which we are currently using.
What is HTML?
HTML stands for Hypertext Markup Language. HTML is used for creating web pages & here we can add the main content of our website. HTML describes the structure of a web page and it consists of series of elements. These elements tell the browser how to display content and more.
Hypertext and Markup Language are two different words. Hypertext means link between the web pages and Markup Language means text between the tags. So, we can say that text between the tags is a markup language.
Also read:- Introduction to HTML, CSS and JS
Simple HTML document (Boilerplate)
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<meta name = "viewport"
content = "width=device-width,
initial-scale=1.0">
<meta http-equiv="X-UA-
Compatible" content = "ie=edge">
<title> your title here </title>
<link rel ="stylesheet"
href="style.css">
</head>
<body>
<script src = "index.js">
</script>
<h1> This is heading1 </h1>
<h2> This is heading2 </h2>
<p> This is a paragraph </p>
</body>
</html>
Boilerplate Explained
<!DOCTYPE html> :- <!DOCTYPE html> is the first line in our HTML code. It tells the browser what version of html the page is written in. If you didn’t add this line of code in your file, then some HTML5 tags ( <article>, <header>, <footer>) may not be supported.
<html lang = “en”> :- <html> element is the top level element of the HTML file. Here we nest the <head> and <body> tags inside it.
The attribute lang inside the html tag describes the language for the page.
<head> :- <head> element represents the collection of metadata, which is the data that describes the document to the machine.
UTF-8 inside the head tags specifies the character encoding for the HTML document.
<meta name = "viewport" content = "width=device-width, initial-scale=1.0">
This tag helps us to render the width of the page to the width of the device’s screen size. If we don’t add this , the webpage may appear zoomed out on the device screen.
<meta http-equiv="X-UA- Compatible" content = "ie=edge">
This <meta> tag allows web authors to choose the document mode for internet explorer. ie= “edge” helps to display content in the highest mode.
<title> your title here</title> This tag is the title for the web page. The text you write inside the title tags will shown in the browser’s title bar like this;
<link rel ="stylesheet" href="style.css">
This line of code will link our CSS file with the HTML page.
<script src ="index.js"> </script>
Script tags are placed between the body tags. This helps us to link our JavaScript code with the HTML page.
<h1> This is heading1 </h1> <h2> This is heading2 </h2> <p> This is a paragraph </p>
These tags are also placed inside the body tags. <h1> represents the heading1 and <h2> represents the heading2. There are six headings in HTML <h1> is the largest heading and <h6> is the smallest one.
<p> tag represents a paragraph, it is also placed between the body tags.
You should add this simple HTML document also known as boilerplate to each of your HTML pages, As it contains very important information like metadata, and here you can add external stylesheets and script tags with your HTML page. You don’t need to memorize this whole boilerplate, because with the help of some modern text editors you can type it in just one simple click. In our next post we will install one of the most popular text editor (VS Code) so stay connected with us, Thanks for reading this, see you next time till then bye bye.
Related posts
Introduction to Web Development
