Search

Technique Gallery - Image Linker Banner

The Image Linker Pluglet is a great solution for several situations. Here I have shown the Image Linker runing an image rotation that fades from one image to another and allows unique links (or even the same link) from each image. The result is a progression that is similar to Flash whilst still alowing you to make changes easily (and without the cost). This technique can work equally well in main banner of a web site or as an element in the content area which directs people to different sections of your site.

I built the banner above in about 1 hour using Corel's Paint Shop Pro. I decided what size I wanted the banner to be then chose 3 topical images from www.istock.com. I fairly quickly created the three swishes using vector tools. I inserted the images on separate layers and then added a Mask layer to each image to create the fades on the edges. I added the Text, copied that layer, rendered the copy to raster and blurred by 3 pixels. I set opacity to 20% on the blurred text and then moved it to create the drop shadow. Finally I switched layers so that I saw only the the individual slides in order and saved them off as JPEG images wih a compression setting of 10 named "NoFlash01" to 03 so I could keep the correct order easily.

In Create I inserted the Image Linker Pluglet and set the Pluglet Properties to:

  • Image Duration: 4 seconds
  • Start On Random Image: No (to ensure the sequence is kept)
  • Size: 213 x 600

then chose each of the images in order (in the example I didn't set links just to save you wandering off accidentally). I chose the Image Linker for it's ability to have Links and also because the images Fade from one to another. If I didn't want the fade or links I could have chosen the Photo Slider Pluglet instead.

When using an Image Linker or similar it is very important to make sure all the images are exactly the same size or as the images swap, rather than a smooth flow, the difference in sizes will create a jarring feeling for the user. Always making sure images are appropriately sized in a photo application will also make sure that images look smooth and don't take longer than necessary to download on the page.

If you have any questions or want some assistance with creating something like this for yourself please don't hesitate to contact one of us here at iSmart.

iSmart Software

Australia - United Kingdom - Ireland @ iSmartsoftware 2009. All rights reseverd.

Web design and content management software / web builder by iSmart Software Australia, United Kingdom and Ireland

xml

RSS : Real Simple Syndication