protecing your images on the web
January 12, 2008 //
If you put up some photos of paintings or certificates or any personal stuff on the internet, at some point someone is going to use those photos without your permission. You may feel that your stuff is ’stolen’, but there isnt much that you can do in order to protect your images. So what do you do?
1. You can start by putting up low-resolution images on your website at a size as small as possible. A resolution of around 72 dpi would be fine for viewing on the web. These low quality resolution images may be copied for use on the web, but are no good for printing out.
2. Watermaking your pictures has been one of the favorite methods of discouraging others from using your images. You can easily put up a semi-transparent text across you image to deter the others from using the images directly. It is possible to remove a watermark, but most people wont spend the time doing so.
3. Some websites disable right click on their websites in the hope to stop their content from being ’stolen’. I would not suggest the scheme as it turns out to be highly irritating for the visitors and it is very easy to bypass. Anyone can disable scripts in his browser for your page and easily download the images from your website.
4. Another not-so-commomly-used method can be to incorporate each of your image as a separate Adobe flash object. However, initially you need to create different flash objects for each of your images. On the upside, no one can right-click-and-save your images nor can anyone download the images from the path. But there do exist softwares to specifically download flash objects from the website. Once downloaded, graphic objects can be easily extracted from the flash objects.
5. Some developers use the technique of image hiding. In this technique, the original image is placed as the background of a table cell introduced at the position of the image on the webpage. Above the background image (the image you need to display), you place a transparent image of the same size. When the visitor right-click-and-save the image, without knowing he selects the transparent image to be saved. The technique relies on the assumption that the visitor wont notice that he has saved the wrong image until much later and will decide that returning to your site to steal the right one is too much effort. The code for such a technique can be generated here.
6. The last one possibly the most complex and the most time consuming of all is the slicing method. In this method, you can use any software like Adobe Fireworks (my favorite!) for slicing the images into several parts. The same software is capable of generating the appropriate html code to re-assemble the image parts on the webpage. You can copy the generated html <table> code (without the <html> or <body> tags) into your webpage. In this case, with the visitor right-click-saves, he is able to save only the sliced part of the image where he clicked. In order to obtain the complete image, he has to download all parts and then re-assemble the parts like a jigsaw puzzle in his webpage or a photo editing software. This method may be used by applying this process to a low resolution image. Click here for a sample image
The slicing method is my favorite amongst all. However, the inital prep for all images has always been a big deterrant for adopting this method. I plan to code a script to automate the slicing procedure in the near future. Keep a check on this page for any updates.
Even with all the methods described above, the user can still use print-screen and obtain the image using a simple photo editing software. Thus, all the methods described here are still not capable for providing complete security for your image content on your webpage. However, a combination of the techniques described above can really discourage someone from downloading your images for personal use.
gayle said...
hi, just have a sec and wanted to say thank you for being so generous to share your expertise on this topic.
i will return when i have more time…
peace,gayle in WA state
February 11th, 2008
gagan said...
wanna send my photos in the internet
April 10th, 2008
Susan said...
I would really love for you to post a tutorial on how to use Adobe Fireworks to do the slicing and upload a photo to my site as a sliced image instead of an ordinary .jpg. I have searched high and low on the internet for instructions on how to follow your last tip to no avail. I think it’s a great idea though. Or would it be better to post images as a movie to help slow down would be thieves?Thanks.
August 3rd, 2008
Rachel said...
How to put disable right click on my blog to protect my picture fron copying and stealing??
September 7th, 2008