As you develop your Web site, take a look at your Web pages in a Web browser to make sure they're looking good. It's best to do this locally (in other words, on your own computer) before uploading to the Internet.

To make sure you're on the right track, all you need is your browser. Then follow these steps:

1. Create a new directory on your computer and name it something relevant to this project (for example, newweb or My First Web Site ).
2. Save your Web files to this directory, including all HTML files and graphics.
3. Once you have at least one file in this directory, open a Web browser, such as Microsoft® Internet Explorer or Mozilla Firefox, and type the path and directory name in the browser's address field. No need to add http://. Just type c:\newweb , or, if you're using a Mac, your hard drive's name, a forward slash (/), and the directory name ( newweb ). You can also use the Browse feature to find your directory. You'll get a listing of what's in that directory, as shown in Figure 3-1.

Enlarge image

4. Double-click any of the HTML files to display it in your browser.

Most Web design programs help you develop your Web site structure automatically. They also typically have a Preview tool that shows your Web pages in a browser.

That's all there is to using your own computer and browser to test your Web designs.

How'd They Do That?

Like most Web developers, you've probably spent a lot of time browsing other people's Web sites, and getting ideas of what you like, and don't like, and what you want to do on your own site. But sometimes you may not know how to do what you want.

There are a few ways to find out. First, you can contact the Web site owner and ask them. Second, you can use the View > Source option in your browser to take a look at the HTML. Or, third, you can download the Web page to your local computer and take a look at in your Web design tool.

You need to get permission to use someone else's proprietary Web program. However, grabbing HTML or JavaScript code that you aren't yet familiar with is not a problem.

Save Pages from the Web

Log on to the Internet and go to any Web site. Save that page in your Web design directory or folder using the browser's File > Save As command. Now point your Web browser to your Web design directory and open the HTML file you just saved. What happens? Does the page display as it did when you opened the page from its http address? Are things missing?

Unless you've downloaded a very plain Web page, the page will be missing images and maybe its font styles. To download every file associated with a Web page, select File > Save As and then select Web Page, complete (or something similar) in the Save as type drop-down list to save the entire Web page, including all graphics. Internet Explorer creates a series of subdirectories within the directory you created to store these images and other Web page items. Select File > Save As and then select Web Page, HTML only to save only the text.

Save Images from the Web

Just want to save a Web site's images? Taking and using anything from other people's Web sites, including images, might be in violation of copyright laws. However, if you just want to copy an image from another Web site to view it, or if you're sure there are no copyright issues, place your cursor over the image and right-click the mouse button. Select Save Picture As from the shortcut menu. In the Save Picture dialog, save the image into your Web design directory. Mac users can click and hold the graphic, and then select Download image to disk from the menu.

Next Up

Now that you've learned how to put it all together, in Lesson 4, you learn how to give your Web site a home on the Web (no, not on the range). But first, complete this lesson's quiz and assignment to solidify your new knowledge. After that, pop in at the Message Board to see what your classmates are saying about their Web design tools.