This tutorial will teach you how to write your own web pages by using HTML. You do not need any special what-you-see-is-what-you-get HTML editor to use this guide. Any text editor will do just fine. By learning HTML, you will have much more control over how your web pages look, and you'll more easily discover ways to make your web pages look even better. HTML can be created on virtually any type of computer. Windows, Mac, Linux... all of these computers can create HTML files. Because HTML is platform independent (meaning it can be viewed on Windows, Mac, Linux, etc as mentioned above) you'll need to save your HTML files in standard text format. In Windows, an easy way to do this is to use Notepad. On Mac OS X, you can use TextEdit. On Linux, you have a wide variety of choices (although I generally use pico). If you'd prefer to use a word processor like Word to write your HTML code, you can do so, but you need to save your files as "Text" or "Text Only" instead of "DOC" or "DOCX." You'll see this option in a drop down box in your "Save As..." screen. If you use a word processor and forget to save it as Text format, you'll see only garbled data when you try to view your page with a web browser.

You'll need to find a web host for your site unless you run your own web server 24/7. (Running your own server is very expensive, complicated, and not recommended).

By choosing a web host, your site will be available to the world all day every day. Most hosts are only down for a few minutes each month (for things like a reboot for a major software upgrade). Considering there are over 40,000 minutes in a month, this isn't a bad deal! (Imagine only rebooting your computer once a month... that would be terrific!)

If you're making a personal web site, you can choose to get a web site from your Internet Service Provider (ISP), get a limited amount of restricted space at a free host (not recommended for business sites, it's quite unprofessional). Or you can go straight to the big leagues with a domain host. (My personal site is on a domain host: http://www.davekristula.com/ )

A domain host typically costs $10 a month or less, and is well worth the investment.

There are several disadvantages of free hosts:

• Free hosts show banner ads or pop-up windows (or both) to pay for your service (so it's not really free).
• There is no way to turn off the ads on a free service.
• Free hosts limit the amount of web space you get, usually to about 20 MB.
• Free hosts also limit the number of visitors you can receive in a month.
• If you exceed their "limit" your site will be "turned off" until the next month.

• Often give you thousands of GB of web space for your HTML files, graphics, and multimedia.
• Do not shut off your account based on number visitors.
• Plenty of e-mail addresses customized for your domain with generous storage.
• High-speed lines to ensure your site loads faster, and dedicated support for any help you need.
• Place no ads on your site. (You can add them yourself if you want to make money).

I have reviewed several excellent web hosts in the previous next chapter, "Finding a Place to Put your Finished Web Page on the Web"

So if you're making a personal web site you want to look professional, or you're making a business web site or a web site for an organization (church, etc) you'll want to get a domain host. A domain name was originally restricted to ending in .com, .org, or .net, but there are many options available now.

Let me say it again, domain hosts do not show ads, unless you put them up yourself to earn money. The next mini-chapter contains information on domain hosts.

Once you sign up for a host, you'll get a username and password to log in and edit your site. On free hosts, your username is also your directory, so choose wisely. For domains, your username is not as important.

Not ready for a domain yet? Find a free host (remember, there are huge limitations and I do not suggest it).

Custom Search

When you hit davesite.com, and your browser reads http://www.davesite.com/, what file is loading? On almost all web servers, this file is index.html. When the web server sees / and no filename, it automatically looks for index.html.

Imagine a situation where you are making a web site of three HTML pages, the opening page (index.html), an about me page (aboutme.html) and a links page (links.html).

If you're on your own domain, the files would look like this once you upload them on your server.

• http://www.kristula.com/index.html
• http://www.kristula.com/aboutme.html
• http://www.kristula.com/links.html

The first page, http://www.kristula.com/index.html, can also be loaded by just typing http://www.kristula.com/

The same is true of folders (directories). If I made one called /dave/, I could put a new index.html in it, and it could be accessed two ways:

• http://www.kristula.com/dave/index.html
• http://www.kristula.com/dave/

When you write your web site, you'll need two copies:

• One on your web host
• One on your hard drive

There are two reasons:

1. You need a backup (this is the obvious one).
2. When you're working on your site, you don't work on it live! Imagine how silly it would look if a page changed every two minutes while you worked on it!

When you work on the copy of your HTML pages on your hard disk, it's called "editing the local copy." The copy on the web host is called the "remote copy." (Kind of like a remote control, controls something far away!)

Take our previous example with three files...

• index.html
• aboutme.html
• links.html

You'll edit all three of these from a folder in your hard drive, and once you're down, you'll upload them (Covered in Chapter 10) to your web host. Then the whole world will see them!

Tip: You can view your files on your hard drive before you upload them.

1. Open your web browser.
2. Choose File -> Open... File, (Browse).
3. Find the folder with your HTML files.
4. Double-click the one you're working on, and presto! It's in your web browser.

The most common mistake for new designers is the urge to put the c:\ in links and images (covered in Chapter 4). When you're on the web, there is no c:\ to the rest of the world. When you start out, keep all your HTML files and images in one folder, and don't use c:\ at all.

Quick example:

<img> loads an image into a web page. If you have a file called taco.jpg, use the code <img src="taco.jpg"> to load it, not <img src="c:\My Documents\website\taco.jpg">

Next, we'll have a quick overview of where we'll put our finished HTML web pages so others can access it online.