Web Page w/ Macromedia Fire Work (MFW)

You will be guiding by this topic especially for design web with MFW. You’ll get hands-on experience using the industry’s leading web graphics application and learn web design concepts along the way.

Before taking this tutorial, you should be familiar with designing graphics in MFW or other vector and bitmap graphics applications. You should possess the basic skills covered in the MFW “Graphic Design Basics Tutorial.”

Specifically, you should know how to accomplish the following tasks in MFW:

• Saving a document
• Selecting objects
• Editing object properties
• Displaying and using panels
• Working with layers and objects
• Creating and editing text
• Exporting a graphic

View the completed web page Next you’ll view the completed tutorial file to see how your finished project will appear after you export it as an HTML file.

1. Start your web browser.
2. On your hard disk, navigate to the Tutorial2 folder that you downloaded from the Macromedia website, and browse to the Tutorial2/Complete folder.
   
   Note:
   Some versions of Microsoft Windows hide extensions for known file types by default. If you have not changed this setting, the files in the complete folder won’t display extensions. When dealing with web pages and web graphics, it’s best to be able to see file extensions. For information about how to turn file extensions back on, see Windows Help.
   
3. Select the final.htm file and drag it to the open browser window. For this tutorial, you will complete a partially finished version of this page for Global, a rental car company.
4. Move the pointer over the large Vintage image. When the pointer moves over the Vintage image, another image on the page changes. This is called a disjoint rollover.
5. Move the pointer across the navigation bar along the top of the web page. The buttons change in response to the pointer passing over them. Click the Rates button to test the link. The link takes you to the Fireworks page at www.macromedia.com, but you will enter your own URL for this and other items as you complete the tutorial.
6. Use your browser’s Back button to return to the final.htm page.
7. Move the pointer over the Worldwide Airports image. A pop-up menu appears. Roll over each item in the menu with the pointer, including the first item, which contains a submenu.
8. Click United States to test the link, then return to the final.htm page.
9. When you finish viewing the web page, you can either close it or leave it open for reference as you take the tutorial.
   
   Note: The Complete folder also includes the Fireworks document from which the HTML file is generated. To view this document, double-click final.png.
   
   

Open the source file You’ve viewed the final.htm file in a browser, so you’re ready to begin.
In

1. MFW, choose File > Open.
2. Navigate to the Tutorial2 folder on your hard disk. Browse to Tutorial2/Start and open global.png.
   
   Note:
   As you perform the tutorial, remember to save your work frequently by choosing File > Save.