• 0

Protecting images on a site


Question

I have seen this done on some sites before where if someone tries to download or link to an image on your site, instead of getting the image they wanted, they get a generic one with the websites logo and a message stating not to copy the images. How can I do this?

My reason for needing this is that it is for a photography website where the client doesn't want to use watermarks (spoils the photo) but also doesn't want other people to use her work without her permission or claim it as their own.

Cheers for any help.

Jordan

Link to comment
Share on other sites

Recommended Posts

  • 0

In my experience if I want to get a picture from somewhere, I'll get it no matter what kind of countermeasures are in place. :-)

Link to comment
Share on other sites

  • 0

Unless you embed it in a Flash applet or something, it's pretty simple to bypass these things. In Firefox, you can just right click, view page info, and you get a list of all images on the page and a save button.

Link to comment
Share on other sites

  • 0

You can. Just use a flash gallery, the images are loaded dynamically inside the flash clip and you can't get them, even if you get the flash and decompile it.

Link to comment
Share on other sites

  • 0

You can. Just use a flash gallery, the images are loaded dynamically inside the flash clip and you can't get them, even if you get the flash and decompile it.

Even then if you really wanted it you could just screenshot it :p

Link to comment
Share on other sites

  • 0

You can. Just use a flash gallery, the images are loaded dynamically inside the flash clip and you can't get them, even if you get the flash and decompile it.

It'd take me about two seconds in Microsoft Network Monitor to get the URL. That said, it would stop most people. Sort of. There are people who will just hit print screen on an image they like. For that reason, you'll want to reduce the size and quality as well.

Link to comment
Share on other sites

  • 0

Even then if you really wanted it you could just screenshot it :p

Yes, but you would get a crappy preview, at a smaller resolution than the original pic. :)

@hdood: Come on, if we're talking on this level, than remember that ANYTHING can be cracked/reversed/stolen, etc. We're talking about the average user. :)

Link to comment
Share on other sites

  • 0

You can use .htaccess hotlinling protection.

This will prevent people from using the photograph's URL on another site and using her/your bandwidth. You can also setup the rule to display a specific image when a user tries to hotlink.

This won't do anything to prevent them from right-clicking and saving but rather just people who copy/paste image URLs.

I'm on my iPhone so I can't give you the code itself but I have this snippet in my company's KB database: http://my.holdfire.net/knowledgebase/28/How-do-I-prevent-hotordirect-linking.html

Link to comment
Share on other sites

  • 0

Yes, but you would get a crappy preview, at a smaller resolution than the original pic. :)

Really? When I screenshot a page I get the image as the browser see's it.

Link to comment
Share on other sites

  • 0

Really? When I screenshot a page I get the image as the browser see's it.

You would get what the gallery shows you. And, usually, that's just a preview (300x400 or something).

Link to comment
Share on other sites

  • 0

^ If you're never going to show the full picture and only a preview, what's the point in protecting it? I'm assuming that obviously somebody wants to protect something more than just a small thumbnail.

I agree that these measures are very easy to get by but will stop the average user. But then again, someone who wants to steal it that bad would find a way.

A simple way wound be one of those right-click blockers in the code. I don't know anything about coding though.

Link to comment
Share on other sites

  • 0

Why can't anyone just answer his question? Try this out Sorry that's only part of what you asked for.

maybe because no such answer exists? you cannot, possibly, ever, show someone an image and then prevent them from making a copy of whatever you've shown them.

hotlink protection, watermark, hashing, sealed-in-envelope-addressed-to-yourself all serve different purposes, and they may be effective depending on what you want to achieve, but asking for a blanked "protect an image" mechanism is like asking for unicorn blood.

Link to comment
Share on other sites

  • 0

Instead of being pedantic, primexx, maybe read what the OP is asking for instead.

While he did mention the owner doesn't want the photographs to be used by anyone else the main requirement is what hotlink protection can do.

