category:
html
description: Beginner tutorial covering what HTML is and how to create your first webpage...
In this tutorial we will discuss what HTML is and what it is used for, also some
examples that you can use to code your first page!
HTML (Hyper-Text Markup Language) is a web programming language, the
building blocks of any website. You could think of it like the alphabet of the
english language.
It is used to tell the Web Browser (Internet Explorer, Firefox, Netscape etc.)
how the website should look.
HTML is just one of many web languages used in websites, but it is the only language
which is used in every web page. Meaning learning HTML is a must!
How to view HTML
Every web page on the World Wide Web uses HTML, you can view this HTML with a
few simple clicks of the button, for example if you:
Right click with your mouse on this page.
Click view source.
It will bring up notepad or whatever your preferred editor is. On this page
you will notice lots of code that will mean nothing to you except jargon.
At the very top of the jargon you will see the text:
<HTML>
How do I make HTML?
You can make HTML with notepad or any other wordpad you may have downloaded.
You may have or have seen many of these WYSIWYG programs which input all the
HTML for you and you just have to tell the program what you want it to look
like, while these are great they can generate bad code and slow your site down.
Learning HTML is the preferred method of web design even so all code outputted
by these programs can be checked over and validated.
To make HTML in your notepad you just have to type in the code (examples will
be stated further along in this tutorial) and click 'save as' choose a file
name and at the end add a .html or .htm make sure to include the
dot for example webpage.html this will enable the saved file to be viewed
by your browser can you can see the output effects of your work.
What is HTML made up of?
The HTML language is made up of 'tags'. Tags are functions such as the above
<HTML> example which are enclosed in < and > arrows. All
tags open and close, for example our <HTML> tag this is called
the open tag, the closed version of this tag would be </HTML> all
tags in the HTML language open and close like this. (with a few exceptions
which you needn't bother with at this time)
What are tags used for?
Tags are used to start a function and close it with the text inside
these tags effected by the tags function. For example if we use our <HTML>
tag:
<HTML>
your website text here
</HTML>
Notice on our example how the tag opens the information is entered then when
all information has been entered the tags closed with the / slash.
There are four tags that are necessary to make a web page, these are:
<HTML>
<HEAD>
<TITLE>
<BODY>
The above tags represent different parts of the web page. The <HTML>
tags always comes first and should always be at the top of your code. Followed
by the <HEAD> tag then inside the <HEAD> tag is the <TITLE>
tag. The <TITLE> tag is then closed (remember all tags close with a /
symbol) followed by the <HEAD> tag. Next the <BODY> tag is opened
then it is closed. And finally the <HTML> tag is closed. If you have followed
this you should have the example below:
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
What are these tags used for?
The above tags make-up the structure of your webpage like the skeleton
of the human body, now I shall discuss which each tag is used for.
<HTML>
This tag tells the browser that the following code is HTML and should be treated
by the browser as such.
<HEAD>
This tag not only stores the <TITLE> tag but it also stores the information
for search engine descriptions and javascript functions but are outside the
scope of this tutorial.
<TITLE>
Inside this tag you can name the title of your web page, for example if
i was doing a website about dogs i could name it Dog information and pictures.
<BODY>
Inside this tag is all the site content, content is what you wish to display
to the viewer of the web page.
Creating my first web page
Okay now that you know what HTML makes up a web page its time to make
your first web page!
Open up notepad or your preferred text editor.
Input the following code:
<HTML>
<HEAD>
<TITLE>Welcome to my web page!</TITLE>
</HEAD>
<BODY>
Hi, this is my web page what do you think?
</BODY>
</HTML>
Now choose File > Save As
Pick a place to save it such as My Documents and name it: Webpage.html
Remember to add the .html to the end.
Now go to my documents and click the Webpage file.
Congratulations! you have just made your first webpage.
|
Creating my first webpage with HTML 
