Hoover Web Design, Affordable Professional Web DesignHoover Web TemplatesContact UsReturn to HomeView PayPal Shopping CartView Credit Card Shopping Cart
small business web design
Professional Web Design
  Website Design Services
  Prices and Packages
  Web Templates Mouse Icon
  Rate Card Adobe PDF Document
  Web Design FAQ
  Free Website Design Quote
  Client Testimonials
  Client Login
  Customer Support
Web Portfolios
  Web Design Portfolio
  Graphics Design Portfolio
  Flash Design Portfolio
Web Design Extras
  Hoover Web Hosting
  Domain Registration
  Ecommerce - Sell Online
  Web Site Promotion
Web Site Builders
  Website Builder Reviews
  Flash Web Site Builder
  Online Web Site Builder
About Us
  Learn About Us
  Sign Our Guestbook
  Make a Payment
  Our Website Awards
  Awards Program
  Website Award Winners
  Partner Links [2] [3] [4]
  Link to Us
Shop for your Web Site
  Web Templates Mouse Icon
  Flash Photo Gallery Mouse Icon
  Flash Music Players Mouse Icon
  Website Calendar Mouse Icon
  Stock Photography Mouse Icon
  Scripts and Programs Mouse Icon
  Blog Templates
  Budget Web Hosting
  Quick Shopping Cart
  Website Submission
  Web Design Bookstore
  Flash Intros
  Web Design E-Books
  Web Sites for Sale
  Domain Names for Sale
  Software for Sale
  Web Templates for Sale
For Web Site Designers
  Free Webmaster Tools
  Web Designers Directory
  Web Resources Directory
  DIY Web Design Mouse Icon
  Webmaster Freebies
  Free Web Templates Mouse Icon
  Free Web Graphics Mouse Icon
  Free Fonts Archive
  Free Buttons Maker Mouse Icon
  Free Banners Maker Mouse Icon
  Free Sound Wavs
  Free JavaScripts
  Free Web Design Articles
  Archived Article Directory
  Join An Affiliate Program
  Web Design Business Kit
  Web Design Encyclopedia
  Spam-Free FFA Links
  Webmaster Awards
  Template Top Sites
  Webmaster Wearables
Small Business
  Small Business Services
  Logo Design
  Banner Design
  Work from Home Articles
  Free Business Forms
Free Printables
  Party Invitation Templates
  Printable Wedding Invitations
  Greeting Card Templates
  Free Calendar Templates
  Printable Certificates
  Printable Signs
  Free Resume Templates
  Free Fax Cover Sheets
  More Printables
Creative and Professional Web Site Design for Small Businesses and Individuals
professional web templates

Create a Flash Template for a Photograghy website

Macromedia Flash MX is a program used to display rich interactive animation and multimedia content on the Web. This is especially advantageous while creating visually appealing websites for photograghers, designers, artists, etc.

One of the main advantages of Flash is that it stores all of the information in a single file that can be easily integrated with most Content Management Systems (used in http://www.fancydressheaven.co.uk). Flash is great for showcasing various pieces of media in a dynamic way that can be completely controlled by the author. This program uses vector graphics, which means that the graphics can be scaled to any size without losing either clarity or quality.

Java applets are also frequently used on the World Wide Web to create dynamic effects on web pages. Nevertheless, Flash applications load much faster than applets do not require programming skills. Flash also allows interactivity while animated images don't.

However, it should be noted that Flash is not a method to replace HTML Web pages. While Flash opens up certain capabilities, its nature of being a single locked file prevents a flash project's text from being read by some search engines, screen readers for the blind and archiving Web services that cache Web pages. Flash must be used only as a way to display media in a self-contained "shell," knowing that the surrounding HTML will complement it.

This is a tutorial that will take you through the process of creating a simple Flash template with 3 buttons which change while your mouse hovers over it.

1. Create a new Flash document/project

2. Import a background image for your template. Could be one of the photographs from the collection.
To align your image with the Stage, open the "align" pane under the window menu. To align, you must first set the To Stage: option to "on," then click the buttons to align to the left edge of the Stage and the top edge of the Stage.
Next, double click on name of the layer up in the timeline and name it to "background."

3. Next, create a new layer, which where we will put our title. Name the new layer "title." (Important! After you create the title layer, LOCK your background layer.
Use the text tool to draw a box on your Stage. And type in "Photography By Nicholas".When you click on the text tool, you might have noticed your properties box has changed to show you all of the option related to text. Here you can change the color of your text, the font, and style. You want to make sure you are using Static Text (like it sounds, it's text that never changes). This is the most common form of text you will use for titles, captions, or text that is "static" and unchanging. You can add effects, such as drop shadows, to your text by clicking on the filters tab in your property panel.

4. Create a new layer and call it "buttons." Remember to lock your title layer, as we won't be using it again.

Now grab each of the photo1.jpg, photo2.jpg, photo3.jpg and drag them to the right side of the stage one at a time, so they are stacked vertically.
You can space the images out evenly by selecting all of them and using the align pane. This time we are not aligning them to the Stage but, rather, to each other. So we turn off the To Stage: option. You can use the middle Distribute option or the left Space button to space out the three buttons. You can also align each button to their left or right edge. In order for this to work, all three buttons have to be selected (you will see a grey strip surrounding them).

5. Click on only ONE of your three button images, making sure only one is selected. Then in the top menu click on Modify then choose Convert To Symbol. Choose button for the symbol type, and give your symbol a relevant name. This name is for your reference only. You will know you have successfully converted your button to a symbol when you see a blue line surrounding your image and a small circle in the center. Repeat the steps above for each image, converting each one to a button symbol.

6. Once you have "converted" each of the three images into button symbols, you can edit the properties of each symbol by double-clicking it to enter symbol editing mode.
First, let's rename the only layer to "image". After that, click on the frame representing the "over" state, and click Insert ? Timeline ? Keyframe. You can also right-click to insert a keyframe.
While the red play head is currently on the over state, click on the button image on your Stage, and then in your properties inspector click on swap.
Choose another photo say photo4.jpg. This allows you to swap the photo on that keyframe for another photo.

7. You can test a project at any time by going to Control ? Test Movie. Or you can press the shortcut key which is Ctrl + Enter

About the Author:

Arya works in a web designing agency in the United Kingdom, where she has handled all aspects of a website from basic design and conceptualization to complete development. In her spare time she writes articles to contribute to the community. Link htp://www.nationalwebdesign.co.uk.

Hoover Professional Web Design Articles Knowledgebase

>> Return to Web Design Article Knowledgebase Index


small business web site design

2000-2010 Hoover Web Design. All Rights Reserved.
No part of this website may be downloaded, copied or reproduced without the written permission of Hoover Web Design.