1&! US hosting - Hosting Made Easy. Order 1&1 Microsoft Web Hosting from the World’s # 1 Web Host. Get up to 5 FREE domains!
| HTMLCOOK - Main Page - lists all articles and tutorials |
||
| 1&1 hosting - UK hosting - Buy
your domain from 1&1 -
Best domain prices in the UK! 1&! US hosting - Hosting Made Easy. Order 1&1 Microsoft Web Hosting from the World’s # 1 Web Host. Get up to 5 FREE domains! |
|
|
HTML (Hyper Text Markup Language), is the language used to create your Web Pages. It's basically very simple and anyone can do it. Depending on your level of enthusiasm, you can actually publish your first Web Pages in just a day or two. This tutorial will walk you through all the basics and some advanced HTML in several easy steps that will have you beating up your keyboard programming web pages like an expert in no time. Armed with the tricks and code samples you'll find here you will be limited only by your own imagination. So whether you just want to design your own home page or make the big leap to a full blown Web Site you will be able to do it your way. You may want to print this tutorial for later reference while working as it will make it much easier to go through it. Work through the tutorial in the order given, as things will slowly get harder. There's also a list of HTML codes for you to print out and keep. |
|
|
|
HTML
is made up of numerous "TAGS" which are always included between the "less
than" < or "greater than" > brackets. The text that is in
between these brackets tells your Web Browser what to do, and how to recognize
and display the content of your Web Page. Your Web Page content is determined
solely by your imagination, and your creative use of these "Tags".
|
|
You
already use a browser to surf the web, so its something you already have.
|
|
All HTML documents require the minimum "tagging" in order to function in your Browser. The minimum HTML document looks like this: |
| <HTML> | This tells your browser that it is reading an HTML document and begins the document |
| <HEAD> | This begins your HTML document heading |
| <TITLE> | This begins your HTML document title |
| </TITLE> | This ends your document's title |
| </HEAD> | This ends your documents heading (The title is allways included within the "head" tags) |
| <BODY> | The "body" of your document. All of the content of your web page is within the "body" tags |
| </BODY> | End of body (end of content) |
| </HTML> | End of HTML document (end of your web page) |
| This
snippet of code will show only a blank gray page. There is no content within
the "<BODY> & </BODY>" tags. And a gray background
is simply the "default" background when none is specified in your HTML
code. If its not specified, then defaults are used. Your browser might show white as the default background. |
| All HTML Tags are surrounded by these brackets and all sections of an HTML document are noted by a beginning and an ending. The end of the "<TITLE>" is designated by the "/" charactor "</TITLE>". |
| It
is very important to understand that their is a certain "hierarchy"
of HTML tags which must be followed. Note that the <BODY> and </BODY> tags are all included within the <HTML> and </HTML> tags. Also note that the <HEAD> and </HEAD> tags are nested within the <HTML> and </HTML> tags. Notice further that the <HEAD> & </HEAD> tags are before the "BODY" tags, and that the "TITLE" tags are nested within the "HEAD". All tags on your page should be nested according to their hierarchy. It gets easy just keep going. |
|
Now
get ready to make your first HTML page. Open up your text editor, wordpad,
notepad, or what ever. |
| <HTML>
<HEAD> <TITLE> </TITLE> </HEAD> <BODY> </BODY> </HTML> |
|
Got it?
Cut and paste if you want, or type it out! Now add some new stuff to what
you've already got. (The new code is in Blue).
|
| <HTML>
<HEAD> <TITLE> My first web page</TITLE> </HEAD> <BODY> This is my first web page </BODY> </HTML> |
| Save
this in your file folder that you created a minute ago. Give it a name,
and save it as an HTML document. Say "mypage.html". Now open your browser. Click "Open" Select the file folder you created. Open "mypage.html" in your browser because you have just created your first Web Page. Congratulations! To check what it looks like click here |
| Did
it work? If yes, then go to the next step. If not - Check your spelling. Check you used the "tags" < and > EXACTLY where I told you to. Check you saved your document as .htm and not .txt or .doc Try again HINT: It is a good idea to write your HTML tags in CAPITAL letters. This makes your coding easier to read and edit. If you have problems - the first thing to do is check your spelling Check you've got the capitalisation right - although it won't make much difference on your computer, when you upload to the web (yes you will do that - soon) it will. You should always aim to use only lowercase letters in your files names. And don't use spaces in filenames. You'll save yourself a lot of heartache if you learn NOW not to have spaces in file names. Use a _ or a - to fill spaces. For example: my_file_name.jpg, or my-file-name.jpg |
|
|