HTML stands for Hyper Text Markup Language. HTML uses tags to identity its source code.
In the above example <p> is called open tag and </p> is closing tag. These tags determine what will happen to the text with in it. What will be the appearance and behavior of the text on web browser.
In the above example <h1> is opening tag and </h1> is closing tag. These tags determine what will the appearance and behavior of the text with in it on web browser.
There are so many other HTML tags are there like this. We will discuss about them one by one.
We need any text editor to write HTML program. and a web browser to run it.
What is a web browser ?
A web browser is an application software which is used for accessing information on the World Wide Web or Internet. In simple words, a web browser is a software that helps us to access information of another computer through internet. Some of the examples of web browser are Internet Explorer, Mozila Firefox, Google Chrome, Opera etc.
If you do not have a computer, do not worry. You can practice it on your smart phone also. So many applications are available on google play store. Download one of them and practice it on your smart phone.
Normally it is common for all programming learners to write Hello World program as their first program. So let us write hello world program.
<!DOCTYPE html> <html> <head> <title>This is my first web page</title> </head> <body>
An HTML program is use used to define the content of the program by using a special markups.
A CSS ( Cascading Style Sheet) defines the style of the HTML elements in the page. The styling may be the color of elements, the space between elements, the layout of elements etc.
The second line HTML element. It defines the browser that the text with in open and closing HTML tag are actual HTML program.
The third line HEAD tag. It immediately follows the HTML tag. It contains all the non-visual elements. Means the elements with in this tag will not be displayed on web browser. But contains specific information about the web page. These information are different meta data, title of web page, link to css file or css codes, like to java script file or java script codes etc.
The fourth line TITLE tag. It is used to specify the title of web page. It is very important tag because it is important for SEO and displays as clickable headline on search result.
The fifth line is HEAD closing tag.
The sixth line is BODY tag. This tag follows the HEAD tag. It contains all visual elements. Means the elements with in this tag will be displayed on web browser. The elements that can be placed with in the body tag are headings, paragraphs, lists, quotes, images, links etc.
The seventh line is H1 tag. This tag displays the text with in it as heading on web browser. We will discuss headings in detail on our later lectures.
The eighth line is BODY closing tag.
The ninth line is HTML closing tag.
can we write out HTML program using any word processor ?
No avoid word processors. We can write HTML programs using any text editor only. The default notepad provided with windows is fine. You can also download Notepad++ for a better user experience. You can also use other text editors like Sublime Text or Komodo Edit. These are also free to download and use.
How to write a HTML program ?
If you want to write the above mentioned HTML program. Create a text file using any text editor and write the code with in it. But the file should be shaved with .html or .htm extension. Let us save our file as myprog1.html
How to run a HTML program ?
Open the program using any web browser to see the output. To open it in any web browser,
right click on the file
choose open with
choose the desired browser.
In this course we will create the front end of a blog. So that you will ensure what you have learnt and its practical implementation. Just follow instructions as you proceed further. Do not be afraid of programming codes. By the time you complete the course, everything will be easier for you. I believe it.
Golden Rules to Remember while writing HTML code
Majority of the HTML tags must be closed. For example <HEAD> is opening HEAD tag and </HEAD> is closing HEAD tag.
When using multiple HTML tags, they must be closed in the order in which they are opened.
Explain the difference between tag and element ?
Tags are the labels used to mark the opening and closing of an element. An element consists of an opening tag and closing tag. both the opening and closing tags look same. The only difference is that, the closing tag has an extra forward slash (/).
Theoretically tag and element both are different. But in real life we are using any of them to represent element only.