About this Tutorial
This tutorial is intended for those with absolutely no experience with HTML. It's a guide. A basics to get you up and going writing your own web pages.
This tutorial will teach you how to create HTML documents and get those pages from your computer to a web server. You'll learn about different fonts and sizes of type. You'll learn all the codes necessary to display a page in a browser and how to make your type and images appear where you want them to in a browser.
This tutorial assumes you have a basic working knowledge of your own computer. You should know how to copy and paste, use an editor like Note Pad or Word, create files and directories and be able to download files and programs and launch them. Experience with WinZip to UnZip a file is also important.
This tutor, in itself, is really all you need to begin creating your own web pages. Depending on what you are looking for it may be all you need. If you are going to put up a page about yourself, family, dog, favorite celebrity or whatever using one of the free web space providers like PageBarn.com then you may well be all set. If you are looking to go into business, or setup some serious web sites with lots of pages with your own domain name (yourname.com) you will do well to purchase two other pieces of software. A good Editor such as NoteTab Pro about $20, and an FTP program such as WS_FTP by Ipswich Software for around $40. There are other programs from other companies but these are the ones I recommend. But again, regardless of what your long term goal is, this tutor will get you to the point of creating your web presence.
You will experiment with each lesson adding more and more of what you've learned as you progress. By the time you finish this tutorial you will be able to create a web site on the Internet that anyone can come and visit. A place where you can show off your family, your writing, creations and art or anything else you want to publish to the world. You can even start your own online business!
You will be quizzed at different points as you progress which will show you where to go back and review. The quizes are not hard, nor are they meant to really show whether you have learned HTML or not, they are simply to point out places that you need to spend some more time. Whether you thoroughly learn HTML, or learn just enough to get your pages online, is entirely up to you. It's your project, and long terms goals, that dictate how you use this tutorial. The only grade you will receive is when you site is online and you are either pleased, or not pleased.
The quizes in this tutorial use SFESurvey v1.0.5 which can be found at http://www.tesol.net/scripts.
This tutorial also uses HTMLArea by InteractiveTools.com. It is really much too complicated for you to get into at this point. I am merely mentioning it here to give credit for the program which we have incorporated, with permission, into this HTML tutorial. An example is below.
When you use these HTMLArea's, you can click the (V for View) icon and you'll be able to view the source code or what the actual HTML would display like in a browser. I feel the use of these HTMLArea boxes make this tutorial a definite step above the others scattered around the net. Give us some attention and you will learn to write web pages very, very soon.
Please note that if you are using a Mozilla browser, Firefox etc., you probably can't get the benefit of the HTMLArea as it is not supported. I suggest using Internet Explorer when using this website. It renders HTMLArea correctly.
Click the "V" (if you are using Firefox you probably don't see the "V" ... Firefox is apparently not compatible with HTML Area. Please use IE) to see the "source code" and again to return to the Browser View. You'll see much more of this feature throughout this tutorial. The source code looks like this:
<h1>Welcome to the World of HTML</h1>
You Must Use IE Here ... NOT Firefox!
You Need to Use Internet Explorer for HTML Area (above) ... Firefox does not render this code
I want to wet your taste buds. Click the "V" to view the source. Copy the following code and paste it in before the word World in the above HTMLArea box:
<font color="#0000ff">
Now move the cursor to after the word HTML and before the </h1>. Now type this: </font>. Now click on the "V" to view the change you just made. Check what you just did to make sure you didn't accidentally get a space or something after, or perhaps before, the brackets of the code. That sometimes happens with copy/paste.
In this tutorial we are going to teach you to use all lowercase when writing your code. You'll notice in these HTML Areas that some code you write in lowercase gets changed to uppercase. Don't worry about it. It's the HTML Area Software that does that. It won't happen when you move on to using an editor and actually writing code. These are just practice boxes to let you experiment in real time. Let's move on, there is more to be said before we jump right into the code.
Next: Introduction
|