FAQ 11: Making and Maintaining Webpages

Examples of common hosting sites for webspace:

As the last section mentoined, if you need a site that will allow adult content, you can try FSN:

Two examples of sites I've made there are at:

Disadvantages:

Advantages:

http://www.cyber-squall.com/msw/swolf/index.html

You can learn html very quickly at http://www.davesite.com/webstation/html/. I strongly recommend this tutorial for anyone who wants to get started *very* quickly.

It teachs you all you need to know with clear examples and even allows you to practice making sample pages (it will ask you to type in something and then it will display what it would look like as a webpage).

I made my first webpage about 15 minutes after starting the tutorial. It's very nice because you can quickly see your mistakes and learn from them.

All standard browsers have the ability to browse your hard drive as if it were a website. Instead of typing in http://blah.blah you type in c:/blah/blah

Example
Your hard drive
Note: Only *you* can see the contents of the above link. Everyone else sees their own hard drive. It's a convenient feature of your browser that allows you to quickly preview a site on your own computer and make final corrections before you take the trouble to upload it to the website.

For example, you can make a directory c:/test/ to practice html by making webpages on your hard drive. This way, you don't need an actual website to practice, and all changes you make to your "webpage" will take effect immediately (all you need to do then is reload)

Another way to learn html is to examine other websites that you think are well-designed. To examine the html used, your browser should have an option to view the "source" of the page. Here's how to do it:

1. For Internet Explorer, right click on the page and choose "View Source".
2. For Netscape, go to View -> Page Source.

Note that if a page has frames, then each of the frames of the page will have its own source code as well.

To start practicing (once you've gone through the tutorial), I suggest using a plain text editor notepad or wordpad. This is the best way to learn; I've seen a lot of people work years on webpages using fancy programs and still ask me basic questions on html because they never learned it first the hard way.

I personally use a program called FlexEdit to make webpages. It is a plain text editor as well, only that it allows you to easily and quickly open up multiple text files, with tabs so that you can skip around between them. It also has references for all standard html tags so that you can either look up how to use a tag or use FlexEdit to make one for you.

When you save your html file, make sure that the extension is either .htm or .html. If it is .txt, it might not work properly. If you try to save the file as .htm but instead it saves it as .htm.txt, this is no good. This probably also means that you're using Win95 with certain features disabled. To enable Win95 to save as .htm instead, you must change an annoying option in Win95. First go to Windows explorer, then access menu option View and choose Options. Make sure the box marked "Hide MS-Dos extensions..." is off (unchecked). Once again, this is important.

Now that you have a file to edit, feel free to type in whatever you wish. Here is an example, followed by its actual html source code:

If not, take a look at the actual source code for this message below:

The first part is what the example ends up looking like on the webpage. The second part is what the html source looks like on the file you edit. Of course, you should know this if you took the tutorial. ;)

Note that I sometimes use brackets [] to replace the normal tags <> for the sake of demonstration (since the less than and greater than sign are interpreted as commands in html). Most browsers allow you to view the source code of any webpage you are at. With Netscape 3 or lower, go to View and choose Document Source to view the source for this page. With Internet Explorer, right click on this page and it will give you an option to view the source code of this page as a textfile. Using either browser, you can save this source code, play around and edit it, save it on your computer, and view the changes. Note that if a page has frames, you might want to view the frame source instead. ;)

You can always design an entire website on your hard drive before actually uploading it to a space on the internet. This is usually best because if you see an error, you can correct it much easier if the file is on your hard drive (and pressing the reload button will instantly display the changes). Important: In order for changes to take effect, you must actually save the file you are working on. Simply editing the file without saving will not make changes. Another important thing you must know is that the default page to any site is almost normally "index.html" In other words, whenever someone goes to www.place.com/~ziggy/, they are really looking at www.place.com/~ziggy/index.html. If your computer can only save filenames as "index.htm" (for example, you use windows 3.1), then after uploading you should rename it to "index.html"

