677 Messages
•
44.6K Points
Sitebuilder Plus: Protect Images
Note: We want to provide a few common and useful snippets for your use, but our support department is not able to assist you with editing code. They can help you with code placement.
Protecting digital media (especially images) on the internet is next to impossible due to the nature of how the internet and webpages work. When someone views a webpage the web browser is downloading a copy of all the content of the page to the computer. So even if you go to great lengths to prevent them from taking an image from the website, the reality is they already have that image on their computer in the temporary internet files. On top of that, anyone can take a screenshot when viewing a website and get the image that way.What you can do is make it more difficult for the average internet user to take the image. Most of these were mentioned by your fellow community members, but here are the most common ways our users do that:
Disable Right-Click: The right-click menu allows the viewer to easily save an image from the browser. It can be disabled by putting code on your website, but it will not prevent some browsers from being able to drag the image directly to the desktop. There are several different ways to do it in code, but here is the most efficient code we've found to disable the right-click menu. Place this code in the head section, under Page Settings > Advanced
Shrink Wrap Images: This is the technique of putting a transparent image on top of the image you are protecting so they cannot drag it or right click save since it will save the invisible transparent "shrink wrap" that is on top. In SiteBuilder you can do it easily without code by adding a border over the image since borders have a transparent center and are essentially like a picture frame with glass.
Add a Watermark: Adding a digital watermark does not make it more difficult to steal the image, but it is the best deterrent since they would have to use Photoshop or another image editor to remove the watermark. How efficient it is depends on the complexity of the image, the watermark placement on it, and how difficult it would be to remove. There are free websites online to add watermarks such as http://www.picmarkr.com or you could use just about any image editing software.
Resize before uploading: Images on your site need to be downloaded to the visitors computer. If you are uploading high resolution images, it will slow down page loads. If you resize the images to a lower resolution, you can still have a good looking image that isn't as useful to the person that does manage to steal it. Sitebuilder will alert you if the image you are uploading is larger than necessary and offer to resize it to a more appropriate size.There are several other methods out there but like these the best they do is make images difficult to steal so a viewer might find an easier website to take images from.
Protecting digital media (especially images) on the internet is next to impossible due to the nature of how the internet and webpages work. When someone views a webpage the web browser is downloading a copy of all the content of the page to the computer. So even if you go to great lengths to prevent them from taking an image from the website, the reality is they already have that image on their computer in the temporary internet files. On top of that, anyone can take a screenshot when viewing a website and get the image that way.What you can do is make it more difficult for the average internet user to take the image. Most of these were mentioned by your fellow community members, but here are the most common ways our users do that:
Disable Right-Click: The right-click menu allows the viewer to easily save an image from the browser. It can be disabled by putting code on your website, but it will not prevent some browsers from being able to drag the image directly to the desktop. There are several different ways to do it in code, but here is the most efficient code we've found to disable the right-click menu. Place this code in the head section, under Page Settings > Advanced
Shrink Wrap Images: This is the technique of putting a transparent image on top of the image you are protecting so they cannot drag it or right click save since it will save the invisible transparent "shrink wrap" that is on top. In SiteBuilder you can do it easily without code by adding a border over the image since borders have a transparent center and are essentially like a picture frame with glass.
Add a Watermark: Adding a digital watermark does not make it more difficult to steal the image, but it is the best deterrent since they would have to use Photoshop or another image editor to remove the watermark. How efficient it is depends on the complexity of the image, the watermark placement on it, and how difficult it would be to remove. There are free websites online to add watermarks such as http://www.picmarkr.com or you could use just about any image editing software.
Resize before uploading: Images on your site need to be downloaded to the visitors computer. If you are uploading high resolution images, it will slow down page loads. If you resize the images to a lower resolution, you can still have a good looking image that isn't as useful to the person that does manage to steal it. Sitebuilder will alert you if the image you are uploading is larger than necessary and offer to resize it to a more appropriate size.There are several other methods out there but like these the best they do is make images difficult to steal so a viewer might find an easier website to take images from.
bob1777
23 Messages
•
1.2K Points
22 days ago
great tips!
0
0