How to Create Animated Web Banners

According to Web Developers Notes, animated banners bring almost 30 percent more click-thru rates than static versions do. The movement of animation attracts the viewer's attention, which supports the goal of building your Web presence and participating in marketing opportunities. There are a couple of common methods you can employ to create your own animated Web banners. You can opt to build your own image from scratch, if you have the programming knowledge, or utilize a free template available on the Web.

Instructions

  1. Build a Banner from Scratch

    • 1

      Launch a graphics editor, such as Fireworks or PaintShop Pro, and begin a new project.

    • 2

      Choose a standard size for your animated templates. Established sizes are 468 by 60 pixels (most common), 234 by 60 pixels (half banner), 120 by 240 (vertical banner), 120 by 60 and 125 by 125 pixels (button sizes) and 88 by 31 pixels (micro size).

    • 3

      Create as many frames as you want for your banner. The frames are the actual views that the visitor sees when the banner is animated. For example, one frame might contain your website name, another may include some text and a third could present an image with your slogan.

    • 4

      Use your graphic editor's animation function to combine all the frames, set the sequence of appearance and define how long each view is displayed. Read your editor's help files to determine how to use the animation feature.

    • 5

      Save your file and then export it as HTML so that it is ready to be added to a website.

    Configure a Ready-Made Banner

    • 6

      Locate an automated banner generator online and sign up for a free account.

    • 7

      Enter the banner's information in the text fields provided. Common entries include a title, line of text and URL.

    • 8

      Set the background color, loop animation and count, text colors and any other styling offered by the generator.

    • 9

      Save your work and download the resulting HTML code. Add this code to your web page in order to view it.

Tips & Warnings

  • Be aware that if you use Flash to animate your banner, it will not be viewable by visitors who do not have the plugin, and by alternate devices like the iPhone.

  • Make sure your images are clear and sharp to present a professional looking appearance for your ad.

Related Searches:

References

Resources

Comments

You May Also Like

Related Ads

Featured