1. | Create a new HTML page by choosing the New option from the File menu. Choose the HTML option from the Basic Page category and click Create.
|
2. | Insert a new image placeholder by choosing Insert, Image Objects, Image Placeholder. The Image Placeholder dialog appears.
|
3. | Give your new image placeholder the name SurfingOahu, a width of 300, and a height of 177. Click OK. The new image placeholder appears on the page.
|
4. | Select the image placeholder. Doing this exposes the Create button in the Properties Inspector. Click the Create button to launch Fireworks. When Fireworks opens, a new document is created with the width of 300 pixels and a height of 177 pixels.
|
5. | Playing the role of the graphics department, choose the Import option from the File menu. The Import dialog appears, allowing you to browse for and select an image to import into Fireworks. Locate the SurfingOahu.gif image in the Images folder of the project and click Open.
|
6. | The dialog closes and your cursor changes, indicating that you need to place the image into the workspace. Position your cursor on the top-left edge of the workspace and click the left mouse button. The image is placed into the workspace.
|
7. | Click Done. Dreamweaver asks you to save the original file, providing the name you gave the image placeholder originally. Keep the default name SurfingOahu.png, browse to the Assets folder, and click Save.
|
8. | Dreamweaver asks you to export the GIF image. Again, keep the default name, browse to the Images folder, and click Save. Fireworks closes, and the image placeholder is updated with the newly created image.
|
This example was merely a simple image placement example that demonstrated the use of Fireworks to replace image placeholders. Of course, this is just the beginning. You can use Fireworks to create impressive images with filters, text designs, and more.
