|

Description: The Image Guardian action applies certain rules to the selected image item to make it harder for the web page viewer to download a copy of the image. Although the only real solution to preventing users from copying restricted images is to simply not place them on the web in the first place this action will make the process a lot harder. As a simple example some of the action's features have been applied to the following image.
Adding the action to your pages: Image Guardian is generally what is called an item action. Applying the action to a specific image is quite simple. Simply follow the 'Applying Item Actions' guidelines.
Using the action: Once applied to an image all of the settings relating to the action can be viewed and set from the Image Guardian tab in the Actions palette. If the palette is not visible simply select Actions from the Window menu and the palette will open (figure 2.1).
 Figure 2.1 - The Image Guardian action interface.
The Activate check box ( ) is something that you will find in a lot of these actions as it allows action code to be disabled without needing to be removed from the item which would, in turn, lose any of the user settings applied to it. It allows users to quickly add and remove action functionality very quickly and easily.
Below the Activate check box are the main controls that allow the image to be protected by the action.
Prevent copying ( ), Prevent dragging( ) and Prevent right clicking( ) do very much what these interface elements suggest. They each attempt to protect the image by 'trapping' these three vital events. When a user attempts to drag an image, for example, the action's code will instantly 'return false' to the request which has the effect of denying the user access to this feature. Due to the way that contextual menus are accessed on the Mac this feature will have no effect in preventing Mac users from accessing the image. In this instance it is recommended that blank GIFs ( ) are also used.
The new Hinder contextual menu control ( ) will prevent the user getting to Internet Explorer's contextual menu if they click and hold the mouse over the image on a Mac. Unfortunately it cannot prevent the user simply using the control key to access this feature. As such it's recommended that images are also protected using the Insert blank GIFs feature ( ).
Insert blank GIFs ( ) will, as the name suggests, insert blank, or clear, GIF images over the top of your image. The result of this is that if someone attempts to download the image by either clicking on it or dragging it to their desktop then they will get a copy of this blank image rather than the one they were after. To accomplish this the action makes use of tables rather than layers which ensures that this feature can still be effective on pre HTML version 4.0 pages.
Image Guardian can also be set to remind users that the image you are attempting to protect should not be downloaded. We can do this by selecting the Display warning check box ( ) and entering the text to be displayed in the Text field ( ). By default the message will be displayed in the form of an alert when the user attempts to click on the image. Because this would be highly restrictive for images that also acted as links, for example, you have the option of choosing how the text is displayed to the user using the Display pop-up menu ( ). The display options are;
- in an alert
Image Guardian will attach code to the image which will cause a standard JavaScript alert window to pop open with your warning text. By default this happens when the user clicks on the protected image in the hope of downloading it. Although this can be altered by use of the When pop-up menu ( ) so that the alert will pop-up when the user rolls over the image it will almost certainly prove to be more of an annoyance than a benefit. - in the status bar
This allows the message text to appear in the browser's window status area at the foot of the current browser window (figure 2.2).
 Figure 2.2 - The message text displayed in the status area. - as a tool tip
'Tool tips' (or titles) can be quite effective in adding extra information to images. When the user rolls over the image a little balloon help 'bubble' (figure 2.3) will pop open on the Mac. On Windows based PC's and in Netscape 6 the text will appear as a yellow tool tip bar.
 Figure 2.3 - A tool tip message as seen on a Mac in Internet Explorer.
Internet Explorer introduced the Image Toolbar feature ( ) as a quick and convenient way for users to access images found on web pages. By default the browser will pop up a small icon palette over any images over 200 pixels square in size when the user hovers over the image. Buttons on the palette allow the user to save, print or e-mail the image as well as allowing them to easily open their 'My Pictures' folder (figure 2.4).
 Figure 2.4 - The Image Toolbar in Internet Explorer 6.
Image Guardian allows you to prevent the toolbar from appearing either on an image by image basis or for all images on a page by using the Disable ( ) pop-up menu.
Prevent Printing ( ) uses the power of CSS to prevent the selected image appearing on any printouts. If you are currently viewing this page in a browser that supports CSS you may want to attempt to print, or preview, this page as you should see the FreewayActions.com logo missing from the top of the page.
Prevent Caching ( ) inserts a META-TAG in the document head that instructs the browser not to cache (or store locally) any content for this page. In doing so the image will need to be downloaded every time the page is viewed but a copy will not be held on the user's machine.
Protect Image Directory ( ) creates and inserts a small 'index' file into the same directory as the current image (normally called 'Resource' or 'Resources') to prevent users from simply directing their browser to this location and getting a full list of the images used in the site. Although this can also be done by setting the permissions on this folder to prevent directory listings inserting an index file in this fashion is just as effective and a lot quicker.
Prevent Robots ( ) does a similar thing to Protect Image Directory ( ) in that it will create and upload a small 'robots' text file that will prevent any search engines from trawling the Resources folder. Although this may not seem that important at first, many more search engines offer tools for locating images without the need for users to access your web pages. With this robots file in place these search engines should ignore your images.
The QuickTime movies section of the action interface ( ) allows you to apply the action to QuickTime content and have it prevent users from saving the movie by way of the item's contextual menu.
 Figure 2.5 - Prevent users from saving movies by blocking the QuickTime contextual menu.
Using rollovers with protected images: One of the best ways to protect an image with Image Guardian is to use the Insert Blank GIFs feature (6) so that your image sits behind a protective clear GIF. Although this works well it will, however, fail to protect any images used as rollovers on this image. When Freeway's own rollover action is combined with this feature of Image Guardian anyone rolling over the protected image will load the rollover image 'over' the original (rather than replacing it as would normally happen). Obviously this leaves the rollover image open to attack as it can be easily downloaded.
OK here's a simple example:

1. The diagram to the left shows an exploded representation of your protected image. You can see the image plus the clear GIF that sits over the top of it.
2. When used with the standard Freeway rollover action if the user rolls over the image the clear GIF is replaced with the rollover image rather than the protected one. Once the rollover image is displayed this once again becomes susceptible to copying by the user.
The solution: Because of these problems Image Guardian now ships with its own rollover action called Image Guardian Rollover (it took hours to come up with that name!). The action will only work if the image is also being protected by the Insert Blank GIFs feature of Image Guardian.
Simply apply the action to the protected image and select the image to use as the rollover (see figure 2.5). You can also choose to preload the rollover image as well as restore the original image when the user rolls off of the image.
 Figure 2.5 - The Image Guardian Rollover interface.
Now when the user rolls over the protected image the rollover image is loaded behind the clear GIF.
Please note that because of the way these images have been protected the rollover code is totally different from that of the standard Freeway rollover action. As such Image Guardian's rollovers cannot be used as slave triggers or images at present.
Requirements: To add Image Guardian functionality to your web pages you will need Freeway 3.1 or higher including Freeway Pro. This action will not run in any version of Freeway Express.
Browser compatibility: Image Guardian uses both tables and JavaScript to protect images which are supported on most modern browsers - mainly version 3.0 and above.
Image Guardian Rollover requires a browser that supports the document object model (DOM) and therefore requires mainly IE version 5.0 or above or Netscape 6.0. |