Learn HTML Quickly

Learn how to make an HTML web page really quick and easily!

Hello my name is Kevin Hopcraft and I am going to teach you how to make web pages with HTML code. HTML code is really simple and is nothing like programming at all; actually it is the easiest type of code out there. So if you are trying to learn HTML because you would like to be a programmer, HTML is good to start but don’t study it for hours, when you are done go to CSS. Anyway, continuing the tutorial for making web pages.

It is best to start HTML by understanding what it means. So I will explain in detail to you exactly what HTML stands for: Hyper Text Markup Language. Why would it stand for this? I have no idea; I am not her to explain that(just to explain it’s meaning;D). The code you use for a web page is never in capitals. A simple webpage looks like this:

This is the text that appears on any tabs you create in Firefox or Internet explorer. Also in a search engine this is what appears as the name of you’re website.

Under body is where you type all you’re code that you want to do things and all you’re text that you want displayed.

If you save this as an HTML file with notepad (for windows) or text edit (with Mac)
With the extension of html, you will get something like this:

Notice that the text typed in between the tags show up on the screen yet the title doesn’t. This is because the text in the body tags always shows up here. By the way a tag is just a command used in HTML.

Now I’ll explain all of the other commands shown. Always when you make an html document you must start it with otherwise it will not work with all browsers. After the tag you will have to make a tag which holds all the ‘invisible’ information needed, then there is a tag which is the title of the page as I have said previously.

Now then you notice a tag, whenever you make a tag there has to be an end and when you put a / in front of your tag it means that you have ended the code before it.

Make sure you have an end tag for every tag you make. Onward we march, after the tag you will have a tag which ends the tag. There is then a tag which has under it, all the info you write to make what you want and all the small tags to make images appear and text to grow bigger or make it different colors and a lot more which I will explain  in detail.

You guessed it the next tag is which ends the tag. Now you make an tag which ends the tag and you have made a web page. Go down and I’ll show you some code to make images appear and align text. First a little review:

Basic Commands Needed

This is where you name your page. It will show in a new tab. Under body is where you type all the code and text you want to use for your page and stuff.

All right now then;

Web page with image and links:

Title

http://www.google.ca/”>Google

This is the image tag, you always need to have the img and the src part. Src is basically what you put the image in. Img is just there to tell the browser it’s an image tag but it’s still required. Notice that there is no tag, that is because this is one of a dozen or so tags that does not require the end tag.

Google

This is the link tag a means ‘anchor’ href is what you always use for the link to the website, in between the “” you will see http://www.google.ca/ well if you wanted to link to a page you made you would have to just put the filename, for example: ‘thing.html’. Once the tag is ended you see Google, well this is where you name the link and it’s what the user will see when they open the page. Then you close the tag with a tag.

Now I am going to show you a few basic commands to layout the page and

make a table. Any other tags you want to learn (and there are lots!!!) you can

search Google for a lot . But I do recommend this website:

http://www.w3schools.com

This website is a very good website for learning more html and stuff like that. Continuing: A table command.

makes a table with a border of 1 px. If you don’t want a border

just take that part away.

This starts a new table row

This ends the previous cell

This ends the previous row

This starts another table row

This ends that table cell

This ends that table row

This starts a new table cell

Anything in between these shows up in a table cell!

This starts another table cell

Anything in between these shows up in a table cell!

This ends the table

What this would end up with is something like this:

How to make your page aligned nice and neat:

Makes everything in between these two tags align left.

Makes everything in between these two tags align right.

To make things go in the center you use Alright that’s the end of this tutorial. Hope you learned how to make a web page. Remember go to www.w3schools.com for more info.

One Response

Pawan Kumar
08.10.29

This is very good tutorial..I liked it. I would be very happy if you could kindly send me some tips like this on my email Id too. My email ID is: pawanpath@gmail.com.

With Regards,

Pawan

Leave Your Response