The Web has Changed the entire world, we can share the information remotely anywhere in the world & can be accessed by anyone with just internet connection. Web was introduced by Tim berners lee in 90's & this was the mark of information era. And to build these websites three main things are required HTML, CSS and JavaScript (JS). Website is nothing but collection of web pages. HTML is used for structure of a webpage, CSS is used for the looks & JS is used for function of the web. In this article we will just explore basics of HTML.
Before we go to HTML, we will just have a look at server.
Intro to Server
Server is nothing but a computer with special software, that serves the web and shares resources to the user (client). There are lot of servers now a days but in initial days apache2 server was famous and this was the standard one and to manage these servers there are server management tools like cPanel (for more info click here) and we don't want to go in depth for now. There will be lot of files in server in order to serve the web, when we try to access web the server first looks for the default index.html file
Lets dive into HTML
HTML (Hyper Text Markup Language) is used for structure of a webpage. HTML has some standard rule to follow for better structuring of the web page.
Here is a boiler plate code for HTML :
<!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>
<h1> This is heading one </h1>
<h2> This is heading two </h2>
<p> This is were you write paragraphs </p>
</body>
</html>
Tags or Elements
<h1>, <h2>, <p>, ....
these are called elements or tags. These tags specify what should be the format of the content and these tags can also have attributes & these are not visible in the web browser when rendered.
Lets dive in to build HTML
To write or edit these HTML files, there are code editors which we developers can use it for development. There are lot of code editors in the market like atom, VScode, sublimeText, Vim, etc., one such editor we use is VScode which is most popular at the time of this writing and these editor provides lot of features and can install plugins too... which makes developer life easier.
One such example is Emmet plugin, which automates or complete the codes.
The boiler plate code of HTML which we saw above, by using emmet we get these HTML code by just typing '!' then press tab or enter in the empty HTML file. This is just one use of emmet, we can use this more such things. Our focus should be just learning to code, then these things will automatically get used to it.
We will learn more things step by step, so stay TUNED !!!
Top comments (0)