Web Design for Beginners

If you don’t have your own web page and would like to make one, there are a number of web page editing tools out there which will enable a beginner to put a page on the Web quickly with little or no prior knowledge of HTML (Hypertext Markup Language, the code of which web pages are made). Netscape Composer is probably one of the best (it comes with the browser).

But learning to write your own HTML is much better, and most people find it not too difficult. The trick is learning to write it correctly, so that all browsers (not just Internet Explorer) will display your pages properly. Read the section below for some tips on Web design.

Chances are great that your Internet service provider will host your web page for free. If not, free web hosting is available through many other servers, including Yahoo!, Fortune City and Bravenet, to name just a few. You may need an FTP program, such as WS_FTP, to publish your web files to the Internet; some HTML editors, such as Microsoft FrontPage Express, have their own “publishing wizard,” but my experience with such tools has been poor. What if you want to remove a file from the Internet, because it’s outdated, or because you accidentally sent it to the wrong folder? An FTP program is a much better solution.

Perhaps you don’t want a long, obscure URL (Web address) such as http://members.aol.com/profiles/ummamum/yadayada. Top level domain names (like www.ookingdom.com) can be registered for as little as $8.95 per year through Go Daddy Software. In order to use a domain, however, you need to purchase your own web hosting; that may cost anywhere from less than $1 per month upward. Many web hosts also offer domain registration.

In general, more money usually buys more disk space, higher monthly bandwidth allowance, and better features. This isn’t always the case; sometimes you can get more for less, so shop around.

Tips on Web Design

Some of these are things that I’ve never seen or read anywhere but have learned from experience. Hopefully, you can glean something from my early mistakes.

A good rule of thumb is this: Keep It Simple But Nice. Complicated pages are tough to maintain and leave lots of room for errors. Also, too much stuff on the page can bog down your visitor’s computer. For example, instead of a background image, try a background color; it looks nice and loads more quickly. Or try a text link instead of an image link. If you do use image links (and I use a few myself), don’t overdo it with large files or too many of them.

For goodness’ sake, use good HTML! A lot of us write our own, and it’s easy to mess it up and never be aware of it. Not all browsers will render your page properly if it has errors in it. Internet Explorer is generally pretty forgiving.

Most elements require both start and end tags, so be sure to use both if required, or your page may look wrong.

A word of caution if you write your own HTML: always put attribute values in "quotes" if they contain anything other than alphanumerics (letters or numerals). And DON’T forget the end quote, or your entire page may be messed up! Even Internet Explorer won’t forgive you for that.

The W3C HTML Validation Service is a valuable tool for making sure that your HTML is written according to standards. It’s entirely Web based, so you don’t have to download anything.

A common pitfall of beginners is to put everything on one page. The visitor has to scroll up and down like crazy to see everything. In some parts of this site, I did the opposite: I made all of the pages very small. Now the visitor has to click a few more times, but at least the pages load quickly.

Try to keep it to four printed pages if possible. Use Print Preview to check it, or if your browser doesn’t have that feature, look at the scroll bar on the right of your screen. It should be between one-half and one-eighth the height of the window, when the browser is maximized (assuming 800 by 600 pixels resolution, in Windows; your mileage may vary).

Be kind to your visitors! Not everyone has the same screen resolution that you do. And visitors with AOL may get a smaller than normal window for Web browsing. So check your pages at 640 by 480 pixels setting to make sure that no horizontal scroll bar appears at the bottom of the page, and that everything wraps OK without messing up the page layout.

If you don’t know how to do this, follow these simple instructions (for Windows):

  1. Right click the desktop, or go to My Computer > Control Panel > Display.
  2. At the top of the window that appears, click Settings.
  3. Find where it says “Screen area” and move the slider bar to the left until it says “640 by 480 pixels.” Then click Apply.
  4. A dialog box will appear; click OK. Your screen will go dark for a few seconds, then come back resized, with another box asking if you want to keep this setting. Tell it OK; you can always change it back when you’re finished checking your pages.

It’s tempting to use sound files as backgrounds on your pages, but some surfers find embedded background sounds quite annoying. If you do use them, however, keep the files small. MIDI files (instrumental music) are commonly used, and the files are usually small. But uncompressed WAV files can get really big if they last more than a few seconds. Use compressed files, such as MP3, to conserve bandwidth. Compressed WAV files in MPEG Layer 3 format work well too (that’s what I use). Most modern computers can read these files, so compatibility is less a problem than it used to be.

To use a sound file as a page background, you need a <bgsound> tag for Internet Explorer and Opera. An <embed> tag will work in Netscape 3 or 4 but not in Netscape 6, 7 or Mozilla. Neither tag will validate! Our Ummamum’s Surprise section uses a JavaScript which writes those tags for legacy browsers (newer browsers will open the sound clip in your default media player). The script chooses the sound file based on the seconds on your computer’s clock, so you hear a different sound each time. In addition, the script hides the forbidden tags from the validator! I don’t normally use this trick, but our visitors actually enjoy the brief clips I run in that section, so I use this workaround to pull it off (confession is good for the soul).