MadameBlack Posted March 18, 2009 Report Share Posted March 18, 2009 Just wondering if there's anyone out there that knows the code to prevent someone from right clicking on an image and saving it? I'm about to attempt to make a website for my photography and I would really prefer not putting watermarks on everything if I can help it, and I've found the inability to save an image really helps! Be gentle with me! I'm a bit slow so far when it comes to code and I'm just starting out. I just didnt know how to even search for this kind of information, and I'm sure I'll need more help in the future, so I figured this was my best bet. Thanks! Quote Link to comment Share on other sites More sharing options...
Wickham Posted March 18, 2009 Report Share Posted March 18, 2009 (edited) If it's placed on a page with normal image code, themn I don't think there is any way to prevent someone downloading it. If they don't use the right click, then they can look at the source code for the url and download it that way. I think including it in a Flash file is a possible way to protect it, but you will have to learn to code Flash. See this about Flash:- http://labnol.blogspot.com/2007/08/prevent-visitors-from-downloading.html Edited March 18, 2009 by Wickham Quote Link to comment Share on other sites More sharing options...
Andrea Posted March 18, 2009 Report Share Posted March 18, 2009 And even then there are print screens. Quote Link to comment Share on other sites More sharing options...
monkeysaurus Posted March 18, 2009 Report Share Posted March 18, 2009 There's no way prevent this. You could watermark your images, but watermarks can be removed. If you're really concerned with people stealing your images - don't put them on the web. I wouldn't expend too much energy looking for a solution for this one. Quote Link to comment Share on other sites More sharing options...
MadameBlack Posted March 18, 2009 Author Report Share Posted March 18, 2009 yeah, I know its not fool proof, but it definitely cuts down on the possibility of it happening, for those who dont know how to get around that. I'll take a look into flash and see if I can figure it out. I didnt think about that I actually had to drop out of a web design class last year and they were eventually going to touch on Flash, so I'll need to get familiar with it again eventually when I retake it Quote Link to comment Share on other sites More sharing options...
LSW Posted March 18, 2009 Report Share Posted March 18, 2009 One trick and it is just a trick... Create a clear GIF the exact size of the image. Place the image as the background and the clear GIF as the image over it. Give it the same name as the background (only as a GIF). Now when a Fly by grabber comes by and snatches it with a right click, they get the clear gif. They can still go into the code to get the real image path... but hey, they have to remember where it was, which page and which image... so it can help sticking it to the fly by grabbers. But Flash is a better bet. Quote Link to comment Share on other sites More sharing options...
PicnicTutorials Posted March 18, 2009 Report Share Posted March 18, 2009 (edited) One trick and it is just a trick... Create a clear GIF the exact size of the image. Place the image as the background and the clear GIF as the image over it. Give it the same name as the background (only as a GIF). Now when a Fly by grabber comes by and snatches it with a right click, they get the clear gif. They can still go into the code to get the real image path... but hey, they have to remember where it was, which page and which image... so it can help sticking it to the fly by grabbers. But Flash is a better bet. I was just coding the same thing. Only, you don't even need the clear gif - a fake image will do! Basically the same thing as a no right-click script (many ways around it) but this prevents right-click "save image as" in all browsers! Ie6 needs the px height/width and overflow hidden. Otherwise, height:100% and width:100% works perfect in the others. { visibility: inherit; } Testing <br /><!--<br />#hide {<br />float:left;<br />position:relative;<br />overflow:hidden;<br />}<br />#hide div {<br />position:absolute;<br />top:0;left:0;<br />width:999px;<br />height:999px;<br />background:url(fake.jpg);<br />}<br />--><br /> Edited March 18, 2009 by Eric Quote Link to comment Share on other sites More sharing options...
PicnicTutorials Posted March 18, 2009 Report Share Posted March 18, 2009 (edited) ...Almost the same that is. With mine the browser doesn't even give "save as" an option. I wonder, is that because the image does not really exist? If so, my code with a 999px clear gif (LSW's) would probably be even better. That way, one size fits all! Edited March 18, 2009 by Eric Quote Link to comment Share on other sites More sharing options...
PicnicTutorials Posted March 19, 2009 Report Share Posted March 19, 2009 (edited) ...Almost the same that is. With mine the browser doesn't even give "save as" an option. I wonder, is that because the image does not really exist? If so, my code with a 999px clear gif (LSW's) would probably be even better. That way, one size fits all! I wasn't altogether correct. Messing with it now on my computer, this is what LSW was saying. This is how to make one size fit all (sort of). Edited March 19, 2009 by Eric Quote Link to comment Share on other sites More sharing options...
MadameBlack Posted March 19, 2009 Author Report Share Posted March 19, 2009 very nice ideas, I like that! at least that way if I cant figure out Flash...which I guess is still the *best* option? I can then do that instead. I think most people that steal images for they're own use are mainly not going to put the effort into figuring all that out. I find that its a lot of people wanting profile pictures or avatars.... things of that nature. Thanks! Quote Link to comment Share on other sites More sharing options...
PicnicTutorials Posted March 19, 2009 Report Share Posted March 19, 2009 I forgot to mention! In my code directly above, I used a 999px by 999px clear.gif and then just sized it to fit (with inline dimensions on the img tag) for each image. So one size fits all. That's important to me. Quote Link to comment Share on other sites More sharing options...
Andrea Posted March 19, 2009 Report Share Posted March 19, 2009 Eric, why not create the image just 1px by 1px and then apply whatever dimensions - wouldn't that save load time? Quote Link to comment Share on other sites More sharing options...
monkeysaurus Posted March 19, 2009 Report Share Posted March 19, 2009 1000px * 1000px transparent gif is around 1.7Kb while a 1px * 1px is about 0.5kb - you could probably save 1kb more easily elsewhere. Quote Link to comment Share on other sites More sharing options...
PicnicTutorials Posted March 19, 2009 Report Share Posted March 19, 2009 (edited) Eric, why not create the image just 1px by 1px and then apply whatever dimensions - wouldn't that save load time? Duuuhhh! Me Eric - me make fire - me smart! Yes, that's obviously better. Edited March 19, 2009 by Eric Quote Link to comment Share on other sites More sharing options...
Susie Posted March 19, 2009 Report Share Posted March 19, 2009 Quote Link to comment Share on other sites More sharing options...
jlhaslip Posted March 19, 2009 Report Share Posted March 19, 2009 Please be reminded that the http protocol includes sending the image information to the client requesting the image. That said, there is nothing you can do that will stop a devious client from capturing the image off the page. Disabling right click, transparent overlays, and other methods only defer the honest people. Any image on the web is available for capture. Many methods have been devised and they all fail. As noted above, a print screen and an Image program like Photoshop or GIMP will have the image captured in a flash. I appreciate that the purpose is to provide your potential clients with quality images on your Portfolio, and all that, but stopping them from 'snagging' the image in one form or another is not a valid request. Please re-consider the 'watermarking' of the images as the most effective method of deferring them from stealing the images. Another thing to consider is that you do not need to present the best quality shot on the web. Rather than providing a print quality image, reducing the quality to 'web quality' might be another approach to take. Considering Monitor display quality and Bandwidth are issues as well, you can drop the quality of the print so that it diplays best at a reduced size suitable for display, but not good enough as a print. Quote Link to comment Share on other sites More sharing options...
MadameBlack Posted March 19, 2009 Author Report Share Posted March 19, 2009 yes, I'll definitely be reducing image quality for all of them, that always makes them less desirable to steal. I really would hate to watermark my images, and I doubt I would. I've already got all my artwork in a gallery on DeviantART, so there's a big part of me that is perfectly fine with mass viewing and the possibility of stealing is always imminent. People do it for stupid reasons half the time that I'm sure I wouldnt care much about. I'm really pushing my photography skills though and I'm hoping to draw more attention than I have been getting in the past and I just figure that I might want to be more careful on my website. I really appreciate all the responses Quote Link to comment Share on other sites More sharing options...
LSW Posted March 19, 2009 Report Share Posted March 19, 2009 My right click article under JavaScript explains about ways to beat these things... in the end the image is automatically downloaded to my hard drive when I open the page... regardless of what you do (minus Flash) I already have the image if I can see it. Just most people do not realize it and this trick is for those not computer savvy enough, hence my calling it a trick. By the way, I like the Avatar Meagan. Quote Link to comment Share on other sites More sharing options...
MadameBlack Posted March 19, 2009 Author Report Share Posted March 19, 2009 thank you! I get bored sometimes and get dressed up, and I didnt have a proper picture of my blue-greenish hair. I figure it works good enough I'm definitely going to take a shot at flash, since I'm going to have to anyway sooner or later with classes, but at least there's some other really good tricks now that I wouldnt have thought of before. Quote Link to comment Share on other sites More sharing options...
LSW Posted March 19, 2009 Report Share Posted March 19, 2009 MadameBlack has Blue/Green hair? What is wrong with this picture? Quote Link to comment Share on other sites More sharing options...
MadameBlack Posted March 19, 2009 Author Report Share Posted March 19, 2009 its always black and another color, lol. Pretty soon it will be black and white Quote Link to comment Share on other sites More sharing options...
LSW Posted March 19, 2009 Report Share Posted March 19, 2009 Black & White Hugh? I even know a good theme song for you. OK, Back on subject! Quote Link to comment Share on other sites More sharing options...
tpattison Posted March 21, 2009 Report Share Posted March 21, 2009 Just as a note. In Firefox, all you have to do is open the "Page Info" box, click on the "Media" tab, select the image and then "Save As...". So even the transparent GIF trick isn't going to deter many. You could make your image really small, that way prints will look bad and won't be of much use on screen. Quote Link to comment Share on other sites More sharing options...
daddyalfie Posted March 22, 2009 Report Share Posted March 22, 2009 This was a very fascinating and informative thread! I believe tpattison's last input is the ultimate answer. Make them too small to be useful! There will still be people who use the images for icons and the like, but not for full quality theft of images. Interesting subject! Maybe new W3C protocols in the future? Alfie Quote Link to comment Share on other sites More sharing options...
Wickham Posted April 3, 2009 Report Share Posted April 3, 2009 (edited) I've just found this link:- http://www.protware.com/ Look at the screenshots page. The program encrypts html and css files and also disables right-click screen printing. Has anyone tried this program? It looks as if it would deter the average Joe trying to copy images; the encryption probably works well so that just leaves the screen print as a possible way to capture an image if the disabling can be worked around. Can the disabling print screen be avoided? This is an extract from protware.com about trying to use Firefox's Media Save as or any other browser's "Save image" or "Save as":- Here comes the Image Guardian - it will split your images into pieces and will generate the appropriate code (which will be then encrypted by HTML Guardian) to display those pieces in your pages as if this is an integral, non-splitted image. This will make image theft nearly impossible - if someone wants to get some of your images, he/she will not be able to get the entire image, only a pieces of it saved under random, meaningless names. It will be very hard to determine that a certain piece is a part of a certain image. Let's say your website has 10 images, and you configured Image Guardian to split them into 3x3=9 pieces each - this will result in 90 image pieces with random names, mixed with a lot of images from other websites visited. A determined person may still be able to find all the pieces of a certain image, but finding them and joining them together to recreate the original image will require a lot of time, knowledge and expensive image editing programs(like Photoshop and similar). In most cases, this will also lead to a seriously decreased image quality. We can say that HTML Guardian's image protection will decrease the risk of image theft with 95-98% (but not 100%). Edited April 3, 2009 by Wickham Quote Link to comment Share on other sites More sharing options...
falkencreative Posted April 3, 2009 Report Share Posted April 3, 2009 I haven't personally used it... It does require Javascript though, and with it turned off, a blank page is displayed. Minor point, but a reason I wouldn't use it. Quote Link to comment Share on other sites More sharing options...
newseed Posted April 3, 2009 Report Share Posted April 3, 2009 The big questions here are...Is it SEO friendly? Will Google Index the pages that uses it? Will Yahoo? The website that sells that software doesn't really say anything about that. Quote Link to comment Share on other sites More sharing options...
jonbey Posted April 12, 2009 Report Share Posted April 12, 2009 I love that clear image on top idea. Something else you need to consider is preventing hotlinking. Some servers allow this through the control panel, otherwise it some code in the .htaccess file I think. People often steal your images AND your bandwidth at the same time and show them on their own sites. Quote Link to comment Share on other sites More sharing options...
joris1 Posted April 21, 2009 Report Share Posted April 21, 2009 Had the same problem. Thank for the input! Quote Link to comment Share on other sites More sharing options...
LSW Posted April 21, 2009 Report Share Posted April 21, 2009 MadameBlack - Another idea. You could use disjointed rollovers (http://meyerweb.com/eric/css/edge/popups/demo2.html). The advantage here is that as soon as the mouse is moved from the thumbnail the image vanishes... it can be beat as described above... but for the right click grabbers who do not understand what is going on it can be frustrating as it disappears when the move the mouse. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.