Jul 2, 2020

HTML - The Basics

HTML stands for “Hypertext Markup Language”. This allows the users to create and structure paragraphs, sections, divisions, table, forms etc etc in your web-pages and applications that you are planning to create for your website.

HTML is not a programming language though, which means that it doesn’t have the ability to create dynamic functionality. Instead, it makes it possible to organise and format the documents, in the way you wanted it to be on your website pages.

Okay, before getting into the actual topic, we will look into some of the things that are important to know:

HTML was first introduced by Sir Tim Berners-Lee in late 1991 but was officially launched in the year 1995 as HTML 2.0.
HTML 1.0 was published in the year 1993 with an intention of sharing information which can be accessible and readable with the web browsers.
In the year 1995, HTML 2.0 was published and this had the features of HTML 1.0 along with much more advanced features. This remained as the standard markup language for designing and creating web pages until January 1997.
Next came the HTML 3.0 and this version had a fresh paper or a draft on the HTML page along with the additional features and this remained as the standard markup language for designing and creating a basic web page.
Then came HTML 4.0 in the year 1999. This was the most successful HTML version among all the previous version of HTML, until it was taken over by HTML 5.0 which came up in the year 2012, this is the version that is still being used across the world.

What is HTML? As we already know, HTML stands for Hypertext Markup Language. So, HTML refers to the hyperlinks that is there on the HTML page. "Markup language" refers to the tags and the way it is being used to define the page layout and elements within the page. HTML comprises of very simple coding and it is a bit easier compared to others. At the time of working with HTML, we use simple code structures which consists of tags and attributes to markup the website. There are certain attributes and elements that you need to use at the time of coding and we will look into some of them here:

<title> This tag is used to get the title of your page and this can be seen on the tab of your website. </title>
<h1> Your (h1) should consist of the heading or the main text of the body </h1>
Headings: We totally have 6 elements they are: <h1> <h2> <h3> <h4> <h5> <h6> and these can be used based on the requirement and in the way you want it to be.
<p> This is used to open a paragraph and all your text should be placed in between these opening and closing tags. </p>
<a> is usually used to insert any link from one page to another </a>.
<footer> this is a tag used to open the footer of your webpage. </footer>

These are some of the elements used in the HTML coding. Overall, HTML is a markup language that is really straightforward and a very easy to learn language even for those who have absolutely no clue about coding and are complete beginners in website building. How does this HTML work? Now that we have some idea about what HTML is, we will now look into how it actually works. HTML documents file should end with “.html” (saving it in this format is mandatory) as its extension or file type and when you do this, your document is turned into a html file and your document can be seen in any browser and at any point of time. The browser will read the HTML file and allow its content to be displayed on the internet so that the users can view it. Usually for an average website to be ready, it will have several html pages. For example: Home page, About us page, Contact us page, etc. and each of such pages will have separate document and “.html” as its extension. Each HTML page will have separate sets of tags which are called as tags/elements. We already saw some of the elements in html, these tags/elements act as the building blocks of your webpages. These tags and elements create a hierarchy that structures the content into sections, headings, paragraphs and other content blocks. Most of the elements in html have an opening <tag> and a closing tag </tag> and these tags should be used carefully because this is the syntax that HTML will understand. For Example: Imagine you want to open a paragraph and you wanted “My name is ABC” in that paragraph. p “My name is ABC p This is not the right way to code. The correct way is: <p> My name is ABC </p> With the above example it is very clear that, when you don’t open a tag, html will not understand what you are trying to say. Hence, it is always mandatory to open and close the tag. Below, you can see a code example of how to actually structure and place the HTML elements:

<div> <h1> Main Heading of the page </h1> <h2> Give it a catchy sub-heading </h2> <p> Your paragraph goes here </p> <img src=“#” alt=“ ” > <p> open an other paragraph with a link I.e., <a href=“https://www.abc.com”> Hyperlink </a> </p> </div>

The outcome of the above code would be:

The first element is a simple division (<div> </div>) we can use it to markup bigger content sections.
It also consists of a heading (<h1> </h1>), two paragraphs (<p> </p>) and also an image (<img>).
The second paragraph in the code includes a link (<a> </a>) with an attribute called href that is used for linking the page, i.e., it contains the destination URL.

Cons and Pros of HTML HTML has its own set of Cons and Pros. Let’s look into all those: Pros:

HTML is a widely used language with a lot of available resources available.
HTML can be used widely in all the browsers available.
HTML is much easier when compared to all the other coding languages.
It is considered as a clean and consistent mark-up language.

Cons:

HTML is mostly used for a website that is static and it used by those who are willing to share information only.
Some of the browsers do not give access to the HTML sometimes, it takes time to adopt to the new features.
Browsers’ behaviour are sometimes hard to predict and hence it is one of the cons in HTML.
You cannot make websites responsive with just HTML coding because it is just a markup language.

These are some of the Pros and Cons of HTML How are HTML, CSS, and JavaScript related? Though HTML is a powerful tool, we cannot make a website complete without using CSS and JavaScript. Hence it called as a markup language. Meaning you can only add text, tables, and align everything you want in your website. Using CSS and JavaScript can make the website colourful and responsive. All the three, HTML, CSS, and JavaScript are inter-related and have their own importance. However, HTML works well with these two frontend languages. These three together will create a rich user experience. CSS: It is responsible for styling the website such as: adding background colour, layouts, spacing etc. JavaScript: It is responsible for making the website responsive, example, adding pop-ups, add photo gallery, etc. Note: All these comes under Web Developer and click here to know more about this the complete in and out of what a Web Developer does, how and what can he do.