THAT is the answer. Not any of the BS that's been spewed in here aside from legitimate suggestions.

Link to comment
Share on other sites

  • 0

Instead of being pedantic, primexx, maybe read what the OP is asking for instead.

While he did mention the owner doesn't want the photographs to be used by anyone else the main requirement is what hotlink protection can do.

THAT is the answer. Not any of the BS that's been spewed in here aside from legitimate suggestions.

how does hotlink protection at all prevent "other people to use her work without her permission or claim it as their own."?

it's not a method of protecting anything. the best it can do is to reduce your own bandwidth costs, and even then it's nowhere near 100% effective, since:

a) either anyone who doesn't send referrer headers can still see hotlinked images; or

b) anyone who doesn't send referrer headers can't see the images at all, even on your own website.

this isn't being pedantic. what the OP asked for simply isn't possible (note that one of the conditions already provided is that they don't want to use watermarks).

Link to comment
Share on other sites

  • 0

ANYWAY

Does her hosting account have GD library enabled? If she doesn't want to watermark the original photos and upload them online, I think you could definitely toss a couple of PHP files up there that would generate a watermark on the image on the website only.. Which means you wouldn't need to edit all of the photos. The watermark would just be processed when the photo is loaded :).

It does have some disadvantages but no harm in trying it out as an option alongside with .htaccess protection for hotlinking.

http://systembash.com/content/php-gd-htaccess-to-watermark-all-images-in-directory/

http://www.sajithmr.me/intelligent-watermark-php-gd/

Link to comment
Share on other sites

  • 0

ANYWAY

Does her hosting account have GD library enabled? If she doesn't want to watermark the original photos and upload them online, I think you could definitely toss a couple of PHP files up there that would generate a watermark on the image on the website only.. Which means you wouldn't need to edit all of the photos. The watermark would just be processed when the photo is loaded :).

It does have some disadvantages but no harm in trying it out as an option alongside with .htaccess protection for hotlinking.

http://systembash.com/content/php-gd-htaccess-to-watermark-all-images-in-directory/

http://www.sajithmr.me/intelligent-watermark-php-gd/

I think the OP doesn't want people to view a watermarked image as it takes away from the quality of the image. If it was just a matter of not wanting to edit the original then he could make a copy and only put the watermark on the copy and not the original.

EDIT: That being said, I do not think there is any real solution to your problem. You could disable right-clicking (which will stop the average user), but that may not work on all browsers (depending on how its handled) and it will not stop anyone who knows anything about computers. You could embed them in a flash gallery as already suggested, which will make them even more difficult to download/save, but not impossible if someone really wants to do it.

Probably the best solution I know of is to embed it in a flash app, if possible only include a small image (not necessarily low quality, but small so its mostly useless to copy). From there the only way they can copy it is to screenshot it which, while simple, again, will not provide much use if its a small image, or some of the more advanced methods mentioned previously.

You best bet is either watermarking the image (which you already said you do not want to do) or make it difficult to and/or not worth copying.

Link to comment
Share on other sites

  • 0

I can read. Watermarks won't "spoil" a photo if you do it tastefully and if you just create an image with enough opacity that it barely interrupts the flow of the files.

Either way, it's merely a suggestion.

Link to comment
Share on other sites

  • 0

I can read. Watermarks won't "spoil" a photo if you do it tastefully and if you just create an image with enough opacity that it barely interrupts the flow of the files.

Either way, it's merely a suggestion.

I wasn't implying you couldn't, its just that the OP explicitly mentions that the client doesn't want to watermark, but honestly that is one of the best ways to protect people from copying your work.....they will still do it, but I will agree that it is one of the best solutions, since there is no way to really stop a determined person from grabbing the image.

Link to comment
Share on other sites

  • 0

About 5 years ago, I came up with a mostly fool proof way of protecting images but doing the following:

Create a Table (Mind you - 5 years ago)

