adm
22-10-2006, 09:21 PM
Introduction
I'm guessing that this is your first time that you've come across HTML. Well then, sit back and read and you'll have your own webpage up within minutes!
HTML
HTML stands for Hyper Text Mark-Up Language. It is a coding language that is made to make even the basic of websites. Basically, the on the server of the website you are viewing sends this code to the browser you're using and it comes up on your screen as a webpage.
Tags
HTML coding is made up of tags like this one:-
<title>My Site</title>
If you don't have tags - then you can't create a HTML web page. The important thing to know and understand about tags is that they have to start, and they have to end. To start a tag, you have to use one of these: '<' and then enter the tag you want. Like this:-
<title>
That is a basic code - but it cannot be read by the browser because it hasn't got an end. To make the tag complete - you have to end the tag, after you've put what you want inside the tags, like so:-
<title>My Site</title>
With the tag complete, the browser can read the coding and display what the tag is telling it to.
Ok, let's start!
First of all, you should open up notepad which can be found in the accesories part of your programs section on your start menu.
Ok, so now you know about HTML and tags, I think you're ready to start on your journey, to create your very own first webpage.
Every basic webpage has to start with the html tag, this tells the browser that it's to read HTML and no other coding language unless specified.
So type in the following in your blank notepad document:-
<html>
Now, you don't have to end this tag until you've finished the webpage because then it tells the browser to stop reading the html coding.
Next, I think we should add a head tag to the coding. The head tag is used for putting other tags inside that don't necersarly appear on-page. So, you should have the following in your document:-
<html>
<head>
Ok, so now we need something to put in the head tags. I know - let's put a title tag in to tell everyone what your site is called! The title tag basically tells the browser the name of the webpage and displays it up the top. You see where it says Habbox UK Forum up at the top? That's the title of the webpage. So now you should have this:-
<html>
<head>
<title>My First WebPage
Now, what have I done wrong? I havn't ended the title tags yet. So now you should have this:-
<html>
<head>
<title>My First WebPage</title>
Now we need to end the head tag as there's nothing else that needs to be put in there. So your document should look like this:-
<html>
<head>
<title>My First WebPage</title>
</head>
Now we need to put content into the webpage. To do this we need to enter body tags which basically tells the browser that this is the start of the content. So your document should look like this:-
<html>
<head>
<title>My First WebPage</title>
</head>
<body>
Now, there are some things that we can do to extend the body tag. We can add a background colour to the webpage by adding a hex code to the body tag. Something like this:-
<html>
<head>
<title>My First WebPage</title>
</head>
<body bgcolor="#ffffff">
This tells the browser that the colour of the background is the one in the hex codes and it displays it.
Now we need to add the content. So add your content like this:-
<html>
<head>
<title>My First WebPage</title>
</head>
<body bgcolor="#ffffff">
My content
</body>
You can customise your content by adding a number of format tags. Like the font tag which you can tell what font face it is, the color and size. Like the following:-
<html>
<head>
<title>My First WebPage</title>
</head>
<body bgcolor="#ffffff">
<font face="verdana" size="1" color="#000000">My content</font>
</body>
To customise your text/content even more, you can make it bold, underlined or italic, or a mixture of the three, like so:-
<html>
<head>
<title>My First WebPage</title>
</head>
<body bgcolor="#ffffff">
<font face="verdana" size="1" color="#000000"><b><i><u>My content</b></i></u></font>
</body>
The U tag is for underlined, the I tag is for italic and the b tag is for bold tags.
Now you need to end the html tag to tell the browser to stop reading the code.
<html>
<head>
<title>My First WebPage</title>
</head>
<body bgcolor="#ffffff">
<font face="verdana" size="1" color="#000000"><b><i><u>My content</b></i></u></font>
</body>
</html>
Now, save your file as index.htm and upload it to your server. If you have no server or web hosting then visit www.hostultra.com for free hosting.
That's It
And that's it, you've created your first, basic webpage in a matter of minutes - and you've been learning aswell.
If you find errors with this tutorial then contact me.
I'm guessing that this is your first time that you've come across HTML. Well then, sit back and read and you'll have your own webpage up within minutes!
HTML
HTML stands for Hyper Text Mark-Up Language. It is a coding language that is made to make even the basic of websites. Basically, the on the server of the website you are viewing sends this code to the browser you're using and it comes up on your screen as a webpage.
Tags
HTML coding is made up of tags like this one:-
<title>My Site</title>
If you don't have tags - then you can't create a HTML web page. The important thing to know and understand about tags is that they have to start, and they have to end. To start a tag, you have to use one of these: '<' and then enter the tag you want. Like this:-
<title>
That is a basic code - but it cannot be read by the browser because it hasn't got an end. To make the tag complete - you have to end the tag, after you've put what you want inside the tags, like so:-
<title>My Site</title>
With the tag complete, the browser can read the coding and display what the tag is telling it to.
Ok, let's start!
First of all, you should open up notepad which can be found in the accesories part of your programs section on your start menu.
Ok, so now you know about HTML and tags, I think you're ready to start on your journey, to create your very own first webpage.
Every basic webpage has to start with the html tag, this tells the browser that it's to read HTML and no other coding language unless specified.
So type in the following in your blank notepad document:-
<html>
Now, you don't have to end this tag until you've finished the webpage because then it tells the browser to stop reading the html coding.
Next, I think we should add a head tag to the coding. The head tag is used for putting other tags inside that don't necersarly appear on-page. So, you should have the following in your document:-
<html>
<head>
Ok, so now we need something to put in the head tags. I know - let's put a title tag in to tell everyone what your site is called! The title tag basically tells the browser the name of the webpage and displays it up the top. You see where it says Habbox UK Forum up at the top? That's the title of the webpage. So now you should have this:-
<html>
<head>
<title>My First WebPage
Now, what have I done wrong? I havn't ended the title tags yet. So now you should have this:-
<html>
<head>
<title>My First WebPage</title>
Now we need to end the head tag as there's nothing else that needs to be put in there. So your document should look like this:-
<html>
<head>
<title>My First WebPage</title>
</head>
Now we need to put content into the webpage. To do this we need to enter body tags which basically tells the browser that this is the start of the content. So your document should look like this:-
<html>
<head>
<title>My First WebPage</title>
</head>
<body>
Now, there are some things that we can do to extend the body tag. We can add a background colour to the webpage by adding a hex code to the body tag. Something like this:-
<html>
<head>
<title>My First WebPage</title>
</head>
<body bgcolor="#ffffff">
This tells the browser that the colour of the background is the one in the hex codes and it displays it.
Now we need to add the content. So add your content like this:-
<html>
<head>
<title>My First WebPage</title>
</head>
<body bgcolor="#ffffff">
My content
</body>
You can customise your content by adding a number of format tags. Like the font tag which you can tell what font face it is, the color and size. Like the following:-
<html>
<head>
<title>My First WebPage</title>
</head>
<body bgcolor="#ffffff">
<font face="verdana" size="1" color="#000000">My content</font>
</body>
To customise your text/content even more, you can make it bold, underlined or italic, or a mixture of the three, like so:-
<html>
<head>
<title>My First WebPage</title>
</head>
<body bgcolor="#ffffff">
<font face="verdana" size="1" color="#000000"><b><i><u>My content</b></i></u></font>
</body>
The U tag is for underlined, the I tag is for italic and the b tag is for bold tags.
Now you need to end the html tag to tell the browser to stop reading the code.
<html>
<head>
<title>My First WebPage</title>
</head>
<body bgcolor="#ffffff">
<font face="verdana" size="1" color="#000000"><b><i><u>My content</b></i></u></font>
</body>
</html>
Now, save your file as index.htm and upload it to your server. If you have no server or web hosting then visit www.hostultra.com for free hosting.
That's It
And that's it, you've created your first, basic webpage in a matter of minutes - and you've been learning aswell.
If you find errors with this tutorial then contact me.