Protectiong Photos on a Website

While working on adding photographs to our camera club website, I looked long and hard at various methods of protecting photographs on a website from theft. My bottom line: other than limiting the size of images you post on your website, don't bother, as it cannot be done. I guess it is also good to add a javascript so people cannot just right click on your images to gain access to them.

The only way to protect images (completely) on the web is to not put them there in the first place. Bad solution. If you are a professional you cannot sell very well this way. If you are an amateur you cannot share this way. If you are a camera club you cannot attract new members this way.

The partial solution is to only put up relatively low resolution images. I am bold and post images with a maximum dimension (either height or width) of 600 pixels. You can still (if you are good with Adobe PhotoShop) create a half-way decent 8x10 photo from that. I would not be satisfied with the resulting 8x10, nor would anyone who really appreciates a sharp image. Bottom line here: if you are paranoid about your images getting stolen, do not put up anything larger than 300 pixels in the longest dimension. If you want to share (or sell), post images in the vicinity of 600 pixels in the largest dimension.

To partially limit theft of your photos (after limiting the size to something you are comfortable with), use a javascript that prevents the following: hovering over an image with the mouse to get the toolbar to copy the image, right-clicking on an image to copy the image, and right-clicking on a page to see the source code. These theft modes are then disabled on your website, although the javascript code must be added to every page on your website that includes photos. You will find the code below; feel free to use it if you wish to bother. Want to see what it looks like? The javascript code is active on my website at Avalon Peninusla (NF) Birds. Click on any bird icon on the left, then right click on the photo on the right and see what happens. Hover over the bird photo on the right with the cursor and nothing will happen. Want to see a webpage of mine without some of this protection? I do not bother to put the protection on the page with the thumbnails (on the left). So right click on one of the thumbnails and you will get a drop-down menu that allows you to "Save Picture As" and copy the picture to your computer. Right click on the black space beneath the text and from the resulting drop-down menu click "View Source." This shows you (and allows you to copy) the source code for that page on my website.

Some people put a copyright symbol and statement in their images. I personally believe that in most cases this is a waste of time to stop theft. It detracts markedly from the image. It does stop people who are honest, but they are unlikely to steal the image in the first place. It does stop people who are computer-illiterate. But anyone adept with Adobe PhotoShop can take a really complex image with a huge copyright notice on it, and eradicate the copyright mark in just a few minutes. The result will not be perfect, but it will certainly look as good as the original image, and better than the original image with a copyright mark on it. The one time you might want to add a copyright to an image is if you would actually sue someone who used it. Lawyers and all. Few of us would bother.

Finally I used a program called HTML Guardian to try protecting images. First of all, let me state that this program is a major pain to use, but also is somewhat effective. What HTML Guardian does is to break the image up into many images (I used 16) so that you have to download and assemble all 16 if you want the image. It also prevents you from seeing the code used to create the webpage (as does my javascript).

Here is the secret that means you cannot protect an image except by not posting it: all the computer-savvy person needs to do is use a screen-save (aka Print Screen), and paste it into a blank (new) Adobe PhotoShop image that is the same pixel-dimension as the computer screen. Then you crop out the image you want, process it, and print it. This cannot be stopped except by not posting the image on the internet at all! Nor can someone photographing the computer screen be stopped, although the results here are a bit less satisfactory than just doing a print screen command.

For my personal website, if someone wants the images (and if 600 pixels in the maximum dimension is sufficient for them) then they are able to steal my images. Sharing is more important to me than preventing the thefts that likely occur. I have had several people ask to use my photos, and I always say yes, but not for profit. By the way, the images I compete at camera club are 1400x1050 pixels for digital, and 2200 by 3300 pixels for slides. The images I use for prints are 4200x3300 pixels.


The following code is placed inside the header (between "head" and "/head") on every page with a photo. The script prevents accessing the photo and source code, the last line prevents the image toolbar from appearing (the image toolbar will give access to photos). You can copy and paste from the code below.

<script language=JavaScript> <!-- //Disable right mouse click Script //By Maximus ( w/ mods by DynamicDrive //For full source code, visit var message="Please purchase images to use them."; /////////////////////////////////// function clickIE4(){ if (event.button==2){ alert(message); return false; } } function clickNS4(e){ if (document.layers||document.getElementById&&!document.all){ if (e.which==2||e.which==3){ alert(message); return false; } } } if (document.layers){ document.captureEvents(Event.MOUSEDOWN); document.onmousedown=clickNS4; } else if (document.all&&!document.getElementById){ document.onmousedown=clickIE4; } document.oncontextmenu=new Function("alert(message);return false") // --> </script> <META HTTP-EQUIV="imagetoolbar" CONTENT="no"> </plaintext> <p> </body> </html>