A few last notes on programming html. Davesite does cover this, but I just want to remind you of some of the more important tags. I suggest to make extensive use of the [p] and [br] tags. In fact, almost all tags on this page are p or br tags. [p] starts a paragraph (in most cases it simply separates paragraphs with a space). [br] is like the enter key. This is important because browsers ignore normal enter characters and extra spaces (so you must actually use html commands to tell your browser to skip lines, rather than hitting enter). This is very important. In other words, if you press the spacebar 20 times and save the .htm file, only one spacebar will actually be displayed. Likewise, if you press enter 20 times, no return will show up at all; the browser will treat it as if it were a spacebar space.

Geocities, Fortunecity, Xoom, and Tripod tend to be good places to get space. I heard that some ISPs like Earthlink, Bekkoame, and AOL provide personal space for their members, though these would probably best be used for personal pages or even practice pages.

For more advanced users, check out a list of roughly 100 services offering free hosting in the advanced section.

To send your webpage to Geocities, for example, you should use FTP (you can also use the http tool they provide, but that is inefficient and cumbersome).

One FTP program I suggest is CuteFTP; it is a shareware that has all the essentials (you can get it from http://www.cuteftp.com).

To upload, connect to the server ftp.geocities.com. As your username, enter your account name. As password, enter the password for that account. Always remember your password or have it handy.

Note that Geocities FTP is special because it does not allow you to see a directory listing of files that you have uploaded (when I first wrote this FAQ, this was the case; Geocities has since changed their policy and now allow you to view them). While uploading, particularly if you upload larger files, you might want to stop all other downloads to speed the process up.

1) Geocities does not allow subdirectories.

2) Most websites are case sensitive.

• in other words, to a website, "happosai.txt" is not the same as "HAPPOSAI.TXT".
• this is significant because chances are that on your own hard drive, the name is not case-sensitive.
• in other words, on your own hard drive, "happosai.txt" is the same file as "HAPPOSAI.TXT".
• remember this, because this causes a lot of "page not found" problems. ;)
• for this reason I strongly recommend sticking completely to one case (preferably lowercase).

3) If you use Geocities, make only legitimate pages.

• don't force them to take the trouble to close down your site because you didn't follow their guidelines.
• one important guideline to follow is to provide their standard link banner on every main page.
• the source to this banner can be found in the members FAQ on their page.
• also, Geocities requires that all pages are linked together on your site (i.e. no hidden pages).

4) Whenever you display an image on a page, it is a very good idea to specify the image's dimensions.

• I always do this, and while it's not mandatory, it will make your page load much better for many browsers.
• for example, [img src = happosai.gif height = 40 width = 40] is better than just putting [img src = happosai.gif]
• with Netscape in particular, if you don't specify these dimensions, Netscape will not display the rest of the page until it downloads the image and manually determines the dimensions. This can be very annoying and unnecessary.
• note that the height and width are by default specified in pixels, though you can also specify them in percent
• if you specify the wrong dimensions, the image might look stretched or scaled, so specifying the right dimensions is pretty important
• you can find out the dimensions of an image many ways. Often the quickest is to open the image using your browser (right clicking and selecting view) or by using a program like ACDSee.
• also be sure you don't mix up height and width.

If you want to have an index page with links to 20 files, one quick way to generate this index page would be to use Changename 5.0. Run Changename and select all the files you want to link to. Then edit the filenames as text, and copy and paste this list onto another textfile. Now it shouldn't be hard to turn this textfile into a html file that links to these files.

I try to refrain from using long filenames whenever possible. This is primarily in consideration for people who use Win 3.1, because when saving to the hard drive, long filenames will always be reduced to eight characters plus a three character extension. For example, "happosaisfaqs.html" might become shortened to "happosai.htm" on a computer running windows 3.1.

Choosing the right colors is very important. Unless you are clever, try to always choose a light background. If you do choose a light background, it's best to use black text. The second best combination according to studies is green text on a black background (like an old computer terminal). Sometimes you might want to bold writing to make it easier to read, but don't use this unless you feel it is necessary. At message boards, choosing the wrong colors has frequently caused a sharp decline in visits.

Please be considerate and don't put anything that is highly offensive on your page. In addition, if you are using a free hosting service like geocities or fortunecities that requires you to follow guidelines, this is especially important. In such a case, a general rule of thumb is not to put anything on a page that offends more than 5% of visitors. Please, don't put up pictures of gunshot wounds, use excessive obscenity, or express hatred towards others. I have seen all such pages and more, each one violating several guidelines at once.