HTML Hints

When I first became interested in Web design, I read a how-to book cover to cover. When I had finished, I had a pretty good idea about how to use tags to format text and insert graphics. I even had a slight grip on linking.

What I didn't know -- and what was never explained to me -- was what to do in the very beginning. I didn't know where to start typing my code, how to see it as a webpage, or what I needed to type to make the webpage work.

That is why we will tell you everything you need to make your first webpage from scratch. Once you know how to begin, the rest will be pretty easy.

Getting Started

Browsers such as Netscape and Internet Explorer interpret the code known as HTML and turn it into a webpage. This HTML needs to be created in text-only format, not Word format, or any format that includes styles, tabs, and so on. You can create your webpages in Microsoft Word, though default settings may try to display the actual webpage instead of the code. To avoid this, we suggest you use a text editor designed for writing code.

BBEdit Lite for the Mac is a great application and NoteTab Light for Windows is available for free download from the ZDNet Software Library. These programs allow you to search and replace and offer useful tools for editing documents for the Web. BBEdit Lite even color-codes your documents so they are easier to read. You can also use SimpleText or Word Pad though they can't handle really large documents and don't offer certain features the editors do.

You also need a browser such as Netscape or Internet Explorer. You don't need to be connected to the Internet to view your webpages. Rather you can open any HTML document offline. This is a great way to make sure everything looks the way you want before uploading your documents to a server.

Now that you have all the tools you need, it is time to create your first webpage.

Essential Tags

Tags are commands held between < and > brackets. Most of the time you need a beginning tag and an ending tag, though a few tags can stand alone. Anything you place between the beginning and ending tags will take on the attributes described by the tag. For example, anything between these bold tags will be bold. Many tags have their own attributes and can be modified to suit you.

But before you begin formatting your text, you need a few bare minimum tags to make your page even work. The following are the most common tags you should know to start:

<HTML>

</TITLE>
</HEAD>

<BODY>

</BODY>

</HTML>

Notice that each of these tags has an end tag as well. The <HTML> tag tells the browser that the page should be interpreted as HTML. The <HEAD> tag defines the place where you insert other tags that won't appear on the page but need attention from the browser. The <TITLE> tags, for example, contain text that you wish to display at the top of the browser window. This is also the text that will appear when someone bookmarks your page.

<BODY> tags contain everything that will actually appear on the page. Anything you want people to see needs to be within these tags. The BODY tag has several attributes you can use to customize your page. Adding BGCOLOR=#FFFFFF within the first BODY tag tells the browser to display the background color of your page in white. Most browsers understand plain English commands for color so you can easily write BGCOLOR=white. Other attributes include BACKGROUND which will assign a background image, LINK for link color, TEXT for text color, and VLINK for visited link color. These are the most common attributes.

If you don't specify background and link colors, the browser will display its defaults-- a gray background with blue, purple, and red links. Also, people can customize their browsers to override the settings you have chosen. So even though most people will see what you see, some may not.

Now that you know what a webpage absolutely needs to have, you can practice with some text. Know this: The paragraphs you know and love will run together in a big wad unless you separate them with a paragraph tag-- . If you want to make a break, but don't want the space of a paragraph, use the break tag-- . Neither of these tags need an end tag, though you may see a here and there.

So go ahead and put your page together with some text in between the BODY tags. Once you have finished, save your page with the extension .html. You can then open a browser and choose Open File. Locate the file you just made and it should appear in the browser window.

Hints for Beginners

You can see the code for any webpage by choosing View Source from the View menu. A lot of professional sites will have all sorts of scary- looking script at the beginning, but you should be able to find the basic tags discussed earlier in this article.

As you scroll down, you will eventually see the BODY tags and will be able to decipher the contents for the page. Looking at other programmer's code has always been the best way to learn for yourself. Find a page you like and try to create what you see in your own HTML. You can then check your code against the programmer's code.

Good housekeeping is very important when designing webpages. This means that keeping space around tags will make your code easier to read. Once you get into formatting the style of your text, you may have more than one tag for certain text. This is known as nesting. Begin your good habits now by making sure that when you have a starting tag, the browser will see its ending tag before you start with another-- bold and italicized text.

Home	HTML Menu	Extra Information	HTML Hub


	HTML Workshop: The Basics