Hacking Hockney Images

As a photographer and Web Designer/Developer the most frequent question I am  asked “is how can I protect my pictures from being stolen?” The question recently arose again when  I showed a client the David Hockney website and thus encountered  its somewhat forbidding entrance way:

1. Greg Cope at Nature Focused  states bluntly – “Put plain and simple: the only way to protect your images from being downloaded or stolen off a web page is to not put them online in the first place.”
2. Skinny Artist says – “After scouring the web, it turns out the only 100% foolproof method of protecting our work from these thievin’ bastards is to avoid putting your stuff on the internet in the first place.”
3. Tara Hornor at TutsPlus – “As a photographer, one of your biggest concerns with putting your work online is probably that it can be stolen so easily. No matter how well you try to protect your intellectual property (IP), once it is on someone’s screen, there’s not much you can do if they’re serious about stealing“.
4. Carolyn Wright at Lynda.com = “Taking photos is fun—but sharing them over the Internet is what photography is all about these days. Unfortunately some people want to share your photos more than you’d like them to. ”
   
5. Jeff Chandler at WPTavern – “Although copy protection plugins or copy protection in general prevents the average website visitor from being able to steal content, they come with a lot of unnecessary baggage. In essence, they do more harm than good, especially from an accessibility stand point, as common keyboard shortcuts are disabled. If you don’t want to have your content stolen online, don’t publish it.”

As you can see there is a consistent pattern here – if you don’t want something stolen the collective recommendation is “don’t make it publicly available on the Web” But surely in 2015 there must be some effective methods to curb if not outright curtail photo piracy. But to solve this “damned if you; damned if you don’t” problem lets take a look at how images get stolen and then some potential remedies.

Methods of Photo Pirating

At first there seems to be dozens of ways to pirate photos. And in some cases vendors may want copy/pirating – the more copying the better especially when  promoting a product or service. But in too many cases pirating is just exploitation and often from afar.

The number one problem is that pirating of images is greatly enabled by all of the major browsers. Take the  right mouse click. Use it on any website image and users get a Save Image As command that facilitates the download of your image by any user of your website. Unfortunately,  there are a lot more pilfering permissions made available by most browser. The following table introduces increasingly effective pirate methods and their deterrents.

Image Stealing and Deterrence
Pirating Method	Potential Deterrents
Keyboard Copy & Paste commands in browsers allow easy copy of text and/or images	JavaScript to trap keypress or keydown events Add the following code to your < head > block. This provides the template for which keypresses you want to trap and turn away.[html] <script language=”javascript”> document.onkeydown = overrideKeyboardEvent; document.onkeyup = overrideKeyboardEvent; var keyIsDown = {}; function overrideKeyboardEvent(e){ switch(e.type){ case “keydown”: if(!keyIsDown[e.keyCode]){ keyIsDown[e.keyCode] = true; // do key down stuff here } break; case “keyup”: delete(keyIsDown[e.keyCode]); // do key up stuff here break; } disabledEventPropagation(e); e.preventDefault(); return false; } function disabledEventPropagation(e){ if(e){ if(e.stopPropagation){ e.stopPropagation(); }else if(window.event){ window.event.cancelBubble = true; } } </script> [/html] Note this may disable legitimate uses of CTL+C and other keyclicks in other blocks of HTML code. Be careful! . Downside: Some legitimate usability may be lost.
Right Mouse Click[Ctrl+click on Mac] + Save Image as popup expedites stealing images.	JavaScript to disable right mouse click Add the following code to your < head > block[html] <script language=”javascript”> document.onmousedown=disableclick; status=”Right Click Disabled”; Function disableclick(event) { if(event.button==2) { alert(status); return false; } } </script> [/html] Note this disables legitimate right mouse click events as well as image theft ones. Downside: again legit options are blocked too.
Drag and drop image to desktop or file browser	CSS change on images draggable=’false’
Print Screen image capture	JavaScript to disable PrintScreen  or Word Press plugin Downside: Easily defeated by screen image capture as described below.
Print Screen Image  and other methods of screen image capture are very simple and yet very hard to defeat. PrintScreen disablers wipe out so many regular browser and OS commands they can become too punitive to use . But the other screen image capture methods are equally hard to deter.  For example using a  screen grabber like Snagit or taking a picture of the screen with a high resolution digital camera are nearly impossible to defend against. The Hockney opening page image [see above] was captured using Snagit. In sum, screen image capture is cause for  most severe  vulnerability of Web pictures. See below for some methods of deterring but not completely defeating image capture thieves.
Get image  from Browser cache or source code	Close RSS Feed combined  with   Click to see CSS Substitution Protection CSS class will make the Pillow pic non-downloadable. The pic123.png matches the exact dimensions as the pillow.jpg. [php] <style> cssimage { /* This code hides the image in a protected directory */ background-image: url(“https://photofinishes.ca/images/pillow.jpg”); } </style> <script language=”javascript”> /* This script disables right mouse click – reducing usability but protecting images */ document.onmousedown=disableclick; status=”Images &copy;copyright JBSurveyer, all rights reserved”; function disableclick(event) { if(event.button==2){ alert(status); return false; } } </script> [/php] Downsides: Usability decrease and greatly increased development time
Get image file address from browser’s Inspector or Sourcecode dump	htaccess Cutoff , disable  right mouse click and the above CSS Substitution method Downsides: Greatly increased development time, website usability suffers
Suppress use of RSS Feed	Click to see how to cancel RSS Feed Add the following code to your theme’s function.php file:[php] function fb_disable_feed() { wp_die( __(‘No feeds are available on Tester WP42,please visit our <a href=”‘. get_bloginfo(‘url’) .'”>homepage</a>!’) ); } add_action(‘do_feed’, ‘fb_disable_feed’, 1); add_action(‘do_feed_rdf’, ‘fb_disable_feed’, 1); add_action(‘do_feed_rss’, ‘fb_disable_feed’, 1); add_action(‘do_feed_rss2’, ‘fb_disable_feed’, 1); add_action(‘do_feed_atom’, ‘fb_disable_feed’, 1); add_action(‘do_feed_rss2_comments’, ‘fb_disable_feed’, 1); add_action(‘do_feed_atom_comments’, ‘fb_disable_feed’, 1); [/php] Also be sure to remove RSS and Meta widgets from any sidebars as they will no longer work.
Use image address for pirating	.htaccess file lock can limit access to images in a protected directory Add the following code to the .htaccess file that protects the directories where your images are stored. If there is not a .htaccess file in the directory create one containing these commands:[php] SetEnvIfNoCase Referer “^http://www.your-domain-name-here.com/” locally_linked=1 SetEnvIfNoCase Referer “^http://www.your-domain-name-here.com$” locally_linked=1 SetEnvIfNoCase Referer “^http://your-domain-name-here.com/” locally_linked=1 SetEnvIfNoCase Referer “^http://your-domain-name-here.com$” locally_linked=1 SetEnvIfNoCase Referer “^$” locally_linked=1 <FilesMatch “\.(gif|png|jpe?g)$”> Order Allow,Deny Allow from env=locally_linked </FilesMatch> [/php] If there already is a .htaccess file, just append the above lines.
Users are not aware images are protected and proprietary.	Remind them with watermarks and warning messages. Unfortunately, most visible watermarks are intrusive and can be defeated by top photo editors.

WordPress Plugins for Image Protection

WordPress has a number of plugins for image and general copy protections. the following table summarizes their use and effectiveness.