Content and Images Copyright of ISDProductions.com 2006. All Rights Reserved.
Design 2.1
Design 2.1
Didn't find what you we're looking for? Ask Dr. Zoidberg
What you will need:
-A computer (PC or Mac)
-Some type of text editor, notepad will be fine
-thats it!
So Lets get started!
HTML is the main language used to create web pages, although new languages have come since it's inception, HTML is still the backbone of most web sites even today. It is comprised of elements called tags, each tag is started by the symbol <
and ends with >
the first tag you are going to learn in this tutorial is the <HTML> tag.
Every page you create should start with <HTML>, it tell's the browser that the page it is trying to load will comprise of HTML and that it needs to get ready for it. So go ahead, open your text editor and type in
<HTML>
Ok, got it typed? good lets continue.
The next tag we are going to learn is <TITLE>
The <TITLE> tag lets the browser know the title you want your page to have. Page title you ask? Yes, look all the way at the top left of your browser, it says HTML Basics - HTML Tutorials -
this is the title of this page, for the purposes of this tutorial we are going to name your page "My First HTML Page" so the code for this will look like
<TITLE> My First HTML Page </TITLE>
Wait a second here....whats that </TITLE> doing there? We haven't talked about that? Good observation, the </TITLE> tag is just like the <TITLE> tag, except for one main difference. Where the <TITLE> tag tell the browser the title of you page is coming, the </TITLE> tag tell the browser that the title of you page is over. This is a main theme in HTML, as well as the world, every action has a equal and opposite reaction, or every HTML tag has an equal and opposite tag. As you write your code, and work out the parts of your site, each tag must have a closing tag to let the browser know that it's done. You can close a tag simply by writing it again, but putting a / in front of it as shown above. Got it? If not thats ok, it will become more clear as we move on.
Your code should now look like this
<HTML>
<TITLE> My First HTML Page </TITLE>
You have your <HTML> tag letting the browser know that you want it to read in HTML format, and you have you <TITLE> tag to name your page, and the </TITLE> tag to let the browser know your done naming your page. So now you would probaly like to add some content. How do you do this? Easy!
Type this on the next line of your document "This is my first HTML Page, <BR>Whatcha Think?"
<HR>
Ok, I broke the theme a bit here, and introduced you to 2 new tags, don't worry, I think your ready for it. The first new tag you should have noticed is the <BR> tag. This tag tells the browser that you want the next your writing to stop and go to the next line, since HTML doesn't act like a word processer, you must tell it when you want text to move on the the next line, simply hitting enter is not enough, you must use the <BR> tag. The next new tag is the <HR> tag. This tag gives you a line or "Horizontal Reference" Across the page, not necessary, but it does help break things up a bit and enhance your pages look. I know what your thinking, :didn't you say each tag must end with a </> tag of the same? well, yes and no. Just like the laws of nature, the laws of HTML are not always valid, certain tags such as <HR> and <BR> don't need end tags. I just wanted to get you in the frame of mind to always end your tags because not ending your tags can create lots of headaches once you get into more serious HTML coding. So now your code should look something like this
<HTML>
<TITLE> My First HTML Page </TITLE>
"This is my first HTML Page, <BR>Whatcha Think?"
<HR>
So now we just need to add one more line of code, </HTML>
This lets your browser know that your done showing it HTML, so here the full code:
<HTML>
<TITLE> My First HTML Page </TITLE>
"This is my first HTML Page, <BR>Whatcha Think?"
<HR>
</HTML>
click here to see what it will look like.
Go Ahead and save your document, go to save as, change the file type to plain text, and name your file
firsthtmlpage.html
now upload it to your server and check it out! It should look just like my example above. Ok, your HTML basics tutorial is now done, your ready to move on. See ya next time.