Hyper Text Markup Language, or HTML, is one of the easiest programming languages to learn. In essence, it is composed of a series of HTML Tags that are saved in an unformatted text file with a .php extension. If you did not understand a word that was just said then be sure to look at the picture below.
Ok; now to the left is an example of what will appear when you save an HTML file. On the zoomed in section you can clearly see the .php file extension and the text file type; this must be the same for any webpage saved.
But now for the meat of HTML; in any word editor html begins with the signifying <html> tag. To end most HTML tags, you use a / slash. So at the top of any html document you will encounter <html> and at the bottom you will see </html>. The easiest way to learn HTML is to practice it, so below is a list of the most commonly used tags and certain points about them, also below will be a copy of an html document as a resource.
<html> - Encloses an entire document and identifies it as the html language.
<head> - Encloses the document header information, including the title.
<title> - Encloses the document title.
<a href="url" target="frame"> - Encloses a link, ends with </a>.
<body> - Describes page's preferences (background color or img src, font color, link colors etc.).
<!--comment--> - Used to place comments throughtout pages that cannot be seen by the visitor.
<img src="img url" width="100%" alt="logo"> - Embeds an image on the page and sets preferences.
<br> - Forces a line break.
<p> - Forces a paragraph break.
<big> - Encloses text and makes it big.
<blink> - Encloses text to make it blink.
<font size="-1" color="green" face="Tahoma"> - Sets font preferences.
<body> - Encloses main section of html, usually placed after head+.
<u> - Encloses text to be underlined.
<b> - Encloses text to be bold.
<table width="20" bgcolor="blue"> - Creates a table.
<tr> - Creates a table row inside of a table.
<td width="30" bgcolor="white"> - Encloses table data inside of a table row.
<frameset rows="20, *" OR cols="20, *"> - Creates frames on the page and sets their length.
<frame src="http:www.blazedent.com/"url" name="uptoyou" scrolling="no"> - Inside of the frameset tags, sets frame info.
Below is some sample html for your viewing pleasure to help you understand the concept of it all. Please note the positioning of the tags and the fact that any text located in the body tags that are not encased with < and > become actual text on the page that visitors can see. To see what the html below would produce to the viewer, click here for a sample pop-up page.
<!--all html is copyright 2002 Blazedent-->
<body bgcolor="#FFFFFF" text="#004080" link="#0099cc" alink="#0099cc" vlink="#0099cc">
Welcome to <a href="http://blazedent.tripod.com" target="frame_2">Blazedent</a>!
<font color="red" size="3">
Contact us <a href="mailto:[email protected]">here</a>.
Please note that this html tutorial is very limited and strictly intended as an introduction for those who know nothing about it; in later tutorials everything will be more advanced. For now, please check the web for the mass resources that are available; a great website the has much information is Web Monkey.
The main purpose for web development tutorials is to inform beginners of how it all works, and how they can get started. Going into depth on the subject of HTML would require almost a whole website devoted to it. For anyone is not partial to typing up html, alot of website hosts (hosts are explained in the next tutorial), offer easy to use online webpage applications. Their are also literally hundreds of website design programs that can be downloaded for free or bought at your local BestBuy. The art of actually constructing webpages through solely typing HTML in a text editor is becoming obsolete; however, knowing html can help anyone figure out the problems that come with alot of the webpage designing software. The programs that create websites still develope HTML files, they just use user-friendly visuals to help quicken the proccess.
I hope that this tutorial has at least been a stepping stone for any beginners out there, and if your still interested in learning more then you may as well continue on to the next tutorial that covers HTML more in-depth with a table of many common HTML tags as well as more information on how to use them. Check out the next tutorial.
- Joseph Lookabaugh