Posts Tagged ‘Web Design’
How to Convert a Fireworks Image Design to HTML
In the last video in this mini site creation series I showed How to Design a Mini Site in Fireworks. In this video I show how to slice the image and export the image into HTML and then modify it into a very basic mini site.
There is nothing advanced in this tutorial, it’s just a very basic slice and export process with very minimal editing. This is to assist someone who has very little knowledge and experience with HTML. Basic understanding of using word processors and editing documents is all that’s required.
Please visit W3Schools to learn basic HTML programming.
I’ve created the two menu pages seen in the design image and created a link to the exported HTML mini site. You can view it here. I haven’t added anything to it that isn’t in the video. It is exactly how it was when I designed it in the video.
How to Design a Mini Site in Fireworks
In the last video series, I went through the process of How to Create eCovers (eBooks) and in this video I show how to design the mini site that compliments that eCover.
Mini sites are a pretty easy way to quickly create a website that is e-commerce ready. You can find tons of them on the internet in almost every genre imaginable. More commonly, the mini site serves the purpose of selling informational products, such as “How-to Make Money Online“. A somewhat horrible industry, due to the fact there is a lot stupid information available. I think most of that information is recycled garbage, modified by someone who promises riches, but has no idea what they are doing.
Nevertheless, the mini site is a powerful web site formula and not to be overlooked by someone with real talent and real knowledge. Understanding the formula and how to design and create the mini site is a valuable asset, as it can be used in many ways by both the entrepreneur and the freelancer.
The image below is the end result of this design video.

How to Create eCovers (FW+PS)(ebooks)
I use Adobe products for many things. I’m not a graphic artist, so I’ve never been able to master or even make good sense with Photoshop. However, Adobe Fireworks is easy to learn and a very powerful tool for me as a web developer.
In this video I use Adobe Photoshop and Adobe Fireworks to create an ebook cover.
To create modern day Web 2.0 style ebook covers, most everybody uses Action Scripts of some sort. In this video I am using Cover Action Pro scripts (a commercial product).
This video is about 25 minutes long and shows every step I took to create the eZine eCover in this post. My style might seem goofy to some Photoshop experts, but I’m a Fireworks user and all scripts that I am aware of at the moment are for Photoshop. So, I design the eCover in Fireworks and run the Photoshop scripts on the design.

Creating Reflective Images in Adobe Fireworks
Reflective images are easy. The only steps involved are “vertically flipping” the image you want to reflect and applying some fades and transparencies to the flipped object. This quick video shows exactly how it’s done using Adobe Fireworks.
There are several ways in which you can create reflective images. The method in this video is a standard menu driven approach and is commonly used and considered very simple. The other method is to create a vector object and apply gradient effects with some opacity. I’ll create another video which demonstrates this another day. The truth is, this menu driven approach automatically creates this vector approach for you.
Adobe Fireworks is a commercial software application for editing and creating graphics. You can download a trial version of this software here.
