Like many people in the design community, I learned to produce web design concepts in Photoshop. I found this quite peculiar since Photoshop's main purpose is to edit photos while Adobe has an application designed specifically for designing websites. Most web designers have Fireworks installed on their computer and have never even launched it! While there is nothing wrong with using Photoshop for designing websites, Fireworks has many features that make it easier and faster. I've written this short list detailing some of things I've found most useful while exploring Fireworks in hopes that it may be of use to any designers considering switching.
.01.pages
If you've ever designed a multiple page print piece using InDesign's Pages panel you will already see the value in this feature. Instead of having a separate .psd for each page of your website design or a labyrinth of unmanageable layers in one file, Pages lets you create multiple pages inside one document. This allows you to have page specific content appear only when you want to view it but it's always right within your grasp. Along with Pages you can set a Master Page. In essence, you can create one page with anything that would appear on all pages (background, logo, nav, etc), then set it as your Master Page and all of those items will appear on all of your other pages. Then, if you need to make a change to something on your Master Page you only need to edit it once and the changes will take place on all instances of that object. Pages and Master Pages can be a real key to organization and saving time.
.02.symbols.and.libraries
Symbols are a common thing to be found in any Flash site or animation. In Fireworks, any elements that you're likely to use multiple times (buttons, bullet points, etc) can be turned into Symbols. This symbol is added to your Library and you can then drag as many instances of it as you need into your design. Then, should you need to edit the color of your symbol and maybe add a drop-shadow, you only need to edit the Symbol in your Library and all instances will be updated to reflect the change. This is much faster that updating all 20 copies if your bullet point individually. Also, you have access to common libraries where you can store frequently used objects such as social media icons so you always have quick access to them when starting a new project. .03.properties
The Properties panel is another feature the looks like it was taken right out of Flash with just a couple upgrades. Pixel precision is undoubtedly important in any HTML layout and Fireworks' Properties panel lets you easily adjust height and width, as well as X and Y positioning of any object. It also houses all of your formatting options for text elements, opacity, live filters, and a handful of other features. All of this in one easy to read panel instead of having to hunt through numerous menus to find all your desired features.
.conclusion The benefits of using Fireworks are quite apparent and I've had only a small amount of time using it. While it can't replace Photoshop for some hardcore imaging effects, it's certainly able to streamline my web design workflow after a little more practice and I'm going to continue using it for all of my new projects. And if I get stuck, I can always safe my file out as a layered .PSD.
