HOW TO WRITE BASIC HTML

welcome to my html tutorial! knowing how to write html allowes you to make web pages! i know this is big and long but trust me, it is very straight forward and the results are really awesome in the end.

so lets get started, (note: if your using a mac, great! just a few changes to what i say becuase this tutorial was written for windows users:  when i say open "notepad" just open simpletext. i think you can interpret the rest for yourself.)

go to your start menu and click on "run"

a small box should apper near the start menu.

in the box type: notepad

a window should apper with a spot for you to type in it. now you are ready to start typing html code

copy this text and paste it into your notepad window:

<html>
<head>
<title>my first webpage</title>
<body>
<h1> my first webpage </h1>
<p> hello this is my first webpage. <b> this is bold text</b>
<a href="http://ed79.tk"> this </a> is an awesome link

now, go to "file" then click on "save as" call it "my first webpage.htm" (when dealing with html we always save the file as an .htm)

now, go to wherever you saved the file. when you see it it should be an internet explorer file. double click on it and it should open in an internet browser window. you have created your first webpage! now i will show you haw to do it on your own. :)

to start off any document, you always use the header, <html>. so go to notepad and type in <html> to tell notepad that you are starting an html coded ducument.

then, to tell the program want we want to make a header for our document we use the header <head> so go one line down from <html> and type <head>.

then we tell notepad that we want a title for our page. we use: <title>. imediatly after typing that in (no spaces) we type in the title for instance: <title>test html. now we have to tell notepad that that is the end of our title or else the WHOLE peice of html we write will be our title :( so to end just about every thing we use a slash and then the original header. it should look like this: <title>test html </title>

now we are ready to start typing. we tell this to notpad by the header: <body>. this tells it that we are ready to begin the typing of our document. your whole html file should now look like this:

<html>
<head>
<title>*whatever you want here*</title>
<body>

CONGRAGULATIONS!! YOU HAVE COMPLEATED THE HARDEST PART!!!!!!!!!!!!!!

now we are readey to begin typing. typing is the easy part. skip a line from <body> and just start typing away! to create a new paragraph, use the header: <p>. NOTE: it is very very very inportent to close your paragraph when you want to create a new one. to close it we use the slash (</p>) so type <p> then type a few lines of text, the close it (</p>) and start a new paragraph. your document should look more or less like this:

<html>
<head>
<title>*whatever you want here*</title>
<body>
<p> blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah </p>
<p> blah blah blah blah blah blah blah blah blah

it will show up like this in the browser:

   blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah

  blah blah blah blah blah blah blah blah blah

ok so now we move on. open a new notepad document ( file, new) and type in this text:

<html>
<head>
<title>colored backround</title>
<body bgcolor="blue">
<p> blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah </p>
<p> blah blah blah blah blah blah blah blah blah

do you notice a difirance? color!!!! lets take a look at how to do it.

look at this html:

<html>
<head>
<title>*whatever you want here*</title>
<body>
<p> blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah </p>
<p> blah blah blah blah blah blah blah blah blah

now look at this html:

<html>
<head>
<title>colored backround</title>
<body bgcolor="blue">
<p> blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah </p>
<p> blah blah blah blah blah blah blah blah blah

do you notice the difrance that made the color? (and no, it is not the title that made the difirance.) hint: look for the name of the color

if you saw this line :<body bgcolor="blue"> you were correct!!!  to put color into a html document, you group it with the body. you use the tag: bgcolor="*whatever color here*" so get to your html and right next to body, put bgcolor= and then put any color in quotations (must be in quotations) make sure you close it off with the end braket!!! (example of bad color: <body bgcolor="blue". example of good color: <body bgcolor="blue">. now that we have go that down lets refresh. i have put several mistakes in this html below. copy and paste it to notepad and fix the mistakes. you will know if you are right or not from saving it as an .htm document and viewing it!

here is the bad html: (use the above to help you!! you DO NOT have to commit this all to memory.)

<html
<head>
<title>colored backround</title
<body bgcolor=blue>
blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah </p>
<p> blah blah blah blah blah blah blah blah blah

now that we have refreshed ourselfs, im going to show you how to add a link, and make text bold, then butt out of your life :) if you would like to learn more advanced html, or move on to xhtml, please vistit www.w3schools.com ( i give them credit for teaching me everything i know in html)

now, links! to make a link to anything we use "a href" this lets notepad know that we are making a link. to create a link open notepad, put in your vital headers:

<html
<head>
<title>blah</title
<body>

and then type in "<a href=" then, find any website, and copy the url ( here is a link to save you time, just copy it: http://www.w3schools.com/html/default.asp) and put it in ( it should now look like this:

<html
<head>
<title>blah</title
<body>
<a href="http://www.w3schools.com/html/default.asp")

Note: THIS IS REALY INPORTENT!!! after typing in the url you DO NOT have to close it with a braket. just be sure to put it in quotations.

now, we tell notpad what we want to link to say in the final version. ( for instance i could put a link like www.w3schools.com  or i could just say click here which is what most people preferer) so after typing in the url we type in what we ant it to say. after we do that we tell notpad to stop with the url by typing in </a> it should look like this

<html
<head>
<title>blah</title
<body>
<a href="http://www.w3schools.com/html/default.asp"here</a>

it will show up like this in the browser: here

ok now we make bold text. to do this it is prety simple. just type in <b> right before any bold text make sure to tell it to stop with the bold ofter you are done (</b>)

CONGRAGULATIONS! YOU HAVE LEARNED THE BASICS OF HTML! HAPPY WEBPAGE MAKING!