Embed said image as table background

Apply Transparent image with "SAMPLE" or whatnot as the picture for the table. - This essentially created a layered image.

When the person would print the page, usually the settings were set to not print background images to conserve ink. If they printed with background images, it would be superimposed with the "SAMPLE" text, thus creating an issue.

A Screenshot person would only grab it with the image and "SAMPLE" on it, then would have to edit it out by hand.

A Right Clicker would get the transparent image and no background image in the table.

A person who would view the source with get a scrambled source code to decode.

It was good enough almost to satisfy a safety paranoid person who has the exclusive rights to Jairus Watson prints. I was virtually contracted to work on his site but declined after he wanted me to write a book for him (The website owner) as an on-call person.

In reference to using a program to read the picture name as it was being called from the server, my question would be, couldn't you call it in an encrypted manner with a non-descript filename? This would also throw off the image engines that index images site wide.

Link to comment
Share on other sites

  • 0

You could always disallow indexing of just images. Although I'd recommend against it as it will definitely have a negative impact on SEO. My website gets hundreds of search hits a day for various images I have throughout my website (although I don't care if people use my photos elsewhere, blah blah.)

But for someone that wants to control it as much as they can...

In between the <head> tags you'd add:

&lt;meta name="robots" content="noimageindex"&gt;

If you have directories with photos in it you can prevent viewing of the index (for humans) as well as spiders:

For search engines, add the following to a robots.txt:

User-agent: *
Disallow: /&lt;image-directory&gt;

For humans, add the following to .htaccess:

Options -Indexes 

Or if you don't give a crap about people viewing your indexes, you can get all fancy: http://www.reload.me.uk/projects/fancydir/

Link to comment
Share on other sites

  • 0

About 5 years ago, I came up with a mostly fool proof way of protecting images but doing the following:

Create a Table (Mind you - 5 years ago)

Embed said image as table background

Apply Transparent image with "SAMPLE" or whatnot as the picture for the table. - This essentially created a layered image.

When the person would print the page, usually the settings were set to not print background images to conserve ink. If they printed with background images, it would be superimposed with the "SAMPLE" text, thus creating an issue.

A Screenshot person would only grab it with the image and "SAMPLE" on it, then would have to edit it out by hand.

A Right Clicker would get the transparent image and no background image in the table.

A person who would view the source with get a scrambled source code to decode.

It was good enough almost to satisfy a safety paranoid person who has the exclusive rights to Jairus Watson prints. I was virtually contracted to work on his site but declined after he wanted me to write a book for him (The website owner) as an on-call person.

In reference to using a program to read the picture name as it was being called from the server, my question would be, couldn't you call it in an encrypted manner with a non-descript filename? This would also throw off the image engines that index images site wide.

it's absolutely trivial to get the actual image. For starters, there's the "view background image" item in the context menu, i'm not 100% sure it'd work if you have an image overlaid on top of it, but it's equally trivial to block that image from being loaded, you could also inspect the table and grab the background url directly from the html/css (which, by the way, is nicely formatted by the inspection tool), and there's also countless other ways you can get at it within a few clicks.

you can get all elaborate and stream data to a flash container from a server-side script that accesses encrypted images inside a folder that is forbidden to the public, but that's still trivially defeated by a print screen. the best method really is just to watermark the images in a manner that they can't edit out with ease.

Link to comment
Share on other sites

  • 0

Wow, lots of replies here to read through. Once I finish reading them all, rep points for those who actually helped.

I think hotlink protection and maybe right click protection is all I am looking for. I am well aware that there are always ways to get around this but the point is really to stop the "average" user and send a clear message that you are supposed to ask for permission first.

Now instead of the normal right click protection, is there a way to set it so that when a visitor tries to go to "save as", they don't get the image they wanted but instead something like what would happen with hotlink image swapping thingy? If that makes sense.

Link to comment
Share on other sites

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.