HTML Classes — Chapter 01 by The TricksDuniya Team
Hello Dear TricksDuniya Viewers or Readers. From Today we have started Class of HTML which is also known as "Hyper Text Markup Language". This is a complete guide to Learn HTML. This guide is in English(US) Language. But if strength will say to Post this Thread in Hindi Language then we will Post it.
So, if you have decided to learn HTML by Our Online Class & want to create your own Webpage then please proceed.....
Chapter 01 - HTML Introduction
1-1 Introduction
So you have decided to design your web pages yourself! Good decision. So let's start it.
Web pages are ordinary files with .htm or .html file extensions. They contain a code named "hyper text mark-up language" or html. This codes when viewed in a browser like Internet Explorer or Netscape will be seen as beautiful web pages however code under web page may be complicated.
To design an html web page you have two options:
a) You can use a web page editor like Microsoft FrontPage to create web pages. It works exactly like Microsoft word (a complicated editor program used for creating and editing book, letter etc pages.) You just type text, insert graphics and finally save your document as an html web page. By the way word 2000 itself can save your existing documents as html pages.
So you see designing a web page can be very easy. But soon you will see that this is not a good option for creating a professional web page.
b) Second option is to learn html codes and write html pages in a simple text editor. As we said your codes will be seen as WebPages when viewed in a web browser.
1-2 Reasons for choosing second option
- If you want to design professional web pages using these tools will not be enough. You must be familiar with html codes. - Results of these editors are big and sometimes chaotic code. Maintaining this code is very difficult.
- If you want to design dynamic web pages in future you will need to know html codes. - If you will need forms in your pages to send information to server and return result pages back to browser you will need to know html codes. - There are other reasons that dictate us to learn html coding and not satisfy with these tools.
1-3 Tools you will need
You will need a simple text editor to write html codes. For example you can use NOTEPAD in windows or any text editor in other operating systems. You will also need a browser like Internet explorer or Google Chrome or Opera or etc. In this course we will assume that you are working in windows 9X/NT/2000 in Notepad.
We recommend you to use NOTEPAD because it is very popular & easy as compaire to any other softwares.
1-4 Start Here
Now open notepad and type the following code.
Example 1-1:-
Code:
<HTML>My First Webpage</HTML>
Now save the text as "myfirstwebpage.html" or you can give any other name to your webpage. To browse html file open windows explorer and double click on the file. You must see your first web page opened in your web browser.
and are called tags. First one is a start tag and second is an end tag. Tags are something like commands in programming languages. tag tells the browser that this is start of the HTML and marks its end.
mark start and end on a html page.
1-5 HTML code headers
Every html page must have a header. Header contains important information about the page. Different tags are used for different sections of a header. Header of an html page is specified by and tags.
Code:
<HTML><HEAD> . . . </HEAD></HTML>
We will enter header information between tags.
In Headers tags we include coding of icons, secured servers, meta-contents, etc.
These things you will read on later chapters.
1-6 Title
One of the most important parts of a header is title. Title is the small text that will appear in title bar of viewer's browser. So html document will be as below :-
Code:
<HTML><HEAD><TITLE>Title of your webpage</TITLE></HEAD></HTML>
Always Remember that the spelling of TITTLE is "TITLE" in HTML not "TITTLE" .
1-7 Webpage body
Now our web page needs a body in which we will enter web page content. As you may guess we will use these tags:
Code:
<BODY></BODY>
Yes! You are right HTML is a conceptual based language.
Body will come right after header end tag. So our web page will be something like this
Example 1-2:-
Code:
<HTML><HEAD><TITLE>My company web page</TITLE></HEAD><BODY>Welcome to my homepage. </BODY></HTML>
Now type html code in notepad and save it as "page2.html". Then view html file in your browser by double clicking on it in windows explorer or on which you usually use.
1-9 Background color for body of web page
If you want you can change background color of your web page by extending tag as below.
Example 1-3:-
Code:
<HTML><HEAD><TITLE>Page with Background Color</TITLE></HEAD><BODY BGCOLOR="PINK">Page with Background Color</BODY></HTML>
This will change your background color to PINK.
Always Remember that the spelling of COLOUR is "COLOR" in HTML not "COLOUR" .
1-10 Background Image
We can use a background picture for web page instead of background color. You must have an image file in .gif , .jpg , .png or etc.. formats.
You just have to do that put this code in your webpage.
Code:
<BODY BACKGROUND="image1.gif">
Example 1-4:-
Code:
<HTML><HEAD><TITLE>Page with background image</TITLE></HEAD><BODY BACKGROUND="image1.gif"></BODY></HTML>
Image file must be in the same folder as your html file. Otherwise browser will not be able to find it.
>> Kindly, give your Feedback related to this topic. We will Help you Happily.
Also, give your feedback if you want to see this Thread in Hindi.
(This post was last modified: 11-28-2015, 03:25 PM by Avishkar Singh.)
(Y)